snipt

Ctrl+h for KB shortcuts

JavaScript

serialize

$('#nutmeg span.note').seralizeAnnotations();
https://snipt.net/embed/235cdd01b87af1e1de37f4746a88d82c/
/raw/235cdd01b87af1e1de37f4746a88d82c/
235cdd01b87af1e1de37f4746a88d82c
js
JavaScript
1
2019-07-17T15:32:15
True
False
False
/api/public/snipt/13893/
serialize
<table class="highlighttable"><tr><td class="linenos"><div class="linenodiv"><pre><a href="#L-1">1</a></pre></div></td><td class="code"><div class="highlight"><pre><span></span><span id="L-1"><a name="L-1"></a><span class="nx">$</span><span class="p">(</span><span class="s1">&#39;#nutmeg span.note&#39;</span><span class="p">).</span><span class="nx">seralizeAnnotations</span><span class="p">();</span> </span></pre></div> </td></tr></table>
js

JavaScript

positioning

1
2
3
$('#labeledNutmeg').annotatableImage(function(annotation){
  return $(document.createElement('span')).addClass('set-label');
}, {xPosition: 'left'});
https://snipt.net/embed/319cea54e5298516993cebd73afb1483/
/raw/319cea54e5298516993cebd73afb1483/
319cea54e5298516993cebd73afb1483
js
JavaScript
3
2019-07-20T16:17:23
True
False
False
/api/public/snipt/13891/
positioning
<table class="highlighttable"><tr><td class="linenos"><div class="linenodiv"><pre><a href="#L-1">1</a> <a href="#L-2">2</a> <a href="#L-3">3</a></pre></div></td><td class="code"><div class="highlight"><pre><span></span><span id="L-1"><a name="L-1"></a><span class="nx">$</span><span class="p">(</span><span class="s1">&#39;#labeledNutmeg&#39;</span><span class="p">).</span><span class="nx">annotatableImage</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">annotation</span><span class="p">){</span> </span><span id="L-2"><a name="L-2"></a> <span class="k">return</span> <span class="nx">$</span><span class="p">(</span><span class="nb">document</span><span class="p">.</span><span class="nx">createElement</span><span class="p">(</span><span class="s1">&#39;span&#39;</span><span class="p">)).</span><span class="nx">addClass</span><span class="p">(</span><span class="s1">&#39;set-label&#39;</span><span class="p">);</span> </span><span id="L-3"><a name="L-3"></a><span class="p">},</span> <span class="p">{</span><span class="nx">xPosition</span><span class="o">:</span> <span class="s1">&#39;left&#39;</span><span class="p">});</span> </span></pre></div> </td></tr></table>
js

JavaScript

23

$('#smallNutmeg').addAnnotations(blackNote, annotations);
https://snipt.net/embed/53012e3f5d9eb91d6a69b1bf46a0014e/
/raw/53012e3f5d9eb91d6a69b1bf46a0014e/
53012e3f5d9eb91d6a69b1bf46a0014e
js
JavaScript
1
2019-07-17T23:40:17
True
False
False
/api/public/snipt/13721/
oneliner
<table class="highlighttable"><tr><td class="linenos"><div class="linenodiv"><pre><a href="#L-1">1</a></pre></div></td><td class="code"><div class="highlight"><pre><span></span><span id="L-1"><a name="L-1"></a><span class="nx">$</span><span class="p">(</span><span class="s1">&#39;#smallNutmeg&#39;</span><span class="p">).</span><span class="nx">addAnnotations</span><span class="p">(</span><span class="nx">blackNote</span><span class="p">,</span> <span class="nx">annotations</span><span class="p">);</span> </span></pre></div> </td></tr></table>
js

JavaScript

23

1
2
3
4
5
function blackNote() {
  return $(document.createElement('span')).addClass('black circle note')
}
	
$('#nutmeg').annotatableImage(blackNote);
https://snipt.net/embed/37693cfc748049e45d87b8c7d8b9aacd/
/raw/37693cfc748049e45d87b8c7d8b9aacd/
37693cfc748049e45d87b8c7d8b9aacd
js
JavaScript
5
2019-07-20T04:47:04
True
False
False
/api/public/snipt/13720/
23
<table class="highlighttable"><tr><td class="linenos"><div class="linenodiv"><pre><a href="#L-1">1</a> <a href="#L-2">2</a> <a href="#L-3">3</a> <a href="#L-4">4</a> <a href="#L-5">5</a></pre></div></td><td class="code"><div class="highlight"><pre><span></span><span id="L-1"><a name="L-1"></a><span class="kd">function</span> <span class="nx">blackNote</span><span class="p">()</span> <span class="p">{</span> </span><span id="L-2"><a name="L-2"></a> <span class="k">return</span> <span class="nx">$</span><span class="p">(</span><span class="nb">document</span><span class="p">.</span><span class="nx">createElement</span><span class="p">(</span><span class="s1">&#39;span&#39;</span><span class="p">)).</span><span class="nx">addClass</span><span class="p">(</span><span class="s1">&#39;black circle note&#39;</span><span class="p">)</span> </span><span id="L-3"><a name="L-3"></a><span class="p">}</span> </span><span id="L-4"><a name="L-4"></a> </span><span id="L-5"><a name="L-5"></a><span class="nx">$</span><span class="p">(</span><span class="s1">&#39;#nutmeg&#39;</span><span class="p">).</span><span class="nx">annotatableImage</span><span class="p">(</span><span class="nx">blackNote</span><span class="p">);</span> </span></pre></div> </td></tr></table>
js

JavaScript

bijanvaez.com/image_upload_test/

<form action="/playground/ajax_upload" id="newHotnessForm">
https://snipt.net/embed/f9bfe4a932d0414bf07b10ec1f1a5cf2/
/raw/f9bfe4a932d0414bf07b10ec1f1a5cf2/
f9bfe4a932d0414bf07b10ec1f1a5cf2
js
JavaScript
1
2019-07-07T12:57:50
True
False
False
/api/public/snipt/12694/
fwefw
<table class="highlighttable"><tr><td class="linenos"><div class="linenodiv"><pre><a href="#L-1">1</a></pre></div></td><td class="code"><div class="highlight"><pre><span></span><span id="L-1"><a name="L-1"></a><span class="o">&lt;</span><span class="nx">form</span> <span class="nx">action</span><span class="o">=</span><span class="s2">&quot;/playground/ajax_upload&quot;</span> <span class="nx">id</span><span class="o">=</span><span class="s2">&quot;newHotnessForm&quot;</span><span class="o">&gt;</span> </span></pre></div> </td></tr></table>
js

JavaScript

6

	thumb.attr('src', response);
}
https://snipt.net/embed/1679091c5a880faf6fb5e6087eb1b2dc/
/raw/1679091c5a880faf6fb5e6087eb1b2dc/
1679091c5a880faf6fb5e6087eb1b2dc
js
JavaScript
2
2019-07-15T07:59:20
True
False
False
/api/public/snipt/12510/
6
<table class="highlighttable"><tr><td class="linenos"><div class="linenodiv"><pre><a href="#L-1">1</a> <a href="#L-2">2</a></pre></div></td><td class="code"><div class="highlight"><pre><span></span><span id="L-1"><a name="L-1"></a> <span class="nx">thumb</span><span class="p">.</span><span class="nx">attr</span><span class="p">(</span><span class="s1">&#39;src&#39;</span><span class="p">,</span> <span class="nx">response</span><span class="p">);</span> </span><span id="L-2"><a name="L-2"></a><span class="p">}</span> </span></pre></div> </td></tr></table>
js

JavaScript

5

1
2
3
4
5
onComplete: function(file, response) {
	thumb.load(function(){
		$('div.preview').removeClass('loading');
		thumb.unbind();
	});
https://snipt.net/embed/e4da3b7fbbce2345d7772b0674a318d5/
/raw/e4da3b7fbbce2345d7772b0674a318d5/
e4da3b7fbbce2345d7772b0674a318d5
js
JavaScript
5
2019-07-18T06:34:37
True
False
False
/api/public/snipt/12441/
5
<table class="highlighttable"><tr><td class="linenos"><div class="linenodiv"><pre><a href="#L-1">1</a> <a href="#L-2">2</a> <a href="#L-3">3</a> <a href="#L-4">4</a> <a href="#L-5">5</a></pre></div></td><td class="code"><div class="highlight"><pre><span></span><span id="L-1"><a name="L-1"></a><span class="nx">onComplete</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">file</span><span class="p">,</span> <span class="nx">response</span><span class="p">)</span> <span class="p">{</span> </span><span id="L-2"><a name="L-2"></a> <span class="nx">thumb</span><span class="p">.</span><span class="nx">load</span><span class="p">(</span><span class="kd">function</span><span class="p">(){</span> </span><span id="L-3"><a name="L-3"></a> <span class="nx">$</span><span class="p">(</span><span class="s1">&#39;div.preview&#39;</span><span class="p">).</span><span class="nx">removeClass</span><span class="p">(</span><span class="s1">&#39;loading&#39;</span><span class="p">);</span> </span><span id="L-4"><a name="L-4"></a> <span class="nx">thumb</span><span class="p">.</span><span class="nx">unbind</span><span class="p">();</span> </span><span id="L-5"><a name="L-5"></a> <span class="p">});</span> </span></pre></div> </td></tr></table>
js

JavaScript

4

1
2
3
onSubmit: function(file, extension) {
     $('div.preview').addClass('loading');
},
https://snipt.net/embed/a87ff679a2f3e71d9181a67b7542122c/
/raw/a87ff679a2f3e71d9181a67b7542122c/
a87ff679a2f3e71d9181a67b7542122c
js
JavaScript
4
2019-07-20T18:51:11
True
False
False
/api/public/snipt/12440/
4
<table class="highlighttable"><tr><td class="linenos"><div class="linenodiv"><pre><a href="#L-1">1</a> <a href="#L-2">2</a> <a href="#L-3">3</a></pre></div></td><td class="code"><div class="highlight"><pre><span></span><span id="L-1"><a name="L-1"></a><span class="nx">onSubmit</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">file</span><span class="p">,</span> <span class="nx">extension</span><span class="p">)</span> <span class="p">{</span> </span><span id="L-2"><a name="L-2"></a> <span class="nx">$</span><span class="p">(</span><span class="s1">&#39;div.preview&#39;</span><span class="p">).</span><span class="nx">addClass</span><span class="p">(</span><span class="s1">&#39;loading&#39;</span><span class="p">);</span> </span><span id="L-3"><a name="L-3"></a><span class="p">},</span> </span></pre></div> </td></tr></table>
js

JavaScript

3

name: 'image',
https://snipt.net/embed/c9e6e7b69f98f516a54cfe2c9e25fb3f/
/raw/c9e6e7b69f98f516a54cfe2c9e25fb3f/
c9e6e7b69f98f516a54cfe2c9e25fb3f
js
JavaScript
2
2019-07-14T09:23:19
True
False
False
/api/public/snipt/12439/
3-1
<table class="highlighttable"><tr><td class="linenos"><div class="linenodiv"><pre><a href="#L-1">1</a></pre></div></td><td class="code"><div class="highlight"><pre><span></span><span id="L-1"><a name="L-1"></a><span class="nx">name</span><span class="o">:</span> <span class="s1">&#39;image&#39;</span><span class="p">,</span> </span></pre></div> </td></tr></table>
js