kmx.io/prism.js/assets/utopia.js

• Show log

  Commit

• Hash : 91fdd0b1
  Author :
  Date : 2020-06-28T01:58:55
  

  Website: New assets directory for all web-only files (#2180)

Download

• assets/utopia.js

• /**
   * Utopia: A JavaScript util library that assumes modern standards support and doesn't fix any browser bugs
   * @author Lea Verou (http://lea.verou.me)
   * MIT license (http://www.opensource.org/licenses/mit-license.php)
   * Last update: 2012-4-29
   */
   
  function $(expr, con) {
  	return typeof expr === 'string'? (con || document).querySelector(expr) : expr;
  }
  
  function $$(expr, con) {
  	var elements = (con || document).querySelectorAll(expr);
  	
  	try {
  		return Array.prototype.slice.call(elements);
  	}
  	catch(e) {
  		var arr = Array(elements.length);
  	    
  	    for (var i = elements.length; i-- > 0;) {
  			arr[i] = elements[i];
  		}
  		
  		return arr;
  	}
  }
  
  if (!Array.prototype.forEach) {
  	Array.prototype.forEach = function(fn, scope) {
  		for (var i = 0, len = this.length; i < len; ++i) {
  			fn.call(scope || this, this[i], i, this);
  		}
  	}
  }
  
  // Make each ID a global variable
  // Many browsers do this anyway (it’s in the HTML5 spec), so it ensures consistency
  $$('[id]').forEach(function(element) { window[element.id] = element; });
  
  // Array#splice but for strings
  String.prototype.splice = function(i, remove, add) {
  	remove = +remove || 0;
  	add = add || '';
  	
  	return this.slice(0,i) + add + this.slice(i + remove);
  };
  
  (function(){
  
  var _ = window.Utopia = {
  	/**
  	 * Returns the [[Class]] of an object in lowercase (eg. array, date, regexp, string etc)
  	 * Caution: Results for DOM elements and collections aren't reliable.
  	 * @param {Object} obj
  	 *
  	 * @return {String}
  	 */
  	type: function(obj) {
  		if(obj === null) { return 'null'; }
  
  		if(obj === undefined) { return 'undefined'; }
  
  		var ret = Object.prototype.toString.call(obj).match(/^\[object\s+(.*?)\]$/)[1];
  
  		ret = ret? ret.toLowerCase() : '';
  
  		if(ret == 'number' && isNaN(obj)) {
  			return 'NaN';
  		}
  
  		return ret;
  	},
  
  	/**
  	 * Iterate over the properties of an object. Checks whether the properties actually belong to it.
  	 * Can be stopped if the function explicitly returns a value that isn't null, undefined or NaN.
  	 * 
  	 * @param obj {Object} The object to iterate over
  	 * @param func {Function} The function used in the iteration. Can accept 2 parameters: one of the
  	 * 							value of the object and one for its name.
  	 * @param context {Object} Context for the above function. Default is the object being iterated.
  	 *
  	 * @return {Object} Null or the return value of func, if it broke the loop at some point.
  	 */
  	each: function(obj, func, context) {
  		if(!_.type(func) == 'function') {
  			throw Error('The second argument in Utopia.each() must be a function');
  		};
  
  		context = context || obj;
  
  		for (var i in obj) {
  			if(obj.hasOwnProperty && obj.hasOwnProperty(i)) {
  				var ret = func.call(context, obj[i], i);
  
  				if(!!ret || ret === 0 || ret === '') {
  					return ret;
  				}
  			}
  		}
  
  		return null;
  	},
  
  	/**
  	 * Copies the properties of one object onto another.
  	 * When there is a collision, the later one wins
  	 *
  	 * @return {Object} destination object
  	 */
  	merge: function(objects) {
  		var ret = {};
  		
  		for(var i=0; i<arguments.length; i++) {
  			var o = arguments[i];
  			
  			for(var j in o) {
  				ret[j] = o[j];
  			}
  		}
  		
  		return ret;
  	},
  	
  	/**
  	 * Copies the properties of one or more objects onto the first one
  	 * When there is a collision, the first object wins
  	 */
  	attach: function(object, objects) {
  		for(var i=0; i<arguments.length; i++) {
  			var o = arguments[i];
  			
  			for(var j in o) {
  				if(!(j in object)) {
  					object[j] = o[j];
  				}
  			}
  		}
  		
  		return object;
  	},
  	
  	element: {
  		/**
  		 * Creates a new DOM element
  		 * @param options {Object} A set of key/value pairs for attributes, properties, contents, placement in the DOM etc
  		 * @return The new DOM element
  		 */
  		create: function() {
  			var options;
  
  			if(_.type(arguments[0]) === 'string') {
  				if(_.type(arguments[1]) === 'object') {
  					// Utopia.element.create('div', { ... });
  					options = arguments[1];
  					options.tag = arguments[0];
  				}
  				else {
  					// Utopia.element.create('div', ...);
  					options = {
  						tag: arguments[0]
  					};
  					
  					// Utopia.element.create('div', [contents]);
  					if(_.type(arguments[1]) === 'array') {
  						options.contents = arguments[1];
  					}
  					// Utopia.element.create('div', 'Text contents');
  					else if(_.type(arguments[1]) === 'string' || _.type(arguments[1]) === 'number') {
  						options.contents = ['' + arguments[1]];
  					}
  				}
  			}
  			else {
  				options = arguments[0];
  			}
  			
  			var namespace = options.namespace || '', element;
  			
  			if(namespace) {
  				element = document.createElementNS(namespace, options.tag);
  			}
  			else {
  				element = document.createElement(options.tag);
  			}
  			
  			if (options.className || options.id) {
  				options.properties = options.properties || {};
  				options.properties.className = options.className;
  				options.properties.id = options.id;
  			}
  			
  			// Set properties, attributes and contents
  			_.element.set(element, options);
  			
  			// Place the element in the DOM (inside, before or after an existing element)
  			// This could be a selector
  			if(options.before) {
  				var before = $(options.before);
  				
  				if (before && before.parentNode) {
  					before.parentNode.insertBefore(element, before);
  				}
  			}
  			
  			if (options.after && element.parentNode === null) {
  				var after = $(options.after);
  				
  				if (after && after.parentNode) {
  					after.parentNode.insertBefore(element, after.nextSibling)
  				}
  			}
  			
  			if (options.inside && element.parentNode === null) {
  				$(options.inside).appendChild(element);
  			}
  			
  			return element;
  		},
  		
  		set: function(element, options) {
  			_.element.prop(element, options.properties || options.prop);
  					
  			_.element.attr(element, options.attributes || options.attr);
  			
  			_.element.contents(element, options.contents);
  	
  			return element;
  		},
  		
  		prop: function (element, properties) {
  			if (properties) {
  				for (var prop in properties) {
  					element[prop] = properties[prop];
  				}
  			}
  			
  			return element;
  		},
  		
  		attr: function (element, attributes) {
  			if (attributes) {
  				for (attr in attributes) {
  					element.setAttribute(attr, attributes[attr]);
  				}
  			}
  			
  			return element;
  		},
  		
  		/**
  		 * Sets an element’s contents
  		 * Contents could be: One or multiple (as an array) of the following:
  		 *			- An object literal that will be passed through Utopia.element.create
  		 *			- A string or number, which will become a text node
  		 *			- An existing DOM element
  		 */
  		contents: function (element, contents, where) {
  			if(contents || contents === 0) {
  				if (_.type(contents) !== 'array') {
  					contents = [contents];
  				}
  				
  				var firstChild = element.firstChild;
  				
  				for (var i=0; i<contents.length; i++) {
  					var content = contents[i], child;
  					
  					switch(_.type(content)) {
  						case 'string':
  							if(content === '') {
  								continue;
  							}
  							// fall through
  						case 'number':
  							child = document.createTextNode(content);
  							break;
  						case 'object':
  							child = _.element.create(content);
  							break;
  						default:
  							child = content;
  
  					}
  					
  					if(child) {
  						if (!where || where === 'end') {
  							element.appendChild(child);
  						}
  						else if (where === 'start') {
  							element.insertBefore(child, firstChild);
  						}
  					}
  				}	
  			}
  			
  			return element;
  		}
  	},
  	
  	elements: {
  		// set, attr, prop, contents functions from Utopia.element, but for multiple elements
  	},
  	
  	event: {
  		/**
  		 * Binds one or more events to one or more elements
  		 */
  		bind: function(target, event, callback, traditional) {
  			if(_.type(target) === 'string' || _.type(target) === 'array') {
  				var elements = _.type(target) === 'string'? $$(target) : target;
  				
  				elements.forEach(function(element) {
  					_.event.bind(element, event, callback, traditional);
  				});
  			}
  			else if(_.type(event) === 'string') {
  				if(traditional) {
  					target['on' + event] = callback;
  				}
  				else {
  					target.addEventListener(event, callback, false);
  				}
  			}
  			else if(_.type(event) === 'array') {
  				for (var i=0; i<event.length; i++) {
  					_.event.bind(target, event[i], callback, arguments[2]);
  				}
  			}
  			else {
  				for (var name in event) {
  					_.event.bind(target, name, event[name], arguments[2]);
  				}
  			}
  		},
  		
  		/**
  		 * Fire a custom event
  		 */
  		fire: function(target, type, properties) {
  			if(_.type(target) === 'string' || _.type(target) === 'array') {
  				var elements = _.type(target) === 'string'? $$(target) : target;
  				
  				elements.forEach(function(element) {
  					_.event.fire(element, type, properties);
  				});
  			}
  			else if (document.createEvent) {
  				var evt = document.createEvent("HTMLEvents");
  		
  				evt.initEvent(type, true, true );
  				evt.custom = true;
  		
  				if(properties) {
  					_.attach(evt, properties);
  				}
  		
  				target.dispatchEvent(evt);
  			}
  		}
  	},
  	
  	/**
  	 * Helper for XHR requests
  	 */
  	xhr: function(o) {
  		document.body.setAttribute('data-loading', '');
  		
  		var xhr = new XMLHttpRequest(),
  			method = o.method || 'GET',
  			data = o.data || '';
  		
  		xhr.open(method, o.url + (method === 'GET' && data? '?' + data : ''), true);
  		
  		o.headers = o.headers || {};
  		
  		if(method !== 'GET' && !o.headers['Content-type'] && !o.headers['Content-Type']) {
  			xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
  		}
  		
  		for (var header in o.headers) {
  			xhr.setRequestHeader(header, o.headers[header]);
  		}
  		
  		xhr.onreadystatechange = function(){
  			
  			if(xhr.readyState === 4) {
  				document.body.removeAttribute('data-loading');
  				
  				o.callback(xhr);
  			}
  		};
  		
  		xhr.send(method === 'GET'? null : data);
  	
  		return xhr;
  	},
  	
  	/**
  	 * Lazy loads an external script
  	 */
  	script: function(url, callback, doc) {
  		doc = doc || document;
  		
  		return _.element.create({
  			tag: 'script',
  			properties: {
  				src: url,
  				async: true,
  				onload: callback
  			},
  			inside: doc.documentElement
  		});
  	},
  	
  	/**
  	 * Returns the absolute X, Y offsets for an element
  	 */
  	offset: function(element) {
  	    var left = 0, top = 0, el = element;
  	    
  	    if (el.parentNode) {
  			do {
  				left += el.offsetLeft;
  				top += el.offsetTop;
  			} while ((el = el.offsetParent) && el.nodeType < 9);
  			
  			el = element;
  			
  			do {
  				left -= el.scrollLeft;
  				top -= el.scrollTop;
  			} while ((el = el.parentNode) && !/body/i.test(el.nodeName));
  		}
  	
  	    return {
  			top: top,
  	    	right: innerWidth - left - element.offsetWidth,
  	    	bottom: innerHeight - top - element.offsetHeight,
  	    	left: left,
  	    };
  	}
  };
  
  ['set', 'prop', 'attr', 'contents'].forEach(function(method) {
  	_.elements[method] = function(elements) {
  		elements = _.type(elements) === 'string'? $$(elements) : Array.prototype.slice.call(elements);
  		
  		var args = Array.prototype.slice.call(arguments);
  		args.shift(); // Remove the elements argument
  		
  		elements = elements.map(function(element) {
  			return _.element[method](element, args);
  		});
  		
  		return elements;
  	}
  });
  
  })();
  
  window.$u = window.$u || Utopia;

Download