dreemgl
Version:
DreemGL is an open-source multi-screen prototyping framework for mediated environments, with a visual editor and shader styling for webGL and DALi runtimes written in JavaScript. As a toolkit for gpu-accelerated multiscreen development, DreemGL includes
841 lines (794 loc) • 51.9 kB
HTML
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>CodeRay output</title>
<style type="text/css">
.CodeRay .line-numbers a {
text-decoration: inherit;
color: inherit;
}
body {
background-color: white;
padding: 0;
margin: 0;
}
.CodeRay {
background-color: hsl(0,0%,95%);
border: 1px solid silver;
color: black;
}
.CodeRay pre {
margin: 0px;
}
span.CodeRay { white-space: pre; border: 0px; padding: 2px; }
table.CodeRay { border-collapse: collapse; width: 100%; padding: 2px; }
table.CodeRay td { padding: 2px 4px; vertical-align: top; }
.CodeRay .line-numbers {
background-color: hsl(180,65%,90%);
color: gray;
text-align: right;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
.CodeRay .line-numbers a {
background-color: hsl(180,65%,90%) !important;
color: gray !important;
text-decoration: none !important;
}
.CodeRay .line-numbers pre {
word-break: normal;
}
.CodeRay .line-numbers a:target { color: blue !important; }
.CodeRay .line-numbers .highlighted { color: red !important; }
.CodeRay .line-numbers .highlighted a { color: red !important; }
.CodeRay span.line-numbers { padding: 0px 4px; }
.CodeRay .line { display: block; float: left; width: 100%; }
.CodeRay .code { width: 100%; }
.CodeRay .debug { color: white !important; background: blue !important; }
.CodeRay .annotation { color:#007 }
.CodeRay .attribute-name { color:#b48 }
.CodeRay .attribute-value { color:#700 }
.CodeRay .binary { color:#549 }
.CodeRay .binary .char { color:#325 }
.CodeRay .binary .delimiter { color:#325 }
.CodeRay .char { color:#D20 }
.CodeRay .char .content { color:#D20 }
.CodeRay .char .delimiter { color:#710 }
.CodeRay .class { color:#B06; font-weight:bold }
.CodeRay .class-variable { color:#369 }
.CodeRay .color { color:#0A0 }
.CodeRay .comment { color:#777 }
.CodeRay .comment .char { color:#444 }
.CodeRay .comment .delimiter { color:#444 }
.CodeRay .constant { color:#036; font-weight:bold }
.CodeRay .decorator { color:#B0B }
.CodeRay .definition { color:#099; font-weight:bold }
.CodeRay .delimiter { color:black }
.CodeRay .directive { color:#088; font-weight:bold }
.CodeRay .docstring { color:#D42; }
.CodeRay .doctype { color:#34b }
.CodeRay .done { text-decoration: line-through; color: gray }
.CodeRay .entity { color:#800; font-weight:bold }
.CodeRay .error { color:#F00; background-color:#FAA }
.CodeRay .escape { color:#666 }
.CodeRay .exception { color:#C00; font-weight:bold }
.CodeRay .float { color:#60E }
.CodeRay .function { color:#06B; font-weight:bold }
.CodeRay .function .delimiter { color:#024; font-weight:bold }
.CodeRay .global-variable { color:#d70 }
.CodeRay .hex { color:#02b }
.CodeRay .id { color:#33D; font-weight:bold }
.CodeRay .include { color:#B44; font-weight:bold }
.CodeRay .inline { background-color: hsla(0,0%,0%,0.07); color: black }
.CodeRay .inline-delimiter { font-weight: bold; color: #666 }
.CodeRay .instance-variable { color:#33B }
.CodeRay .integer { color:#00D }
.CodeRay .imaginary { color:#f00 }
.CodeRay .important { color:#D00 }
.CodeRay .key { color: #606 }
.CodeRay .key .char { color: #60f }
.CodeRay .key .delimiter { color: #404 }
.CodeRay .keyword { color:#080; font-weight:bold }
.CodeRay .label { color:#970; font-weight:bold }
.CodeRay .local-variable { color:#950 }
.CodeRay .map .content { color:#808 }
.CodeRay .map .delimiter { color:#40A}
.CodeRay .map { background-color:hsla(200,100%,50%,0.06); }
.CodeRay .namespace { color:#707; font-weight:bold }
.CodeRay .octal { color:#40E }
.CodeRay .operator { }
.CodeRay .predefined { color:#369; font-weight:bold }
.CodeRay .predefined-constant { color:#069 }
.CodeRay .predefined-type { color:#0a8; font-weight:bold }
.CodeRay .preprocessor { color:#579 }
.CodeRay .pseudo-class { color:#00C; font-weight:bold }
.CodeRay .regexp { background-color:hsla(300,100%,50%,0.06); }
.CodeRay .regexp .content { color:#808 }
.CodeRay .regexp .delimiter { color:#404 }
.CodeRay .regexp .modifier { color:#C2C }
.CodeRay .reserved { color:#080; font-weight:bold }
.CodeRay .shell { background-color:hsla(120,100%,50%,0.06); }
.CodeRay .shell .content { color:#2B2 }
.CodeRay .shell .delimiter { color:#161 }
.CodeRay .string { background-color:hsla(0,100%,50%,0.05); }
.CodeRay .string .char { color: #b0b }
.CodeRay .string .content { color: #D20 }
.CodeRay .string .delimiter { color: #710 }
.CodeRay .string .modifier { color: #E40 }
.CodeRay .symbol { color:#A60 }
.CodeRay .symbol .content { color:#A60 }
.CodeRay .symbol .delimiter { color:#740 }
.CodeRay .tag { color:#070; font-weight:bold }
.CodeRay .type { color:#339; font-weight:bold }
.CodeRay .value { color: #088 }
.CodeRay .variable { color:#037 }
.CodeRay .insert { background: hsla(120,100%,50%,0.12) }
.CodeRay .delete { background: hsla(0,100%,50%,0.12) }
.CodeRay .change { color: #bbf; background: #007 }
.CodeRay .head { color: #f8f; background: #505 }
.CodeRay .head .filename { color: white; }
.CodeRay .delete .eyecatcher { background-color: hsla(0,100%,50%,0.2); border: 1px solid hsla(0,100%,45%,0.5); margin: -1px; border-bottom: none; border-top-left-radius: 5px; border-top-right-radius: 5px; }
.CodeRay .insert .eyecatcher { background-color: hsla(120,100%,50%,0.2); border: 1px solid hsla(120,100%,25%,0.5); margin: -1px; border-top: none; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; }
.CodeRay .insert .insert { color: #0c0; background:transparent; font-weight:bold }
.CodeRay .delete .delete { color: #c00; background:transparent; font-weight:bold }
.CodeRay .change .change { color: #88f }
.CodeRay .head .head { color: #f4f }
.CodeRay {
border: none;
}
</style>
</head>
<body>
<table class="CodeRay"><tr>
<td class="line-numbers"><pre><a href="#n1" name="n1">1</a>
<a href="#n2" name="n2">2</a>
<a href="#n3" name="n3">3</a>
<a href="#n4" name="n4">4</a>
<a href="#n5" name="n5">5</a>
<a href="#n6" name="n6">6</a>
<a href="#n7" name="n7">7</a>
<a href="#n8" name="n8">8</a>
<a href="#n9" name="n9">9</a>
<strong><a href="#n10" name="n10">10</a></strong>
<a href="#n11" name="n11">11</a>
<a href="#n12" name="n12">12</a>
<a href="#n13" name="n13">13</a>
<a href="#n14" name="n14">14</a>
<a href="#n15" name="n15">15</a>
<a href="#n16" name="n16">16</a>
<a href="#n17" name="n17">17</a>
<a href="#n18" name="n18">18</a>
<a href="#n19" name="n19">19</a>
<strong><a href="#n20" name="n20">20</a></strong>
<a href="#n21" name="n21">21</a>
<a href="#n22" name="n22">22</a>
<a href="#n23" name="n23">23</a>
<a href="#n24" name="n24">24</a>
<a href="#n25" name="n25">25</a>
<a href="#n26" name="n26">26</a>
<a href="#n27" name="n27">27</a>
<a href="#n28" name="n28">28</a>
<a href="#n29" name="n29">29</a>
<strong><a href="#n30" name="n30">30</a></strong>
<a href="#n31" name="n31">31</a>
<a href="#n32" name="n32">32</a>
<a href="#n33" name="n33">33</a>
<a href="#n34" name="n34">34</a>
<a href="#n35" name="n35">35</a>
<a href="#n36" name="n36">36</a>
<a href="#n37" name="n37">37</a>
<a href="#n38" name="n38">38</a>
<a href="#n39" name="n39">39</a>
<strong><a href="#n40" name="n40">40</a></strong>
<a href="#n41" name="n41">41</a>
<a href="#n42" name="n42">42</a>
<a href="#n43" name="n43">43</a>
<a href="#n44" name="n44">44</a>
<a href="#n45" name="n45">45</a>
<a href="#n46" name="n46">46</a>
<a href="#n47" name="n47">47</a>
<a href="#n48" name="n48">48</a>
<a href="#n49" name="n49">49</a>
<strong><a href="#n50" name="n50">50</a></strong>
<a href="#n51" name="n51">51</a>
<a href="#n52" name="n52">52</a>
<a href="#n53" name="n53">53</a>
<a href="#n54" name="n54">54</a>
<a href="#n55" name="n55">55</a>
<a href="#n56" name="n56">56</a>
<a href="#n57" name="n57">57</a>
<a href="#n58" name="n58">58</a>
<a href="#n59" name="n59">59</a>
<strong><a href="#n60" name="n60">60</a></strong>
<a href="#n61" name="n61">61</a>
<a href="#n62" name="n62">62</a>
<a href="#n63" name="n63">63</a>
<a href="#n64" name="n64">64</a>
<a href="#n65" name="n65">65</a>
<a href="#n66" name="n66">66</a>
<a href="#n67" name="n67">67</a>
<a href="#n68" name="n68">68</a>
<a href="#n69" name="n69">69</a>
<strong><a href="#n70" name="n70">70</a></strong>
<a href="#n71" name="n71">71</a>
<a href="#n72" name="n72">72</a>
<a href="#n73" name="n73">73</a>
<a href="#n74" name="n74">74</a>
<a href="#n75" name="n75">75</a>
<a href="#n76" name="n76">76</a>
<a href="#n77" name="n77">77</a>
<a href="#n78" name="n78">78</a>
<a href="#n79" name="n79">79</a>
<strong><a href="#n80" name="n80">80</a></strong>
<a href="#n81" name="n81">81</a>
<a href="#n82" name="n82">82</a>
<a href="#n83" name="n83">83</a>
<a href="#n84" name="n84">84</a>
<a href="#n85" name="n85">85</a>
<a href="#n86" name="n86">86</a>
<a href="#n87" name="n87">87</a>
<a href="#n88" name="n88">88</a>
<a href="#n89" name="n89">89</a>
<strong><a href="#n90" name="n90">90</a></strong>
<a href="#n91" name="n91">91</a>
<a href="#n92" name="n92">92</a>
<a href="#n93" name="n93">93</a>
<a href="#n94" name="n94">94</a>
<a href="#n95" name="n95">95</a>
<a href="#n96" name="n96">96</a>
<a href="#n97" name="n97">97</a>
<a href="#n98" name="n98">98</a>
<a href="#n99" name="n99">99</a>
<strong><a href="#n100" name="n100">100</a></strong>
<a href="#n101" name="n101">101</a>
<a href="#n102" name="n102">102</a>
<a href="#n103" name="n103">103</a>
<a href="#n104" name="n104">104</a>
<a href="#n105" name="n105">105</a>
<a href="#n106" name="n106">106</a>
<a href="#n107" name="n107">107</a>
<a href="#n108" name="n108">108</a>
<a href="#n109" name="n109">109</a>
<strong><a href="#n110" name="n110">110</a></strong>
<a href="#n111" name="n111">111</a>
<a href="#n112" name="n112">112</a>
<a href="#n113" name="n113">113</a>
<a href="#n114" name="n114">114</a>
<a href="#n115" name="n115">115</a>
<a href="#n116" name="n116">116</a>
<a href="#n117" name="n117">117</a>
<a href="#n118" name="n118">118</a>
<a href="#n119" name="n119">119</a>
<strong><a href="#n120" name="n120">120</a></strong>
<a href="#n121" name="n121">121</a>
<a href="#n122" name="n122">122</a>
<a href="#n123" name="n123">123</a>
<a href="#n124" name="n124">124</a>
<a href="#n125" name="n125">125</a>
<a href="#n126" name="n126">126</a>
<a href="#n127" name="n127">127</a>
<a href="#n128" name="n128">128</a>
<a href="#n129" name="n129">129</a>
<strong><a href="#n130" name="n130">130</a></strong>
<a href="#n131" name="n131">131</a>
<a href="#n132" name="n132">132</a>
<a href="#n133" name="n133">133</a>
<a href="#n134" name="n134">134</a>
<a href="#n135" name="n135">135</a>
<a href="#n136" name="n136">136</a>
<a href="#n137" name="n137">137</a>
<a href="#n138" name="n138">138</a>
<a href="#n139" name="n139">139</a>
<strong><a href="#n140" name="n140">140</a></strong>
<a href="#n141" name="n141">141</a>
<a href="#n142" name="n142">142</a>
<a href="#n143" name="n143">143</a>
<a href="#n144" name="n144">144</a>
<a href="#n145" name="n145">145</a>
<a href="#n146" name="n146">146</a>
<a href="#n147" name="n147">147</a>
<a href="#n148" name="n148">148</a>
<a href="#n149" name="n149">149</a>
<strong><a href="#n150" name="n150">150</a></strong>
<a href="#n151" name="n151">151</a>
<a href="#n152" name="n152">152</a>
<a href="#n153" name="n153">153</a>
<a href="#n154" name="n154">154</a>
<a href="#n155" name="n155">155</a>
<a href="#n156" name="n156">156</a>
<a href="#n157" name="n157">157</a>
<a href="#n158" name="n158">158</a>
<a href="#n159" name="n159">159</a>
<strong><a href="#n160" name="n160">160</a></strong>
<a href="#n161" name="n161">161</a>
<a href="#n162" name="n162">162</a>
<a href="#n163" name="n163">163</a>
<a href="#n164" name="n164">164</a>
<a href="#n165" name="n165">165</a>
<a href="#n166" name="n166">166</a>
<a href="#n167" name="n167">167</a>
<a href="#n168" name="n168">168</a>
<a href="#n169" name="n169">169</a>
<strong><a href="#n170" name="n170">170</a></strong>
<a href="#n171" name="n171">171</a>
<a href="#n172" name="n172">172</a>
<a href="#n173" name="n173">173</a>
<a href="#n174" name="n174">174</a>
<a href="#n175" name="n175">175</a>
<a href="#n176" name="n176">176</a>
<a href="#n177" name="n177">177</a>
<a href="#n178" name="n178">178</a>
<a href="#n179" name="n179">179</a>
<strong><a href="#n180" name="n180">180</a></strong>
<a href="#n181" name="n181">181</a>
<a href="#n182" name="n182">182</a>
<a href="#n183" name="n183">183</a>
<a href="#n184" name="n184">184</a>
<a href="#n185" name="n185">185</a>
<a href="#n186" name="n186">186</a>
<a href="#n187" name="n187">187</a>
<a href="#n188" name="n188">188</a>
<a href="#n189" name="n189">189</a>
<strong><a href="#n190" name="n190">190</a></strong>
<a href="#n191" name="n191">191</a>
<a href="#n192" name="n192">192</a>
<a href="#n193" name="n193">193</a>
<a href="#n194" name="n194">194</a>
<a href="#n195" name="n195">195</a>
<a href="#n196" name="n196">196</a>
<a href="#n197" name="n197">197</a>
<a href="#n198" name="n198">198</a>
<a href="#n199" name="n199">199</a>
<strong><a href="#n200" name="n200">200</a></strong>
<a href="#n201" name="n201">201</a>
<a href="#n202" name="n202">202</a>
<a href="#n203" name="n203">203</a>
<a href="#n204" name="n204">204</a>
<a href="#n205" name="n205">205</a>
<a href="#n206" name="n206">206</a>
<a href="#n207" name="n207">207</a>
<a href="#n208" name="n208">208</a>
<a href="#n209" name="n209">209</a>
<strong><a href="#n210" name="n210">210</a></strong>
<a href="#n211" name="n211">211</a>
<a href="#n212" name="n212">212</a>
<a href="#n213" name="n213">213</a>
<a href="#n214" name="n214">214</a>
<a href="#n215" name="n215">215</a>
<a href="#n216" name="n216">216</a>
<a href="#n217" name="n217">217</a>
<a href="#n218" name="n218">218</a>
<a href="#n219" name="n219">219</a>
<strong><a href="#n220" name="n220">220</a></strong>
<a href="#n221" name="n221">221</a>
<a href="#n222" name="n222">222</a>
<a href="#n223" name="n223">223</a>
<a href="#n224" name="n224">224</a>
<a href="#n225" name="n225">225</a>
<a href="#n226" name="n226">226</a>
<a href="#n227" name="n227">227</a>
<a href="#n228" name="n228">228</a>
<a href="#n229" name="n229">229</a>
<strong><a href="#n230" name="n230">230</a></strong>
<a href="#n231" name="n231">231</a>
<a href="#n232" name="n232">232</a>
<a href="#n233" name="n233">233</a>
<a href="#n234" name="n234">234</a>
<a href="#n235" name="n235">235</a>
<a href="#n236" name="n236">236</a>
<a href="#n237" name="n237">237</a>
<a href="#n238" name="n238">238</a>
<a href="#n239" name="n239">239</a>
<strong><a href="#n240" name="n240">240</a></strong>
<a href="#n241" name="n241">241</a>
<a href="#n242" name="n242">242</a>
<a href="#n243" name="n243">243</a>
<a href="#n244" name="n244">244</a>
<a href="#n245" name="n245">245</a>
<a href="#n246" name="n246">246</a>
<a href="#n247" name="n247">247</a>
<a href="#n248" name="n248">248</a>
<a href="#n249" name="n249">249</a>
<strong><a href="#n250" name="n250">250</a></strong>
<a href="#n251" name="n251">251</a>
<a href="#n252" name="n252">252</a>
<a href="#n253" name="n253">253</a>
<a href="#n254" name="n254">254</a>
<a href="#n255" name="n255">255</a>
<a href="#n256" name="n256">256</a>
<a href="#n257" name="n257">257</a>
<a href="#n258" name="n258">258</a>
<a href="#n259" name="n259">259</a>
<strong><a href="#n260" name="n260">260</a></strong>
<a href="#n261" name="n261">261</a>
<a href="#n262" name="n262">262</a>
<a href="#n263" name="n263">263</a>
<a href="#n264" name="n264">264</a>
<a href="#n265" name="n265">265</a>
<a href="#n266" name="n266">266</a>
<a href="#n267" name="n267">267</a>
<a href="#n268" name="n268">268</a>
<a href="#n269" name="n269">269</a>
<strong><a href="#n270" name="n270">270</a></strong>
<a href="#n271" name="n271">271</a>
<a href="#n272" name="n272">272</a>
<a href="#n273" name="n273">273</a>
<a href="#n274" name="n274">274</a>
<a href="#n275" name="n275">275</a>
<a href="#n276" name="n276">276</a>
<a href="#n277" name="n277">277</a>
<a href="#n278" name="n278">278</a>
<a href="#n279" name="n279">279</a>
<strong><a href="#n280" name="n280">280</a></strong>
<a href="#n281" name="n281">281</a>
<a href="#n282" name="n282">282</a>
<a href="#n283" name="n283">283</a>
<a href="#n284" name="n284">284</a>
<a href="#n285" name="n285">285</a>
<a href="#n286" name="n286">286</a>
<a href="#n287" name="n287">287</a>
<a href="#n288" name="n288">288</a>
<a href="#n289" name="n289">289</a>
<strong><a href="#n290" name="n290">290</a></strong>
<a href="#n291" name="n291">291</a>
<a href="#n292" name="n292">292</a>
<a href="#n293" name="n293">293</a>
<a href="#n294" name="n294">294</a>
<a href="#n295" name="n295">295</a>
<a href="#n296" name="n296">296</a>
<a href="#n297" name="n297">297</a>
<a href="#n298" name="n298">298</a>
<a href="#n299" name="n299">299</a>
<strong><a href="#n300" name="n300">300</a></strong>
<a href="#n301" name="n301">301</a>
<a href="#n302" name="n302">302</a>
<a href="#n303" name="n303">303</a>
<a href="#n304" name="n304">304</a>
<a href="#n305" name="n305">305</a>
<a href="#n306" name="n306">306</a>
<a href="#n307" name="n307">307</a>
<a href="#n308" name="n308">308</a>
<a href="#n309" name="n309">309</a>
<strong><a href="#n310" name="n310">310</a></strong>
<a href="#n311" name="n311">311</a>
<a href="#n312" name="n312">312</a>
<a href="#n313" name="n313">313</a>
<a href="#n314" name="n314">314</a>
<a href="#n315" name="n315">315</a>
<a href="#n316" name="n316">316</a>
<a href="#n317" name="n317">317</a>
<a href="#n318" name="n318">318</a>
<a href="#n319" name="n319">319</a>
<strong><a href="#n320" name="n320">320</a></strong>
<a href="#n321" name="n321">321</a>
<a href="#n322" name="n322">322</a>
<a href="#n323" name="n323">323</a>
<a href="#n324" name="n324">324</a>
<a href="#n325" name="n325">325</a>
<a href="#n326" name="n326">326</a>
<a href="#n327" name="n327">327</a>
<a href="#n328" name="n328">328</a>
<a href="#n329" name="n329">329</a>
<strong><a href="#n330" name="n330">330</a></strong>
<a href="#n331" name="n331">331</a>
<a href="#n332" name="n332">332</a>
<a href="#n333" name="n333">333</a>
<a href="#n334" name="n334">334</a>
<a href="#n335" name="n335">335</a>
<a href="#n336" name="n336">336</a>
<a href="#n337" name="n337">337</a>
<a href="#n338" name="n338">338</a>
<a href="#n339" name="n339">339</a>
<strong><a href="#n340" name="n340">340</a></strong>
<a href="#n341" name="n341">341</a>
<a href="#n342" name="n342">342</a>
<a href="#n343" name="n343">343</a>
<a href="#n344" name="n344">344</a>
<a href="#n345" name="n345">345</a>
<a href="#n346" name="n346">346</a>
<a href="#n347" name="n347">347</a>
<a href="#n348" name="n348">348</a>
<a href="#n349" name="n349">349</a>
<strong><a href="#n350" name="n350">350</a></strong>
<a href="#n351" name="n351">351</a>
<a href="#n352" name="n352">352</a>
</pre></td>
<td class="code"><pre><span class="comment">/* DreemGL is a collaboration between Teeming Society & Samsung Electronics, sponsored by Samsung and others.
Copyright 2015-2016 Teeming Society. Licensed under the Apache License, Version 2.0 (the "License"); You may not use this file except in compliance with the License.
You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0 Unless required by applicable law or agreed to in writing,
software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and limitations under the License.*/</span>
<span class="comment">// Pointer emits events that unify mouse and touch interactions.</span>
define.<span class="reserved">class</span>(<span class="string"><span class="delimiter">'</span><span class="content">$system/base/node</span><span class="delimiter">'</span></span>, <span class="keyword">function</span>(){
<span class="keyword">var</span> TAPSPEED = <span class="integer">150</span>
<span class="keyword">var</span> TAPDIST = <span class="integer">5</span>
<span class="local-variable">this</span>.<span class="function">atConstructor</span> = <span class="keyword">function</span>(){}
<span class="comment">// Internal: Pointer list with helper methods.</span>
<span class="keyword">var</span> <span class="function">PointerList</span> = <span class="keyword">function</span> () {
Array.call(<span class="local-variable">this</span>)
}
PointerList.prototype = Object.create( Array.prototype )
PointerList.prototype.constructor = PointerList
<span class="comment">// Internal: Finds first unused id in sorted pointer list</span>
PointerList.prototype.<span class="function">getAvailableId</span> = <span class="keyword">function</span> () {
<span class="keyword">var</span> id = <span class="integer">0</span>
<span class="keyword">for</span> (<span class="keyword">var</span> i = <span class="integer">0</span>; i < <span class="local-variable">this</span>.length; i++) {
<span class="keyword">if</span> (<span class="local-variable">this</span>[i].id === id) id += <span class="integer">1</span>
}
<span class="keyword">return</span> id
}
<span class="comment">// Internal: Finds closest pointer ID in the list to a specified pointer</span>
PointerList.prototype.<span class="function">getClosest</span> = <span class="keyword">function</span> (pointer) {
<span class="keyword">var</span> closest, dist, closestdist = <span class="predefined-constant">Infinity</span>
<span class="keyword">for</span> (<span class="keyword">var</span> i = <span class="integer">0</span>; i < <span class="local-variable">this</span>.length; i++) {
dist = vec2.distance(pointer.position, <span class="local-variable">this</span>[i].position)
<span class="keyword">if</span> (dist < closestdist) {
closest = <span class="local-variable">this</span>[i]
closestdist = dist
}
}
<span class="keyword">return</span> closest !== <span class="predefined-constant">undefined</span> ? closest : <span class="predefined-constant">undefined</span>
}
<span class="comment">// Internal: Returns a pointer with specified ID</span>
PointerList.prototype.<span class="function">getById</span> = <span class="keyword">function</span> (id) {
<span class="keyword">for</span> (<span class="keyword">var</span> i = <span class="integer">0</span>; i < <span class="local-variable">this</span>.length; i++) {
<span class="keyword">if</span> (<span class="local-variable">this</span>[i].id === id) {
<span class="keyword">return</span> <span class="local-variable">this</span>[i]
}
}
}
<span class="comment">// Internal: Removes specified pointer from the list</span>
PointerList.prototype.<span class="function">removePointer</span> = <span class="keyword">function</span> (pointer) {
<span class="keyword">for</span> (<span class="keyword">var</span> i = <span class="local-variable">this</span>.length; i--;) {
<span class="keyword">if</span> (<span class="local-variable">this</span>[i].id === pointer.id) {
<span class="local-variable">this</span>.splice(i, <span class="integer">1</span>)
<span class="keyword">return</span>
}
}
}
<span class="comment">// Internal: Adds pointer to the list or replaces it if ID match is found</span>
PointerList.prototype.<span class="function">setPointer</span> = <span class="keyword">function</span> (pointer) {
<span class="keyword">for</span> (<span class="keyword">var</span> i = <span class="local-variable">this</span>.length; i--;) {
<span class="keyword">if</span> (<span class="local-variable">this</span>[i].id === pointer.id) {
<span class="local-variable">this</span>.splice(i, <span class="integer">1</span>, <span class="keyword">new</span> Pointer(pointer, pointer.id, pointer.view))
<span class="keyword">return</span>
}
}
<span class="local-variable">this</span>.push(<span class="keyword">new</span> Pointer(pointer, pointer.id, pointer.view))
<span class="local-variable">this</span>.sort(<span class="keyword">function</span>(a, b) {
<span class="keyword">if</span> (a.id < b.id) <span class="keyword">return</span> -<span class="integer">1</span>
<span class="keyword">if</span> (a.id > b.id) <span class="keyword">return</span> <span class="integer">1</span>
<span class="keyword">return</span> <span class="integer">0</span>
})
}
<span class="comment">// Internal: Iterates over all views associated with the pointer list and</span>
<span class="comment">// calls specified callback with the view and filtered pointers as arguments</span>
PointerList.prototype.<span class="function">forEachView</span> = <span class="keyword">function</span> (callback) {
<span class="keyword">var</span> views = []
<span class="keyword">for</span> (<span class="keyword">var</span> i = <span class="integer">0</span>; i < <span class="local-variable">this</span>.length; i++) {
<span class="keyword">if</span> (<span class="local-variable">this</span>[i].view && views.indexOf(<span class="local-variable">this</span>[i].view) == -<span class="integer">1</span>) {
views.push(<span class="local-variable">this</span>[i].view)
}
}
<span class="keyword">for</span> (<span class="keyword">var</span> i = <span class="integer">0</span>; i < views.length; i++) {
<span class="keyword">var</span> pointers = []
<span class="keyword">for</span> (<span class="keyword">var</span> j = <span class="integer">0</span>; j < <span class="local-variable">this</span>.length; j++) {
<span class="keyword">if</span> (<span class="local-variable">this</span>[j].view === views[i] && pointers.indexOf(<span class="local-variable">this</span>[j]) == -<span class="integer">1</span>) {
pointers.push(<span class="local-variable">this</span>[j])
}
}
callback(views[i], pointers)
}
}
<span class="comment">// Internal: Returns pointer object.</span>
<span class="comment">// It calculats deltas, min and max is reference pointer is provided.</span>
<span class="keyword">var</span> <span class="function">Pointer</span> = <span class="keyword">function</span>(pointer, id, view) {
<span class="comment">// TODO(aki): add start value</span>
<span class="local-variable">this</span>.id = id
<span class="local-variable">this</span>.view = view
<span class="local-variable">this</span>.value = pointer.value
<span class="local-variable">this</span>.position = pointer.position
<span class="local-variable">this</span>.button = pointer.button
<span class="local-variable">this</span>.shift = pointer.shift
<span class="local-variable">this</span>.alt = pointer.alt
<span class="local-variable">this</span>.ctrl = pointer.ctrl
<span class="local-variable">this</span>.meta = pointer.meta
<span class="local-variable">this</span>.touch = pointer.touch
<span class="local-variable">this</span>.delta = pointer.delta || vec2()
<span class="local-variable">this</span>.min = pointer.min || vec2()
<span class="local-variable">this</span>.max = pointer.max || vec2()
<span class="local-variable">this</span>.dt = pointer.dt || <span class="integer">0</span>
<span class="local-variable">this</span>.movement = pointer.movement || vec2()
<span class="local-variable">this</span>.isover = pointer.isover
<span class="local-variable">this</span>.pick = pointer.pick
<span class="local-variable">this</span>.clicker = pointer.clicker
<span class="local-variable">this</span>.t = Date.now()
<span class="keyword">if</span> (pointer.wheel !== <span class="predefined-constant">undefined</span>) <span class="local-variable">this</span>.wheel = pointer.wheel
}
Pointer.prototype.<span class="function">addDelta</span> = <span class="keyword">function</span>(refpointer) {
<span class="local-variable">this</span>.delta = vec2(<span class="local-variable">this</span>.position[<span class="integer">0</span>] - refpointer.position[<span class="integer">0</span>], <span class="local-variable">this</span>.position[<span class="integer">1</span>] - refpointer.position[<span class="integer">1</span>])
<span class="local-variable">this</span>.min = vec2(min(<span class="local-variable">this</span>.position[<span class="integer">0</span>], refpointer.position[<span class="integer">0</span>]), min(<span class="local-variable">this</span>.position[<span class="integer">1</span>], refpointer.position[<span class="integer">1</span>]))
<span class="local-variable">this</span>.max = vec2(max(<span class="local-variable">this</span>.position[<span class="integer">0</span>], refpointer.position[<span class="integer">0</span>]), max(<span class="local-variable">this</span>.position[<span class="integer">1</span>], refpointer.position[<span class="integer">1</span>]))
<span class="local-variable">this</span>.dt = <span class="local-variable">this</span>.t - refpointer.t
}
Pointer.prototype.<span class="function">addMovement</span> = <span class="keyword">function</span>(refpointer) {
<span class="local-variable">this</span>.movement = vec2(<span class="local-variable">this</span>.position[<span class="integer">0</span>] - refpointer.position[<span class="integer">0</span>], <span class="local-variable">this</span>.position[<span class="integer">1</span>] - refpointer.position[<span class="integer">1</span>])
}
<span class="comment">// Adds click count to pointer</span>
Pointer.prototype.<span class="function">setClicker</span> = <span class="keyword">function</span>(list) {
<span class="local-variable">this</span>.clicker = <span class="integer">0</span>
<span class="keyword">for</span> (<span class="keyword">var</span> i = <span class="integer">0</span>; i < list.length; i++) {
<span class="keyword">if</span> (<span class="local-variable">this</span>.t - list[i].t < TAPSPEED * (i + <span class="integer">1</span>)) <span class="local-variable">this</span>.clicker += <span class="integer">1</span>
}
}
<span class="comment">// TODO(aki): initialize per instance</span>
<span class="local-variable">this</span>.attributes = {
<span class="comment">// List of pointers that are captured.</span>
<span class="key">first</span>:Config({<span class="key">type</span>: Array, <span class="key">value</span>: <span class="keyword">new</span> PointerList()}),
<span class="comment">// List of pointers at the moment of capture.</span>
<span class="key">start</span>:Config({<span class="key">type</span>: Array, <span class="key">value</span>: <span class="keyword">new</span> PointerList()}),
<span class="comment">// List of captured pointers while moving.</span>
<span class="key">move</span>:Config({<span class="key">type</span>: Array, <span class="key">value</span>: <span class="keyword">new</span> PointerList()}),
<span class="comment">// List of pointers released from capture.</span>
<span class="key">end</span>:Config({<span class="key">type</span>: Array, <span class="key">value</span>: <span class="keyword">new</span> PointerList()}),
<span class="comment">// List of pointers that satisfy tap criteria at the moment of release.</span>
<span class="key">tap</span>:Config({<span class="key">type</span>: Array, <span class="key">value</span>: <span class="keyword">new</span> PointerList()}),
<span class="comment">// List of uncaptured pointers in movinf state (should apply only to mouse).</span>
<span class="key">hover</span>:Config({<span class="key">type</span>: Array, <span class="key">value</span>: <span class="keyword">new</span> PointerList()}),
<span class="comment">// List of pointers that entered a view.</span>
<span class="key">over</span>:Config({<span class="key">type</span>: Array, <span class="key">value</span>: <span class="keyword">new</span> PointerList()}),
<span class="comment">// List of pointers that exited a view.</span>
<span class="key">out</span>:Config({<span class="key">type</span>: Array, <span class="key">value</span>: <span class="keyword">new</span> PointerList()}),
<span class="comment">// List of pointers that emitted wheel event (should apply only to mouse).</span>
<span class="key">wheel</span>:Config({<span class="key">type</span>: Array, <span class="key">value</span>: <span class="keyword">new</span> PointerList()}),
<span class="comment">// list of previous taps</span>
<span class="key">clickerstash</span>:Config({<span class="key">type</span>: Array, <span class="key">value</span>: []})
}
<span class="local-variable">this</span>.<span class="function">emitPointerList</span> = <span class="keyword">function</span>(pointerlist, eventname) {
pointerlist.forEachView(<span class="keyword">function</span>(view, pointers) {
pointers.forEach(<span class="keyword">function</span>(pointer) {
<span class="comment">// delete pointer.view</span>
<span class="local-variable">this</span>.emit(eventname, {<span class="key">view</span>: view, <span class="key">pointer</span>: pointer})
}.bind(<span class="local-variable">this</span>))
<span class="local-variable">this</span>.emit(eventname, {<span class="key">view</span>: view, <span class="key">pointers</span>: pointers})
}.bind(<span class="local-variable">this</span>))
}
<span class="comment">// Internal: emits `start` event.</span>
<span class="comment">// TODO(aki): down with button 2 seems to trigger end and tap. Investigate.</span>
<span class="local-variable">this</span>.<span class="function">setstart</span> = <span class="keyword">function</span>(pointerlist) {
<span class="comment">// scan for handoff hooks on in flight pointers</span>
<span class="keyword">for</span> (<span class="keyword">var</span> i = <span class="integer">0</span>; i < <span class="local-variable">this</span>._start.length; i++) {
<span class="keyword">var</span> start = <span class="local-variable">this</span>._start[i]
<span class="keyword">if</span> (start.atHandOver){
<span class="keyword">var</span> id = start.atHandOver(pointerlist)
<span class="keyword">if</span> (id >= <span class="integer">0</span>){
<span class="comment">// we got a handoff of a particular pointer</span>
pointerlist[id].handovered = start.view
}
}
}
<span class="local-variable">this</span>._start.length = <span class="integer">0</span>
<span class="keyword">var</span> <span class="function">pick</span> = <span class="keyword">function</span>(view){
<span class="keyword">var</span> id = <span class="local-variable">this</span>._first.getAvailableId()
<span class="keyword">var</span> pointer = <span class="keyword">new</span> Pointer(pointerlist[i], id, view)
<span class="comment">// Add pointer to clicker stash for counting</span>
<span class="local-variable">this</span>._clickerstash.unshift(pointer)
<span class="local-variable">this</span>._clickerstash.length = min(<span class="local-variable">this</span>._clickerstash.length, <span class="integer">5</span>)
pointer.setClicker(<span class="local-variable">this</span>._clickerstash)
<span class="comment">// set pointer lists</span>
<span class="local-variable">this</span>._start.setPointer(pointer)
<span class="local-variable">this</span>._first.setPointer(pointer)
<span class="local-variable">this</span>._move.setPointer(pointer)
}.bind(<span class="local-variable">this</span>)
<span class="keyword">for</span> (<span class="keyword">var</span> i = <span class="integer">0</span>; i < pointerlist.length; i++) {
<span class="comment">// if a pointer is handoffed use that view instead</span>
<span class="keyword">if</span> (pointerlist[i].handovered) pick(pointerlist[i].handovered)
<span class="keyword">else</span> <span class="local-variable">this</span>.device.pickScreen(pointerlist[i].position, pick, <span class="predefined-constant">true</span>)
}
<span class="local-variable">this</span>.emitPointerList(<span class="local-variable">this</span>._start, <span class="string"><span class="delimiter">'</span><span class="content">start</span><span class="delimiter">'</span></span>)
}
<span class="comment">// Internal: emits `move` event.</span>
<span class="local-variable">this</span>.<span class="function">setmove</span> = <span class="keyword">function</span>(pointerlist) {
<span class="local-variable">this</span>._wheel.length = <span class="integer">0</span>
<span class="keyword">for</span> (<span class="keyword">var</span> i = <span class="integer">0</span>; i < pointerlist.length; i++) {
<span class="keyword">var</span> previous = <span class="local-variable">this</span>._move.getClosest(pointerlist[i])
<span class="keyword">if</span>(!previous){
console.log(<span class="string"><span class="delimiter">'</span><span class="content">pointer lost!</span><span class="delimiter">'</span></span>)
<span class="keyword">continue</span>
}
<span class="keyword">var</span> start = <span class="local-variable">this</span>._start.getById(previous.id)
<span class="keyword">var</span> first = <span class="local-variable">this</span>._first.getById(previous.id)
<span class="keyword">var</span> pointer = <span class="keyword">new</span> Pointer(pointerlist[i], previous.id, first.view)
pointer.addDelta(first)
pointer.addMovement(previous || first)
<span class="comment">// emit event hooks</span>
<span class="keyword">if</span> (start){
<span class="keyword">if</span> (start.pickview){
<span class="local-variable">this</span>.device.pickScreen(pointerlist[i].position, <span class="keyword">function</span>(view){
pointer.pick = view
}.bind(<span class="local-variable">this</span>), <span class="predefined-constant">true</span>)
}
<span class="keyword">if</span> (start.atMove) start.atMove(pointerlist[i], pointerlist[i].value, start)
}
<span class="local-variable">this</span>._move.setPointer(pointer)
}
<span class="local-variable">this</span>.emitPointerList(<span class="local-variable">this</span>._move, <span class="string"><span class="delimiter">'</span><span class="content">move</span><span class="delimiter">'</span></span>)
}
<span class="comment">// Internal: emits `end` event.</span>
<span class="comment">// Emits `tap` event if conditions are met.</span>
<span class="local-variable">this</span>.<span class="function">setend</span> = <span class="keyword">function</span>(pointerlist) {
<span class="local-variable">this</span>._end.length = <span class="integer">0</span>
<span class="local-variable">this</span>._tap.length = <span class="integer">0</span>
<span class="keyword">for</span> (<span class="keyword">var</span> i = <span class="integer">0</span>; i < pointerlist.length; i++) {
<span class="keyword">var</span> closest = <span class="local-variable">this</span>._move.getClosest(pointerlist[i])
<span class="keyword">if</span>(!closest){
console.log(<span class="string"><span class="delimiter">'</span><span class="content">pointer lost!</span><span class="delimiter">'</span></span>)
<span class="keyword">continue</span>
}
<span class="comment">// emit event hooks</span>
<span class="keyword">var</span> start = <span class="local-variable">this</span>._start.getById(closest.id)
<span class="keyword">if</span> (start){
<span class="keyword">if</span> (start.atEnd) start.atEnd(pointerlist[i], pointerlist[i].value, start)
}
<span class="local-variable">this</span>.device.pickScreen(pointerlist[i].position, <span class="keyword">function</span>(view){
<span class="keyword">var</span> previous = <span class="local-variable">this</span>._move.getClosest(pointerlist[i])
<span class="keyword">var</span> first = <span class="local-variable">this</span>._first.getById(previous.id)
<span class="keyword">var</span> pointer = <span class="keyword">new</span> Pointer(pointerlist[i], previous.id, first.view)
pointer.addDelta(first)
pointer.setClicker(<span class="local-variable">this</span>._clickerstash)
pointer.isover = pointer.view === view
<span class="local-variable">this</span>._first.removePointer(first)
<span class="local-variable">this</span>._end.setPointer(pointer)
<span class="local-variable">this</span>._move.removePointer(pointer)
<span class="keyword">if</span> (pointer.dt < TAPSPEED && vec2.len(pointer.delta) < TAPDIST){
<span class="local-variable">this</span>._tap.setPointer(pointer)
}
}.bind(<span class="local-variable">this</span>), <span class="predefined-constant">true</span>)
}
<span class="local-variable">this</span>.emitPointerList(<span class="local-variable">this</span>._end, <span class="string"><span class="delimiter">'</span><span class="content">end</span><span class="delimiter">'</span></span>)
<span class="local-variable">this</span>.emitPointerList(<span class="local-variable">this</span>._tap, <span class="string"><span class="delimiter">'</span><span class="content">tap</span><span class="delimiter">'</span></span>)
}
<span class="comment">// Internal: emits `hover` event.</span>
<span class="local-variable">this</span>.<span class="function">sethover</span> = <span class="keyword">function</span>(pointerlist) {
<span class="local-variable">this</span>._over.length = <span class="integer">0</span>
<span class="local-variable">this</span>._out.length = <span class="integer">0</span>
<span class="local-variable">this</span>.device.pickScreen(pointerlist[<span class="integer">0</span>].position, <span class="keyword">function</span>(view){
<span class="keyword">var</span> previous = <span class="local-variable">this</span>._hover.getById(<span class="integer">0</span>)
<span class="keyword">if</span> (previous) previous = <span class="keyword">new</span> Pointer(previous, <span class="integer">0</span>, previous.view)
<span class="keyword">var</span> pointer = <span class="keyword">new</span> Pointer(pointerlist[<span class="integer">0</span>], <span class="integer">0</span>, view)
<span class="local-variable">this</span>._hover.setPointer(pointer)
<span class="comment">// TODO(aki): entering child view triggers out event. Consider adding pointer-events: 'none'</span>
<span class="keyword">if</span> (!previous || previous.view !== pointer.view) {
<span class="keyword">if</span> (pointer.view) {
<span class="local-variable">this</span>._over.setPointer(pointer)
}
<span class="keyword">if</span> (previous) {
<span class="local-variable">this</span>._out.setPointer(previous)
}
}
<span class="comment">// TODO(aki): fix hover, over, out and drag API</span>
<span class="local-variable">this</span>.emitPointerList(<span class="local-variable">this</span>._hover, <span class="string"><span class="delimiter">'</span><span class="content">hover</span><span class="delimiter">'</span></span>)
<span class="local-variable">this</span>.emitPointerList(<span class="local-variable">this</span>._over, <span class="string"><span class="delimiter">'</span><span class="content">over</span><span class="delimiter">'</span></span>)
<span class="local-variable">this</span>.emitPointerList(<span class="local-variable">this</span>._out, <span class="string"><span class="delimiter">'</span><span class="content">out</span><span class="delimiter">'</span></span>)
}.bind(<span class="local-variable">this</span>))
}
<span class="comment">// TODO(aki): implement over/out on touch start/end</span>
<span class="comment">// Internal: emits `over` event.</span>
<span class="local-variable">this</span>.<span class="function">setover</span> = <span class="keyword">function</span>() {}
<span class="comment">// TODO(aki): implement over/out on touch start/end</span>
<span class="comment">// Internal: emits `out` event.</span>
<span class="local-variable">this</span>.<span class="function">setout</span> = <span class="keyword">function</span>() {}
<span class="comment">// Internal: emits `wheel` event.</span>
<span class="local-variable">this</span>.<span class="function">setwheel</span> = <span class="keyword">function</span>(pointerlist) {
<span class="keyword">var</span> dist = <span class="predefined-constant">Infinity</span>
<span class="comment">// Hack to prevent screen picking when mouse is not moving</span>
<span class="keyword">if</span> (<span class="local-variable">this</span>._wheel[<span class="integer">0</span>]) {
dist = vec2.distance(pointerlist[<span class="integer">0</span>].position, <span class="local-variable">this</span>._wheel[<span class="integer">0</span>].position)
}
<span class="keyword">if</span> (dist > <span class="integer">0</span>) {
<span class="keyword">if</span> (<span class="local-variable">this</span>._start[<span class="integer">0</span>]) {
<span class="comment">// Prevent continuous picking when dragging.</span>
<span class="comment">// TODO(aki): optimize the mousewheel picking below.</span>
<span class="keyword">var</span> pointer = <span class="keyword">new</span> Pointer(pointerlist[<span class="integer">0</span>], <span