scobie-0.1.js 3.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103
  1. /**
  2. * Scobie - light weight html templating in JS.
  3. *
  4. * in some html, include a script fragment like this:
  5. *
  6. * <script type="x-scobie-tmpl" data-name="someName.ext"></script>
  7. */
  8. (function() {
  9. var _ajax = function(url, success, error) {
  10. var http = false;
  11. if (navigator.appName == "Microsoft Internet Explorer")
  12. http = new ActiveXObject("Microsoft.XMLHTTP");
  13. else
  14. http = new XMLHttpRequest();
  15. http.open("GET", url);
  16. http.onreadystatechange=function() {
  17. if(http.readyState == 4) {
  18. if (http.status == 200)
  19. success(http.responseText);
  20. else error();
  21. }
  22. }
  23. http.send(null);
  24. };
  25. var _checkReady = function() {
  26. templateCount -= 1;
  27. if (templateCount == 0) {
  28. ready = true;
  29. window.setTimeout(function() {
  30. for (var i = 0; i < readyFuncs.length; i++)
  31. readyFuncs[i]();
  32. }, 200);
  33. }
  34. };
  35. var _finalise = function(s) {
  36. s.parentNode.removeChild(s);
  37. _checkReady();
  38. };
  39. var _init = function(base, s, isScript, isCss) {
  40. templateCount += 1;
  41. var fId = s.getAttribute("src"), h = s.innerHTML.trim();
  42. var params = h.length > 0 ? params = eval("(" + h +")") : {};
  43. var replace = function(html) {
  44. for (var i in params) {
  45. html = html.replace(new RegExp("\\${" + i + "}", "g"), params[i]);
  46. }
  47. return html;
  48. };
  49. var _finaliseThis = function() { _finalise(s); };
  50. _ajax(base + fId, function(html) {
  51. var d = document.createElement(isScript ? "script" : isCss ? "style" : "div");
  52. if (isScript) {
  53. d.type = "text/javascript";
  54. d.text = replace(html);
  55. s.parentNode.insertBefore(d, s);
  56. } else if (isCss) {
  57. d.type = "text/css";
  58. d.innerHTML = replace(html);
  59. s.parentNode.insertBefore(d, s);
  60. } else {
  61. d.innerHTML = replace(html);
  62. for (var i = 0; i < d.childNodes.length; i++)
  63. s.parentNode.insertBefore(d.childNodes[i], s);
  64. }
  65. _update();
  66. _finaliseThis();
  67. }, _finaliseThis); // ajax error handler. we ignore the failure to log a template. could log it or something of course.
  68. };
  69. var _update = function() {
  70. var tags = document.getElementsByTagName("script");
  71. for (var i = 0; i < tags.length ;i++) {
  72. var type = tags[i].getAttribute("type"), isScript = type == "x-scobie-script", isCss = type == "x-scobie-css";
  73. var src = tags[i].getAttribute("src"), done = tags[i].getAttribute("done");
  74. if ((type == "x-scobie-tmpl" && !done) || (isScript && !_loadedScripts[src]) || (isCss && !_loadedCss[src])) {
  75. tags[i].setAttribute("done", "true");
  76. if (isScript) _loadedScripts[src] = true;
  77. if (isCss) _loadedCss[src] = true;
  78. _init(base, tags[i], isScript, isCss);
  79. }
  80. }
  81. };
  82. var _loadedScripts = { }, _loadedCss = { };
  83. var templateCount = 0;
  84. var base = /(.+\/)(.+\.?)/.exec(document.location)[1];
  85. var jQueryReady = jQuery.fn.ready, readyFuncs = [], ready = false;
  86. jQuery.fn.ready = function(fn) { // todo remove jQuery dependency entirely. but we want to override it dont we?
  87. if (!ready) readyFuncs.push(fn);
  88. };
  89. var Scobie = window.Scobie = {
  90. ready : jQuery.fn.ready
  91. };
  92. jQueryReady(_update);
  93. })();