diff --git a/js/test.js b/js/test.js
new file mode 100644
index 0000000000000000000000000000000000000000..48103e9040c9dc62c0f5dd96b57b5f399c7d1511
--- /dev/null
+++ b/js/test.js
@@ -0,0 +1,20 @@
+if(!mu.exists(window.muTest)){
+ window.muTest = {
+ postJsonResponse: function(){
+ mu.ajax({
+ url: 'tests/jsonresponse.php',
+ method: 'POST',
+ responseType: 'json',
+ success: function(data){
+ console.log(data);
+ }
+ });
+ },
+ delegateEvent: function(){
+ mu('#delTest').on('click', '.clickme', function(e){
+ console.log(this);
+ console.log(e);
+ });
+ }
+ }
+}
diff --git a/js/tinyDOM.js b/js/tinyDOM.js
index c0e64c8298359ebd99539e29d24c3e3f82bcfbbd..d8329f002203c38546a8497dbe7aa38abc19703d 100644
--- a/js/tinyDOM.js
+++ b/js/tinyDOM.js
@@ -1,8 +1,20 @@
-//Prevent pollution of global namespace with closure
(function() {
'use strict';
- var tinyDOM = function(selector) {
+ /*
+ * Polyfill from https://gist.github.com/elijahmanor/6452535
+ */
+ if (Element && !Element.prototype.matches) {
+ var proto = Element.prototype;
+ proto.matches = proto.matchesSelector ||
+ proto.mozMatchesSelector || proto.msMatchesSelector ||
+ proto.oMatchesSelector || proto.webkitMatchesSelector;
+ }
+ /*
+ * End Polyfill
+ */
+
+ var tinyDOM = function(selector){
return new tinyDOMFunction(selector);
};
@@ -50,7 +62,7 @@
},
show: function() {
this.each(function(i, e) {
- if(e.td_prop.isHidden === true){
+ if(e.td_prop.isHidden === true) {
if(typeof(e.style.td_previousDisplay) !== 'undefined') {
e.style.display = e.style.td_previousDisplay;
} else {
@@ -61,10 +73,32 @@
});
return this;
},
- on: function(ev, fn) {
- this.each(function(i, e) {
- e.addEventListener(ev, fn);
- });
+ on: function(ev, del, fn) {
+ if(typeof(del) === 'string') {
+ this.each(function(i, e) {
+ e.addEventListener(ev, function(firedevent) {
+ var target = firedevent.target;
+ var matched = false;
+ do {
+ if(target && target.matches(del)) {
+ fn.call(target, firedevent);
+ matched = true;
+ } else {
+ target = target.parentNode;
+ if(!target || !target.matches || target === e) {
+ matched = true;
+ }
+ }
+ } while(matched !== true);
+
+ });
+ });
+ } else {
+ var fn = del;
+ this.each(function(i, e) {
+ e.addEventListener(ev, fn);
+ });
+ }
return this;
},
first: function() {
diff --git a/js/tinyDOM.min.js b/js/tinyDOM.min.js
index db8cd0ea80fbd25970f013de5b739331197f8468..dcde192d49ff8fbc00b6c8f56b8e8ea102209d94 100644
--- a/js/tinyDOM.min.js
+++ b/js/tinyDOM.min.js
@@ -1 +1 @@
-!function(){var a=function(a){return new b(a)},b=function(a){var b=document.querySelectorAll(a);this.length=b.length;for(var c=0;c<b.length;c++){var d=b.item(c);"undefined"==typeof d.td_prop&&(d.td_prop={isHidden:!1}),this[c]=b.item(c)}return this};a.fn=b.prototype={each:function(a){for(var b=this.length;b--;)a(b,this[b],this);return this},hide:function(){return this.each(function(a,b){b.td_prop.isHidden||(b.style.td_previousDisplay=b.style.display,b.style.display="none",b.td_prop.isHidden=!0)}),this},show:function(){return this.each(function(a,b){b.td_prop.isHidden===!0&&(b.style.display="undefined"!=typeof b.style.td_previousDisplay?b.style.td_previousDisplay:"block",b.td_prop.isHidden=!1)}),this},on:function(a,b){return this.each(function(c,d){d.addEventListener(a,b)}),this},first:function(){return"undefined"!=typeof this[0]?this[0]:null},data:function(a,b){var c=this[0];return"undefined"!=typeof b?(c.setAttribute("data-"+a,b),this):c.getAttribute("data-"+a)}},a.exists=function(a){return null!==a&&"undefined"!=typeof a},a.merge=function(a,b){if(this.exists(a)&&this.exists(b)){for(var c in b)b.hasOwnProperty(c)&&(a[c]=b[c]);return a}return null},a.ajax=function(a){var b=new XMLHttpRequest,c=this,d={method:"GET",url:"",async:!0,user:null,password:null,responseType:"text",data:null,headers:[],success:null,error:null};this.merge(d,a),b.responseType=d.responseType,b.onreadystatechange=function(){b.readyState>1&&(200===b.status?4===b.readyState&&c.exists(d.success)&&d.success(b.response,b):(b.abort(),c.exists(d.error)&&d.error({status:b.status,message:b.statusText},b)))},b.open(d.method,d.url,d.async,d.user,d.password);for(var e=0;e<d.headers.length;e++)b.setRequestHeader(d.headers[e].header,d.headers[e].value);return b.send(d.data),b},window.μ||(window.μ=a),window.mu||(window.mu=a)}();
+!function(){if(Element&&!Element.prototype.matches){var a=Element.prototype;a.matches=a.matchesSelector||a.mozMatchesSelector||a.msMatchesSelector||a.oMatchesSelector||a.webkitMatchesSelector}var b=function(a){return new c(a)},c=function(a){if(null===a||"undefined"==typeof a)this.length=0;else if("string"==typeof a){var b=document.querySelectorAll(a);this.length=b.length;for(var c=0;c<b.length;c++){var d=b.item(c);"undefined"==typeof d.td_prop&&(d.td_prop={isHidden:!1}),this[c]=b.item(c)}}else this[0]=a,this.length=1;return this};b.fn=c.prototype={each:function(a){for(var b=this.length;b--;)a(b,this[b],this);return this},hide:function(){return this.each(function(a,b){b.td_prop.isHidden||(b.style.td_previousDisplay=b.style.display,b.style.display="none",b.td_prop.isHidden=!0)}),this},show:function(){return this.each(function(a,b){b.td_prop.isHidden===!0&&(b.style.display="undefined"!=typeof b.style.td_previousDisplay?b.style.td_previousDisplay:"block",b.td_prop.isHidden=!1)}),this},on:function(a,b,c){if("string"==typeof b)this.each(function(d,e){e.addEventListener(a,function(a){var d=a.target,e=!1;do d&&d.matches(b)?(c.call(d,a),e=!0):(d=d.parentNode,d&&d.matches||(e=!0));while(e!==!0)})});else{var c=b;this.each(function(b,d){d.addEventListener(a,c)})}return this},first:function(){return"undefined"!=typeof this[0]?this[0]:null},data:function(a,b){var c=this[0];return"undefined"!=typeof b?(c.setAttribute("data-"+a,b),this):c.getAttribute("data-"+a)}},b.exists=function(a){return null!==a&&"undefined"!=typeof a},b.merge=function(a,b){if(this.exists(a)&&this.exists(b)){for(var c in b)b.hasOwnProperty(c)&&(a[c]=b[c]);return a}return null},b.ajax=function(a){var b=new XMLHttpRequest,c=this,d={method:"GET",url:"",async:!0,user:null,password:null,responseType:"text",data:null,headers:[],success:null,error:null};this.merge(d,a),b.responseType=d.responseType,b.onreadystatechange=function(){b.readyState>1&&(b.status>=200&&b.status<400?4===b.readyState&&c.exists(d.success)&&d.success(b.response,b):c.exists(b.td_hasAborted)&&b.td_hasAborted||(c.exists(d.error)&&d.error({status:b.status,message:b.statusText},b),b.td_hasAborted=!0,b.abort()))},b.open(d.method,d.url,d.async,d.user,d.password);for(var e=0;e<d.headers.length;e++)b.setRequestHeader(d.headers[e].header,d.headers[e].value);return b.send(d.data),b},window.μ||(window.μ=b),window.mu||(window.mu=b)}();
diff --git a/test.html b/test.html
index d46a068b10bd304110f53d3c6c3a4ddf47901634..547e1d057fcbcca81c9ba9c5c307ec5df2673f1e 100644
--- a/test.html
+++ b/test.html
@@ -20,8 +20,8 @@
<button id="btn-hide">HIDE THINGS</button>
<button id="btn-show">SHOW THINGS</button>
- <section class='information' data-href='tests/get.html'>
- <h2>About tinyDOM functions</h2>
+ <section class='information'>
+ <h2 data-href='tests/get.html'>About tinyDOM functions</h2>
<p>
tinyDOM operates on dom elements to make it a bit easier
to select and manipulate them. It also provides some simple
@@ -41,10 +41,23 @@
<ul>
<li>.data(<em>attribute</em>)</li>
</ul>
+
+ <hr>
+
+ <p>
+ There are also functions that are invoked directly from the my object, and deal with
+ things such as ajax requests and json utilities. A few examples of these are
+ </p>
+ <ul id='delTest'>
+ <li class='clickme'>.merge(<em>obj1</em>, <em>obj2</em>)</li>
+ <li class='noclick'>.exists(<em>obj</em>)</li>
+ <li class='clickme'>.ajax(<em>params</em>)</li>
+ </ul>
</section>
</body>
<script type="text/javascript" src="js/tinyDOM.js"></script>
+ <script type="text/javascript" src="js/test.js"></script>
<script type="text/javascript">
μ('#btn-show').on('click', function(){
μ('.important').show();
@@ -58,7 +71,7 @@
console.log(this);
});
- μ('.information').on('click', function(){
+ μ('.information h2').on('click', function(){
var url = μ(this).data('href');
console.log(μ(this).data('href'));
μ.ajax({
diff --git a/tests/jsonresponse.php b/tests/jsonresponse.php
new file mode 100644
index 0000000000000000000000000000000000000000..6a32ea96eb03a6342e8bb8921b77e58ada41aff2
--- /dev/null
+++ b/tests/jsonresponse.php
@@ -0,0 +1,9 @@
+<?php header('Content-Type: application/json');
+ $jsonObj = array(
+ 'elementOne' => 'Its a string',
+ 'numberElement' => -1,
+ 'booleanElement' => True,
+ 'elementTwo' => 'another string!'
+ );
+ echo json_encode($jsonObj);
+?>