83 var requestAnimationFrameID = null; |
83 var requestAnimationFrameID = null; |
84 function animate() { |
84 function animate() { |
85 // Do the page swith if any one pending |
85 // Do the page swith if any one pending |
86 if(current_subscribed_page != current_visible_page){ |
86 if(current_subscribed_page != current_visible_page){ |
87 switch_visible_page(current_subscribed_page); |
87 switch_visible_page(current_subscribed_page); |
|
88 } |
|
89 |
|
90 if(current_subscribed_page_index != current_visible_page_index){ |
|
91 apply_cache(); |
88 } |
92 } |
89 apply_updates(); |
93 apply_updates(); |
90 requestAnimationFrameID = null; |
94 requestAnimationFrameID = null; |
91 } |
95 } |
92 |
96 |
251 return new_val; |
255 return new_val; |
252 } |
256 } |
253 |
257 |
254 var current_visible_page; |
258 var current_visible_page; |
255 var current_subscribed_page; |
259 var current_subscribed_page; |
|
260 var current_visible_page_index; |
|
261 var current_subscribed_page_index; |
256 |
262 |
257 function prepare_svg() { |
263 function prepare_svg() { |
258 for(let eltid in detachable_elements){ |
264 for(let eltid in detachable_elements){ |
259 let [element,parent] = detachable_elements[eltid]; |
265 let [element,parent] = detachable_elements[eltid]; |
260 parent.removeChild(element); |
266 parent.removeChild(element); |
264 function switch_page(page_name, page_index) { |
270 function switch_page(page_name, page_index) { |
265 if(current_subscribed_page != current_visible_page){ |
271 if(current_subscribed_page != current_visible_page){ |
266 /* page switch already going */ |
272 /* page switch already going */ |
267 /* TODO LOG ERROR */ |
273 /* TODO LOG ERROR */ |
268 return; |
274 return; |
269 } else if(page_name == current_visible_page){ |
275 } |
270 /* already in that page */ |
276 |
271 /* TODO LOG ERROR */ |
277 if(page_name == undefined) |
272 return; |
278 page_name = current_subscribed_page; |
273 } |
279 |
274 switch_subscribed_page(page_name, page_index); |
280 switch_subscribed_page(page_name, page_index); |
275 }; |
281 }; |
276 |
282 |
277 function* chain(a,b){ |
283 function* chain(a,b){ |
278 yield* a; |
284 yield* a; |
279 yield* b; |
285 yield* b; |
280 }; |
286 }; |
281 |
287 |
282 function unsubscribe(){ |
288 function unsubscribe(){ |
283 widget = this; |
|
284 /* remove subsribers */ |
289 /* remove subsribers */ |
285 for(let index of widget.indexes){ |
290 for(let index of this.indexes){ |
286 let idx = index + widget.offset; |
291 let idx = index + this.offset; |
287 subscribers[idx].delete(widget); |
292 subscribers[idx].delete(this); |
288 } |
293 } |
289 widget.offset = 0; |
294 this.offset = 0; |
290 } |
295 } |
291 |
296 |
292 function subscribe(new_offset=0){ |
297 function subscribe(new_offset=0){ |
293 widget = this; |
|
294 /* set the offset because relative */ |
298 /* set the offset because relative */ |
295 widget.offset = new_offset; |
299 this.offset = new_offset; |
296 /* add widget's subsribers */ |
300 /* add this's subsribers */ |
297 for(let index of widget.indexes){ |
301 for(let index of this.indexes){ |
298 subscribers[index + new_offset].add(widget); |
302 subscribers[index + new_offset].add(this); |
|
303 } |
|
304 } |
|
305 |
|
306 function unsubscribe_foreach(){ |
|
307 for(let item of this.items){ |
|
308 for(let widget of item) { |
|
309 unsubscribe.call(widget); |
|
310 } |
|
311 } |
|
312 } |
|
313 |
|
314 function subscribe_foreach(new_offset=0){ |
|
315 for(let i = 0; i < this.items.length; i++) { |
|
316 let item = this.items[i]; |
|
317 let orig_item_index = this.index_pool[i]; |
|
318 let item_index = this.index_pool[i+this.item_offset]; |
|
319 let item_index_offset = item_index - orig_item_index; |
|
320 for(let widget of item) { |
|
321 subscribe.call(widget,new_offset + item_index_offset); |
|
322 } |
299 } |
323 } |
300 } |
324 } |
301 |
325 |
302 function switch_subscribed_page(page_name, page_index) { |
326 function switch_subscribed_page(page_name, page_index) { |
303 let old_desc = page_desc[current_subscribed_page]; |
327 let old_desc = page_desc[current_subscribed_page]; |
350 let [element, parent] = new_desc.required_detachables[eltid]; |
375 let [element, parent] = new_desc.required_detachables[eltid]; |
351 parent.appendChild(element); |
376 parent.appendChild(element); |
352 } |
377 } |
353 } |
378 } |
354 |
379 |
|
380 svg_root.setAttribute('viewBox',new_desc.bbox.join(" ")); |
|
381 current_visible_page = page_name; |
|
382 }; |
|
383 |
|
384 function apply_cache() { |
|
385 let new_desc = page_desc[current_visible_page]; |
355 for(let widget of chain(new_desc.absolute_widgets,new_desc.relative_widgets)){ |
386 for(let widget of chain(new_desc.absolute_widgets,new_desc.relative_widgets)){ |
356 for(let index of widget.indexes){ |
387 for(let index of widget.indexes){ |
357 /* dispatch current cache in newly opened page widgets */ |
388 /* dispatch current cache in newly opened page widgets */ |
358 let cached_val = cache[index]; |
389 let realindex = index+widget.offset; |
|
390 let cached_val = cache[realindex]; |
359 if(cached_val != undefined) |
391 if(cached_val != undefined) |
360 dispatch_value_to_widget(widget, index, cached_val, cached_val); |
392 dispatch_value_to_widget(widget, realindex, cached_val, cached_val); |
361 } |
393 } |
362 } |
394 } |
363 |
395 current_visible_page_index = current_subscribed_page_index; |
364 svg_root.setAttribute('viewBox',new_desc.bbox.join(" ")); |
396 } |
365 current_visible_page = page_name; |
397 |
366 }; |
|
367 |
398 |
368 |
399 |
369 // Once connection established |
400 // Once connection established |
370 ws.onopen = function (evt) { |
401 ws.onopen = function (evt) { |
371 init_widgets(); |
402 init_widgets(); |