Lungo.View.Template.Binding.js 2.9 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192
  1. /**
  2. * Lungo Data-Binding system
  3. *
  4. * @namespace LUNGO.View.Template
  5. * @class Binding
  6. *
  7. * @author Javier Jimenez Villar <javi@tapquo.com> || @soyjavi
  8. * @author Guillermo Pascual <pasku@tapquo.com> || @pasku1
  9. */
  10. LUNGO.View.Template.Binding = (function(lng, undefined) {
  11. var BINDING_START = '{{';
  12. var BINDING_END = '}}';
  13. var BINDING_PARSER = /\{{.*?\}}/gi;
  14. /**
  15. * Performs databinding process for a data set and a given template
  16. *
  17. * @method create
  18. *
  19. * @param {String} Id of the container showing the result of databinding
  20. * @param {String} Databinding Template Id
  21. * @param {Object} Data for binding
  22. * @param {Function} Callback when the process is complete
  23. */
  24. var create = function(container_id, template_id, data, callback) {
  25. if (lng.View.Template.exists(template_id)) {
  26. var template = lng.View.Template.get(template_id);
  27. var markup = _processData(data, template);
  28. _render(container_id, markup);
  29. lng.Core.execute(callback);
  30. } else {
  31. lng.Core.log(3, 'lng.View.Template.binding: id ' + template_id + ' not exists');
  32. }
  33. };
  34. var dataAttribute = function(element, attribute) {
  35. var data = element.data(attribute.tag);
  36. if (data) {
  37. var html_binded = attribute.html.replace(BINDING_START + 'value' + BINDING_END, data);
  38. element.prepend(html_binded);
  39. }
  40. };
  41. var _processData = function(data, template) {
  42. var data_type = lng.Core.toType(data);
  43. if (data_type === 'array') {
  44. return _bindPropertiesInMultiplesElements(data, template);
  45. } else if (data_type === 'object') {
  46. return _bindProperties(data, template);
  47. } else {
  48. lng.Core.log(3, 'View.Template ERROR >> No type defined.');
  49. }
  50. };
  51. var _bindPropertiesInMultiplesElements = function(elements, template) {
  52. var markup = '';
  53. for (var i = 0, len = elements.length; i < len; i++) {
  54. markup += _bindProperties(elements[i], template);
  55. }
  56. return markup;
  57. };
  58. var _bindProperties = function(element, template) {
  59. var binding_field;
  60. for (var property in element) {
  61. if (lng.Core.isOwnProperty(element, property)) {
  62. binding_field = new RegExp(BINDING_START + property + BINDING_END, 'g');
  63. template = template.replace(binding_field, element[property]);
  64. }
  65. }
  66. return _removeNoBindedProperties(template);
  67. };
  68. var _removeNoBindedProperties = function(template) {
  69. return template.replace(BINDING_PARSER, '');
  70. };
  71. var _render = function(container_id, markup) {
  72. var container = lng.dom('#' + container_id);
  73. container.html(markup);
  74. };
  75. return {
  76. create: create,
  77. dataAttribute: dataAttribute
  78. };
  79. })(LUNGO);