Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse files

add zepto support

  • Loading branch information...
commit f04e0f5fc8cf66d289b7eb69cebbd6a979381d38 1 parent 148c72b
@kakchan authored
View
92 examples/jquery-nohtmlTest.html
@@ -0,0 +1,92 @@
+<!DOCTYPE html>
+<HTML>
+<HEAD>
+ <TITLE>JQuery - NoHtml Test</TITLE>
+</HEAD>
+<BODY>
+<h1>Create DOM element with JQuery</h1>
+<DIV id='test1'></DIV>
+
+<h1>Create Simple Element with JQuery and nohtml</h1>
+<DIV id='test2'></DIV>
+
+<h1>Create Complext Element with JQuery and nohtml</h1>
+<DIV id='test3'></DIV>
+
+<h1>Test JQuery.append()</h1>
+<DIV id="test4"></DIV>
+
+<h1>Test JQuery.append() with nohtml</h1>
+<DIV id="test5"></DIV>
+
+<h1>Test Radio Button with nohtml</h1>
+<DIV id="test6"></DIV>
+
+<script src="../lib/jquery-1.6.1.js"></script>
+<script src="../src/jquery-nohtml.js"></script>
+<script>
+ $( function() {
+ // Test 1 - Create DOM element with JQuery
+ $( "<DIV>").html("Create DOM Element with JQuery").appendTo( "#test1" );
+
+ // Test 2 - Create Simple Element with JQuery and nohtml
+ $( { tag: "DIV", text: "Create Simple Element with JQuery and nohtml" } ).appendTo( "#test2" );
+
+ // Test 3 - Create Complext Element with JQuery and nohtml
+ var otherEl = jQuery( "<div class='foo'>foo</div>").get( 0 );
+ var testpoint = false;
+ jQuery(
+ { tag: "DIV", children: [
+ // use the zeroth div to test setting attributes
+ { tag: "DIV",
+ css: { border: "1px solid black", backgroundColor: "red" },
+ cls: "class1 class2 class3",
+ random123: "attribute456",
+ id: "this_is_my_id",
+ lang: "en-AU"
+ },
+ { tag: "DIV", children: [
+ "",
+ 0,
+ true === true ? false : false,
+ undefined,
+ null,
+ {}
+ ] },
+ { tag: "DIV",
+ id: 'datadiv',
+ onclick: function() { testpoint = true; },
+ child: { tag: "input", type: "hidden", value: "shhh" },
+ data: { foo: "bar", baz: 3, rel: otherEl }
+ },
+ { tag: "DIV",
+ html: "<span title=\"something\">Something</span> else"
+ },
+ { tag: "DIV", children: [
+ { tag: 'TABLE', cls: 'atable', children: [
+ { tag: "TBODY", children: [
+ { tag: 'TR', children: [
+ { tag: 'TD', text: "one" },
+ { tag: 'TD', text: "two" },
+ { tag: 'TD', text: "three" },
+ { tag: 'TD', id: 'moo', text: "four" }
+ ] }
+ ] }
+ ] }
+ ] },
+ $.create( { tag: "DIV", id: "inner_create", children: $("<div>1</div><div>2</div><div>3</div>") } ),
+ otherEl
+ ] }
+ ).appendTo( "#test3" );
+
+ $( "#test4" ).append("<div>Test 4</div>");
+
+ $( "#test5" ).append( { tag: "DIV", text: "Test 5" } );
+
+ window.test6 = jQuery({ tag: "INPUT", type:"radio" });
+ $( "#test6" ).append( test6 );
+ window.test6.click();
+ } );
+</script>
+</BODY>
+</HTML>
View
94 examples/zepto-nohtmlTest.html
@@ -0,0 +1,94 @@
+<!DOCTYPE html>
+<HTML>
+<HEAD>
+ <TITLE>Zepto - NoHtml Test</TITLE>
+</HEAD>
+<BODY>
+<h1>Create DOM element with Zepto</h1>
+<DIV id='test1'></DIV>
+
+<h1>Create Simple Element with Zepto and nohtml</h1>
+<DIV id='test2'></DIV>
+
+<h1>Create Complex Element with Zepto and nohtml</h1>
+<DIV id='test3'></DIV>
+
+<h1>Test Zepto.append()</h1>
+<DIV id="test4"></DIV>
+
+<h1>Test Zepto.append() with nohtml</h1>
+<DIV id="test5"></DIV>
+
+<h1>Test Radio Button with nohtml</h1>
+<DIV id="test6"></DIV>
+
+<script src="../lib/zepto.js"></script>
+<script src="../lib/zepto-event.js"></script>
+<script src="../src/zepto-nohtml.js"></script>
+<script>
+ $( function() {
+ // Test 1 - Create DOM element with Zepto
+ $( "<DIV>").html("Create DOM Element with Zepto").appendTo( "#test1" );
+
+ // Test 2 - Create Simple Element with Zepto and nohtml
+ $( { tag: "DIV", text: "Create Simple Element with Zepto and nohtml" } ).appendTo( "#test2" );
+
+ // Test 3 - Create Complext Element with Zepto and nohtml
+ var otherEl = Zepto( "<div class='foo'>foo</div>");
+ var testpoint = false;
+ Zepto(
+ { tag: "DIV", children: [
+ // use the zeroth div to test setting attributes
+ { tag: "DIV",
+ css: { border: "1px solid black", backgroundColor: "red" },
+ cls: "class1 class2 class3",
+ random123: "attribute456",
+ id: "this_is_my_id",
+ lang: "en-AU"
+ },
+ { tag: "DIV", children: [
+ "",
+ 0,
+ true === true ? false : false,
+ undefined,
+ null,
+ {}
+ ] },
+ { tag: "DIV",
+ id: 'datadiv',
+ onclick: function() { testpoint = true; },
+ child: { tag: "input", type: "hidden", value: "shhh" },
+ data: { foo: "bar", baz: 3, rel: otherEl }
+ },
+ { tag: "DIV",
+ html: "<span title=\"something\">Something</span> else"
+ },
+ { tag: "DIV", children: [
+ { tag: 'TABLE', cls: 'atable', children: [
+ { tag: "TBODY", children: [
+ { tag: 'TR', children: [
+ { tag: 'TD', text: "one" },
+ { tag: 'TD', text: "two" },
+ { tag: 'TD', text: "three" },
+ { tag: 'TD', id: 'moo', text: "four" }
+ ] }
+ ] }
+ ] }
+ ] },
+ Zepto( { tag: "DIV", id: "inner_create", children: Zepto("<div>1</div><div>2</div><div>3</div>") } ),
+ otherEl
+ ] }
+ ).appendTo( "#test3" );
+
+ $( "#test4" ).append("<div>Test 4</div>");
+
+ $( "#test5" ).append( { tag: "DIV", text: "Test 5" } );
+
+ window.test6 = Zepto({ tag: "INPUT", type:"radio" });
+ $( "#test6" ).append( test6 );
+ window.test6.click();
+ } );
+
+</script>
+</BODY>
+</HTML>
View
231 lib/zepto-event.js
@@ -0,0 +1,231 @@
+// Zepto.js
+// (c) 2010, 2011 Thomas Fuchs
+// Zepto.js may be freely distributed under the MIT license.
+(function($) {
+ var $$ = $.qsa,
+ handlers = {},
+ _zid = 1,
+ specialEvents = {};
+
+ specialEvents.click = specialEvents.mousedown = specialEvents.mouseup = specialEvents.mousemove = 'MouseEvents';
+
+ function zid(element) {
+ return element._zid || (element._zid = _zid++);
+ }
+
+ function findHandlers(element, event, fn, selector) {
+ event = parse(event);
+ if (event.ns) var matcher = matcherFor(event.ns);
+ return (handlers[zid(element)] || []).filter(function(handler) {
+ return handler && (!event.e || handler.e == event.e) && (!event.ns || matcher.test(handler.ns)) && (!fn || handler.fn == fn) && (!selector || handler.sel == selector);
+ });
+ }
+
+ function parse(event) {
+ var parts = ('' + event).split('.');
+ return {
+ e: parts[0],
+ ns: parts.slice(1).sort().join(' ')
+ };
+ }
+
+ function matcherFor(ns) {
+ return new RegExp('(?:^| )' + ns.replace(' ', ' .* ?') + '(?: |$)');
+ }
+
+ function eachEvent(events, fn, iterator) {
+ if ($.isObject(events)) $.each(events, iterator);
+ else events.split(/\s/).forEach(function(type) {
+ iterator(type, fn)
+ });
+ }
+
+ function add(element, events, fn, selector, getDelegate) {
+ var id = zid(element),
+ set = (handlers[id] || (handlers[id] = []));
+ eachEvent(events, fn, function(event, fn) {
+ var delegate = getDelegate && getDelegate(fn, event),
+ callback = delegate || fn;
+ var proxyfn = function(event) {
+ var result = callback.apply(element, [event].concat(event.data));
+ if (result === false) event.preventDefault();
+ return result;
+ };
+ var handler = $.extend(parse(event), {
+ fn: fn,
+ proxy: proxyfn,
+ sel: selector,
+ del: delegate,
+ i: set.length
+ });
+ set.push(handler);
+ element.addEventListener(handler.e, proxyfn, false);
+ });
+ }
+
+ function remove(element, events, fn, selector) {
+ var id = zid(element);
+ eachEvent(events || '', fn, function(event, fn) {
+ findHandlers(element, event, fn, selector).forEach(function(handler) {
+ delete handlers[id][handler.i];
+ element.removeEventListener(handler.e, handler.proxy, false);
+ });
+ });
+ }
+
+ $.event = {
+ add: add,
+ remove: remove
+ }
+
+ $.fn.bind = function(event, callback) {
+ return this.each(function() {
+ add(this, event, callback);
+ });
+ };
+ $.fn.unbind = function(event, callback) {
+ return this.each(function() {
+ remove(this, event, callback);
+ });
+ };
+ $.fn.one = function(event, callback) {
+ return this.each(function(i, element) {
+ add(this, event, callback, null, function(fn, type) {
+ return function() {
+ var result = fn.apply(element, arguments);
+ remove(element, type, fn);
+ return result;
+ }
+ });
+ });
+ };
+
+ var returnTrue = function() {
+ return true
+ },
+ returnFalse = function() {
+ return false
+ },
+ eventMethods = {
+ preventDefault: 'isDefaultPrevented',
+ stopImmediatePropagation: 'isImmediatePropagationStopped',
+ stopPropagation: 'isPropagationStopped'
+ };
+
+ function createProxy(event) {
+ var proxy = $.extend({
+ originalEvent: event
+ }, event);
+ $.each(eventMethods, function(name, predicate) {
+ proxy[name] = function() {
+ this[predicate] = returnTrue;
+ return event[name].apply(event, arguments);
+ };
+ proxy[predicate] = returnFalse;
+ })
+ return proxy;
+ }
+
+ // emulates the 'defaultPrevented' property for browsers that have none
+
+
+ function fix(event) {
+ if (!('defaultPrevented' in event)) {
+ event.defaultPrevented = false;
+ var prevent = event.preventDefault;
+ event.preventDefault = function() {
+ this.defaultPrevented = true;
+ prevent.call(this);
+ }
+ }
+ }
+
+ $.fn.delegate = function(selector, event, callback) {
+ return this.each(function(i, element) {
+ add(element, event, callback, selector, function(fn) {
+ return function(e) {
+ var evt, match = $(e.target).closest(selector, element).get(0);
+ if (match) {
+ evt = $.extend(createProxy(e), {
+ currentTarget: match,
+ liveFired: element
+ });
+ return fn.apply(match, [evt].concat([].slice.call(arguments, 1)));
+ }
+ }
+ });
+ });
+ };
+ $.fn.undelegate = function(selector, event, callback) {
+ return this.each(function() {
+ remove(this, event, callback, selector);
+ });
+ }
+
+ $.fn.live = function(event, callback) {
+ $(document.body).delegate(this.selector, event, callback);
+ return this;
+ };
+ $.fn.die = function(event, callback) {
+ $(document.body).undelegate(this.selector, event, callback);
+ return this;
+ };
+
+ $.fn.on = function(event, selector, callback) {
+ return selector === undefined || $.isFunction(selector) ? this.bind(event, selector) : this.delegate(selector, event, callback);
+ };
+ $.fn.off = function(event, selector, callback) {
+ return selector === undefined || $.isFunction(selector) ? this.unbind(event, selector) : this.undelegate(selector, event, callback);
+ };
+
+ $.fn.trigger = function(event, data) {
+ if (typeof event == 'string') event = $.Event(event);
+ fix(event);
+ event.data = data;
+ return this.each(function() {
+ this.dispatchEvent(event)
+ });
+ };
+
+ // triggers event handlers on current element just as if an event occurred,
+ // doesn't trigger an actual event, doesn't bubble
+ $.fn.triggerHandler = function(event, data) {
+ var e, result;
+ this.each(function(i, element) {
+ e = createProxy(typeof event == 'string' ? $.Event(event) : event);
+ e.data = data;
+ e.target = element;
+ $.each(findHandlers(element, event.type || event), function(i, handler) {
+ result = handler.proxy(e);
+ if (e.isImmediatePropagationStopped()) return false;
+ });
+ });
+ return result;
+ };
+
+ // shortcut methods for `.bind(event, fn)` for each event type
+ ('focusin focusout load resize scroll unload click dblclick ' + 'mousedown mouseup mousemove mouseover mouseout ' + 'change select keydown keypress keyup error').split(' ').forEach(function(event) {
+ $.fn[event] = function(callback) {
+ return this.bind(event, callback)
+ };
+ });
+
+ ['focus', 'blur'].forEach(function(name) {
+ $.fn[name] = function(callback) {
+ if (callback) this.bind(name, callback);
+ else if (this.length) try {
+ this.get(0)[name]()
+ } catch (e) {};
+ return this;
+ };
+ });
+
+ $.Event = function(type, props) {
+ var event = document.createEvent(specialEvents[type] || 'Events'),
+ bubbles = true;
+ if (props) for (var name in props)(name == 'bubbles') ? (bubbles = !! props[name]) : (event[name] = props[name]);
+ event.initEvent(type, bubbles, true, null, null, null, null, null, null, null, null, null, null, null, null);
+ return event;
+ };
+
+})(Zepto);
View
525 lib/zepto.js
@@ -0,0 +1,525 @@
+// Zepto.js
+// (c) 2010, 2011 Thomas Fuchs
+// Zepto.js may be freely distributed under the MIT license.
+var Zepto = (function() {
+ var undefined, key, $$, classList, emptyArray = [],
+ slice = emptyArray.slice,
+ document = window.document,
+ elementDisplay = {},
+ classCache = {},
+ getComputedStyle = document.defaultView.getComputedStyle,
+ cssNumber = {
+ 'column-count': 1,
+ 'columns': 1,
+ 'font-weight': 1,
+ 'line-height': 1,
+ 'opacity': 1,
+ 'z-index': 1,
+ 'zoom': 1
+ },
+ fragmentRE = /^\s*<(\w+)[^>]*>/,
+ elementTypes = [1, 9, 11],
+ adjacencyOperators = ['after', 'prepend', 'before', 'append'],
+ table = document.createElement('table'),
+ tableRow = document.createElement('tr'),
+ containers = {
+ 'tr': document.createElement('tbody'),
+ 'tbody': table,
+ 'thead': table,
+ 'tfoot': table,
+ 'td': tableRow,
+ 'th': tableRow,
+ '*': document.createElement('div')
+ },
+ readyRE = /complete|loaded|interactive/,
+ classSelectorRE = /^\.([\w-]+)$/,
+ idSelectorRE = /^#([\w-]+)$/,
+ tagSelectorRE = /^[\w-]+$/;
+
+ function isF(value) {
+ return ({}).toString.call(value) == "[object Function]"
+ }
+
+ function isO(value) {
+ return value instanceof Object
+ }
+
+ function isA(value) {
+ return value instanceof Array
+ }
+
+ function likeArray(obj) {
+ return typeof obj.length == 'number'
+ }
+
+ function compact(array) {
+ return array.filter(function(item) {
+ return item !== undefined && item !== null
+ })
+ }
+
+ function flatten(array) {
+ return array.length > 0 ? [].concat.apply([], array) : array
+ }
+
+ function camelize(str) {
+ return str.replace(/-+(.)?/g, function(match, chr) {
+ return chr ? chr.toUpperCase() : ''
+ })
+ }
+
+ function dasherize(str) {
+ return str.replace(/::/g, '/').replace(/([A-Z]+)([A-Z][a-z])/g, '$1_$2').replace(/([a-z\d])([A-Z])/g, '$1_$2').replace(/_/g, '-').toLowerCase();
+ }
+
+ function uniq(array) {
+ return array.filter(function(item, index, array) {
+ return array.indexOf(item) == index
+ })
+ }
+
+ function classRE(name) {
+ return name in classCache ? classCache[name] : (classCache[name] = new RegExp('(^|\\s)' + name + '(\\s|$)'));
+ }
+
+ function maybeAddPx(name, value) {
+ return (typeof value == "number" && !cssNumber[dasherize(name)]) ? value + "px" : value;
+ }
+
+ function defaultDisplay(nodeName) {
+ var element, display;
+ if (!elementDisplay[nodeName]) {
+ element = document.createElement(nodeName);
+ document.body.appendChild(element);
+ display = getComputedStyle(element, '').getPropertyValue("display");
+ element.parentNode.removeChild(element);
+ display == "none" && (display = "block");
+ elementDisplay[nodeName] = display;
+ }
+ return elementDisplay[nodeName];
+ }
+
+ function fragment(html, name) {
+ if (name === undefined) fragmentRE.test(html) && RegExp.$1;
+ if (!(name in containers)) name = '*';
+ var container = containers[name];
+ container.innerHTML = '' + html;
+ return slice.call(container.childNodes);
+ }
+
+ function Z(dom, selector) {
+ dom = dom || emptyArray;
+ dom.__proto__ = Z.prototype;
+ dom.selector = selector || '';
+ return dom;
+ }
+
+ function $(selector, context) {
+ if (!selector) return Z();
+ if (context !== undefined) return $(context).find(selector);
+ else if (isF(selector)) return $(document).ready(selector);
+ else if (selector instanceof Z) return selector;
+ else {
+ var dom;
+ if (isA(selector)) dom = compact(selector);
+ else if (elementTypes.indexOf(selector.nodeType) >= 0 || selector === window) dom = [selector], selector = null;
+ else if (fragmentRE.test(selector)) dom = fragment(selector.trim(), RegExp.$1), selector = null;
+ else if (selector.nodeType && selector.nodeType == 3) dom = [selector];
+ else dom = $$(document, selector);
+ return Z(dom, selector);
+ }
+ }
+
+ $.extend = function(target) {
+ slice.call(arguments, 1).forEach(function(source) {
+ for (key in source) target[key] = source[key];
+ })
+ return target;
+ }
+
+ $.qsa = $$ = function(element, selector) {
+ var found;
+ return (element === document && idSelectorRE.test(selector)) ? ((found = element.getElementById(RegExp.$1)) ? [found] : emptyArray) : slice.call(
+ classSelectorRE.test(selector) ? element.getElementsByClassName(RegExp.$1) : tagSelectorRE.test(selector) ? element.getElementsByTagName(selector) : element.querySelectorAll(selector));
+ }
+
+ function filtered(nodes, selector) {
+ return selector === undefined ? $(nodes) : $(nodes).filter(selector);
+ }
+
+ function funcArg(context, arg, idx, payload) {
+ return isF(arg) ? arg.call(context, idx, payload) : arg;
+ }
+
+ $.isFunction = isF;
+ $.isObject = isO;
+ $.isArray = isA;
+
+ $.map = function(elements, callback) {
+ var value, values = [],
+ i, key;
+ if (likeArray(elements)) for (i = 0; i < elements.length; i++) {
+ value = callback(elements[i], i);
+ if (value != null) values.push(value);
+ } else
+ for (key in elements) {
+ value = callback(elements[key], key);
+ if (value != null) values.push(value);
+ }
+ return flatten(values);
+ }
+
+ $.each = function(elements, callback) {
+ var i, key;
+ if (likeArray(elements)) for (i = 0; i < elements.length; i++) {
+ if (callback(i, elements[i]) === false) return elements;
+ } else
+ for (key in elements) {
+ if (callback(key, elements[key]) === false) return elements;
+ }
+ return elements;
+ }
+
+ $.fn = {
+ forEach: emptyArray.forEach,
+ reduce: emptyArray.reduce,
+ push: emptyArray.push,
+ indexOf: emptyArray.indexOf,
+ concat: emptyArray.concat,
+ map: function(fn) {
+ return $.map(this, function(el, i) {
+ return fn.call(el, i, el)
+ });
+ },
+ slice: function() {
+ return $(slice.apply(this, arguments));
+ },
+ ready: function(callback) {
+ if (readyRE.test(document.readyState)) callback($);
+ else document.addEventListener('DOMContentLoaded', function() {
+ callback($)
+ }, false);
+ return this;
+ },
+ get: function(idx) {
+ return idx === undefined ? this : this[idx]
+ },
+ size: function() {
+ return this.length
+ },
+ remove: function() {
+ return this.each(function() {
+ if (this.parentNode != null) {
+ this.parentNode.removeChild(this);
+ }
+ });
+ },
+ each: function(callback) {
+ this.forEach(function(el, idx) {
+ callback.call(el, idx, el)
+ });
+ return this;
+ },
+ filter: function(selector) {
+ return $([].filter.call(this, function(element) {
+ return element.parentNode && $$(element.parentNode, selector).indexOf(element) >= 0;
+ }));
+ },
+ end: function() {
+ return this.prevObject || $();
+ },
+ andSelf: function() {
+ return this.add(this.prevObject || $())
+ },
+ add: function(selector, context) {
+ return $(uniq(this.concat($(selector, context))));
+ },
+ is: function(selector) {
+ return this.length > 0 && $(this[0]).filter(selector).length > 0;
+ },
+ not: function(selector) {
+ var nodes = [];
+ if (isF(selector) && selector.call !== undefined) this.each(function(idx) {
+ if (!selector.call(this, idx)) nodes.push(this);
+ });
+ else {
+ var excludes = typeof selector == 'string' ? this.filter(selector) : (likeArray(selector) && isF(selector.item)) ? slice.call(selector) : $(selector);
+ this.forEach(function(el) {
+ if (excludes.indexOf(el) < 0) nodes.push(el);
+ });
+ }
+ return $(nodes);
+ },
+ eq: function(idx) {
+ return idx === -1 ? this.slice(idx) : this.slice(idx, +idx + 1);
+ },
+ first: function() {
+ var el = this[0];
+ return el && !isO(el) ? el : $(el)
+ },
+ last: function() {
+ var el = this[this.length - 1];
+ return el && !isO(el) ? el : $(el)
+ },
+ find: function(selector) {
+ var result;
+ if (this.length == 1) result = $$(this[0], selector);
+ else result = this.map(function() {
+ return $$(this, selector)
+ });
+ return $(result);
+ },
+ closest: function(selector, context) {
+ var node = this[0],
+ candidates = $$(context || document, selector);
+ if (!candidates.length) node = null;
+ while (node && candidates.indexOf(node) < 0)
+ node = node !== context && node !== document && node.parentNode;
+ return $(node);
+ },
+ parents: function(selector) {
+ var ancestors = [],
+ nodes = this;
+ while (nodes.length > 0)
+ nodes = $.map(nodes, function(node) {
+ if ((node = node.parentNode) && node !== document && ancestors.indexOf(node) < 0) {
+ ancestors.push(node);
+ return node;
+ }
+ });
+ return filtered(ancestors, selector);
+ },
+ parent: function(selector) {
+ return filtered(uniq(this.pluck('parentNode')), selector);
+ },
+ children: function(selector) {
+ return filtered(this.map(function() {
+ return slice.call(this.children)
+ }), selector);
+ },
+ siblings: function(selector) {
+ return filtered(this.map(function(i, el) {
+ return slice.call(el.parentNode.children).filter(function(child) {
+ return child !== el
+ });
+ }), selector);
+ },
+ empty: function() {
+ return this.each(function() {
+ this.innerHTML = ''
+ })
+ },
+ pluck: function(property) {
+ return this.map(function() {
+ return this[property]
+ })
+ },
+ show: function() {
+ return this.each(function() {
+ this.style.display == "none" && (this.style.display = null);
+ if (getComputedStyle(this, '').getPropertyValue("display") == "none") {
+ this.style.display = defaultDisplay(this.nodeName)
+ }
+ })
+ },
+ replaceWith: function(newContent) {
+ return this.each(function() {
+ $(this).before(newContent).remove();
+ });
+ },
+ wrap: function(newContent) {
+ return this.each(function() {
+ $(this).wrapAll($(newContent)[0].cloneNode(false));
+ });
+ },
+ wrapAll: function(newContent) {
+ if (this[0]) {
+ $(this[0]).before(newContent = $(newContent));
+ newContent.append(this);
+ }
+ return this;
+ },
+ unwrap: function() {
+ this.parent().each(function() {
+ $(this).replaceWith($(this).children());
+ });
+ return this;
+ },
+ hide: function() {
+ return this.css("display", "none")
+ },
+ toggle: function(setting) {
+ return (setting === undefined ? this.css("display") == "none" : setting) ? this.show() : this.hide();
+ },
+ prev: function() {
+ return $(this.pluck('previousElementSibling'))
+ },
+ next: function() {
+ return $(this.pluck('nextElementSibling'))
+ },
+ html: function(html) {
+ return html === undefined ? (this.length > 0 ? this[0].innerHTML : null) : this.each(function(idx) {
+ var originHtml = this.innerHTML;
+ $(this).empty().append(funcArg(this, html, idx, originHtml));
+ });
+ },
+ text: function(text) {
+ return text === undefined ? (this.length > 0 ? this[0].textContent : null) : this.each(function() {
+ this.textContent = text
+ });
+ },
+ attr: function(name, value) {
+ var res;
+ return (typeof name == 'string' && value === undefined) ? (this.length == 0 ? undefined : (name == 'value' && this[0].nodeName == 'INPUT') ? this.val() : (!(res = this[0].getAttribute(name)) && name in this[0]) ? this[0][name] : res) : this.each(function(idx) {
+ if (isO(name)) for (key in name) this.setAttribute(key, name[key])
+ else this.setAttribute(name, funcArg(this, value, idx, this.getAttribute(name)));
+ });
+ },
+ removeAttr: function(name) {
+ return this.each(function() {
+ this.removeAttribute(name);
+ });
+ },
+ data: function(name, value) {
+ return this.attr('data-' + name, value);
+ },
+ val: function(value) {
+ return (value === undefined) ? (this.length > 0 ? this[0].value : null) : this.each(function(idx) {
+ this.value = funcArg(this, value, idx, this.value);
+ });
+ },
+ offset: function() {
+ if (this.length == 0) return null;
+ var obj = this[0].getBoundingClientRect();
+ return {
+ left: obj.left + window.pageXOffset,
+ top: obj.top + window.pageYOffset,
+ width: obj.width,
+ height: obj.height
+ };
+ },
+ css: function(property, value) {
+ if (value === undefined && typeof property == 'string') {
+ return (
+ this.length == 0 ? undefined : this[0].style[camelize(property)] || getComputedStyle(this[0], '').getPropertyValue(property));
+ }
+ var css = '';
+ for (key in property) css += dasherize(key) + ':' + maybeAddPx(key, property[key]) + ';';
+ if (typeof property == 'string') css = dasherize(property) + ":" + maybeAddPx(property, value);
+ return this.each(function() {
+ this.style.cssText += ';' + css
+ });
+ },
+ index: function(element) {
+ return element ? this.indexOf($(element)[0]) : this.parent().children().indexOf(this[0]);
+ },
+ hasClass: function(name) {
+ if (this.length < 1) return false;
+ else
+ return classRE(name).test(this[0].className);
+ },
+ addClass: function(name) {
+ return this.each(function(idx) {
+ classList = [];
+ var cls = this.className,
+ newName = funcArg(this, name, idx, cls);
+ newName.split(/\s+/g).forEach(function(klass) {
+ if (!$(this).hasClass(klass)) {
+ classList.push(klass)
+ }
+ }, this);
+ classList.length && (this.className += (cls ? " " : "") + classList.join(" "))
+ });
+ },
+ removeClass: function(name) {
+ return this.each(function(idx) {
+ if (name === undefined) return this.className = '';
+ classList = this.className;
+ funcArg(this, name, idx, classList).split(/\s+/g).forEach(function(klass) {
+ classList = classList.replace(classRE(klass), " ")
+ });
+ this.className = classList.trim()
+ });
+ },
+ toggleClass: function(name, when) {
+ return this.each(function(idx) {
+ var newName = funcArg(this, name, idx, this.className);
+ (when === undefined ? !$(this).hasClass(newName) : when) ? $(this).addClass(newName) : $(this).removeClass(newName);
+ });
+ }
+ };
+
+ 'filter,add,not,eq,first,last,find,closest,parents,parent,children,siblings'.split(',').forEach(function(property) {
+ var fn = $.fn[property];
+ $.fn[property] = function() {
+ var ret = fn.apply(this, arguments);
+ ret.prevObject = this;
+ return ret;
+ }
+ });
+
+ ['width', 'height'].forEach(function(dimension) {
+ $.fn[dimension] = function(value) {
+ var offset, Dimension = dimension.replace(/./, function(m) {
+ return m[0].toUpperCase()
+ });
+ if (value === undefined) return this[0] == window ? window['inner' + Dimension] : this[0] == document ? document.documentElement['offset' + Dimension] : (offset = this.offset()) && offset[dimension];
+ else
+ return this.each(function(idx) {
+ var el = $(this);
+ el.css(dimension, funcArg(this, value, idx, el[dimension]()));
+ });
+ }
+ });
+
+ function insert(operator, target, node) {
+ var parent = (operator % 2) ? target : target.parentNode;
+ parent && parent.insertBefore(node, !operator ? target.nextSibling : // after
+ operator == 1 ? parent.firstChild : // prepend
+ operator == 2 ? target : // before
+ null); // append
+ }
+
+ function traverseNode(node, fun) {
+ fun(node);
+ for (var key in node.childNodes) {
+ traverseNode(node.childNodes[key], fun);
+ }
+ }
+
+ adjacencyOperators.forEach(function(key, operator) {
+ $.fn[key] = function(html) {
+ var nodes = isO(html) ? html : fragment(html);
+ if (!('length' in nodes) || nodes.nodeType) nodes = [nodes];
+ if (nodes.length < 1) return this;
+ var size = this.length,
+ copyByClone = size > 1,
+ inReverse = operator < 2;
+
+ return this.each(function(index, target) {
+ for (var i = 0; i < nodes.length; i++) {
+ var node = nodes[inReverse ? nodes.length - i - 1 : i];
+ traverseNode(node, function(node) {
+ if (node.nodeName != null && node.nodeName.toUpperCase() === 'SCRIPT' && (!node.type || node.type === 'text/javascript')) {
+ window['eval'].call(window, node.innerHTML);
+ }
+ });
+ if (copyByClone && index < size - 1) node = node.cloneNode(true);
+ insert(operator, target, node);
+ }
+ });
+ };
+
+ var reverseKey = (operator % 2) ? key + 'To' : 'insert' + (operator ? 'Before' : 'After');
+ $.fn[reverseKey] = function(html) {
+ $(html)[key](this);
+ return this;
+ };
+ });
+ Z.prototype = $.fn;
+
+ return $;
+})();
+
+window.Zepto = Zepto;
+'$' in window || (window.$ = Zepto);
View
121 src/zepto-nohtml.js
@@ -0,0 +1,121 @@
+(function($, document) {
+ $.support = {};
+ // ie 6, 7 and 8 have trouble with the type and names of dynamically created inputs
+ $.support.useHTMLForInputType = false;
@mobz
mobz added a note

I'd remove useHTMLForInputType completely as well as the branch logic below, it's just not needed for zepto browsers

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
+ $(function() {
+ try {
+ var field = document.createElement( "INPUT" );
+ document.body.appendChild( field );
+ field.setAttribute( "type", "checkbox" );
+ } catch(e) {
+ $.support.useHTMLForInputType = true;
+ } finally {
+ field.parentNode && document.body.removeChild( field );
+ }
+ });
+
+ var create = $.create = (function() {
+ function addAttrs( el, obj, context ) {
+ for( var attr in obj ){
+ switch( attr ) {
+ case 'tag' :
+ break;
+ case 'html' :
+ el.innerHTML = obj[ attr ];
+ break;
+ case 'css' :
+ for( var style in obj.css ) {
+ $(el).css( style, obj.css[ style ] );
+ }
+ break;
+ case 'text' : case 'child' : case 'children' :
+ createNode( obj[attr], el, context );
+ break;
+ case 'cls' :
+ el.className = obj[attr];
+ break;
+ case 'data' :
+ for( var data in obj.data ) {
+ $.fn.data( el, data, obj.data[data] );
+ }
+ break;
+ default :
+ if( attr.indexOf("on") === 0 && $.isFunction(obj[attr]) ) {
+ $.event.add( el, attr.substr(2).replace(/^[A-Z]/, function(a) { return a.toLowerCase(); }), obj[attr] );
+ } else {
+ $( el ).attr( attr, obj[attr] );
+ }
+ }
+ }
+ }
+
+ function createNode(obj, parent, context) {
+ if(obj && ($.isArray(obj) || obj.selector === "")) {
+ for(var ret = [], i = 0; i < obj.length; i++) {
+ var newNode = createNode(obj[i], parent, context);
+ if(newNode) {
+ ret.push(newNode);
+ }
+ }
+ return ret;
+ }
+ var el;
+ if(typeof(obj) === 'string') {
+ el = context.createTextNode(obj);
+ } else if(!obj) {
+ return undefined;
+ } else if(obj.nodeType === 1) {
+ el = obj;
+ } else {
+ if($.support.useHTMLForInputType && obj.tag && obj.tag.match(/input|button/i)) {
+ el = context.createElement("<"+obj.tag + ( obj.type ? " type='"+obj.type+"'" : "" ) + ( obj.name ? " name='"+obj.name+"'" : "" ) + ( obj.checked ? " checked" : "" ) + ">");
+ delete obj.type;
+ delete obj.name;
+ } else {
+ el = context.createElement(obj.tag||'DIV');
+ }
+ addAttrs(el, obj, context);
+ }
+ if(parent){ parent.appendChild(el); }
+ return el;
+ };
+
+ return function(elementDef, parentNode) {
+ return createNode(elementDef, parentNode, (parentNode && parentNode.ownerDocument) || document);
+ };
+
+ })();
+
+ ['after', 'prepend', 'before', 'append'].forEach( function( key, operator ) {
+ var fn = $.fn[key];
+ $.fn[ key ] = function( html ) {
+ var node = null;
+ if ( html && html.tag ) {
+ node = create( html );
+ }
+ return fn.call( this, node || html );
+ }
+ } );
+
+ // inject create into jquery internals so object definitions are treated as first class constructors (overrides non-public methods)
+ var clean = $.clean;
@mobz
mobz added a note

remove jquery specific stuff (eg $.clean) assume that nohtml is running with zepto OR with jquery, not both.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
+
+ $.fn.clean = function( elems, context, fragment, scripts ) {
+ for(var i = 0; i < elems.length; i++) {
+ if( elems[i].tag )
+ elems[i] = create( elems[i], null, context );
+ }
+ return clean( elems, context, fragment, scripts );
+ };
+
+ window.$ = window.Zepto = function( selector, context ) {
@mobz
mobz added a note

check that window.$ is the same as window.Zepto before overwriting it.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
+ if ( selector && selector.tag ) {
+ selector = create( selector, null, context );
+ }
+ return $.call( this, selector, context );
+ };
+
+ window.Zepto.support = $.support;
+ window.Zepto.create = $.create;
@mobz
mobz added a note

this line is redundant

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
+})(Zepto, window.document);
+
View
11 test/JsTestDriver-Zepto.conf
@@ -0,0 +1,11 @@
+load:
+ - ../lib/zepto.js
+ - ../lib/zepto-event.js
+ - ../lib/jshamcrest.js
+
+ - ../src/zepto-nohtml.js
+
+ - ../test/zepto-nohtmlTest.js
+
+ - ../lib/test-plugins.js
+
View
4 test/JsTestDriver.conf
@@ -1,12 +1,10 @@
-server: http://127.0.0.1:4224
-
load:
- ../lib/jquery*.js
- ../lib/jshamcrest.js
- ../src/jquery-nohtml.js
- - ../test/*.js
+ - ../test/jquery-nohtmlTest.js
- ../lib/test-plugins.js
View
119 test/zepto-nohtmlTest.js
@@ -0,0 +1,119 @@
+TestCase("Zepto.create", {
+ "test namespace": function() {
+ assertThat(Zepto.support, hasMember("useHTMLForInputType"), "can't change input type feature detected");
+ assertThat(Zepto, hasFunction("create"), "plugin installed in Zepto namespace");
+ },
+
+ "test simple create": function() {
+ var el = Zepto.create({ tag: "DIV", cls: "foo" });
+ assertThat(el.nodeType, is(1), "created DOM ELEMENT_NODE");
+ assertThat(el.tagName, is("DIV"), "created a DIV");
+ },
+
+ "test complex create": function() {
+ Zepto( "<div id='harness'>" ).appendTo( document.body );
+ var otherEl = Zepto( "<div class='foo'>foo</div>").get( 0 );
+ var testpoint = false;
+ var complex = Zepto(
+ { tag: "DIV", children: [
+ // use the zeroth div to test setting attributes
+ { tag: "DIV",
+ css: { border: "1px solid black", backgroundColor: "red" },
+ cls: "class1 class2 class3",
+ random123: "attribute456",
+ id: "this_is_my_id",
+ lang: "en-AU"
+ },
+ { tag: "DIV", children: [
+ "",
+ 0,
+ true === true ? false : false,
+ undefined,
+ null,
+ {}
+ ] },
+ { tag: "DIV",
+ id: 'datadiv',
+ onclick: function() { testpoint = true; },
+ child: { tag: "input", type: "hidden", value: "shhh" },
+ data: { foo: "bar", baz: 3, rel: otherEl }
+ },
+ { tag: "DIV",
+ html: "<span title=\"something\">Something</span> else"
+ },
+ { tag: "DIV", children: [
+ { tag: 'TABLE', cls: 'atable', children: [
+ { tag: "TBODY", children: [
+ { tag: 'TR', children: [
+ { tag: 'TD', text: "one" },
+ { tag: 'TD', text: "two" },
+ { tag: 'TD', text: "three" },
+ { tag: 'TD', id: 'moo', text: "four" }
+ ] }
+ ] }
+ ] }
+ ] },
+ Zepto( { tag: "DIV", id: "inner_create", children: Zepto("<div>1</div><div>2</div><div>3</div>") } ),
+ otherEl
+ ] }
+ );
+ },
+
+ "test zepto binding": function() {
+ var harness = $("<div id=\"harness\"></div>").appendTo(document.body);
+
+ var div0 = $({ tag: "DIV", id: "div0" });
+ assertThat( div0.length, is(1), "Zepto created a node fail");
+ assertThat( div0.attr("id"), is("div0"), "Zepto created a node with id fail");
+ div0.appendTo(harness);
+ assertThat( $("#div0").attr("id"), is("div0"), "Zepto able to bind created element to body fail");
+
+ div0.append({ tag: "DIV", id: "div1", text: "div1" });
+ div0.prepend({ tag: "DIV", id: "div2", text: "div2" });
+ div0.before({ tag: "DIV", id: "div3", text: "div3" });
+ div0.after({ tag: "DIV", id: "div4", text: "div4" });
+ assertThat( harness[0].innerHTML, is('<div id="div3">div3</div><div id="div0"><div id="div2">div2</div><div id="div1">div1</div></div><div id="div4">div4</div>'), "Zepto clean overloading fail");
+
+ $("#harness").remove();
+ },
+
+ "test radio button select": function() {
+ var harness = $("<div id=\"harness\"></div>").appendTo(document.body);
+
+ var r1 = $({ tag: "INPUT", type: "radio", name: "foo", value: "a" });
+ var r2 = $({ tag: "INPUT", type: "radio", name: "foo", value: "b" });
+ var r3 = $({ tag: "INPUT", type: "radio", name: "foo", value: "c" });
+ harness
+ .append(r1)
+ .append(r2)
+ .append(r3);
+
+ r2.trigger( "click" ); // dom click
+ assertThat( r2.attr("checked"), is( true ), "clicking on radio 2 changes selected state");
+ r3.trigger( "click" ); // dom click
+ assertThat( r3.attr("checked"), is( true ), "clicking on radio 3 changes selected state");
+
+ $("#harness").remove();
+ },
+
+ "test undef type and name": function() {
+ var harness = $("<div id=\"harness\"></div>").appendTo(document.body);
+
+ var i1 = $({ tag: "INPUT" });
+ var i2 = $({ tag: "BUTTON" });
+ var i3 = $({ tag: "INPUT", type: "radio", name: "foo", value: "c", checked: true });
+
+ harness
+ .append(i1)
+ .append(i2)
+ .append(i3);
+ assertThat( i1.attr("type"), is( "text" ), "input given expected default type");
+ assertThat( i1.attr("name"), is( "" ), "input given expected default name");
+ assertThat( i2.attr("type"), is( "submit" ), "button given expected default type");
+ assertThat( i2.attr("name"), is( "" ), "button given expected default name");
+ assertThat( i3.attr("type"), is( "radio" ), "radio input works");
+ assertThat( i3.attr("name"), is( "foo" ), "radio input has name");
+
+ $("#harness").remove();
+ }
+});
View
2  test_jquery.sh
@@ -0,0 +1,2 @@
+#!/bin/bash
+java -jar test/JsTestDriver.jar --config test/JsTestDriver.conf --tests all --browser firefox --port 9876
@mobz
mobz added a note

maybe change JsTestDriver.conf for JsTestDriver-jQuery.conf for consistency

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
View
2  test_zepto.sh
@@ -0,0 +1,2 @@
+#!/bin/bash
+java -jar test/JsTestDriver.jar --config test/JsTestDriver-Zepto.conf --tests all --browser firefox --port 9876
@mobz

I'd remove useHTMLForInputType completely as well as the branch logic below, it's just not needed for zepto browsers

@mobz

remove jquery specific stuff (eg $.clean) assume that nohtml is running with zepto OR with jquery, not both.

@mobz

check that window.$ is the same as window.Zepto before overwriting it.

@mobz

this line is redundant

@mobz

maybe change JsTestDriver.conf for JsTestDriver-jQuery.conf for consistency

Please sign in to comment.
Something went wrong with that request. Please try again.