Commit d7d0c67a45614106c630b1548a37fc0ea2ccdbe0
- Diff rendering mode:
- inline
- side by side
live/index.html
(3 / 1)
| 26 | 26 | </head> | |
| 27 | 27 | <body> | |
| 28 | 28 | ||
| 29 | <h1>Live Microdata</h1> | ||
| 29 | <h1><a href=".">Live Microdata</a></h1> | ||
| 30 | |||
| 31 | <span class="link"><a href="" id="permalink">permalink</a></span> | ||
| 30 | 32 | ||
| 31 | 33 | <form class="examples"> | |
| 32 | 34 | Examples: |
live/live.css
(16 / 0)
| 32 | 32 | margin: 0; | |
| 33 | 33 | padding: 0; | |
| 34 | 34 | } | |
| 35 | h1 a { | ||
| 36 | text-decoration: none; | ||
| 37 | color: black; | ||
| 38 | } | ||
| 39 | a { | ||
| 40 | color: #008; | ||
| 41 | } | ||
| 42 | .link { | ||
| 43 | margin-left: 8px; | ||
| 44 | } | ||
| 45 | .link:before { | ||
| 46 | content: "<"; | ||
| 47 | } | ||
| 48 | .link:after { | ||
| 49 | content: ">"; | ||
| 50 | } | ||
| 35 | 51 | .examples { | |
| 36 | 52 | display: block; | |
| 37 | 53 | margin: 0; |
live/live.js
(19 / 5)
| 1 | 1 | /* -*- mode: js2; js2-basic-offset: 2; indent-tabs-mode: nil -*- */ | |
| 2 | 2 | ||
| 3 | function update() { | ||
| 3 | function update(html) { | ||
| 4 | 4 | // preview always needed to put the microdata into the document | |
| 5 | $('#preview').html($('textarea').val()); | ||
| 5 | $('#preview').html(html); | ||
| 6 | // update permalink | ||
| 7 | $('#permalink').attr('href', '?html='+encodeURIComponent(html)); | ||
| 6 | 8 | // update selected tab | |
| 7 | 9 | updateTab($('#tabs').tabs('option', 'selected')); | |
| 8 | 10 | } | |
| … | … | ||
| 70 | 70 | $(document).ready(function() { | |
| 71 | 71 | var $textarea = $('textarea'); | |
| 72 | 72 | $textarea.TextAreaResizer(); | |
| 73 | $textarea.change(update); | ||
| 73 | $textarea.change(function(){update($textarea.val());}); | ||
| 74 | 74 | $textarea.keyup(function(ev) { | |
| 75 | 75 | // ignore home/end/page up/page down and left/up/down/right | |
| 76 | 76 | if (ev.keyCode < 33 || ev.keyCode > 40) | |
| 77 | update(); | ||
| 77 | update($textarea.val()); | ||
| 78 | 78 | }); | |
| 79 | if (window.location.search) { | ||
| 80 | jQuery.each(window.location.search.substr(1).split('&'), function() { | ||
| 81 | var nameval = this.split('=', 2); | ||
| 82 | var name = decodeURIComponent(nameval[0]); | ||
| 83 | var val = nameval.length == 2 ? decodeURIComponent(nameval[1]) : ''; | ||
| 84 | switch (name) { | ||
| 85 | case 'html': | ||
| 86 | $textarea.val(val); | ||
| 87 | update(val); | ||
| 88 | } | ||
| 89 | }); | ||
| 90 | } | ||
| 79 | 91 | $('select').change(function(ev) { | |
| 80 | 92 | var source = ev.target.value; | |
| 81 | 93 | if (source) { | |
| 82 | 94 | $.get('example/'+source, function(data) { | |
| 83 | 95 | $textarea.val(data); | |
| 84 | update(); | ||
| 96 | update(data); | ||
| 85 | 97 | }); | |
| 86 | 98 | } | |
| 87 | 99 | }); |
