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
965 lines (878 loc) • 49.5 kB
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%) ;
color: gray ;
text-decoration: none ;
}
.CodeRay .line-numbers pre {
word-break: normal;
}
.CodeRay .line-numbers a:target { color: blue ; }
.CodeRay .line-numbers .highlighted { color: red ; }
.CodeRay .line-numbers .highlighted a { color: red ; }
.CodeRay span.line-numbers { padding: 0px 4px; }
.CodeRay .line { display: block; float: left; width: 100%; }
.CodeRay .code { width: 100%; }
.CodeRay .debug { color: white ; background: blue ; }
.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>
<a href="#n353" name="n353">353</a>
<a href="#n354" name="n354">354</a>
<a href="#n355" name="n355">355</a>
<a href="#n356" name="n356">356</a>
<a href="#n357" name="n357">357</a>
<a href="#n358" name="n358">358</a>
<a href="#n359" name="n359">359</a>
<strong><a href="#n360" name="n360">360</a></strong>
<a href="#n361" name="n361">361</a>
<a href="#n362" name="n362">362</a>
<a href="#n363" name="n363">363</a>
<a href="#n364" name="n364">364</a>
<a href="#n365" name="n365">365</a>
<a href="#n366" name="n366">366</a>
<a href="#n367" name="n367">367</a>
<a href="#n368" name="n368">368</a>
<a href="#n369" name="n369">369</a>
<strong><a href="#n370" name="n370">370</a></strong>
<a href="#n371" name="n371">371</a>
<a href="#n372" name="n372">372</a>
<a href="#n373" name="n373">373</a>
<a href="#n374" name="n374">374</a>
<a href="#n375" name="n375">375</a>
<a href="#n376" name="n376">376</a>
<a href="#n377" name="n377">377</a>
<a href="#n378" name="n378">378</a>
<a href="#n379" name="n379">379</a>
<strong><a href="#n380" name="n380">380</a></strong>
<a href="#n381" name="n381">381</a>
<a href="#n382" name="n382">382</a>
<a href="#n383" name="n383">383</a>
<a href="#n384" name="n384">384</a>
<a href="#n385" name="n385">385</a>
<a href="#n386" name="n386">386</a>
<a href="#n387" name="n387">387</a>
<a href="#n388" name="n388">388</a>
<a href="#n389" name="n389">389</a>
<strong><a href="#n390" name="n390">390</a></strong>
<a href="#n391" name="n391">391</a>
<a href="#n392" name="n392">392</a>
<a href="#n393" name="n393">393</a>
<a href="#n394" name="n394">394</a>
<a href="#n395" name="n395">395</a>
<a href="#n396" name="n396">396</a>
<a href="#n397" name="n397">397</a>
<a href="#n398" name="n398">398</a>
<a href="#n399" name="n399">399</a>
<strong><a href="#n400" name="n400">400</a></strong>
<a href="#n401" name="n401">401</a>
<a href="#n402" name="n402">402</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">/**
* @class HeadlessGeometry
* Simulate a geometry
* Modeled from DALi platform.
*/</span>
define.<span class="reserved">class</span>(<span class="keyword">function</span>(require, exports){
<span class="comment">// internal, HeadlessApi is a static object to access the headless api</span>
HeadlessApi = require(<span class="string"><span class="delimiter">'</span><span class="content">./headless_api</span><span class="delimiter">'</span></span>)
<span class="comment">// Assign a unique id to each headlessgeometry object</span>
<span class="keyword">var</span> HeadlessGeometry = exports
HeadlessGeometry.GlobalId = <span class="integer">0</span>
<span class="comment">/**
* @method constructor
* Create a headless.Geometry object, using triangles
* You can access the headless.Geometry object as this.headlessgeometry
* @param {number} drawtype Line drawing type. headless uses the same values
* as webgl. The default is HeadlessApi.Geometry.TRIANGLES.
*/</span>
<span class="local-variable">this</span>.<span class="function">atConstructor</span> = <span class="keyword">function</span>(drawtype) {
<span class="local-variable">this</span>.object_type = <span class="string"><span class="delimiter">'</span><span class="content">HeadlessGeometry</span><span class="delimiter">'</span></span>
<span class="keyword">var</span> headless = HeadlessApi.headless;
<span class="comment">// Keep track of all vertex_buffers added. This acts as a cache</span>
<span class="comment">// Values = [format_hash, data_hash, vertex_index, vertex_buffer, buffer_id];</span>
<span class="local-variable">this</span>.vertex_buffers = {};
<span class="local-variable">this</span>.id = ++HeadlessGeometry.GlobalId;
drawtype = drawtype || HeadlessApi.Geometry.TRIANGLES;
<span class="local-variable">this</span>.geometryType = drawtype;
}
<span class="comment">/**
* @method addGeometry
* Add geometries (vertex buffers) given a dreem shader object
* @param {Object} dreem_shader Compiled data structure. (see shaderheadless.js)
*/</span>
<span class="local-variable">this</span>.<span class="function">addGeometry</span> = <span class="keyword">function</span>(dreem_shader) {
<span class="comment">//console.trace('addGeometry');</span>
<span class="keyword">var</span> headless = HeadlessApi.headless;
<span class="comment">// Make sure the correct object was passed. dreem_shader holds the</span>
<span class="comment">// dreemgl compiled structures.</span>
<span class="keyword">if</span> (!dreem_shader.vtx_state) {
console.log(<span class="string"><span class="delimiter">'</span><span class="content">WARNING. Incorrect object passed to addGeometry</span><span class="delimiter">'</span></span>, dreem_shader.object_type);
<span class="keyword">return</span>;
}
<span class="keyword">var</span> dreem_attributes = dreem_shader.vtx_state.attributes;
<span class="comment">// If there are no keys, it means an object with no parameters</span>
<span class="keyword">var</span> keys = Object.keys(dreem_attributes);
<span class="keyword">for</span> (<span class="keyword">var</span> i <span class="keyword">in</span> keys) {
<span class="comment">// The shader program uses a '_' at the beginning of the name</span>
<span class="keyword">var</span> name = keys[i];
<span class="keyword">var</span> storedname = <span class="string"><span class="delimiter">'</span><span class="content">_</span><span class="delimiter">'</span></span> + name;
<span class="comment">// I found that dreemgl keys with nested information (ie. has _DOT_)</span>
<span class="comment">// do not require vertex.</span>
<span class="keyword">if</span> (name.indexOf(<span class="string"><span class="delimiter">'</span><span class="content">_DOT_</span><span class="delimiter">'</span></span>) > <span class="integer">0</span>) {
<span class="comment">//console.log('HeadlessGeometry.addGeometry Skipping texture', name);</span>
<span class="keyword">continue</span>;
}
<span class="comment">// For each attribute, convert the data into an array</span>
<span class="keyword">var</span> obj = dreem_attributes[name];
<span class="keyword">var</span> type = HeadlessApi.getHeadlessPropertyType(obj.bytes);
<span class="keyword">var</span> nslots = HeadlessApi.getHeadlessPropertySize(type);
<span class="comment">// headless format is a hash of {name: type}</span>
<span class="keyword">var</span> format = {};
format[storedname] = type;
<span class="keyword">var</span> data = [];
<span class="keyword">var</span> arr = dreem_shader[name];
<span class="keyword">if</span> (arr && arr.array) {
<span class="comment">// Do not take all the (allocated) array. Take only length</span>
<span class="keyword">var</span> entries = nslots * arr.length;
<span class="keyword">for</span> (<span class="keyword">var</span> i=<span class="integer">0</span>; i<entries; i++) {
<span class="keyword">var</span> val = parseFloat(arr.array[i]);
data.push(val);
}
}
<span class="comment">// Add or update a vertex buffer</span>
<span class="comment">//console.log('updating', format, nslots);</span>
<span class="local-variable">this</span>.updateVertexBuffer(storedname, data, format, nslots);
}
}
<span class="comment">/**
* @method addAttributeGeometryAlt
* Add other attribute geometries to a headless Actor. This version was used
* during testing to make sure Headless could handle the packed layout outlined
* in the docs.
*
* This version can be removed if no problems are found.
*
* @param {Object} shader_headless Compiled data structure
* @param {Object} attrlocs Compiled data structure
*/</span>
<span class="local-variable">this</span>.<span class="function">addAttributeGeometryAlt</span> = <span class="keyword">function</span>(shader_headless, attrlocs) {
<span class="keyword">var</span> headless = HeadlessApi.headless;
<span class="keyword">if</span> (Object.keys(attrlocs) == <span class="integer">0</span>)
<span class="keyword">return</span>;
<span class="comment">// Write each value separately, in order to test the headless API.</span>
<span class="comment">// The original version (see below) writes a composite</span>
<span class="comment">// headless.PropertyBuffer.</span>
<span class="keyword">var</span> name;
<span class="keyword">var</span> nslots = <span class="integer">0</span>;
<span class="keyword">for</span>(<span class="keyword">var</span> key <span class="keyword">in</span> attrlocs) {
<span class="keyword">var</span> format = {};
<span class="keyword">var</span> attrloc = attrlocs[key]
name = attrloc.name
<span class="keyword">var</span> storedname = <span class="string"><span class="delimiter">'</span><span class="content">_</span><span class="delimiter">'</span></span> + key;
<span class="keyword">var</span> type = <span class="string"><span class="delimiter">'</span><span class="content">FLOAT</span><span class="delimiter">'</span></span>;
<span class="comment">// Skip invalid entries</span>
<span class="keyword">if</span> (<span class="keyword">typeof</span> attrloc.slots === <span class="string"><span class="delimiter">'</span><span class="content">undefined</span><span class="delimiter">'</span></span>)
<span class="keyword">continue</span>;
<span class="keyword">switch</span> (attrloc.slots) {
<span class="keyword">case</span> <span class="integer">1</span>:
type = <span class="string"><span class="delimiter">'</span><span class="content">FLOAT</span><span class="delimiter">'</span></span>;
<span class="keyword">break</span>;
<span class="keyword">case</span> <span class="integer">2</span>:
type = <span class="string"><span class="delimiter">'</span><span class="content">VEC2</span><span class="delimiter">'</span></span>;
<span class="keyword">break</span>;
<span class="keyword">case</span> <span class="integer">3</span>:
type = <span class="string"><span class="delimiter">'</span><span class="content">VEC3</span><span class="delimiter">'</span></span>;
<span class="keyword">break</span>;
<span class="keyword">case</span> <span class="integer">4</span>:
type = <span class="string"><span class="delimiter">'</span><span class="content">VEC4</span><span class="delimiter">'</span></span>;
<span class="keyword">break</span>;
<span class="keyword">default</span>:
console.log(<span class="string"><span class="delimiter">'</span><span class="content">addAttributeGeometry. Unknown type</span><span class="delimiter">'</span></span>, attrloc.slots);
<span class="keyword">break</span>;
}
format[storedname] = type;
<span class="keyword">if</span> (attrloc.slots == <span class="integer">0</span>)
<span class="keyword">continue</span>;
<span class="comment">// Extract the data from the array</span>
<span class="keyword">var</span> arr = shader_headless[name];
<span class="comment">//console.trace('**** addAttributeGeometry', name, arr.array.length);</span>
<span class="keyword">var</span> data = [];
<span class="keyword">if</span> (arr && arr.array) {
<span class="comment">// Find the offset and length of the data to extract</span>
<span class="keyword">var</span> record_offset = arr.slots;
<span class="keyword">var</span> data_offset = attrloc.offset / <span class="integer">4</span>; <span class="comment">// attrloc.offset is bytes</span>
<span class="keyword">var</span> offset = <span class="integer">0</span>;
<span class="keyword">for</span> (<span class="keyword">var</span> i=<span class="integer">0</span>; i<arr.length; i++) {
<span class="keyword">var</span> off = offset + data_offset;
<span class="keyword">for</span> (<span class="keyword">var</span> j=<span class="integer">0</span>; j<attrloc.slots; j++) {
<span class="keyword">var</span> val = parseFloat(arr.array[off++]);
data.push(val);
}
offset += record_offset;
}
<span class="keyword">if</span> (data.length > <span class="integer">0</span>) {
<span class="local-variable">this</span>.updateVertexBuffer(key, data, format, attrloc.slots);
}
}
}
}
<span class="comment">/**
* @method addAttributeGeometry
* Add other attribute geometries to a headless Actor.
* @param {Object} shader_headless Compiled data structure
* @param {Object} attrlocs Compiled data structure
*/</span>
<span class="local-variable">this</span>.<span class="function">addAttributeGeometry</span> = <span class="keyword">function</span>(shader_headless, attrlocs) {
<span class="keyword">var</span> headless = HeadlessApi.headless;
<span class="keyword">if</span> (Object.keys(attrlocs) == <span class="integer">0</span>)
<span class="keyword">return</span>;
<span class="comment">//TODO Support multiple names in the keys, like webgl</span>
<span class="keyword">var</span> format = {};
<span class="keyword">var</span> name;
<span class="keyword">var</span> nslots = <span class="integer">0</span>;
<span class="keyword">for</span>(<span class="keyword">var</span> key <span class="keyword">in</span> attrlocs) {
<span class="keyword">var</span> attrloc = attrlocs[key]
name = attrloc.name
<span class="keyword">var</span> storedname = <span class="string"><span class="delimiter">'</span><span class="content">_</span><span class="delimiter">'</span></span> + key;
<span class="keyword">var</span> type = <span class="string"><span class="delimiter">'</span><span class="content">FLOAT</span><span class="delimiter">'</span></span>;
<span class="comment">// Skip invalid entries</span>
<span class="keyword">if</span> (<span class="keyword">typeof</span> attrloc.slots === <span class="string"><span class="delimiter">'</span><span class="content">undefined</span><span class="delimiter">'</span></span>)
<span class="keyword">continue</span>;
<span class="keyword">switch</span> (attrloc.slots) {
<span class="keyword">case</span> <span class="integer">1</span>:
type = <span class="string"><span class="delimiter">'</span><span class="content">FLOAT</span><span class="delimiter">'</span></span>;
<span class="keyword">break</span>;
<span class="keyword">case</span> <span class="integer">2</span>:
type = <span class="string"><span class="delimiter">'</span><span class="content">VEC2</span><span class="delimiter">'</span></span>;
<span class="keyword">break</span>;
<span class="keyword">case</span> <span class="integer">3</span>:
type = <span class="string"><span class="delimiter">'</span><span class="content">VEC3</span><span class="delimiter">'</span></span>;
<span class="keyword">break</span>;
<span class="keyword">case</span> <span class="integer">4</span>:
type = <span class="string"><span class="delimiter">'</span><span class="content">VEC4</span><span class="delimiter">'</span></span>;
<span class="keyword">break</span>;
<span class="keyword">default</span>:
console.log(<span class="string"><span class="delimiter">'</span><span class="content">addAttributeGeometry. Unknown type</span><span class="delimiter">'</span></span>, attrloc.slots);
<span class="keyword">break</span>;
}
format[storedname] = type;
nslots += attrloc.slots;
}
<span class="keyword">if</span> (!name || (Object.keys(format).length == <span class="integer">0</span>)) <span class="keyword">return</span>;
<span class="comment">//console.log('***************addAttributeGeometry******************');</span>
<span class="comment">//console.log(attrlocs);</span>
<span class="comment">//console.log('*****************************************************');</span>
<span class="keyword">var</span> arr = shader_headless[name];
<span class="keyword">var</span> data = [];
<span class="keyword">if</span> (arr && arr.array) {
<span class="comment">// Do not take all the (allocated) array. Take only length elements.</span>
<span class="comment">// There can be gaps in the stored array, so only the first nslots</span>
<span class="comment">// are used.</span>
<span class="keyword">var</span> offset = <span class="integer">0</span>;
<span class="keyword">for</span> (<span class="keyword">var</span> i=<span class="integer">0</span>; i<arr.length; i++) {
<span class="keyword">for</span> (<span class="keyword">var</span> j=<span class="integer">0</span>; j<nslots; j++) {
<span class="keyword">var</span> val = parseFloat(arr.array[offset++]);
data.push(val);
}
offset += (arr.slots - nslots);
}
}
<span class="comment">// Add or update a vertex buffer</span>
<span class="keyword">if</span> (data.length > <span class="integer">0</span>)
<span class="local-variable">this</span>.updateVertexBuffer(<span class="string"><span class="delimiter">'</span><span class="content">attribgeom</span><span class="delimiter">'</span></span>, data, format, nslots);
}
<span class="comment">/**
* @method updateVertexBuffer
* Add, or update a vertex buffer.
* @param {string} name Cached name
* @param {Object} data Object containing data to write
* @param {Object} format Hash of format information to write.
* @param {Number} nitems Number of items per record
*/</span>
<span class="local-variable">this</span>.<span class="function">updateVertexBuffer</span> = <span class="keyword">function</span>(name, data, format, nitems) {
<span class="keyword">var</span> format_hash = HeadlessApi.getHash(format);
<span class="keyword">var</span> data_hash = HeadlessApi.getHash(data);
<span class="comment">// index, buffer, and bufferindex are either built or come from cache</span>
<span class="keyword">var</span> index;
<span class="keyword">var</span> buffer;
<span class="keyword">var</span> bufferindex;
<span class="keyword">var</span> cache = <span class="local-variable">this</span>.vertex_buffers[name];
<span class="keyword">if</span> (cache) {
<span class="keyword">var</span> oformathash = cache[<span class="integer">0</span>];
<span class="keyword">var</span> odatahash = cache[<span class="integer">1</span>];
<span class="keyword">if</span> (format_hash == oformathash) {
<span class="keyword">if</span> (data_hash == odatahash) {
<span class="comment">// No change to the value</span>
<span class="keyword">return</span>;
}
<span class="comment">// Reuse the vertex buffer</span>
index = cache[<span class="integer">2</span>];
buffer = cache[<span class="integer">3</span>];
bufferindex = cache[<span class="integer">4</span>];
}
<span class="keyword">else</span> {
index = cache[<span class="integer">2</span>];
console.log(<span class="string"><span class="delimiter">'</span><span class="content">addGeometry: vertex buffer already exists: </span><span class="delimiter">'</span></span>, name, index, <span class="string"><span class="delimiter">'</span><span class="content">. Removing</span><span class="delimiter">'</span></span>);
<span class="comment">//TODO headlesswrite</span>
<span class="comment">//this.headlessgeometry.removeVertexBuffer(index);</span>
<span class="keyword">delete</span> <span class="local-variable">this</span>.vertex_buffers[name];
}
}
<span class="comment">// Generate the buffer</span>
<span class="keyword">if</span> (!buffer) {
<span class="keyword">var</span> ret = HeadlessApi.headlessBuffer(data, format, data.length / nitems);
<span class="keyword">var</span> buffer = ret[<span class="integer">0</span>];
bufferindex = ret[<span class="integer">1</span>];
<span class="comment">//index = this.headlessgeometry.addVertexBuffer(buffer);</span>
index = <span class="integer">0</span>;
<span class="comment">// Store the index so it can be removed later</span>
<span class="local-variable">this</span>.vertex_buffers[name] = [format_hash, data_hash, index, buffer, bufferindex];
}
<span class="keyword">else</span> {
<span class="comment">// Update an existing buffer using setData</span>
HeadlessApi.writeHeadlessBuffer(buffer, bufferindex, data)
}
}
<span class="comment">/**
* @method addVertices
* Add vertex attributes array to a headless Geometry. Format is very close
* to gl.vertexAttribPointer. Assumes float data
* @param {Object} array Buffer array
* @param {Number} index Index of attribute in the buffer
* @param {Number} size Number of components per attribute (1,2,3,4)
* @param {Number} stride Offset (bytes) between consecutive attributes
* @param {Number} offset Offset (bytes) to first attribute
* @param {Number} index Index of attribute in the buffer
* @return {Object} Index of vertex buffer
*/</span>
<span class="local-variable">this</span>.<span class="function">addVertices</span> = <span class="keyword">function</span>(name, array, slots, stride, offset) {
console.log(<span class="string"><span class="delimiter">'</span><span class="content">addVertices IS NOT IMPLEMENTED</span><span class="delimiter">'</span></span>);
}
<span class="local-variable">this</span>.<span class="function">name</span> = <span class="keyword">function</span>() {
<span class="keyword">return</span> <span class="string"><span class="delimiter">'</span><span class="content">headlessgeometry</span><span class="delimiter">'</span></span> + <span class="local-variable">this</span>.id;
}
<span class="local-variable">this</span>.<span class="function">currentstate</span> = <span class="keyword">function</span>(verbose) {
<span class="keyword">var</span> states = [];
<span class="keyword">if</span> (!HeadlessApi.isShown(<span class="local-variable">this</span>.name())) {
<span class="comment">// Sort the vertex_buffers </span>
<span class="keyword">var</span> vertex_data = []
<span class="keyword">var</span> keys = Object.keys(<span class="local-variable">this</span>.vertex_buffers).sort();
<span class="keyword">for</span> (<span class="keyword">var</span> i <span class="keyword">in</span> keys) {
<span class="comment">// Decompose the stored vertex_buffer data</span>
<span class="keyword">var</span> obj = <span class="local-variable">this</span>.vertex_buffers[keys[i]];
<span class="keyword">var</span> buffer = obj[<span class="integer">3</span>]
<span class="keyword">var</span> type = buffer.format;
<span class="keyword">var</span> data = buffer.data;
<span class="keyword">var</span> values = []
<span class="keyword">for</span> (<span class="keyword">var</span> j <span class="keyword">in</span> data) {
<span class="comment">// No more than 4 decimal places</span>
values.push(parseFloat(data[j].toFixed(<span class="integer">4</span>)));
}
<span class="keyword">var</span> vertex = [type, values];
vertex_data.push(vertex);
}
<span class="keyword">var</span> state = [
{<span class="key">name</span>: <span class="local-variable">this</span>.name()}
,{<span class="key">type</span>: <span class="local-variable">this</span>.geometryType}
,{<span class="key">vertex_buffers</span>: vertex_data}
]
states = [state];
HeadlessApi.shownObject(<span class="local-variable">this</span>.name());
}
<span class="keyword">return</span> states;
}
<span class="local-variable">this</span>.<span class="function">inspect</span> = <span class="keyword">function</span>(depth) {
<span class="comment">//HACK</span>
<span class="local-variable">this</span>.currentstate();
<span class="keyword">var</span> obj = {<span class="key">headlessGeometry</span>: <span class="local-variable">this</span>.id};
<span class="keyword">var</span> util = require(<span class="string"><span class="delimiter">'</span><span class="content">util</span><span class="delimiter">'</span></span>)
<span class="keyword">return</span> util.inspect(obj, {<span class="key">depth</span>: <span class="predefined-constant">null</span>});
}
});
</pre></td>
</tr></table>
</body>
</html>