raix/sessionExample.html

## sessionExample.html
<head>
  <title>sessionExample</title>
</head>

<body>
  {{> hello}}
</body>

<template name="hello">
  <h1>Hello World!</h1>

  {{#with getSession 'gui'}}
    Height:<input id="a" value="{{height}}" session-bind="gui.height" type="number" step="any" min="0" required/>metres<br/>
    Width:<input id="b" value="{{width}}" session-bind="gui.width" type="number" step="any" min="0" required/>metres<br/>
    Length:<input id="c" value="{{length}}" session-bind="gui.length" type="number" step="any" min="0" required/>metres<br/>
    <h4>Volume is: {{volume}} m&sup3;</h4>
  {{/with}}
</template>

## sessionExample.js
if (Meteor.isClient) {

  //Automatic run calculation
  Meteor.autorun(function() {
    var mySession = Session.get('gui'); //get the session object
    if (!mySession)
      mySession = { height: 10, width: 10, length: 10, volume: 0};

    //We calculate some new value
    mySession.volume = mySession.height * mySession.width * mySession.length;

    Session.set('gui', mySession); //set the new object
  });
}

## someHelpers.js
/*

Basicly initialize the general handlebar helpers and session-bind

 */
if (Meteor.isClient) {

  //create the {{sessionEquals 'foo' 'value'}} and {{getSession 'foo'}}
  (function () {
    if (typeof Handlebars !== 'undefined') {
      //{{getSession 'key'}}
      Handlebars.registerHelper('getSession', function (key) {
        return Session.get(key);
      });


      Handlebars.registerHelper('sessionEquals', function (key, value) {
        var myValue = Session.get(key); //Workaround Issue #617
        if (typeof(myValue) === 'boolean') //Workaround Issue #617
          return Session.equals(key, (value == 'true')); //Workaround Issue #617
        return Session.equals(key, (myValue === +myValue)?+value:value); //Workaround Issue #617
        //return Session.equals(key, value); //When Issue #617 is resolved (0.5.5)
      });
    }
  })();

  Meteor.startup(function () {
    //TypeCast value to same type as typeAs - supports str, int, bool
    function typeCastAs(value, typeAs) {
      value = (value === undefined)?'':''+value; //Should be text by default
      if (1*typeAs === +typeAs) {
        //guess... local can be 1,000.00 or 1.000,00 ? 1,000 or 1.000 ?
        if (value.indexOf(',') > -1 && value.indexOf(',') > value.indexOf('.'))
          value = value.replace('.', '').replace(',', '.'); //1.000,00 -> 1000.00
        if (value.indexOf('.') > -1)
          value = parseFloat(value.replace(',', ''));
        value = +value;
      }
      if (typeAs === true || typeAs === false)
        value = (value.toLowerCase() === 'true' || value === '1');
      return value;
    }

    //setSessionNested
    function bindSetSessionValue(parmString, value) {
      //TODO: Should test some more eg. if value is undefined?
      //paramString support nested objects eg. foo.bar.value
      var param = parmString.split('.');
      if (param.length > 0) {
        var sessionObject = Session.get(param[0]);
        var myVar = sessionObject;
        //Loop through parametres foo.bar.etc leave out the last element
        for (var i = 1; i < param.length-2; i++)
          myVar = (myVar[param[i]])?myVar[param[i]]:{};
        if (param.length > 1) {
          //If nested then grab the last element
          var i = param[param.length-1];
          //convert to int if destination is so str, int, bool
          myVar[i] = typeCastAs(value, myVar[i]);
          Session.set(param[0], sessionObject);
        } else //Not nested, regular var
          Session.set(param[0], typeCastAs(value, sessionObject));
      }
    } //EO bindSetSessionValue

    //Init the session-bind
    $(document).on('change keyup', 'input[session-bind], select[session-bind]', function(e) {
      //TODO: Should test some more eg. if session-bind empty etc.
      var parmString = e.target.getAttribute('session-bind');
      var value = e.target.value;
      bindSetSessionValue(parmString, value);
    }); //EO bind event

    //Init data-set [data-set], button[data-set], input[data-set][type=button]
    $(document).on('click',' a[data-set], button[data-set], input[data-set][type=button]', function(e) {
      var href = e.target.getAttribute('href'); //CSS selector element to set value on
      if (e && href) e.preventDefault();
      var value = e.target.getAttribute('data-set');
      var parmString = e.target.getAttribute('session-bind');

      $(href).val(value).trigger('change');
      if (parmString) bindSetSessionValue(parmString, value);
    });
  });
}
	<head>
	<title>sessionExample</title>
	</head>

	<body>
	{{> hello}}
	</body>

	<template name="hello">
	<h1>Hello World!</h1>

	{{#with getSession 'gui'}}
	Height:<input id="a" value="{{height}}" session-bind="gui.height" type="number" step="any" min="0" required/>metres<br/>
	Width:<input id="b" value="{{width}}" session-bind="gui.width" type="number" step="any" min="0" required/>metres<br/>
	Length:<input id="c" value="{{length}}" session-bind="gui.length" type="number" step="any" min="0" required/>metres<br/>
	<h4>Volume is: {{volume}} m³</h4>
	{{/with}}
	</template>
	if (Meteor.isClient) {

	//Automatic run calculation
	Meteor.autorun(function() {
	var mySession = Session.get('gui'); //get the session object
	if (!mySession)
	mySession = { height: 10, width: 10, length: 10, volume: 0};

	//We calculate some new value
	mySession.volume = mySession.height * mySession.width * mySession.length;

	Session.set('gui', mySession); //set the new object
	});
	}
	/*

	Basicly initialize the general handlebar helpers and session-bind

	*/
	if (Meteor.isClient) {

	//create the {{sessionEquals 'foo' 'value'}} and {{getSession 'foo'}}
	(function () {
	if (typeof Handlebars !== 'undefined') {
	//{{getSession 'key'}}
	Handlebars.registerHelper('getSession', function (key) {
	return Session.get(key);
	});


	Handlebars.registerHelper('sessionEquals', function (key, value) {
	var myValue = Session.get(key); //Workaround Issue #617
	if (typeof(myValue) === 'boolean') //Workaround Issue #617
	return Session.equals(key, (value == 'true')); //Workaround Issue #617
	return Session.equals(key, (myValue === +myValue)?+value:value); //Workaround Issue #617
	//return Session.equals(key, value); //When Issue #617 is resolved (0.5.5)
	});
	}
	})();

	Meteor.startup(function () {
	//TypeCast value to same type as typeAs - supports str, int, bool
	function typeCastAs(value, typeAs) {
	value = (value === undefined)?'':''+value; //Should be text by default
	if (1*typeAs === +typeAs) {
	//guess... local can be 1,000.00 or 1.000,00 ? 1,000 or 1.000 ?
	if (value.indexOf(',') > -1 && value.indexOf(',') > value.indexOf('.'))
	value = value.replace('.', '').replace(',', '.'); //1.000,00 -> 1000.00
	if (value.indexOf('.') > -1)
	value = parseFloat(value.replace(',', ''));
	value = +value;
	}
	if (typeAs === true \|\| typeAs === false)
	value = (value.toLowerCase() === 'true' \|\| value === '1');
	return value;
	}

	//setSessionNested
	function bindSetSessionValue(parmString, value) {
	//TODO: Should test some more eg. if value is undefined?
	//paramString support nested objects eg. foo.bar.value
	var param = parmString.split('.');
	if (param.length > 0) {
	var sessionObject = Session.get(param[0]);
	var myVar = sessionObject;
	//Loop through parametres foo.bar.etc leave out the last element
	for (var i = 1; i < param.length-2; i++)
	myVar = (myVar[param[i]])?myVar[param[i]]:{};
	if (param.length > 1) {
	//If nested then grab the last element
	var i = param[param.length-1];
	//convert to int if destination is so str, int, bool
	myVar[i] = typeCastAs(value, myVar[i]);
	Session.set(param[0], sessionObject);
	} else //Not nested, regular var
	Session.set(param[0], typeCastAs(value, sessionObject));
	}
	} //EO bindSetSessionValue

	//Init the session-bind
	$(document).on('change keyup', 'input[session-bind], select[session-bind]', function(e) {
	//TODO: Should test some more eg. if session-bind empty etc.
	var parmString = e.target.getAttribute('session-bind');
	var value = e.target.value;
	bindSetSessionValue(parmString, value);
	}); //EO bind event

	//Init data-set [data-set], button[data-set], input[data-set][type=button]
	$(document).on('click',' a[data-set], button[data-set], input[data-set][type=button]', function(e) {
	var href = e.target.getAttribute('href'); //CSS selector element to set value on
	if (e && href) e.preventDefault();
	var value = e.target.getAttribute('data-set');
	var parmString = e.target.getAttribute('session-bind');

	$(href).val(value).trigger('change');
	if (parmString) bindSetSessionValue(parmString, value);
	});
	});
	}