From f3c0b9185bd2c456176b8349eeb8ffb3d5d02006 Mon Sep 17 00:00:00 2001 From: pk1a Date: Fri, 28 Mar 2014 16:43:53 +0100 Subject: [PATCH] demo: transpile samples --- build/grunt/hspserver.js | 5 +++-- public/samples/clickhandler/clickhandler.hsp | 12 ++++++------ public/samples/clock/clock.hsp | 12 ++++++------ public/samples/component1/timer.hsp | 4 ++-- public/samples/component2/nbrfield.hsp | 15 +++++++-------- public/samples/component3/pagination.hsp | 10 +++++----- public/samples/conditions/conditions.hsp | 4 ++-- public/samples/cssclass/cssclass.hsp | 12 +++++------- public/samples/dyntemplates/dyntemplates.hsp | 4 +--- public/samples/let/let.hsp | 6 ++---- public/samples/list1/list.hsp | 6 +++--- public/samples/list2/list.hsp | 8 ++++---- public/samples/panel/panel.hsp | 4 ++-- public/samples/simplelist/simplelist.hsp | 4 +--- public/samples/timer/timer.hsp | 4 ++-- public/samples/todolist/todolist.hsp | 4 ++-- 16 files changed, 53 insertions(+), 61 deletions(-) diff --git a/build/grunt/hspserver.js b/build/grunt/hspserver.js index 810381b..fde75aa 100644 --- a/build/grunt/hspserver.js +++ b/build/grunt/hspserver.js @@ -5,7 +5,8 @@ var path = require("path"); module.exports = function(grunt) { grunt.registerTask('hspserver', 'Start a web server to server compiled templates on the fly', function () { - var renderer = require("../../hsp/compiler/renderer"); + var renderer = require("../../hsp/compiler/renderer"); + var transpiler = require("../../hsp/transpiler"); grunt.config.requires('hspserver.port'); grunt.config.requires('hspserver.base'); @@ -44,7 +45,7 @@ module.exports = function(grunt) { if (r.serverErrors && r.serverErrors.length) { res.send(500,r.serverErrors[0].description); } else { - res.send(200,r.code); + res.send(200,transpiler.processString(r.code).code); } } else { res.send(500,"[/hsp/compile] src parameter is undefined"); diff --git a/public/samples/clickhandler/clickhandler.hsp b/public/samples/clickhandler/clickhandler.hsp index 6c94fe9..25cddad 100644 --- a/public/samples/clickhandler/clickhandler.hsp +++ b/public/samples/clickhandler/clickhandler.hsp @@ -1,4 +1,4 @@ -var msg={text:""}, count=-1, $set=require("hsp/$set"); +var msg={text:""}, count=-1; # template message(msg)
@@ -11,15 +11,15 @@ function changeMessage() { count++; switch(count%3) { case 0: - $set(msg,"isWarning",false); - $set(msg,"text","Click me to discover hashspace event hanlders"); + msg.isWarning = false; + msg.text = "Click me to discover hashspace event hanlders"; break; case 1: - $set(msg,"text","Well done - you called the event handler and updated the data model in a row!"); + msg.text = "Well done - you called the event handler and updated the data model in a row!"; break; case 2: - $set(msg,"isWarning",true); - $set(msg,"text","If you click again you will be back to first step!"); + msg.isWarning = true; + msg.text = "If you click again you will be back to first step!"; break; } } diff --git a/public/samples/clock/clock.hsp b/public/samples/clock/clock.hsp index f96d422..6787cdd 100644 --- a/public/samples/clock/clock.hsp +++ b/public/samples/clock/clock.hsp @@ -1,4 +1,4 @@ -var klass=require("hsp/klass"), $set=require("hsp/$set"); +var klass=require("hsp/klass"); var CITIES={ "SFO":{city:"San Francisco",offset:-8}, @@ -34,11 +34,11 @@ var ClockController=klass({ var to=CITIES[this.city].offset; var o=d.getTimezoneOffset()/60; d=new Date(d.getTime()+ ((o+to)*3600000)); // date in the target city - $set(this,"hours",d.getHours()); - $set(this,"minutes",d.getMinutes()); - $set(this,"seconds",d.getSeconds()); - $set(this,"milliseconds",d.getMilliseconds()); - $set(this,"cityName",CITIES[this.city].city); + this.hours = d.getHours(); + this.minutes = d.getMinutes(); + this.seconds = d.getSeconds(); + this.milliseconds = d.getMilliseconds(); + this.cityName = CITIES[this.city].city; } }); diff --git a/public/samples/component1/timer.hsp b/public/samples/component1/timer.hsp index 2a5ad03..d270f08 100644 --- a/public/samples/component1/timer.hsp +++ b/public/samples/component1/timer.hsp @@ -1,4 +1,4 @@ -var klass=require("hsp/klass"), $set=require("hsp/$set"); +var klass=require("hsp/klass"); // klass is a utility to create JS objects with constructors & prototypes var Timer=klass({ @@ -14,7 +14,7 @@ var Timer=klass({ }, tick:function() { console.log("tick"); - $set(this,"secondsElapsed",this.secondsElapsed+1); + this.secondsElapsed++; } }); diff --git a/public/samples/component2/nbrfield.hsp b/public/samples/component2/nbrfield.hsp index 464331b..399fbf5 100644 --- a/public/samples/component2/nbrfield.hsp +++ b/public/samples/component2/nbrfield.hsp @@ -1,4 +1,4 @@ -var klass=require("hsp/klass"), $set=require("hsp/$set"); +var klass=require("hsp/klass"); // Component controller var NbrField = klass({ @@ -24,7 +24,7 @@ var NbrField = klass({ */ onValueChange:function(newValue,oldValue) { var n=getNumber(newValue); - $set(this,"internalValue",n!==null? n : 0); + this.internalValue = n!==null? n : 0; this.checkValidity(); }, onMinChange:function(newValue,oldValue) { @@ -39,24 +39,23 @@ var NbrField = klass({ */ onInternalValueChange:function(newValue,oldValue) { // validate and expose as attribute if ok - $set(this,"value",this.checkValidity()? parseInt(this.internalValue,10) : this.defaultvalue); + this.value = this.checkValidity()? parseInt(this.internalValue,10) : this.defaultvalue; }, /** * Check if the internal value is valid and update the isValid property accordingly */ checkValidity:function() { var n=getNumber(this.internalValue); - var v=(n===null)? false : (n>=this.min) && (n<=this.max); - $set(this,"isValid",v); - return v; + var v=(n===null)? false : (n>=this.min) && (n<=this.max); + return this.isValid = v; }, /** * Reset the field value */ resetField:function() { var v1=this.value, v2=this.defaultvalue; - $set(this,"internalValue",v2); - $set(this,"value",v2); + this.internalValue = v2; + this.value = v2; this.checkValidity(); this.onreset({oldValue:v1,newValue:v2}); // call back event listener } diff --git a/public/samples/component3/pagination.hsp b/public/samples/component3/pagination.hsp index 9e039c9..8407172 100644 --- a/public/samples/component3/pagination.hsp +++ b/public/samples/component3/pagination.hsp @@ -1,4 +1,4 @@ -var klass=require("hsp/klass"), $set=require("hsp/$set"); +var klass=require("hsp/klass"); function calculateNoOfPages(collectionSize, pageSize) { return Math.ceil(collectionSize / pageSize); @@ -13,8 +13,8 @@ function rebuildPagesModel(noOfPages) { } function rebuildInternalModel(ctl) { - $set(ctl, 'noOfPages', calculateNoOfPages(ctl.collectionsize, ctl.pagesize)); - $set(ctl, 'pages', rebuildPagesModel(ctl.noOfPages)); + ctl.noOfPages = calculateNoOfPages(ctl.collectionsize, ctl.pagesize); + ctl.pages = rebuildPagesModel(ctl.noOfPages); ctl.selectPage(ctl.activepage); } @@ -31,7 +31,7 @@ var Pagination=klass({ selectPage: function(newPageNo) { newPageNo = Math.min(Math.max(0, newPageNo), this.noOfPages-1); if (this.activepage!==newPageNo) { - $set(this, 'activepage', newPageNo); + this.activepage = newPageNo; this.onpageselect({pageNumber:this.activepage}); } }, @@ -79,7 +79,7 @@ var model = { } function updateSelection(newPageNumber) { - $set(model,"lastSelectedPage",newPageNumber); + model.lastSelectedPage = newPageNumber; } // display the test template in the #output div diff --git a/public/samples/conditions/conditions.hsp b/public/samples/conditions/conditions.hsp index 2e9708e..f2609a6 100644 --- a/public/samples/conditions/conditions.hsp +++ b/public/samples/conditions/conditions.hsp @@ -1,4 +1,4 @@ -var klass=require("hsp/klass"), $set=require("hsp/$set"); +var klass=require("hsp/klass"); // nt is an instance of NumberTester # template test(nt) @@ -31,7 +31,7 @@ var NumberTester=klass({ this.number=0; }, increment:function(nbr2) { - $set(this,"number",this.number+nbr2); + this.number = this.number+nbr2; } }); diff --git a/public/samples/cssclass/cssclass.hsp b/public/samples/cssclass/cssclass.hsp index 58fc26f..e4fd6f0 100644 --- a/public/samples/cssclass/cssclass.hsp +++ b/public/samples/cssclass/cssclass.hsp @@ -1,31 +1,29 @@ -var $set=require("hsp/$set"); - # template message(msg) // onselectstart: prevent double-click selection on a elements
Change Urgency - Set "Personal" - Set "Professional" -
+
Message: {msg.text}
- Class value: "{'msg', 'urgent':msg.urgency===1, msg.category}" + Class value: "{'msg', 'urgent':msg.urgency, msg.category}"
# /template var msg={ text:"Hello World", - urgency:0 + urgency:false } function toggleUrgency() { - $set(msg,"urgency",msg.urgency? 0 : 1); + msg.urgency = !msg.urgency; } function setCategory(cat) { - $set(msg,"category",cat); + msg.category = cat; } // display the template in the #output div diff --git a/public/samples/dyntemplates/dyntemplates.hsp b/public/samples/dyntemplates/dyntemplates.hsp index f0778b4..3ff76bd 100644 --- a/public/samples/dyntemplates/dyntemplates.hsp +++ b/public/samples/dyntemplates/dyntemplates.hsp @@ -1,5 +1,3 @@ -var $set = require("hsp/$set"); - # template test(ctxt)
Change template
<#ctxt.view ctxt="{ctxt}"/> @@ -25,7 +23,7 @@ var model={ function swapTemplate() { var newtpl=(model.view===tplA)? tplB : tplA; - $set(model,"view",newtpl); + model.view = newtpl; } // display the template in the #output div diff --git a/public/samples/let/let.hsp b/public/samples/let/let.hsp index b7c3129..2b06c41 100644 --- a/public/samples/let/let.hsp +++ b/public/samples/let/let.hsp @@ -1,5 +1,3 @@ -var $set=require("hsp/$set"); - # template test(m) {let p1=m.part1, m21=m.part2.part21.msg+"!"}
@@ -27,8 +25,8 @@ var model={ var count=0; function updateModel() { count++; - $set(model.part1.part11,"msg", "(1.1 update: "+count+")"); - $set(model.part2.part21,"msg", "(2.1 update: "+count+")"); + model.part1.part11.msg = "(1.1 update: "+count+")"; + model.part2.part21.msg = "(2.1 update: "+count+")"; } // render template in the #output div diff --git a/public/samples/list1/list.hsp b/public/samples/list1/list.hsp index 29ec4a8..d797f1c 100644 --- a/public/samples/list1/list.hsp +++ b/public/samples/list1/list.hsp @@ -1,4 +1,4 @@ -var klass=require("hsp/klass"), $set=require("hsp/$set"); +var klass=require("hsp/klass"); // simple list controller var ListController = klass({ @@ -67,7 +67,7 @@ var count=0, model={ }; function toggle() { - $set(model,"preferredOption",model.preferredOption? null : "My favourite things"); + model.preferredOption = model.preferredOption? null : "My favourite things"; } function empty() { @@ -77,7 +77,7 @@ function empty() { function update() { count++; for (var i=0;count>i;i++) { - $set(model.items,i,"Item #"+(i+1)+" (change "+count+")"); + model.items[i] = "Item #"+(i+1)+" (change "+count+")"; } } diff --git a/public/samples/list2/list.hsp b/public/samples/list2/list.hsp index 364547c..e979ee6 100644 --- a/public/samples/list2/list.hsp +++ b/public/samples/list2/list.hsp @@ -1,4 +1,4 @@ -var klass=require("hsp/klass"), $set=require("hsp/$set"); +var klass=require("hsp/klass"); // simple option controller var OptionCtrl = klass({ @@ -28,7 +28,7 @@ var ListCtrl = klass({ var c=this.content; for (var i=0,sz=c.length;sz>i;i++) { if (c[i].tagName==="@option") { - $set(c[i],"selected",c[i].value===value); + c[i].selected = c[i].value===value; } } this.onselect({value:value}); @@ -95,12 +95,12 @@ function empty() { function update() { count++; for (var i=0;count>i;i++) { - $set(model.items,i,"Item #"+(i+1)+" (change "+count+")"); + model.items[i] = "Item #"+(i+1)+" (change "+count+")"; } } function showSelection(v) { - $set(model,"selectedItem",v); + model.selectedItem = v; } // display the test template in the #output div diff --git a/public/samples/panel/panel.hsp b/public/samples/panel/panel.hsp index 81287ff..840686f 100644 --- a/public/samples/panel/panel.hsp +++ b/public/samples/panel/panel.hsp @@ -1,4 +1,4 @@ -var klass=require("hsp/klass"), $set=require("hsp/$set"); +var klass=require("hsp/klass"); var PanelController = klass({ attributes: { @@ -36,7 +36,7 @@ var model={text:"Hello World"}, count=0; function update(incr) { count+=incr; - $set(model,"text","Hello World ("+count+")"); + model.text = "Hello World ("+count+")"; } // display the test template in the #output div diff --git a/public/samples/simplelist/simplelist.hsp b/public/samples/simplelist/simplelist.hsp index 02b6c71..e8069d9 100644 --- a/public/samples/simplelist/simplelist.hsp +++ b/public/samples/simplelist/simplelist.hsp @@ -1,5 +1,3 @@ -var $set=require("hsp/$set"); - # template people(d)
Click on a person to see more details:
    @@ -17,7 +15,7 @@ var $set=require("hsp/$set"); # /template function toggleDetails(person) { - $set(person,"showdetails",!person.showdetails); + person.showdetails = !person.showdetails; } var d={ diff --git a/public/samples/timer/timer.hsp b/public/samples/timer/timer.hsp index ad8b4a5..025fa1f 100644 --- a/public/samples/timer/timer.hsp +++ b/public/samples/timer/timer.hsp @@ -1,4 +1,4 @@ -var klass=require("hsp/klass"), $set=require("hsp/$set"); +var klass=require("hsp/klass"); # template elapsedTime(timer) Seconds Elapsed: {timer.secondsElapsed} @@ -16,7 +16,7 @@ var Timer=klass({ clearInterval(this._iid); }, tick:function() { - $set(this,"secondsElapsed",this.secondsElapsed+1); + this.secondsElapsed++; } }); diff --git a/public/samples/todolist/todolist.hsp b/public/samples/todolist/todolist.hsp index 30ac9d3..edb5f6e 100644 --- a/public/samples/todolist/todolist.hsp +++ b/public/samples/todolist/todolist.hsp @@ -1,4 +1,4 @@ -var klass=require("hsp/klass"), $set=require("hsp/$set"); +var klass=require("hsp/klass"); # template todolist(todo)
    @@ -28,7 +28,7 @@ var TodoCtl=klass({ // add new item to the todo list items.splice(items.length,0,d.newTodoItem); // empty new todo field value - $set(d,"newTodoItem",""); + d.newTodoItem = ""; // return false to prevent default behaviour return false; }