modjs-architecture 0.3.5 → 0.4.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- data/README.md +272 -2
- data/Rakefile +8 -0
- data/VERSION +1 -1
- data/docs/application.html +28 -0
- data/docs/docco.css +186 -0
- data/docs/dom.html +73 -0
- data/docs/events.html +87 -0
- data/docs/existence.html +69 -0
- data/docs/module.html +67 -0
- data/lib/modjs-architecture/core/application.js +11 -3
- data/lib/modjs-architecture/core/dom.js +17 -0
- data/lib/modjs-architecture/core/module.js +22 -9
- data/lib/modjs-architecture/extensions/events.js +4 -0
- data/lib/modjs-architecture/helpers/existence.js +28 -0
- data/lib/modjs-architecture/lib/mod.js +5 -9
- data/modjs-architecture.gemspec +8 -3
- data/spec/fixtures/foo-elements.js +4 -3
- data/spec/fixtures/foo.js +5 -4
- data/spec/fixtures/foo_all.js +5 -4
- data/spec/fixtures/foo_elements.js +5 -4
- data/spec/fixtures/foo_model.js +5 -4
- data/spec/fixtures/myapp.js +5 -11
- data/spec/fixtures/update.js +5 -11
- data/spec/javascripts/module_spec.js +7 -14
- data/spec/spec_helper.rb +1 -0
- data/templates/module.js +4 -3
- metadata +9 -4
- data/foo.js +0 -9
data/docs/dom.html
ADDED
@@ -0,0 +1,73 @@
|
|
1
|
+
<!DOCTYPE html> <html> <head> <title>dom.js</title> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <link rel="stylesheet" media="all" href="docco.css" /> </head> <body> <div id="container"> <div id="background"></div> <div id="jump_to"> Jump To … <div id="jump_wrapper"> <div id="jump_page"> <a class="source" href="application.html"> application.js </a> <a class="source" href="dom.html"> dom.js </a> <a class="source" href="module.html"> module.js </a> <a class="source" href="events.html"> events.js </a> <a class="source" href="existence.html"> existence.js </a> </div> </div> </div> <table cellpadding="0" cellspacing="0"> <thead> <tr> <th class="docs"> <h1> dom.js </h1> </th> <th class="code"> </th> </tr> </thead> <tbody> <tr id="section-1"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-1">¶</a> </div> <h2>Mod.DOM</h2> </td> <td class="code"> <div class="highlight"><pre></pre></div> </td> </tr> <tr id="section-2"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-2">¶</a> </div> <p>This object serves as an API to interacting with the dom and cacheing selected elements.</p> </td> <td class="code"> <div class="highlight"><pre><span class="nx">Mod</span><span class="p">.</span><span class="nx">DOM</span> <span class="o">=</span> <span class="p">(</span><span class="kd">function</span><span class="p">()</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-3"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-3">¶</a> </div> <p>Set variables for a setInterval function and a queue to store methods to call when ready.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">timer</span><span class="p">,</span>
|
2
|
+
<span class="nx">queue</span> <span class="o">=</span> <span class="p">[];</span></pre></div> </td> </tr> <tr id="section-4"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-4">¶</a> </div> <p>Set a <code>cache</code> property to store selected elements and an <code>is_ready</code> property to determine DOM status.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">function</span> <span class="nx">DOM</span><span class="p">()</span> <span class="p">{</span>
|
3
|
+
<span class="k">this</span><span class="p">.</span><span class="nx">cache</span> <span class="o">=</span> <span class="p">{};</span>
|
4
|
+
<span class="k">this</span><span class="p">.</span><span class="nx">is_ready</span> <span class="o">=</span> <span class="kc">false</span><span class="p">;</span>
|
5
|
+
<span class="p">}</span></pre></div> </td> </tr> <tr id="section-5"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-5">¶</a> </div> <h3>add_event</h3>
|
6
|
+
|
7
|
+
<p>Convenience method to attach events</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">DOM</span><span class="p">.</span><span class="nx">prototype</span><span class="p">.</span><span class="nx">add_event</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">element</span><span class="p">,</span> <span class="nx">type</span><span class="p">,</span> <span class="nx">fn</span><span class="p">,</span> <span class="nx">capture</span><span class="p">)</span> <span class="p">{</span>
|
8
|
+
<span class="k">if</span> <span class="p">(</span><span class="nx">is_undefined</span><span class="p">(</span><span class="nx">capture</span><span class="p">))</span> <span class="p">{</span>
|
9
|
+
<span class="nx">capture</span> <span class="o">=</span> <span class="kc">false</span><span class="p">;</span>
|
10
|
+
<span class="p">}</span>
|
11
|
+
|
12
|
+
<span class="k">if</span> <span class="p">(</span><span class="nx">is_string</span><span class="p">(</span><span class="nx">element</span><span class="p">))</span> <span class="p">{</span>
|
13
|
+
<span class="nx">element</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">cache</span><span class="p">[</span><span class="nx">element</span><span class="p">];</span>
|
14
|
+
<span class="p">}</span>
|
15
|
+
|
16
|
+
<span class="nx">element</span><span class="p">.</span><span class="nx">addEventListener</span><span class="p">(</span><span class="nx">type</span><span class="p">,</span> <span class="nx">fn</span><span class="p">,</span> <span class="nx">capture</span><span class="p">);</span>
|
17
|
+
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-6"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-6">¶</a> </div> <h3>remove_event</h3>
|
18
|
+
|
19
|
+
<p>Convenience method to remove events</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">DOM</span><span class="p">.</span><span class="nx">prototype</span><span class="p">.</span><span class="nx">remove_event</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">element</span><span class="p">,</span> <span class="nx">type</span><span class="p">,</span> <span class="nx">fn</span><span class="p">,</span> <span class="nx">capture</span><span class="p">)</span> <span class="p">{</span>
|
20
|
+
<span class="k">if</span> <span class="p">(</span><span class="nx">is_undefined</span><span class="p">(</span><span class="nx">capture</span><span class="p">))</span> <span class="p">{</span>
|
21
|
+
<span class="nx">capture</span> <span class="o">=</span> <span class="kc">false</span><span class="p">;</span>
|
22
|
+
<span class="p">}</span>
|
23
|
+
|
24
|
+
<span class="k">if</span> <span class="p">(</span><span class="nx">is_string</span><span class="p">(</span><span class="nx">element</span><span class="p">))</span> <span class="p">{</span>
|
25
|
+
<span class="nx">element</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">cache</span><span class="p">[</span><span class="nx">element</span><span class="p">];</span>
|
26
|
+
<span class="p">}</span>
|
27
|
+
|
28
|
+
<span class="nx">element</span><span class="p">.</span><span class="nx">removeEventListener</span><span class="p">(</span><span class="nx">type</span><span class="p">,</span> <span class="nx">fn</span><span class="p">,</span> <span class="nx">capture</span><span class="p">);</span>
|
29
|
+
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-7"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-7">¶</a> </div> <h3>call<em>when</em>ready</h3>
|
30
|
+
|
31
|
+
<p>Pass a function to call when the DOM is ready</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">DOM</span><span class="p">.</span><span class="nx">prototype</span><span class="p">.</span><span class="nx">call_when_ready</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">func</span><span class="p">)</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-8"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-8">¶</a> </div> <p>if DOM is already loaded execute the function</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">is_ready</span><span class="p">)</span> <span class="p">{</span>
|
32
|
+
<span class="k">return</span> <span class="nx">func</span><span class="p">();</span>
|
33
|
+
<span class="p">}</span></pre></div> </td> </tr> <tr id="section-9"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-9">¶</a> </div> <p>if timer is ticking</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="nx">timer</span><span class="p">)</span> <span class="p">{</span>
|
34
|
+
<span class="nx">queue</span><span class="p">.</span><span class="nx">push</span><span class="p">(</span><span class="nx">func</span><span class="p">);</span>
|
35
|
+
<span class="p">}</span></pre></div> </td> </tr> <tr id="section-10"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-10">¶</a> </div> <p>this is the first in the queue</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">else</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-11"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-11">¶</a> </div> <p>attach to the load event, just in case it finishes first.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">this</span><span class="p">.</span><span class="nx">add_event</span><span class="p">(</span><span class="nb">window</span><span class="p">,</span> <span class="s1">'load'</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">execute_ready_queue</span><span class="p">);</span>
|
36
|
+
<span class="nx">queue</span><span class="p">.</span><span class="nx">push</span><span class="p">(</span><span class="nx">func</span><span class="p">);</span>
|
37
|
+
<span class="nx">timer</span> <span class="o">=</span> <span class="nx">setInterval</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">execute_ready_queue</span><span class="p">,</span> <span class="mi">13</span><span class="p">);</span>
|
38
|
+
<span class="p">}</span>
|
39
|
+
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-12"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-12">¶</a> </div> <h3>execute<em>ready</em>queue</h3>
|
40
|
+
|
41
|
+
<p>Execute all methods in the <code>queue</code></p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">DOM</span><span class="p">.</span><span class="nx">prototype</span><span class="p">.</span><span class="nx">execute_ready_queue</span> <span class="o">=</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
42
|
+
<span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">is_ready</span><span class="p">)</span> <span class="p">{</span>
|
43
|
+
<span class="k">return</span> <span class="kc">false</span><span class="p">;</span>
|
44
|
+
<span class="p">}</span>
|
45
|
+
|
46
|
+
<span class="k">if</span> <span class="p">(</span><span class="nb">document</span> <span class="o">&&</span> <span class="nb">document</span><span class="p">.</span><span class="nx">getElementsByTagName</span> <span class="o">&&</span> <span class="nb">document</span><span class="p">.</span><span class="nx">getElementById</span> <span class="o">&&</span> <span class="nb">document</span><span class="p">.</span><span class="nx">body</span><span class="p">)</span> <span class="p">{</span>
|
47
|
+
<span class="nx">clearInterval</span><span class="p">(</span><span class="nx">timer</span><span class="p">);</span>
|
48
|
+
<span class="nx">timer</span> <span class="o">=</span> <span class="kc">null</span><span class="p">;</span>
|
49
|
+
<span class="k">for</span><span class="p">(</span><span class="kd">var</span> <span class="nx">i</span> <span class="o">=</span> <span class="mi">0</span><span class="p">,</span> <span class="nx">j</span> <span class="o">=</span> <span class="nx">queue</span><span class="p">.</span><span class="nx">length</span><span class="p">;</span> <span class="nx">i</span> <span class="o"><</span> <span class="nx">j</span><span class="p">;</span> <span class="nx">i</span><span class="o">++</span><span class="p">)</span> <span class="p">{</span>
|
50
|
+
<span class="nx">queue</span><span class="p">[</span><span class="nx">i</span><span class="p">]();</span>
|
51
|
+
<span class="p">}</span>
|
52
|
+
|
53
|
+
<span class="nx">queue</span> <span class="o">=</span> <span class="p">[];</span>
|
54
|
+
<span class="k">this</span><span class="p">.</span><span class="nx">is_ready</span> <span class="o">=</span> <span class="kc">true</span><span class="p">;</span>
|
55
|
+
<span class="p">}</span>
|
56
|
+
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-13"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-13">¶</a> </div> <h3>add_elements</h3>
|
57
|
+
|
58
|
+
<p>Add cached elements to the <code>DOM.cache</code> from an object of name/value pairs containing selected DOM elements</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">DOM</span><span class="p">.</span><span class="nx">prototype</span><span class="p">.</span><span class="nx">add_elements</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">elements</span><span class="p">)</span> <span class="p">{</span>
|
59
|
+
<span class="k">for</span><span class="p">(</span><span class="kd">var</span> <span class="nx">key</span> <span class="k">in</span> <span class="nx">elements</span><span class="p">)</span> <span class="p">{</span>
|
60
|
+
<span class="k">if</span> <span class="p">(</span><span class="nx">elements</span><span class="p">.</span><span class="nx">hasOwnProperty</span><span class="p">(</span><span class="nx">key</span><span class="p">))</span> <span class="p">{</span>
|
61
|
+
<span class="k">this</span><span class="p">.</span><span class="nx">add_element</span><span class="p">(</span><span class="nx">key</span><span class="p">,</span> <span class="nx">elements</span><span class="p">[</span><span class="nx">key</span><span class="p">]);</span>
|
62
|
+
<span class="p">}</span>
|
63
|
+
<span class="p">}</span>
|
64
|
+
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-14"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-14">¶</a> </div> <h3>add_element</h3>
|
65
|
+
|
66
|
+
<p>Add a single element to the <code>DOM.cache</code></p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">DOM</span><span class="p">.</span><span class="nx">prototype</span><span class="p">.</span><span class="nx">add_element</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">key</span><span class="p">,</span> <span class="nx">element</span><span class="p">)</span> <span class="p">{</span>
|
67
|
+
<span class="k">this</span><span class="p">.</span><span class="nx">cache</span><span class="p">[</span><span class="nx">key</span><span class="p">]</span> <span class="o">=</span> <span class="nx">element</span><span class="p">;</span>
|
68
|
+
<span class="p">};</span>
|
69
|
+
|
70
|
+
<span class="k">return</span> <span class="nx">DOM</span><span class="p">;</span>
|
71
|
+
<span class="p">})();</span>
|
72
|
+
|
73
|
+
</pre></div> </td> </tr> </tbody> </table> </div> </body> </html>
|
data/docs/events.html
ADDED
@@ -0,0 +1,87 @@
|
|
1
|
+
<!DOCTYPE html> <html> <head> <title>events.js</title> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <link rel="stylesheet" media="all" href="docco.css" /> </head> <body> <div id="container"> <div id="background"></div> <div id="jump_to"> Jump To … <div id="jump_wrapper"> <div id="jump_page"> <a class="source" href="application.html"> application.js </a> <a class="source" href="dom.html"> dom.js </a> <a class="source" href="module.html"> module.js </a> <a class="source" href="events.html"> events.js </a> <a class="source" href="existence.html"> existence.js </a> </div> </div> </div> <table cellpadding="0" cellspacing="0"> <thead> <tr> <th class="docs"> <h1> events.js </h1> </th> <th class="code"> </th> </tr> </thead> <tbody> <tr id="section-1"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-1">¶</a> </div> <h2>Events</h2> </td> <td class="code"> <div class="highlight"><pre></pre></div> </td> </tr> <tr id="section-2"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-2">¶</a> </div> <p>Standardizes events accross all browsers and adds W3C events if not present.
|
2
|
+
Taken directly form <a href="https://developer.mozilla.org/en/DOM/element.removeEventListener">Mozilla Docs</a></p> </td> <td class="code"> <div class="highlight"><pre><span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="nx">Element</span><span class="p">.</span><span class="nx">prototype</span><span class="p">.</span><span class="nx">addEventListener</span><span class="p">)</span> <span class="p">{</span>
|
3
|
+
<span class="kd">var</span> <span class="nx">oListeners</span> <span class="o">=</span> <span class="p">{};</span>
|
4
|
+
|
5
|
+
<span class="kd">function</span> <span class="nx">runListeners</span><span class="p">(</span><span class="nx">oEvent</span><span class="p">)</span> <span class="p">{</span>
|
6
|
+
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="nx">oEvent</span><span class="p">)</span> <span class="p">{</span>
|
7
|
+
<span class="nx">oEvent</span> <span class="o">=</span> <span class="nb">window</span><span class="p">.</span><span class="nx">event</span><span class="p">;</span>
|
8
|
+
<span class="p">}</span>
|
9
|
+
|
10
|
+
<span class="k">for</span> <span class="p">(</span><span class="kd">var</span> <span class="nx">iLstId</span> <span class="o">=</span> <span class="mi">0</span><span class="p">,</span> <span class="nx">iElId</span> <span class="o">=</span> <span class="mi">0</span><span class="p">,</span> <span class="nx">oEvtListeners</span> <span class="o">=</span> <span class="nx">oListeners</span><span class="p">[</span><span class="nx">oEvent</span><span class="p">.</span><span class="nx">type</span><span class="p">];</span> <span class="nx">iElId</span> <span class="o"><</span> <span class="nx">oEvtListeners</span><span class="p">.</span><span class="nx">aEls</span><span class="p">.</span><span class="nx">length</span><span class="p">;</span> <span class="nx">iElId</span><span class="o">++</span><span class="p">)</span> <span class="p">{</span>
|
11
|
+
<span class="k">if</span> <span class="p">(</span><span class="nx">oEvtListeners</span><span class="p">.</span><span class="nx">aEls</span><span class="p">[</span><span class="nx">iElId</span><span class="p">]</span> <span class="o">===</span> <span class="k">this</span><span class="p">)</span> <span class="p">{</span>
|
12
|
+
<span class="k">for</span> <span class="p">(</span><span class="nx">iLstId</span><span class="p">;</span> <span class="nx">iLstId</span> <span class="o"><</span> <span class="nx">oEvtListeners</span><span class="p">.</span><span class="nx">aEvts</span><span class="p">[</span><span class="nx">iElId</span><span class="p">].</span><span class="nx">length</span><span class="p">;</span> <span class="nx">iLstId</span><span class="o">++</span><span class="p">)</span> <span class="p">{</span>
|
13
|
+
<span class="nx">oEvtListeners</span><span class="p">.</span><span class="nx">aEvts</span><span class="p">[</span><span class="nx">iElId</span><span class="p">][</span><span class="nx">iLstId</span><span class="p">].</span><span class="nx">call</span><span class="p">(</span><span class="k">this</span><span class="p">,</span> <span class="nx">oEvent</span><span class="p">);</span>
|
14
|
+
<span class="p">}</span>
|
15
|
+
|
16
|
+
<span class="k">break</span><span class="p">;</span>
|
17
|
+
<span class="p">}</span>
|
18
|
+
<span class="p">}</span>
|
19
|
+
<span class="p">}</span>
|
20
|
+
|
21
|
+
<span class="nx">Element</span><span class="p">.</span><span class="nx">prototype</span><span class="p">.</span><span class="nx">addEventListener</span> <span class="o">=</span> <span class="kd">function</span> <span class="p">(</span><span class="nx">sEventType</span><span class="p">,</span> <span class="nx">fListener</span><span class="p">)</span> <span class="p">{</span>
|
22
|
+
<span class="k">if</span> <span class="p">(</span><span class="nx">oListeners</span><span class="p">.</span><span class="nx">hasOwnProperty</span><span class="p">(</span><span class="nx">sEventType</span><span class="p">))</span> <span class="p">{</span>
|
23
|
+
<span class="kd">var</span> <span class="nx">oEvtListeners</span> <span class="o">=</span> <span class="nx">oListeners</span><span class="p">[</span><span class="nx">sEventType</span><span class="p">];</span>
|
24
|
+
|
25
|
+
<span class="k">for</span> <span class="p">(</span><span class="kd">var</span> <span class="nx">nElIdx</span> <span class="o">=</span> <span class="o">-</span><span class="mi">1</span><span class="p">,</span> <span class="nx">iElId</span> <span class="o">=</span> <span class="mi">0</span><span class="p">;</span> <span class="nx">iElId</span> <span class="o"><</span> <span class="nx">oEvtListeners</span><span class="p">.</span><span class="nx">aEls</span><span class="p">.</span><span class="nx">length</span><span class="p">;</span> <span class="nx">iElId</span><span class="o">++</span><span class="p">)</span> <span class="p">{</span>
|
26
|
+
<span class="k">if</span> <span class="p">(</span><span class="nx">oEvtListeners</span><span class="p">.</span><span class="nx">aEls</span><span class="p">[</span><span class="nx">iElId</span><span class="p">]</span> <span class="o">===</span> <span class="k">this</span><span class="p">)</span> <span class="p">{</span>
|
27
|
+
<span class="nx">nElIdx</span> <span class="o">=</span> <span class="nx">iElId</span><span class="p">;</span> <span class="k">break</span><span class="p">;</span>
|
28
|
+
<span class="p">}</span>
|
29
|
+
<span class="p">}</span>
|
30
|
+
|
31
|
+
<span class="k">if</span> <span class="p">(</span><span class="nx">nElIdx</span> <span class="o">===</span> <span class="o">-</span><span class="mi">1</span><span class="p">)</span> <span class="p">{</span>
|
32
|
+
<span class="nx">oEvtListeners</span><span class="p">.</span><span class="nx">aEls</span><span class="p">.</span><span class="nx">push</span><span class="p">(</span><span class="k">this</span><span class="p">);</span>
|
33
|
+
<span class="nx">oEvtListeners</span><span class="p">.</span><span class="nx">aEvts</span><span class="p">.</span><span class="nx">push</span><span class="p">([</span><span class="nx">fListener</span><span class="p">]);</span>
|
34
|
+
<span class="k">this</span><span class="p">[</span><span class="s2">"on"</span> <span class="o">+</span> <span class="nx">sEventType</span><span class="p">]</span> <span class="o">=</span> <span class="nx">runListeners</span><span class="p">;</span>
|
35
|
+
<span class="p">}</span>
|
36
|
+
<span class="k">else</span> <span class="p">{</span>
|
37
|
+
<span class="kd">var</span> <span class="nx">aElListeners</span> <span class="o">=</span> <span class="nx">oEvtListeners</span><span class="p">.</span><span class="nx">aEvts</span><span class="p">[</span><span class="nx">nElIdx</span><span class="p">];</span>
|
38
|
+
|
39
|
+
<span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">[</span><span class="s2">"on"</span> <span class="o">+</span> <span class="nx">sEventType</span><span class="p">]</span> <span class="o">!==</span> <span class="nx">runListeners</span><span class="p">)</span> <span class="p">{</span>
|
40
|
+
<span class="nx">aElListeners</span><span class="p">.</span><span class="nx">splice</span><span class="p">(</span><span class="mi">0</span><span class="p">);</span>
|
41
|
+
<span class="k">this</span><span class="p">[</span><span class="s2">"on"</span> <span class="o">+</span> <span class="nx">sEventType</span><span class="p">]</span> <span class="o">=</span> <span class="nx">runListeners</span><span class="p">;</span>
|
42
|
+
<span class="p">}</span>
|
43
|
+
|
44
|
+
<span class="k">for</span> <span class="p">(</span><span class="kd">var</span> <span class="nx">iLstId</span> <span class="o">=</span> <span class="mi">0</span><span class="p">;</span> <span class="nx">iLstId</span> <span class="o"><</span> <span class="nx">aElListeners</span><span class="p">.</span><span class="nx">length</span><span class="p">;</span> <span class="nx">iLstId</span><span class="o">++</span><span class="p">)</span> <span class="p">{</span>
|
45
|
+
<span class="k">if</span> <span class="p">(</span><span class="nx">aElListeners</span><span class="p">[</span><span class="nx">iLstId</span><span class="p">]</span> <span class="o">===</span> <span class="nx">fListener</span><span class="p">)</span> <span class="p">{</span>
|
46
|
+
<span class="k">return</span><span class="p">;</span>
|
47
|
+
<span class="p">}</span>
|
48
|
+
<span class="p">}</span>
|
49
|
+
|
50
|
+
<span class="nx">aElListeners</span><span class="p">.</span><span class="nx">push</span><span class="p">(</span><span class="nx">fListener</span><span class="p">);</span>
|
51
|
+
<span class="p">}</span>
|
52
|
+
<span class="p">}</span>
|
53
|
+
<span class="k">else</span> <span class="p">{</span>
|
54
|
+
<span class="nx">oListeners</span><span class="p">[</span><span class="nx">sEventType</span><span class="p">]</span> <span class="o">=</span> <span class="p">{</span>
|
55
|
+
<span class="nx">aEls</span><span class="o">:</span> <span class="p">[</span><span class="k">this</span><span class="p">],</span>
|
56
|
+
<span class="nx">aEvts</span><span class="o">:</span> <span class="p">[[</span><span class="nx">fListener</span><span class="p">]]</span>
|
57
|
+
<span class="p">};</span>
|
58
|
+
|
59
|
+
<span class="k">this</span><span class="p">[</span><span class="s2">"on"</span> <span class="o">+</span> <span class="nx">sEventType</span><span class="p">]</span> <span class="o">=</span> <span class="nx">runListeners</span><span class="p">;</span>
|
60
|
+
<span class="p">}</span>
|
61
|
+
<span class="p">};</span>
|
62
|
+
|
63
|
+
<span class="nx">Element</span><span class="p">.</span><span class="nx">prototype</span><span class="p">.</span><span class="nx">removeEventListener</span> <span class="o">=</span> <span class="kd">function</span> <span class="p">(</span><span class="nx">sEventType</span><span class="p">)</span> <span class="p">{</span>
|
64
|
+
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="nx">oListeners</span><span class="p">.</span><span class="nx">hasOwnProperty</span><span class="p">(</span><span class="nx">sEventType</span><span class="p">))</span> <span class="p">{</span>
|
65
|
+
<span class="k">return</span><span class="p">;</span>
|
66
|
+
<span class="p">}</span>
|
67
|
+
|
68
|
+
<span class="kd">var</span> <span class="nx">oEvtListeners</span> <span class="o">=</span> <span class="nx">oListeners</span><span class="p">[</span><span class="nx">sEventType</span><span class="p">];</span>
|
69
|
+
|
70
|
+
<span class="k">for</span> <span class="p">(</span><span class="kd">var</span> <span class="nx">nElIdx</span> <span class="o">=</span> <span class="o">-</span><span class="mi">1</span><span class="p">,</span> <span class="nx">iElId</span> <span class="o">=</span> <span class="mi">0</span><span class="p">;</span> <span class="nx">iElId</span> <span class="o"><</span> <span class="nx">oEvtListeners</span><span class="p">.</span><span class="nx">aEls</span><span class="p">.</span><span class="nx">length</span><span class="p">;</span> <span class="nx">iElId</span><span class="o">++</span><span class="p">)</span> <span class="p">{</span>
|
71
|
+
<span class="k">if</span> <span class="p">(</span><span class="nx">oEvtListeners</span><span class="p">.</span><span class="nx">aEls</span><span class="p">[</span><span class="nx">iElId</span><span class="p">]</span> <span class="o">===</span> <span class="k">this</span><span class="p">)</span> <span class="p">{</span>
|
72
|
+
<span class="nx">nElIdx</span> <span class="o">=</span> <span class="nx">iElId</span><span class="p">;</span>
|
73
|
+
<span class="k">break</span><span class="p">;</span>
|
74
|
+
<span class="p">}</span>
|
75
|
+
<span class="p">}</span>
|
76
|
+
|
77
|
+
<span class="k">if</span> <span class="p">(</span><span class="nx">nElIdx</span> <span class="o">===</span> <span class="o">-</span><span class="mi">1</span><span class="p">)</span> <span class="p">{</span>
|
78
|
+
<span class="k">return</span><span class="p">;</span>
|
79
|
+
<span class="p">}</span>
|
80
|
+
|
81
|
+
<span class="k">for</span> <span class="p">(</span><span class="kd">var</span> <span class="nx">iLstId</span> <span class="o">=</span> <span class="mi">0</span><span class="p">,</span> <span class="nx">aElListeners</span> <span class="o">=</span> <span class="nx">oEvtListeners</span><span class="p">.</span><span class="nx">aEvts</span><span class="p">[</span><span class="nx">nElIdx</span><span class="p">];</span> <span class="nx">iLstId</span> <span class="o"><</span> <span class="nx">aElListeners</span><span class="p">.</span><span class="nx">length</span><span class="p">;</span> <span class="nx">iLstId</span><span class="o">++</span><span class="p">)</span> <span class="p">{</span>
|
82
|
+
<span class="nx">aElListeners</span><span class="p">.</span><span class="nx">splice</span><span class="p">(</span><span class="nx">iLstId</span><span class="p">,</span> <span class="mi">1</span><span class="p">);</span>
|
83
|
+
<span class="p">}</span>
|
84
|
+
<span class="p">};</span>
|
85
|
+
<span class="p">}</span>
|
86
|
+
|
87
|
+
</pre></div> </td> </tr> </tbody> </table> </div> </body> </html>
|
data/docs/existence.html
ADDED
@@ -0,0 +1,69 @@
|
|
1
|
+
<!DOCTYPE html> <html> <head> <title>existence.js</title> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <link rel="stylesheet" media="all" href="docco.css" /> </head> <body> <div id="container"> <div id="background"></div> <div id="jump_to"> Jump To … <div id="jump_wrapper"> <div id="jump_page"> <a class="source" href="application.html"> application.js </a> <a class="source" href="dom.html"> dom.js </a> <a class="source" href="module.html"> module.js </a> <a class="source" href="events.html"> events.js </a> <a class="source" href="existence.html"> existence.js </a> </div> </div> </div> <table cellpadding="0" cellspacing="0"> <thead> <tr> <th class="docs"> <h1> existence.js </h1> </th> <th class="code"> </th> </tr> </thead> <tbody> <tr id="section-1"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-1">¶</a> </div> <h2>Existence</h2>
|
2
|
+
|
3
|
+
<p>Provides convenience methods to determine the existence and
|
4
|
+
identity of variables.</p> </td> <td class="code"> <div class="highlight"><pre></pre></div> </td> </tr> <tr id="section-2"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-2">¶</a> </div> <h3>is_defined</h3>
|
5
|
+
|
6
|
+
<p>Convenience method to detect defined status</p> </td> <td class="code"> <div class="highlight"><pre><span class="nx">is_defined</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">suspect</span><span class="p">)</span> <span class="p">{</span>
|
7
|
+
<span class="k">return</span> <span class="k">typeof</span> <span class="nx">suspect</span> <span class="o">==</span> <span class="s2">"undefined"</span> <span class="o">?</span> <span class="kc">false</span> <span class="o">:</span> <span class="kc">true</span><span class="p">;</span>
|
8
|
+
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-3"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-3">¶</a> </div> <h3>is_undefined</h3>
|
9
|
+
|
10
|
+
<p>Convenience function to detect undefined status</p> </td> <td class="code"> <div class="highlight"><pre><span class="nx">is_undefined</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">suspect</span><span class="p">)</span> <span class="p">{</span>
|
11
|
+
<span class="k">return</span> <span class="k">typeof</span> <span class="nx">suspect</span> <span class="o">==</span> <span class="s2">"undefined"</span> <span class="o">?</span> <span class="kc">true</span> <span class="o">:</span> <span class="kc">false</span><span class="p">;</span>
|
12
|
+
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-4"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-4">¶</a> </div> <h3>is_typeof</h3>
|
13
|
+
|
14
|
+
<p>Strict type checking against the <code>suspect</code>'s constructor</p> </td> <td class="code"> <div class="highlight"><pre><span class="nx">is_typeof</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">type</span><span class="p">,</span> <span class="nx">suspect</span><span class="p">)</span> <span class="p">{</span>
|
15
|
+
<span class="k">if</span> <span class="p">(</span><span class="nx">is_undefined</span><span class="p">(</span><span class="nx">type</span><span class="p">))</span> <span class="p">{</span>
|
16
|
+
<span class="k">throw</span> <span class="k">new</span> <span class="nb">Error</span><span class="p">(</span><span class="s2">"is_typeof(Type, suspect): type is undefined"</span><span class="p">);</span>
|
17
|
+
<span class="p">}</span>
|
18
|
+
|
19
|
+
<span class="k">if</span> <span class="p">(</span><span class="nx">is_undefined</span><span class="p">(</span><span class="nx">suspect</span><span class="p">))</span> <span class="p">{</span>
|
20
|
+
<span class="k">throw</span> <span class="k">new</span> <span class="nb">Error</span><span class="p">(</span><span class="s2">"is_typeof(Type, suspect): suspect is undefined"</span><span class="p">);</span>
|
21
|
+
<span class="p">}</span>
|
22
|
+
|
23
|
+
<span class="k">return</span> <span class="nx">suspect</span><span class="p">.</span><span class="nx">constructor</span> <span class="o">==</span> <span class="nx">type</span> <span class="o">?</span> <span class="kc">true</span> <span class="o">:</span> <span class="kc">false</span><span class="p">;</span>
|
24
|
+
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-5"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-5">¶</a> </div> <h3>is_numeric</h3>
|
25
|
+
|
26
|
+
<p>Determines <code>suspect</code> holds a numeric value</p> </td> <td class="code"> <div class="highlight"><pre><span class="nx">is_numeric</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">suspect</span><span class="p">)</span> <span class="p">{</span>
|
27
|
+
<span class="k">if</span> <span class="p">(</span><span class="nb">isNaN</span><span class="p">(</span><span class="nx">suspect</span><span class="p">))</span> <span class="p">{</span>
|
28
|
+
<span class="k">return</span> <span class="kc">false</span><span class="p">;</span>
|
29
|
+
<span class="p">}</span>
|
30
|
+
<span class="k">return</span> <span class="o">!</span><span class="nb">isNaN</span><span class="p">(</span><span class="nb">parseFloat</span><span class="p">(</span><span class="nx">suspect</span><span class="p">))</span> <span class="o">&&</span> <span class="nb">isFinite</span><span class="p">(</span><span class="nx">suspect</span><span class="p">);</span>
|
31
|
+
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-6"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-6">¶</a> </div> <h3>is_string</h3>
|
32
|
+
|
33
|
+
<p>Alias method for String detection</p> </td> <td class="code"> <div class="highlight"><pre><span class="nx">is_string</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">suspect</span><span class="p">)</span> <span class="p">{</span>
|
34
|
+
<span class="k">return</span> <span class="nx">is_typeof</span><span class="p">(</span><span class="nb">String</span><span class="p">,</span> <span class="nx">suspect</span><span class="p">);</span>
|
35
|
+
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-7"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-7">¶</a> </div> <h3>is_array</h3>
|
36
|
+
|
37
|
+
<p>Alias method for Array detection</p> </td> <td class="code"> <div class="highlight"><pre><span class="nx">is_array</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">suspect</span><span class="p">)</span> <span class="p">{</span>
|
38
|
+
<span class="k">return</span> <span class="nx">is_typeof</span><span class="p">(</span><span class="nb">Array</span><span class="p">,</span> <span class="nx">suspect</span><span class="p">);</span>
|
39
|
+
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-8"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-8">¶</a> </div> <h3>is_number</h3>
|
40
|
+
|
41
|
+
<p>Alias method for Number detection</p> </td> <td class="code"> <div class="highlight"><pre><span class="nx">is_number</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">suspect</span><span class="p">)</span> <span class="p">{</span>
|
42
|
+
<span class="k">return</span> <span class="nx">is_typeof</span><span class="p">(</span><span class="nb">Number</span><span class="p">,</span> <span class="nx">suspect</span><span class="p">);</span>
|
43
|
+
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-9"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-9">¶</a> </div> <h3>is_date</h3>
|
44
|
+
|
45
|
+
<p>Alias method for Date detection</p> </td> <td class="code"> <div class="highlight"><pre><span class="nx">is_date</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">suspect</span><span class="p">)</span> <span class="p">{</span>
|
46
|
+
<span class="k">return</span> <span class="nx">is_typeof</span><span class="p">(</span><span class="nb">Date</span><span class="p">,</span> <span class="nx">suspect</span><span class="p">);</span>
|
47
|
+
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-10"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-10">¶</a> </div> <h3>is_bool</h3>
|
48
|
+
|
49
|
+
<p>Alias method for Boolean detection</p> </td> <td class="code"> <div class="highlight"><pre><span class="nx">is_bool</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">suspect</span><span class="p">)</span> <span class="p">{</span>
|
50
|
+
<span class="k">return</span> <span class="nx">is_typeof</span><span class="p">(</span><span class="nb">Boolean</span><span class="p">,</span> <span class="nx">suspect</span><span class="p">);</span>
|
51
|
+
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-11"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-11">¶</a> </div> <h3>is_regex</h3>
|
52
|
+
|
53
|
+
<p>Alias method for RegExp detection</p> </td> <td class="code"> <div class="highlight"><pre><span class="nx">is_regex</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">suspect</span><span class="p">)</span> <span class="p">{</span>
|
54
|
+
<span class="k">return</span> <span class="nx">is_typeof</span><span class="p">(</span><span class="nb">RegExp</span><span class="p">,</span> <span class="nx">suspect</span><span class="p">);</span>
|
55
|
+
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-12"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-12">¶</a> </div> <h3>is_empty</h3>
|
56
|
+
|
57
|
+
<p>Convenience method to detect whether the <code>suspect</code> is empty</p> </td> <td class="code"> <div class="highlight"><pre><span class="nx">is_empty</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">suspect</span><span class="p">)</span> <span class="p">{</span>
|
58
|
+
<span class="k">if</span> <span class="p">(</span><span class="nx">is_undefined</span><span class="p">(</span><span class="nx">suspect</span><span class="p">))</span> <span class="p">{</span>
|
59
|
+
<span class="k">return</span> <span class="kc">true</span><span class="p">;</span>
|
60
|
+
<span class="p">}</span>
|
61
|
+
|
62
|
+
<span class="k">return</span> <span class="nx">suspect</span><span class="p">.</span><span class="nx">length</span> <span class="o">===</span> <span class="mi">0</span><span class="p">;</span>
|
63
|
+
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-13"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-13">¶</a> </div> <h3>is<em>not</em>empty</h3>
|
64
|
+
|
65
|
+
<p>Convenience method to detect whether the <code>suspect</code> is not empty</p> </td> <td class="code"> <div class="highlight"><pre><span class="nx">is_not_empty</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">suspect</span><span class="p">)</span> <span class="p">{</span>
|
66
|
+
<span class="k">return</span> <span class="nx">suspect</span><span class="p">.</span><span class="nx">length</span> <span class="o">>=</span> <span class="mi">1</span><span class="p">;</span>
|
67
|
+
<span class="p">};</span>
|
68
|
+
|
69
|
+
</pre></div> </td> </tr> </tbody> </table> </div> </body> </html>
|
data/docs/module.html
ADDED
@@ -0,0 +1,67 @@
|
|
1
|
+
<!DOCTYPE html> <html> <head> <title>module.js</title> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <link rel="stylesheet" media="all" href="docco.css" /> </head> <body> <div id="container"> <div id="background"></div> <div id="jump_to"> Jump To … <div id="jump_wrapper"> <div id="jump_page"> <a class="source" href="application.html"> application.js </a> <a class="source" href="dom.html"> dom.js </a> <a class="source" href="module.html"> module.js </a> <a class="source" href="events.html"> events.js </a> <a class="source" href="existence.html"> existence.js </a> </div> </div> </div> <table cellpadding="0" cellspacing="0"> <thead> <tr> <th class="docs"> <h1> module.js </h1> </th> <th class="code"> </th> </tr> </thead> <tbody> <tr id="section-1"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-1">¶</a> </div> <h2>Mod.Module</h2> </td> <td class="code"> <div class="highlight"><pre></pre></div> </td> </tr> <tr id="section-2"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-2">¶</a> </div> <p>Modules are responsible for defining the specific behavior
|
2
|
+
of pieces of your application. All the functionality of your
|
3
|
+
application will be defined in modules.</p> </td> <td class="code"> <div class="highlight"><pre><span class="nx">Mod</span><span class="p">.</span><span class="nx">Module</span> <span class="o">=</span> <span class="p">(</span><span class="kd">function</span><span class="p">()</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-3"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-3">¶</a> </div> <p>Each module contains a <code>dom</code> property which is a <a href="dom.html">Mod.DOM</a>
|
4
|
+
instance to act as the module's API to the DOM. The <code>data</code> attribute
|
5
|
+
is a simple object literal that serves to store module-wide configuration
|
6
|
+
and properties (which prevents polluting the modules namespace and collision with public methods).
|
7
|
+
The <code>name</code> property is a convenience to be able to ask a module it's name.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">function</span> <span class="nx">Module</span><span class="p">(</span><span class="nx">name</span><span class="p">)</span> <span class="p">{</span>
|
8
|
+
<span class="k">if</span> <span class="p">(</span><span class="nx">is_undefined</span><span class="p">(</span><span class="nx">name</span><span class="p">))</span> <span class="p">{</span>
|
9
|
+
<span class="k">throw</span> <span class="k">new</span> <span class="nb">Error</span><span class="p">(</span><span class="s2">"Mod.Module(name): name is undefined"</span><span class="p">);</span>
|
10
|
+
<span class="p">}</span>
|
11
|
+
|
12
|
+
<span class="k">this</span><span class="p">.</span><span class="nx">dom</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">Mod</span><span class="p">.</span><span class="nx">DOM</span><span class="p">;</span>
|
13
|
+
<span class="k">this</span><span class="p">.</span><span class="nx">data</span> <span class="o">=</span> <span class="p">{};</span>
|
14
|
+
<span class="k">this</span><span class="p">.</span><span class="nx">name</span> <span class="o">=</span> <span class="nx">name</span><span class="p">;</span>
|
15
|
+
<span class="p">}</span></pre></div> </td> </tr> <tr id="section-4"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-4">¶</a> </div> <h3>actions</h3>
|
16
|
+
|
17
|
+
<p>The actions method is a placholder to be overwritten in each instance</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">Module</span><span class="p">.</span><span class="nx">prototype</span><span class="p">.</span><span class="nx">actions</span> <span class="o">=</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{};</span></pre></div> </td> </tr> <tr id="section-5"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-5">¶</a> </div> <h3>run</h3>
|
18
|
+
|
19
|
+
<p>Wait for the DOM to be ready and execute the actions</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">Module</span><span class="p">.</span><span class="nx">prototype</span><span class="p">.</span><span class="nx">run</span> <span class="o">=</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
20
|
+
<span class="kd">var</span> <span class="nx">mod</span> <span class="o">=</span> <span class="k">this</span><span class="p">;</span>
|
21
|
+
<span class="k">this</span><span class="p">.</span><span class="nx">dom</span><span class="p">.</span><span class="nx">call_when_ready</span><span class="p">(</span><span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
22
|
+
<span class="nx">mod</span><span class="p">.</span><span class="nx">execute</span><span class="p">();</span>
|
23
|
+
<span class="p">});</span>
|
24
|
+
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-6"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-6">¶</a> </div> <h3>execute</h3>
|
25
|
+
|
26
|
+
<p>Execute the actions immediately</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">Module</span><span class="p">.</span><span class="nx">prototype</span><span class="p">.</span><span class="nx">execute</span> <span class="o">=</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
27
|
+
<span class="k">this</span><span class="p">.</span><span class="nx">actions</span><span class="p">();</span>
|
28
|
+
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-7"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-7">¶</a> </div> <h3>elements</h3>
|
29
|
+
|
30
|
+
<p>Serves as an api to set and get elements from the module's <code>dom</code> property.
|
31
|
+
passing a string retrieves an element, passing an object sets elements</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">Module</span><span class="p">.</span><span class="nx">prototype</span><span class="p">.</span><span class="nx">elements</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">elements</span><span class="p">)</span> <span class="p">{</span>
|
32
|
+
<span class="k">if</span> <span class="p">(</span><span class="nx">is_undefined</span><span class="p">(</span><span class="nx">elements</span><span class="p">))</span> <span class="p">{</span>
|
33
|
+
<span class="k">return</span> <span class="k">this</span><span class="p">.</span><span class="nx">dom</span><span class="p">.</span><span class="nx">cache</span><span class="p">;</span>
|
34
|
+
<span class="p">}</span></pre></div> </td> </tr> <tr id="section-8"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-8">¶</a> </div> <p>Look up cached element by string key</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="nx">is_string</span><span class="p">(</span><span class="nx">elements</span><span class="p">))</span> <span class="p">{</span>
|
35
|
+
<span class="kd">var</span> <span class="nx">name</span> <span class="o">=</span> <span class="nx">elements</span><span class="p">;</span>
|
36
|
+
<span class="k">return</span> <span class="k">this</span><span class="p">.</span><span class="nx">dom</span><span class="p">.</span><span class="nx">cache</span><span class="p">[</span><span class="nx">name</span><span class="p">];</span>
|
37
|
+
<span class="p">}</span></pre></div> </td> </tr> <tr id="section-9"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-9">¶</a> </div> <p>cache the DOM objects</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">else</span> <span class="p">{</span>
|
38
|
+
<span class="k">this</span><span class="p">.</span><span class="nx">dom</span><span class="p">.</span><span class="nx">add_elements</span><span class="p">(</span><span class="nx">elements</span><span class="p">);</span>
|
39
|
+
<span class="p">}</span>
|
40
|
+
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-10"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-10">¶</a> </div> <h3>set_data</h3>
|
41
|
+
|
42
|
+
<p>Convenience method to add properties to the <code>data</code> property of the module</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">Module</span><span class="p">.</span><span class="nx">prototype</span><span class="p">.</span><span class="nx">set_data</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">key</span><span class="p">,</span> <span class="nx">value</span><span class="p">)</span> <span class="p">{</span>
|
43
|
+
<span class="k">if</span> <span class="p">(</span><span class="nx">is_undefined</span><span class="p">(</span><span class="nx">key</span><span class="p">))</span> <span class="p">{</span>
|
44
|
+
<span class="k">throw</span> <span class="k">new</span> <span class="nb">Error</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">name</span> <span class="o">+</span> <span class="s1">'.set_data(key, value): key is undefined'</span><span class="p">);</span>
|
45
|
+
<span class="p">}</span>
|
46
|
+
|
47
|
+
<span class="k">if</span> <span class="p">(</span><span class="nx">is_typeof</span><span class="p">(</span><span class="nb">String</span><span class="p">,</span> <span class="nx">key</span><span class="p">)</span> <span class="o">&&</span> <span class="nx">is_undefined</span><span class="p">(</span><span class="nx">value</span><span class="p">))</span> <span class="p">{</span>
|
48
|
+
<span class="k">throw</span> <span class="k">new</span> <span class="nx">SyntaxError</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">name</span> <span class="o">+</span> <span class="s1">'Module.set_data(key, value): value is undefined'</span><span class="p">);</span>
|
49
|
+
<span class="p">}</span>
|
50
|
+
|
51
|
+
<span class="k">if</span> <span class="p">(</span><span class="nx">is_typeof</span><span class="p">(</span><span class="nb">String</span><span class="p">,</span> <span class="nx">key</span><span class="p">))</span> <span class="p">{</span>
|
52
|
+
<span class="k">this</span><span class="p">.</span><span class="nx">data</span><span class="p">[</span><span class="nx">key</span><span class="p">]</span> <span class="o">=</span> <span class="nx">value</span><span class="p">;</span>
|
53
|
+
<span class="p">}</span>
|
54
|
+
<span class="k">else</span> <span class="k">if</span> <span class="p">(</span><span class="nx">is_typeof</span><span class="p">(</span><span class="nb">Object</span><span class="p">,</span> <span class="nx">key</span><span class="p">))</span> <span class="p">{</span>
|
55
|
+
<span class="kd">var</span> <span class="nx">data</span> <span class="o">=</span> <span class="nx">key</span><span class="p">;</span>
|
56
|
+
<span class="k">for</span><span class="p">(</span><span class="kd">var</span> <span class="nx">property</span> <span class="k">in</span> <span class="nx">data</span><span class="p">)</span> <span class="p">{</span>
|
57
|
+
<span class="k">this</span><span class="p">.</span><span class="nx">data</span><span class="p">[</span><span class="nx">property</span><span class="p">]</span> <span class="o">=</span> <span class="nx">data</span><span class="p">[</span><span class="nx">property</span><span class="p">];</span>
|
58
|
+
<span class="p">}</span>
|
59
|
+
<span class="p">}</span>
|
60
|
+
|
61
|
+
<span class="k">return</span> <span class="k">this</span><span class="p">;</span>
|
62
|
+
<span class="p">};</span>
|
63
|
+
|
64
|
+
<span class="k">return</span> <span class="nx">Module</span><span class="p">;</span>
|
65
|
+
<span class="p">})();</span>
|
66
|
+
|
67
|
+
</pre></div> </td> </tr> </tbody> </table> </div> </body> </html>
|
@@ -1,14 +1,21 @@
|
|
1
|
+
//## Mod.Application
|
2
|
+
|
3
|
+
// The application object serves as a basic namespace for your application
|
4
|
+
// with a convenience method for attaching modules.
|
1
5
|
Mod.Application = (function() {
|
2
6
|
|
7
|
+
// Constructing an application requires a name.
|
3
8
|
function Application(name) {
|
4
9
|
if (is_undefined(name)) {
|
5
10
|
throw new Error("new Mod.Application(name): name is undefined");
|
6
11
|
}
|
7
12
|
|
8
|
-
this.name = name
|
9
|
-
}
|
13
|
+
this.name = name;
|
14
|
+
}
|
10
15
|
|
11
|
-
|
16
|
+
//### add_module
|
17
|
+
// A factory method to attach modules to the application object.
|
18
|
+
// This method makes sure to avaoid naming collisions
|
12
19
|
Application.prototype.add_module = function(name) {
|
13
20
|
if (is_undefined(name)) {
|
14
21
|
throw new Error("Mod.Application.add_module(name): name is undefined");
|
@@ -25,5 +32,6 @@ Mod.Application = (function() {
|
|
25
32
|
return this[name] = new Mod.Module(name);
|
26
33
|
};
|
27
34
|
|
35
|
+
// Return the application object as a reference
|
28
36
|
return Application;
|
29
37
|
})();
|
@@ -1,13 +1,20 @@
|
|
1
|
+
//## Mod.DOM
|
2
|
+
|
3
|
+
// This object serves as an API to interacting with the dom and cacheing selected elements.
|
1
4
|
Mod.DOM = (function() {
|
2
5
|
|
6
|
+
// Set variables for a setInterval function and a queue to store methods to call when ready.
|
3
7
|
var timer,
|
4
8
|
queue = [];
|
5
9
|
|
10
|
+
// Set a `cache` property to store selected elements and an `is_ready` property to determine DOM status.
|
6
11
|
function DOM() {
|
7
12
|
this.cache = {};
|
8
13
|
this.is_ready = false;
|
9
14
|
}
|
10
15
|
|
16
|
+
//### add_event
|
17
|
+
// Convenience method to attach events
|
11
18
|
DOM.prototype.add_event = function(element, type, fn, capture) {
|
12
19
|
if (is_undefined(capture)) {
|
13
20
|
capture = false;
|
@@ -20,6 +27,8 @@ Mod.DOM = (function() {
|
|
20
27
|
element.addEventListener(type, fn, capture);
|
21
28
|
};
|
22
29
|
|
30
|
+
//### remove_event
|
31
|
+
// Convenience method to remove events
|
23
32
|
DOM.prototype.remove_event = function(element, type, fn, capture) {
|
24
33
|
if (is_undefined(capture)) {
|
25
34
|
capture = false;
|
@@ -32,6 +41,8 @@ Mod.DOM = (function() {
|
|
32
41
|
element.removeEventListener(type, fn, capture);
|
33
42
|
};
|
34
43
|
|
44
|
+
//### call_when_ready
|
45
|
+
// Pass a function to call when the DOM is ready
|
35
46
|
DOM.prototype.call_when_ready = function(func) {
|
36
47
|
// if DOM is already loaded execute the function
|
37
48
|
if (this.is_ready) {
|
@@ -51,6 +62,8 @@ Mod.DOM = (function() {
|
|
51
62
|
}
|
52
63
|
};
|
53
64
|
|
65
|
+
//### execute_ready_queue
|
66
|
+
// Execute all methods in the `queue`
|
54
67
|
DOM.prototype.execute_ready_queue = function() {
|
55
68
|
if (this.is_ready) {
|
56
69
|
return false;
|
@@ -68,6 +81,8 @@ Mod.DOM = (function() {
|
|
68
81
|
}
|
69
82
|
};
|
70
83
|
|
84
|
+
//### add_elements
|
85
|
+
// Add cached elements to the `DOM.cache` from an object of name/value pairs containing selected DOM elements
|
71
86
|
DOM.prototype.add_elements = function(elements) {
|
72
87
|
for(var key in elements) {
|
73
88
|
if (elements.hasOwnProperty(key)) {
|
@@ -76,6 +91,8 @@ Mod.DOM = (function() {
|
|
76
91
|
}
|
77
92
|
};
|
78
93
|
|
94
|
+
//### add_element
|
95
|
+
// Add a single element to the `DOM.cache`
|
79
96
|
DOM.prototype.add_element = function(key, element) {
|
80
97
|
this.cache[key] = element;
|
81
98
|
};
|