WebIO.mount(this.previousSibling,{"props":{"style":{"display":"flex","padding":"10px","flex-direction":"column"}},"nodeType":"DOM","type":"node","instanceArgs":{"namespace":"html","tag":"div"},"children":["Interact is neat!",{"props":{"style":{"borderBottom":"solid 1.0px #DEDEDE","align-self":"stretch"}},"nodeType":"DOM","type":"node","instanceArgs":{"namespace":"html","tag":"div"},"children":[]},{"props":{"style":{"display":"flex","padding":"5px","background-color":"lightgray","flex-direction":"row"}},"nodeType":"DOM","type":"node","instanceArgs":{"namespace":"html","tag":"div"},"children":[{"props":{"className":"field interact-widget"},"nodeType":"DOM","type":"node","instanceArgs":{"namespace":"html","tag":"div"},"children":[{"props":{},"nodeType":"Scope","type":"node","instanceArgs":{"imports":{"data":[{"name":"knockout","type":"js","url":"/assetserver/70b6bb29e5535ff497f8afd4743c9562693131ca-knockout.js"},{"name":"knockout_punches","type":"js","url":"/assetserver/203d5c0c3e6217f1122e7a7b51e90d51f38989bc-knockout_punches.js"},{"name":null,"type":"js","url":"/assetserver/642edfd2924daa6139f6d850e3873821a95fe121-all.js"},{"name":null,"type":"css","url":"/assetserver/e8f9d05545a28a1e6261affc328b9f18eb9692e4-style.css"},{"name":null,"type":"css","url":"/assetserver/6760536d255c6a5d6d440ceec61e80d0107a040b-bulma.min.css"}],"type":"async_block"},"id":"knockout-component-f377c99a-6eee-408c-9870-16462925d6fe","handlers":{"_promises":{"importsLoaded":[function (ko, koPunches) { ko.punches.enableAll(); ko.bindingHandlers.numericValue = { init : function(element, valueAccessor, allBindings, data, context) { var stringified = ko.observable(ko.unwrap(valueAccessor())); stringified.subscribe(function(value) { var val = parseFloat(value); if (!isNaN(val)) { valueAccessor()(val); } }) valueAccessor().subscribe(function(value) { var str = JSON.stringify(value); if ((str == "0") && (["-0", "-0."].indexOf(stringified()) >= 0)) return; if (["null", ""].indexOf(str) >= 0) return; stringified(str); }) ko.applyBindingsToNode(element, { value: stringified, valueUpdate: allBindings.get('valueUpdate')}, context); } }; var json_data = {"formatted_vals":["1","2","3","4","5","6","7","8","9","10","11","12","13","14","15","16","17","18","19","20","21","22","23","24","25","26","27","28","29","30","31","32","33","34","35","36","37","38","39","40","41","42","43","44","45","46","47","48","49","50"],"changes":WebIO.getval({"name":"changes","scope":"knockout-component-f377c99a-6eee-408c-9870-16462925d6fe","id":"ob_02","type":"observable"}),"index":WebIO.getval({"name":"index","scope":"knockout-component-f377c99a-6eee-408c-9870-16462925d6fe","id":"ob_01","type":"observable"})}; var self = this; function AppViewModel() { for (var key in json_data) { var el = json_data[key]; this[key] = Array.isArray(el) ? ko.observableArray(el) : ko.observable(el); } [this["formatted_val"]=ko.computed( function(){ return this.formatted_vals()[parseInt(this.index())-1]; } ,this)] [this["changes"].subscribe((function (val){!(this.valueFromJulia["changes"]) ? (WebIO.setval({"name":"changes","scope":"knockout-component-f377c99a-6eee-408c-9870-16462925d6fe","id":"ob_02","type":"observable"},val)) : undefined; return this.valueFromJulia["changes"]=false}),self),this["index"].subscribe((function (val){!(this.valueFromJulia["index"]) ? (WebIO.setval({"name":"index","scope":"knockout-component-f377c99a-6eee-408c-9870-16462925d6fe","id":"ob_01","type":"observable"},val)) : undefined; return this.valueFromJulia["index"]=false}),self)] } self.model = new AppViewModel(); self.valueFromJulia = {}; for (var key in json_data) { self.valueFromJulia[key] = false; } ko.applyBindings(self.model, self.dom); } ]},"changes":[(function (val){return (val!=this.model["changes"]()) ? (this.valueFromJulia["changes"]=true, this.model["changes"](val)) : undefined})],"index":[(function (val){return (val!=this.model["index"]()) ? (this.valueFromJulia["index"]=true, this.model["index"](val)) : undefined})]},"systemjs_options":null,"observables":{"changes":{"sync":true,"id":"ob_02","value":0},"index":{"sync":false,"id":"ob_01","value":25}}},"children":[{"props":{"className":"interact-flex-row interact-widget"},"nodeType":"DOM","type":"node","instanceArgs":{"namespace":"html","tag":"div"},"children":[{"props":{"className":"interact-flex-row-left"},"nodeType":"DOM","type":"node","instanceArgs":{"namespace":"html","tag":"div"},"children":[{"props":{"className":"interact ","style":{"padding":"5px 10px 0px 10px"}},"nodeType":"DOM","type":"node","instanceArgs":{"namespace":"html","tag":"label"},"children":[""]}]},{"props":{"className":"interact-flex-row-center"},"nodeType":"DOM","type":"node","instanceArgs":{"namespace":"html","tag":"div"},"children":[{"props":{"max":50,"min":1,"attributes":{"type":"range","data-bind":"numericValue: index, valueUpdate: 'input', event: {change: function (){this.changes(this.changes()+1)}}","orient":"horizontal"},"step":1,"className":"slider slider is-fullwidth","style":{}},"nodeType":"DOM","type":"node","instanceArgs":{"namespace":"html","tag":"input"},"children":[]}]},{"props":{"className":"interact-flex-row-right"},"nodeType":"DOM","type":"node","instanceArgs":{"namespace":"html","tag":"div"},"children":[{"props":{"attributes":{"data-bind":"text: formatted_val"}},"nodeType":"DOM","type":"node","instanceArgs":{"namespace":"html","tag":"p"},"children":[]}]}]}]}]},{"props":{},"nodeType":"Scope","type":"node","instanceArgs":{"imports":{"data":[],"type":"async_block"},"id":"scope-35a6fedc-c9cb-4da5-bdea-65d184ec4f6c","handlers":{"obs-output":[function (updated_htmlstr) { var el = this.dom.querySelector("#out"); WebIO.propUtils.setInnerHtml(el, updated_htmlstr); }]},"systemjs_options":null,"observables":{"obs-output":{"sync":false,"id":"ob_23","value":"The slider's value is 25"}}},"children":[{"props":{"id":"out","setInnerHtml":"The slider's value is 25"},"nodeType":"DOM","type":"node","instanceArgs":{"namespace":"html","tag":"div"},"children":[]}]}]},{"props":{"style":{"borderBottom":"solid 1.0px #DEDEDE","align-self":"stretch"}},"nodeType":"DOM","type":"node","instanceArgs":{"namespace":"html","tag":"div"},"children":[]},{"props":{"style":{"display":"flex","padding":"5px","background-color":"lightblue","flex-direction":"row"}},"nodeType":"DOM","type":"node","instanceArgs":{"namespace":"html","tag":"div"},"children":[{"props":{"className":"field interact-widget"},"nodeType":"DOM","type":"node","instanceArgs":{"namespace":"html","tag":"div"},"children":[{"props":{},"nodeType":"Scope","type":"node","instanceArgs":{"imports":{"data":[{"name":"knockout","type":"js","url":"/assetserver/70b6bb29e5535ff497f8afd4743c9562693131ca-knockout.js"},{"name":"knockout_punches","type":"js","url":"/assetserver/203d5c0c3e6217f1122e7a7b51e90d51f38989bc-knockout_punches.js"},{"name":null,"type":"js","url":"/assetserver/642edfd2924daa6139f6d850e3873821a95fe121-all.js"},{"name":null,"type":"css","url":"/assetserver/e8f9d05545a28a1e6261affc328b9f18eb9692e4-style.css"},{"name":null,"type":"css","url":"/assetserver/6760536d255c6a5d6d440ceec61e80d0107a040b-bulma.min.css"}],"type":"async_block"},"id":"knockout-component-a8aeaa5a-f9a3-43ee-84f3-bf818b483c0b","handlers":{"_promises":{"importsLoaded":[function (ko, koPunches) { ko.punches.enableAll(); ko.bindingHandlers.numericValue = { init : function(element, valueAccessor, allBindings, data, context) { var stringified = ko.observable(ko.unwrap(valueAccessor())); stringified.subscribe(function(value) { var val = parseFloat(value); if (!isNaN(val)) { valueAccessor()(val); } }) valueAccessor().subscribe(function(value) { var str = JSON.stringify(value); if ((str == "0") && (["-0", "-0."].indexOf(stringified()) >= 0)) return; if (["null", ""].indexOf(str) >= 0) return; stringified(str); }) ko.applyBindingsToNode(element, { value: stringified, valueUpdate: allBindings.get('valueUpdate')}, context); } }; var json_data = {"options_js":WebIO.getval({"name":"options_js","scope":"knockout-component-a8aeaa5a-f9a3-43ee-84f3-bf818b483c0b","id":"ob_09","type":"observable"}),"index":WebIO.getval({"name":"index","scope":"knockout-component-a8aeaa5a-f9a3-43ee-84f3-bf818b483c0b","id":"ob_08","type":"observable"})}; var self = this; function AppViewModel() { for (var key in json_data) { var el = json_data[key]; this[key] = Array.isArray(el) ? ko.observableArray(el) : ko.observable(el); } [this["options_js"].subscribe((function (val){!(this.valueFromJulia["options_js"]) ? (WebIO.setval({"name":"options_js","scope":"knockout-component-a8aeaa5a-f9a3-43ee-84f3-bf818b483c0b","id":"ob_09","type":"observable"},val)) : undefined; return this.valueFromJulia["options_js"]=false}),self),this["index"].subscribe((function (val){!(this.valueFromJulia["index"]) ? (WebIO.setval({"name":"index","scope":"knockout-component-a8aeaa5a-f9a3-43ee-84f3-bf818b483c0b","id":"ob_08","type":"observable"},val)) : undefined; return this.valueFromJulia["index"]=false}),self)] } self.model = new AppViewModel(); self.valueFromJulia = {}; for (var key in json_data) { self.valueFromJulia[key] = false; } ko.applyBindings(self.model, self.dom); } ]},"options_js":[(function (val){return (val!=this.model["options_js"]()) ? (this.valueFromJulia["options_js"]=true, this.model["options_js"](val)) : undefined})],"index":[(function (val){return (val!=this.model["index"]()) ? (this.valueFromJulia["index"]=true, this.model["index"](val)) : undefined})]},"systemjs_options":null,"observables":{"options_js":{"sync":false,"id":"ob_09","value":[{"key":"1","val":1,"id":"idZyvLwgzU"},{"key":"2","val":2,"id":"idCv7XUMlw"},{"key":"3","val":3,"id":"idzJAeO1Oz"},{"key":"4","val":4,"id":"idM4QfEaow"},{"key":"5","val":5,"id":"idtuj6jakn"}]},"index":{"sync":true,"id":"ob_08","value":[]}}},"children":[{"props":{"attributes":{"data-bind":"foreach : options_js"},"className":"field"},"nodeType":"DOM","type":"node","instanceArgs":{"namespace":"html","tag":"div"},"children":[{"props":{"className":"field"},"nodeType":"DOM","type":"node","instanceArgs":{"namespace":"html","tag":"div"},"children":[{"props":{"attributes":{"name":"##368","type":"checkbox","data-bind":"checked : $root.index, checkedValue: val, attr : {id : id}"},"className":"is-checkradio "},"nodeType":"DOM","type":"node","instanceArgs":{"namespace":"html","tag":"input"},"children":[]},{"props":{"attributes":{"data-bind":"text : key, attr : {for : id}"}},"nodeType":"DOM","type":"node","instanceArgs":{"namespace":"html","tag":"label"},"children":[]}]}]}]}]},{"props":{},"nodeType":"Scope","type":"node","instanceArgs":{"imports":{"data":[],"type":"async_block"},"id":"scope-3d8774ce-d5a9-4cde-a615-98c2992b7d8f","handlers":{"obs-output":[function (updated_htmlstr) { var el = this.dom.querySelector("#out"); WebIO.propUtils.setInnerHtml(el, updated_htmlstr); }]},"systemjs_options":null,"observables":{"obs-output":{"sync":false,"id":"ob_24","value":"You have checked: Int64[]"}}},"children":[{"props":{"id":"out","setInnerHtml":"You have checked: Int64[]"},"nodeType":"DOM","type":"node","instanceArgs":{"namespace":"html","tag":"div"},"children":[]}]}]},{"props":{"style":{"borderBottom":"solid 1.0px #DEDEDE","align-self":"stretch"}},"nodeType":"DOM","type":"node","instanceArgs":{"namespace":"html","tag":"div"},"children":[]},{"props":{"style":{"display":"flex","padding":"5px","background-color":"lightgray","flex-direction":"row"}},"nodeType":"DOM","type":"node","instanceArgs":{"namespace":"html","tag":"div"},"children":[{"props":{},"nodeType":"Scope","type":"node","instanceArgs":{"imports":{"data":[{"name":"knockout","type":"js","url":"/assetserver/70b6bb29e5535ff497f8afd4743c9562693131ca-knockout.js"},{"name":"knockout_punches","type":"js","url":"/assetserver/203d5c0c3e6217f1122e7a7b51e90d51f38989bc-knockout_punches.js"},{"name":null,"type":"js","url":"/assetserver/642edfd2924daa6139f6d850e3873821a95fe121-all.js"},{"name":null,"type":"css","url":"/assetserver/e8f9d05545a28a1e6261affc328b9f18eb9692e4-style.css"},{"name":null,"type":"css","url":"/assetserver/6760536d255c6a5d6d440ceec61e80d0107a040b-bulma.min.css"}],"type":"async_block"},"id":"knockout-component-6666a709-1c2f-4f18-9349-85aa49a689d9","handlers":{"_promises":{"importsLoaded":[function (ko, koPunches) { ko.punches.enableAll(); ko.bindingHandlers.numericValue = { init : function(element, valueAccessor, allBindings, data, context) { var stringified = ko.observable(ko.unwrap(valueAccessor())); stringified.subscribe(function(value) { var val = parseFloat(value); if (!isNaN(val)) { valueAccessor()(val); } }) valueAccessor().subscribe(function(value) { var str = JSON.stringify(value); if ((str == "0") && (["-0", "-0."].indexOf(stringified()) >= 0)) return; if (["null", ""].indexOf(str) >= 0) return; stringified(str); }) ko.applyBindingsToNode(element, { value: stringified, valueUpdate: allBindings.get('valueUpdate')}, context); } }; var json_data = {"options_js":WebIO.getval({"name":"options_js","scope":"knockout-component-6666a709-1c2f-4f18-9349-85aa49a689d9","id":"ob_15","type":"observable"}),"index":WebIO.getval({"name":"index","scope":"knockout-component-6666a709-1c2f-4f18-9349-85aa49a689d9","id":"ob_14","type":"observable"})}; var self = this; function AppViewModel() { for (var key in json_data) { var el = json_data[key]; this[key] = Array.isArray(el) ? ko.observableArray(el) : ko.observable(el); } [this["update"]=function (val) {this.index(val)}] [this["options_js"].subscribe((function (val){!(this.valueFromJulia["options_js"]) ? (WebIO.setval({"name":"options_js","scope":"knockout-component-6666a709-1c2f-4f18-9349-85aa49a689d9","id":"ob_15","type":"observable"},val)) : undefined; return this.valueFromJulia["options_js"]=false}),self),this["index"].subscribe((function (val){!(this.valueFromJulia["index"]) ? (WebIO.setval({"name":"index","scope":"knockout-component-6666a709-1c2f-4f18-9349-85aa49a689d9","id":"ob_14","type":"observable"},val)) : undefined; return this.valueFromJulia["index"]=false}),self)] } self.model = new AppViewModel(); self.valueFromJulia = {}; for (var key in json_data) { self.valueFromJulia[key] = false; } ko.applyBindings(self.model, self.dom); } ]},"options_js":[(function (val){return (val!=this.model["options_js"]()) ? (this.valueFromJulia["options_js"]=true, this.model["options_js"](val)) : undefined})],"index":[(function (val){return (val!=this.model["index"]()) ? (this.valueFromJulia["index"]=true, this.model["index"](val)) : undefined})]},"systemjs_options":null,"observables":{"options_js":{"sync":false,"id":"ob_15","value":[{"key":"on","val":1,"id":"idcYeVsc6Z"},{"key":"off","val":2,"id":"idAD2FeCt5"}]},"index":{"sync":true,"id":"ob_14","value":1}}},"children":[{"props":{"attributes":{"data-bind":"foreach : options_js"},"className":"buttons has-addons is-centered"},"nodeType":"DOM","type":"node","instanceArgs":{"namespace":"html","tag":"div"},"children":[{"props":{"attributes":{"data-bind":"click: function (){$root.update(val)}, css: {'is-primary is-selected' : $root.index() == val, 'interact-widget button ' : true}"}},"nodeType":"DOM","type":"node","instanceArgs":{"namespace":"html","tag":"span"},"children":[{"props":{"attributes":{"data-bind":"text : key"}},"nodeType":"DOM","type":"node","instanceArgs":{"namespace":"html","tag":"label"},"children":[]}]}]}]},{"props":{},"nodeType":"Scope","type":"node","instanceArgs":{"imports":{"data":[],"type":"async_block"},"id":"scope-432f5ecb-60a7-48b3-998d-95392940e86c","handlers":{"obs-output":[function (updated_htmlstr) { var el = this.dom.querySelector("#out"); WebIO.propUtils.setInnerHtml(el, updated_htmlstr); }]},"systemjs_options":null,"observables":{"obs-output":{"sync":false,"id":"ob_25","value":"On or off? on"}}},"children":[{"props":{"id":"out","setInnerHtml":"On or off? on"},"nodeType":"DOM","type":"node","instanceArgs":{"namespace":"html","tag":"div"},"children":[]}]}]},{"props":{"style":{"borderBottom":"solid 1.0px #DEDEDE","align-self":"stretch"}},"nodeType":"DOM","type":"node","instanceArgs":{"namespace":"html","tag":"div"},"children":[]},{"props":{"style":{"display":"flex","padding":"5px","background-color":"lightblue","flex-direction":"row"}},"nodeType":"DOM","type":"node","instanceArgs":{"namespace":"html","tag":"div"},"children":[{"props":{"className":"field interact-widget"},"nodeType":"DOM","type":"node","instanceArgs":{"namespace":"html","tag":"div"},"children":[{"props":{},"nodeType":"Scope","type":"node","instanceArgs":{"imports":{"data":[{"name":"knockout","type":"js","url":"/assetserver/70b6bb29e5535ff497f8afd4743c9562693131ca-knockout.js"},{"name":"knockout_punches","type":"js","url":"/assetserver/203d5c0c3e6217f1122e7a7b51e90d51f38989bc-knockout_punches.js"},{"name":null,"type":"js","url":"/assetserver/642edfd2924daa6139f6d850e3873821a95fe121-all.js"},{"name":null,"type":"css","url":"/assetserver/e8f9d05545a28a1e6261affc328b9f18eb9692e4-style.css"},{"name":null,"type":"css","url":"/assetserver/6760536d255c6a5d6d440ceec61e80d0107a040b-bulma.min.css"}],"type":"async_block"},"id":"knockout-component-93902a94-9521-4f82-806c-f2253dfecbd0","handlers":{"_promises":{"importsLoaded":[function (ko, koPunches) { ko.punches.enableAll(); ko.bindingHandlers.numericValue = { init : function(element, valueAccessor, allBindings, data, context) { var stringified = ko.observable(ko.unwrap(valueAccessor())); stringified.subscribe(function(value) { var val = parseFloat(value); if (!isNaN(val)) { valueAccessor()(val); } }) valueAccessor().subscribe(function(value) { var str = JSON.stringify(value); if ((str == "0") && (["-0", "-0."].indexOf(stringified()) >= 0)) return; if (["null", ""].indexOf(str) >= 0) return; stringified(str); }) ko.applyBindingsToNode(element, { value: stringified, valueUpdate: allBindings.get('valueUpdate')}, context); } }; var json_data = {"changes":WebIO.getval({"name":"changes","scope":"knockout-component-93902a94-9521-4f82-806c-f2253dfecbd0","id":"ob_18","type":"observable"}),"value":WebIO.getval({"name":"value","scope":"knockout-component-93902a94-9521-4f82-806c-f2253dfecbd0","id":"ob_17","type":"observable"})}; var self = this; function AppViewModel() { for (var key in json_data) { var el = json_data[key]; this[key] = Array.isArray(el) ? ko.observableArray(el) : ko.observable(el); } [this["changes"].subscribe((function (val){!(this.valueFromJulia["changes"]) ? (WebIO.setval({"name":"changes","scope":"knockout-component-93902a94-9521-4f82-806c-f2253dfecbd0","id":"ob_18","type":"observable"},val)) : undefined; return this.valueFromJulia["changes"]=false}),self),this["value"].subscribe((function (val){!(this.valueFromJulia["value"]) ? (WebIO.setval({"name":"value","scope":"knockout-component-93902a94-9521-4f82-806c-f2253dfecbd0","id":"ob_17","type":"observable"},val)) : undefined; return this.valueFromJulia["value"]=false}),self)] } self.model = new AppViewModel(); self.valueFromJulia = {}; for (var key in json_data) { self.valueFromJulia[key] = false; } ko.applyBindings(self.model, self.dom); } ]},"changes":[(function (val){return (val!=this.model["changes"]()) ? (this.valueFromJulia["changes"]=true, this.model["changes"](val)) : undefined})],"value":[(function (val){return (val!=this.model["value"]()) ? (this.valueFromJulia["value"]=true, this.model["value"](val)) : undefined})]},"systemjs_options":null,"observables":{"changes":{"sync":false,"id":"ob_18","value":0},"value":{"sync":true,"id":"ob_17","value":""}}},"children":[{"props":{"attributes":{"type":"text","data-bind":"value: value, valueUpdate: 'input', event: {change: function (){this.changes(this.changes()+1)}}"},"placeholder":"Enter text here","className":"input ","style":{}},"nodeType":"DOM","type":"node","instanceArgs":{"namespace":"html","tag":"input"},"children":[]}]}]},{"props":{},"nodeType":"Scope","type":"node","instanceArgs":{"imports":{"data":[],"type":"async_block"},"id":"scope-28ff1f39-9b59-42bf-ab56-492514712652","handlers":{"obs-output":[function (updated_htmlstr) { var el = this.dom.querySelector("#out"); WebIO.propUtils.setInnerHtml(el, updated_htmlstr); }]},"systemjs_options":null,"observables":{"obs-output":{"sync":false,"id":"ob_26","value":"Echo: "}}},"children":[{"props":{"id":"out","setInnerHtml":"Echo: "},"nodeType":"DOM","type":"node","instanceArgs":{"namespace":"html","tag":"div"},"children":[]}]}]},{"props":{"style":{"borderBottom":"solid 1.0px #DEDEDE","align-self":"stretch"}},"nodeType":"DOM","type":"node","instanceArgs":{"namespace":"html","tag":"div"},"children":[]},{"props":{"style":{"display":"flex","padding":"5px","background-color":"lightgray","flex-direction":"row"}},"nodeType":"DOM","type":"node","instanceArgs":{"namespace":"html","tag":"div"},"children":[{"props":{"className":"field interact-widget"},"nodeType":"DOM","type":"node","instanceArgs":{"namespace":"html","tag":"div"},"children":[{"props":{},"nodeType":"Scope","type":"node","instanceArgs":{"imports":{"data":[{"name":"knockout","type":"js","url":"/assetserver/70b6bb29e5535ff497f8afd4743c9562693131ca-knockout.js"},{"name":"knockout_punches","type":"js","url":"/assetserver/203d5c0c3e6217f1122e7a7b51e90d51f38989bc-knockout_punches.js"},{"name":null,"type":"js","url":"/assetserver/642edfd2924daa6139f6d850e3873821a95fe121-all.js"},{"name":null,"type":"css","url":"/assetserver/e8f9d05545a28a1e6261affc328b9f18eb9692e4-style.css"},{"name":null,"type":"css","url":"/assetserver/6760536d255c6a5d6d440ceec61e80d0107a040b-bulma.min.css"}],"type":"async_block"},"id":"knockout-component-f1df2119-2f71-4d1f-9c13-a68582e83a9b","handlers":{"_promises":{"importsLoaded":[function (ko, koPunches) { ko.punches.enableAll(); ko.bindingHandlers.numericValue = { init : function(element, valueAccessor, allBindings, data, context) { var stringified = ko.observable(ko.unwrap(valueAccessor())); stringified.subscribe(function(value) { var val = parseFloat(value); if (!isNaN(val)) { valueAccessor()(val); } }) valueAccessor().subscribe(function(value) { var str = JSON.stringify(value); if ((str == "0") && (["-0", "-0."].indexOf(stringified()) >= 0)) return; if (["null", ""].indexOf(str) >= 0) return; stringified(str); }) ko.applyBindingsToNode(element, { value: stringified, valueUpdate: allBindings.get('valueUpdate')}, context); } }; var json_data = {"loading":WebIO.getval({"name":"loading","scope":"knockout-component-f1df2119-2f71-4d1f-9c13-a68582e83a9b","id":"ob_21","type":"observable"}),"clicks":WebIO.getval({"name":"clicks","scope":"knockout-component-f1df2119-2f71-4d1f-9c13-a68582e83a9b","id":"ob_20","type":"observable"})}; var self = this; function AppViewModel() { for (var key in json_data) { var el = json_data[key]; this[key] = Array.isArray(el) ? ko.observableArray(el) : ko.observable(el); } [this["loading"].subscribe((function (val){!(this.valueFromJulia["loading"]) ? (WebIO.setval({"name":"loading","scope":"knockout-component-f1df2119-2f71-4d1f-9c13-a68582e83a9b","id":"ob_21","type":"observable"},val)) : undefined; return this.valueFromJulia["loading"]=false}),self),this["clicks"].subscribe((function (val){!(this.valueFromJulia["clicks"]) ? (WebIO.setval({"name":"clicks","scope":"knockout-component-f1df2119-2f71-4d1f-9c13-a68582e83a9b","id":"ob_20","type":"observable"},val)) : undefined; return this.valueFromJulia["clicks"]=false}),self)] } self.model = new AppViewModel(); self.valueFromJulia = {}; for (var key in json_data) { self.valueFromJulia[key] = false; } ko.applyBindings(self.model, self.dom); } ]},"loading":[(function (val){return (val!=this.model["loading"]()) ? (this.valueFromJulia["loading"]=true, this.model["loading"](val)) : undefined})],"clicks":[(function (val){return (val!=this.model["clicks"]()) ? (this.valueFromJulia["clicks"]=true, this.model["clicks"](val)) : undefined})]},"systemjs_options":null,"observables":{"loading":{"sync":false,"id":"ob_21","value":false},"clicks":{"sync":true,"id":"ob_20","value":0}}},"children":[{"props":{"attributes":{"data-bind":"click: function (){this.clicks(this.clicks()+1)}, css: {'is-loading' : loading}"},"className":"button is-primary","style":{}},"nodeType":"DOM","type":"node","instanceArgs":{"namespace":"html","tag":"button"},"children":["Click me!"]}]}]},{"props":{},"nodeType":"Scope","type":"node","instanceArgs":{"imports":{"data":[],"type":"async_block"},"id":"scope-6ad6aeb8-3259-4fb5-8deb-5f8302064522","handlers":{"obs-output":[function (updated_htmlstr) { var el = this.dom.querySelector("#out"); WebIO.propUtils.setInnerHtml(el, updated_htmlstr); }]},"systemjs_options":null,"observables":{"obs-output":{"sync":false,"id":"ob_27","value":"You've clicked this button 0 times"}}},"children":[{"props":{"id":"out","setInnerHtml":"You've clicked this button 0 times"},"nodeType":"DOM","type":"node","instanceArgs":{"namespace":"html","tag":"div"},"children":[]}]}]}]})