moel@348: /*
moel@348:  
moel@348:   This Source Code Form is subject to the terms of the Mozilla Public
moel@348:   License, v. 2.0. If a copy of the MPL was not distributed with this
moel@348:   file, You can obtain one at http://mozilla.org/MPL/2.0/.
moel@348:  
moel@348: 	Copyright (C) 2012 Prince Samuel <prince.samuel@gmail.com>
moel@348: 
moel@348: */
moel@348: 
moel@348: ko.bindingHandlers.treeTable = {
moel@348:   update: function(element, valueAccessor, allBindingsAccessor) {
moel@348:     var dependency = ko.utils.unwrapObservable(valueAccessor()),
moel@348:     options = ko.toJS(allBindingsAccessor().treeOptions || {});
moel@348: 
moel@348:     setTimeout(function() { $(element).treeTable(options); }, 0);
moel@348:   } 
moel@348: };
moel@348: 
moel@348: var node = function(config, parent) {
moel@348:   this.parent = parent;
moel@348:   var _this = this;
moel@348: 
moel@348:   var mappingOptions = {
moel@348:     Children : {
moel@348:       create: function(args) {
moel@348:         return new node(args.data, _this);
moel@348:       }
moel@348:       ,
moel@348:       key: function(data) {
moel@348:         return ko.utils.unwrapObservable(data.id);
moel@348:       }
moel@348:     }
moel@348:   };
moel@348: 
moel@348:   ko.mapping.fromJS(config, mappingOptions, this);
moel@348: }
moel@348: 
moel@348: $(function(){
moel@348:   $.getJSON('data.json', function(data) {
moel@348:     viewModel = new node(data, undefined);
moel@348: 
moel@348:     (function() {
moel@348:       function flattenChildren(children, result) {
moel@348:         ko.utils.arrayForEach(children(), function(child) {
moel@348:           result.push(child);
moel@348:           if (child.Children) {
moel@348:             flattenChildren(child.Children, result);
moel@348:           }
moel@348:         });
moel@348:       }
moel@348: 
moel@348:       viewModel.flattened = ko.dependentObservable(function() {
moel@348:         var result = []; //root node
moel@348: 
moel@348:         if (viewModel.Children) {
moel@348:           flattenChildren(viewModel.Children, result);   
moel@348:         }
moel@348: 
moel@348:         return result;
moel@348:       });
moel@348: 
moel@348:       viewModel.update = function() {
moel@348:         $.getJSON('data.json', function(data) {
moel@348:           ko.mapping.fromJS(data, {}, viewModel);
moel@348:         });
moel@348:       }
moel@348: 
moel@348:       viewModel.rate = 3000; //milliseconds
moel@348:       viewModel.timer = {};
moel@348: 
moel@348:       viewModel.startAuto = function (){
moel@348:         viewModel.timer = setInterval(viewModel.update, viewModel.rate);
moel@348:       }
moel@348: 
moel@348:       viewModel.stopAuto = function (){
moel@348:         clearInterval(viewModel.timer);
moel@348:       }
moel@348: 
moel@348:       viewModel.auto_refresh = ko.observable(false);
moel@348:       viewModel.toggleAuto = ko.dependentObservable(function() {
moel@348:         if (viewModel.auto_refresh())
moel@348:           viewModel.startAuto();
moel@348:         else
moel@348:           viewModel.stopAuto();
moel@348:       }, viewModel);
moel@348: 
moel@348:     })();
moel@348: 
moel@348:     ko.applyBindings(viewModel);
moel@348:     $("#tree").treeTable({
moel@348:       initialState: "expanded",
moel@348:       clickableNodeNames: true
moel@348:     });
moel@348:   });
moel@348:   $( "#refresh" ).button();
moel@348:   $( "#auto_refresh" ).button();
moel@348:   $( "#slider" ).slider({
moel@348:     value:3,
moel@348:     min: 1,
moel@348:     max: 10,
moel@348:     slide: function( event, ui ) {
moel@348:       viewModel.rate = ui.value * 1000;
moel@348:       if (viewModel.auto_refresh()) {
moel@348:         //reset the timer
moel@348:         viewModel.stopAuto();
moel@348:         viewModel.startAuto();
moel@348:       }
moel@348:       $( "#lbl" ).text( ui.value + "s");
moel@348:     }
moel@348:   });
moel@348:   $( "#lbl" ).text( $( "#slider" ).slider( "value" ) + "s");
moel@348: 
moel@348: });
moel@348: 
moel@348: