adding dx-alias

README.md

@@ -0,0 +1,131 @@
+DX-Alias is a utility package for helping to make Dojo and AMD more friendly, with shorter names, more versatile methods, and combined modules.
+
+Acknowledgements
+----------------
+
+Author: Mike Wilcox
+
+Email: mike.wilcox@bettervideo.com
+
+Website: http://bettervideo.com
+
+DX-Alias is freely available under the same dual BSD/AFLv2 license as the Dojo Toolkit.
+
+Installation
+------------
+Download the DX-Alias package, and install it in the same directory as your project.
+
+NOTE
+----
+DX-Alias is currently under development, and this should be considered alpha, or pre-release at best. The code is used, and works, but could change. Tests and better documentation are still forth coming.
+
+Description
+-----------
+DX-Alias is designed to make Dojo 1.7+ easier to use. The dom module, for example,
+loads in a majority of the commonly used dom methods so several modules do not have
+to be included in your AMD define. dojo/on is reworked so that it is more like the
+traditional dojo.connect, including the context argument.
+
+More information about each module (in alphabetical order) below.
+
+dom
+---
+
+The dom module returns a simple function for creating nodes:
+
+```javascript
+define(['dx-alias/dom'], function(dom){
+	dom('div', {css:'myClass', html:'text here'}, parentNode);
+});
+```
+The property names are also shorter, so you can use "css" instead of "className", and "html" instead of "innerHTML".
+
+The remaining methods are attached to the dom function, so they can be accessed like: 
+```javascript
+dom.style(node, prop, value);
+dom.byId('myDiv');
+dom.css(node, className, conditional);
+// etc...
+```
+
+fx
+--
+This module is under development. There is one key method, flyout(), which handles something like a volume control slider "popup" (or flyout), by tracking if the mouse is over or clicking on the original button or the flyout.
+
+has
+---
+Also under development, this will contain has() tests for some common CSS3 and HTML5 needs.
+
+lang
+----
+A small combination of dojo/lang, with a few additional methods. 
+
+log
+---
+Based on the original [consoleFix](http://clubajax.org/javascript-console-fix-v2-now-with-ios/). It has additional functionality that allows you to add logs to each module than can be turned off with a simple bit:
+
+```javascript
+define(['dx-alias/log'], function(logger){
+	var log = logger('MOD', 1);
+	log('do stuff'); // outputs: [MOD] do stuff
+});
+```
+But changing the second argument to something falsey, the log for that module can be turned off: 
+```javascript
+define(['dx-alias/log'], function(logger){
+	var log = logger('MOD', 0);
+	log('do stuff'); // no output
+});
+```
+
+main
+----
+Loads in all modules.
+
+mouse
+-----
+Functionality not in Dojo. This module can be used to track mouse movements and events, and will return a modified even with information, like the x/y from the corner of a node, or the distance the mouse has moved. Think of it as a GUI-less dojo/dnd, that could be used for canvas or other uses. See the code for full details.
+
+on
+--
+In Dojo 1.7, dojo.connect was broken into pieces. dojo/on only attaches to dom nodes or objects that are "Evented". To attach to plain old objects, you are supposed to use dojo/aspect. dx-alias/on recombines dojo/aspect and dojo/on, and adds an argument for context (this). It also uses the pause-able ability to the return handle by default.
+
+dx-alias/on adds a simple event for "scroll" to make it easy to attach to dom scroll events. It has a "once" method for attaching to something and allowing for only one event to fire.
+
+It also adds "multi", used like:
+```javascript
+on.multi(node, {
+	'mousedown':'onMouseDown',
+	'mouseup':this.onMouseUp
+}, this);
+```
+
+shim
+----
+dx-alias/shim is not a module, and returns nothing. It is a shim for browsers to add missing key functionality. Notably:
+Function.bind
+Array.forEach
+Array.some
+Array.indexOf
+Array.isArray
+TODO: remaining Array methods
+
+string
+------
+This module adds dojo.string.trim, but otherwise, the remaining functionality is unique.
+urlToObj
+strToObj
+normalize
+urlEscape
+urlEncode
+trim
+
+topic
+-----
+dx-alias/topic is a different implementation of dojo/topic, but taps into dojo/topic, so either can be used. It begins by adding the context argument (this), and changes publish and subscribe to the more funger friendly pub and sub. It also adds support for a multi subscribe:
+```javascript
+topic.sub.multi({
+	'/on/data':'onData',
+	'/on/hide':this.oHide
+}, this);
+```

alias.profile.js

@@ -0,0 +1,66 @@
+
+
+var profile = (function(){
+
+	// the tag tests...
+	var test = function(filename, mid){
+			return /tests\//.test(mid);
+		},
+
+		copyOnly = function(filename, mid){
+			return 0;
+		},
+
+		ignore = function(filename, mid){
+			var list = {
+				"dx-alias/timer.profile":1,
+				"dx-alias/package.json":1,
+				"dx-alias/README.md":1
+			};
+			var isIgnored = mid in list;
+			//console.log('      isIgnored', isIgnored, mid);
+			return isIgnored;
+		},
+
+		amd = function(filename, mid){
+			var isAMD = !copyOnly(filename, mid) && !ignore(filename, mid) && /\.js$/.test(filename);
+			//console.log(isAMD ? 'is AMD' :  'not AMD:', mid)
+			return isAMD;
+		};
+
+	return {
+
+		newlineFilter: function(s){
+		   // convert all DOS-style newlines to Unix-style newlines
+		   return s.replace(/\r\n/g, "\n").replace(/\n\r/g, "\n");
+		},
+
+		resourceTags:{
+			ignore:ignore,
+			test:test,
+			copyOnly:copyOnly,
+			amd:amd
+		},
+
+		// relative to this file
+		basePath:".",
+
+		// relative to basePath
+		releaseDir:"./alias-deploy",
+
+		packages:[
+			{
+				name:"dx-alias",
+				location:"."
+			}
+		],
+
+		layers:{
+			"dx-alias/layer":{
+				include:[
+				]
+			}
+		}
+	};
+
+})();

dom.js

@@ -0,0 +1,195 @@
+define([
+	"dojo/dom",
+	"dojo/dom-construct",
+	"dojo/dom-geometry",
+	"dojo/dom-class",
+	"dojo/dom-style",
+	"dojo/dom-prop",
+	"dojo/on"
+], function(domDom, domCon, domGeom, domClass, domStyle, domProp, on){
+
+	var
+		dom = function(tag, atts, node, place){
+			var n, nm, attCss, attOn, attHtml, attStyle, attValue, attSelectable;
+
+			if(atts){
+				if(typeof(atts)=="string"){
+					atts = {className:atts};
+
+				}else{
+					if(atts.on){
+						attOn = atts.on;
+						delete atts.on;
+					}
+					for(nm in atts){
+						if(nm == "on"){
+							attOn = atts[nm];
+							delete atts[nm];
+						}else if(nm == "css"){
+							atts.className = atts[nm];
+							delete atts[nm];
+						}else if(nm == "html"){
+							atts.innerHTML = atts[nm];
+							delete atts[nm];
+						}else if(nm == "style"){
+							attStyle = atts[nm];
+							delete atts[nm];
+						}else if(nm == "value"){
+							attValue = atts[nm];
+							delete atts[nm];
+						}else if(nm == "selectable"){
+							attSelectable = atts[nm];
+							delete atts[nm];
+						}
+					}
+				}
+			}
+
+			n = domCon.create(tag, atts, node, place);
+			if(attStyle) domStyle.set(n, attStyle);
+			if(attSelectable) domDom.setSelectable(n, attSelectable);
+			if(attValue) n.value = attValue; // need this?
+			if(attOn){
+				for(nm in attOn){
+					on(n, nm, attOn[nm]);
+				}
+			}
+
+			return n;
+		};
+
+	dom.center = function(){
+		//
+		// experimental
+		// - and TODO!
+	};
+
+	dom.fit = function(node){
+		//
+		// experimental
+		//
+		var a1 = arguments[1], a2 = arguments[2], w1, h1, w2, h2, m, nodebox = dom.box(node), w = nodebox.w, h = nodebox.h;
+		if(typeof a1 ==="object" && a1.tagName){
+			var box = dom.box(a1);
+			w1 = box.w;
+			h1 = box.h;
+		}else{
+			w1 = a1;
+			h1 = a2;
+		}
+
+		var aspect = w1/w * h;
+		var block = dom.style(this.domNode, 'display') == 'block';
+
+		if(aspect > h1){
+			h2 = h1;
+			w2 = w * (h / h1);
+			if(block){
+				m = (-h2/2)+'px 0 0 '+(-w2/2)+'px';
+			}else{
+				m = '0px auto';
+			}
+			console.log('height', h, h1, h2, ' w', w);
+
+		}else if(aspect < h1){
+			console.log('width');
+			w2 = w1;
+			h2 = h * (w1 / w);
+			if(block){
+				m = (-h2/2)+'px 0 0 '+(-w2/2)+'px';
+			}else{
+				m = (h1-h2)+'px auto';
+			}
+		}else{
+			console.log('SAME');
+			w2 = w1; h2 = h1;
+			m = '0';
+		}
+
+		console.log(dom.style(node, {
+			width:w2+'px',
+			height:h2+'px',
+			margin:m
+		}));
+
+	};
+
+	dom.byTag = function(tag, node, returnFirstOnly){
+		if(!tag) return null;
+		if(node === true){
+			returnFirstOnly = true;
+			node = document.body;
+		}else{
+			node = dom.byId(node);
+		}
+		var list = node.getElementsByTagName(tag);
+		if(!list || !list.length) return [];
+		if(returnFirstOnly) return list[0];
+		return Array.prototype.slice.call(list);
+		return list;
+	};
+
+	dom.show = function(node, opt){
+		if(node && node instanceof Array){
+			node.forEach(function(n){
+				dom.show(n, opt);
+			}, this);
+			return;
+		}
+		if(opt===false){
+			dom.hide(node); // allows for toggling
+			return;
+		}
+		var display = typeof opt == 'string' ? opt : ''; // allows to reset to proper style, like inline-block
+		node = dom.byId(node);
+		node.style.display = display;
+	};
+
+	dom.hide = function(node){
+		if(node && node instanceof Array){
+			node.forEach(function(n){
+				dom.hide(n);
+			}, this);
+			return;
+		}
+		node = dom.byId(node);
+		node.style.display = 'none';
+	};
+
+	dom.box = function(node, options){
+		// TODO: allow options to ask for margin, padding, border
+		// TODO: optionally ask for position
+		// See if there is a way to cache computedStyle for perf
+		return domGeom.getContentBox(node);
+	};
+
+	dom.pos = function(node, includeScroll){
+		return domGeom.position(node, includeScroll);
+	};
+
+	dom.css = function(node, className, conditional){
+		if(conditional === false || conditional === 0) return domClass.remove(node, className);
+		return domClass.add(node, className);
+	};
+
+	dom.css.remove = domClass.remove;
+	dom.css.replace = domClass.replace;
+	dom.css.toggle = domClass.toggle;
+
+	dom.style = function(node, prop, value){
+		if(value === undefined && typeof prop === 'string') return domStyle.get(node, prop);
+		if(value === undefined) return domStyle.set(node, prop);
+		return domStyle.set(node, prop, value);
+	};
+
+	dom.place = domCon.place;
+	dom.selectable = domDom.setSelectable;
+	dom.byId = domDom.byId; // resolve null
+	dom.destroy = domCon.destroy;
+	dom.set = domProp.set;
+	dom.get = domProp.get;
+
+
+	return dom;
+
+});