transit 0.0.1 → 0.0.2

data/app/assets/javascripts/transit/core.js

@@ -0,0 +1,171 @@
+/**
+ * transit.js
+ * Copyright (c) 2011 by Brent Kirby / kurb media llc
+ * 
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the 'Software'), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ * 
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ * 
+ * THE SOFTWARE IS PROVIDED 'AS IS', WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */
+
+//= require libs/underscore
+//= require libs/backbone
+//= require_self
+//= require ./lib/base64
+
+(function(){
+	
+	var root 	= this,
+		transit = root.transit = {};
+	
+	transit.VERSION 	= '0.0.1';
+	transit.config  	= {};
+	
+	//
+	// Add configuration data
+	//
+	transit.configure = function( name, conf ){
+		var old_conf = this.config[name] || {};
+		this.config[name] = jQuery.extend(this.config[name], conf);
+	};
+	
+	//
+	// Manage editable / viewable contexts.
+	//
+	transit.context = new function(){
+		var cache = [],
+			self  = this;
+		
+		jQuery.extend(self , {
+			// Add a new context			
+			add: function( name, api ){
+				this[ name ] = api;
+				cache.push(name);
+				return api;
+			},
+			
+			exists: function( name ){
+				return _.contains( cache, name );
+			},
+			
+			// Parse the serialize json data within the 
+			// element's data-context-options attribute.
+			data: function( dom, enc ){
+				var element = jQuery(dom), 
+					cdata   = element.data('context-attributes');
+					
+				if( enc == true ) cdata = transit.util.base64.decode( cdata );
+				return (new Function("return " + cdata))();
+			}
+		});
+		
+	};
+	
+	//
+	// Shortcut method to jQuery.extend where
+	// options are to be updated not overwritten
+	//
+	transit.merge = function( oldconf, newconf ){
+		return jQuery.extend( {}, oldconf, newconf );
+	};
+	
+	//
+	// The ui api includes various utility functions
+	// and functionality like form validation etc.
+	//
+	transit.ui = {};
+	
+	//
+	// Wrapper / helper for underscore's template method.
+	// It allows caching of templates, and processing/reprocessing.
+	//
+	transit.template = (function(){
+		
+		var cache  = {},
+			parsed = {},
+			tpl    = function(){
+			
+			// Store a parsed template for later use
+			this.store = function( name, data ){
+				parsed[name] = this.parse( cache[name], data );
+			};
+			
+			// Load a previously parsed template
+			this.load = function( name ){
+				if( parsed[name] ) return parsed[name];
+				else return false; 
+			};
+			
+			// Load a cached, un-rendered template.
+			this.fetch = function( name ){
+				if( cache[name] ) return cache[name];
+				else return false;
+			}
+			
+			// Store a html template in the cache 
+			// to be parsed later.
+			// Returns template object for immediate parsing
+			//
+			this.add = function( name, html ){
+				cache[name] = html;
+				return this;
+			};
+			
+			// Parse a cached template with supplied data
+			this.parse = function( name, data ){
+				return _.template( cache[name], data );
+			};
+			
+			// Render a template with data immediately, without
+			// having previously saved a template.
+			this.render = function( html, data ){
+				return _.template( html, data );
+			};
+			
+		};
+		
+		return new tpl();
+		
+	})();
+	
+	transit.util = {};
+
+}).call(this);
+
+(function( $, undefined){
+	
+	jQuery.fn.transit = function( method, options ){
+		
+		var exist = jQuery(this).data('transit.' + method );
+		
+		if( exist ){
+			if( jQuery.type( options ) == 'string' && jQuery.isFunction( exist[ options ] )){
+				return exist[ options ]();
+			}else return jQuery(this).data('transit.' + method );
+		}	
+		
+		if( transit.context.exists( method ) ) {			
+			jQuery.each(this, function(i, element) {
+				var instance = new transit.context[ method ]( jQuery(element), options );
+				jQuery(element).data('transit.' + method, instance);
+			});
+						
+			return this;
+		} 
+	};
+	
+	
+})(jQuery);

data/app/assets/javascripts/transit/frontend.js

@@ -0,0 +1,3 @@
+//= require transit
+//= require transit/lib/base64
+//= require_tree ./contexts

data/app/assets/javascripts/transit/lib/base64.js

@@ -0,0 +1,120 @@
+(function(transit){
+ 
+	var key = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=";
+
+	transit.util = transit.util || {};	
+	transit.util.base64 = {};
+
+	transit.util.base64.encode = function( input ){
+		var output = "",
+			chr1, chr2, chr3,
+			enc1, enc2, enc3, enc4, 
+			i = 0;
+			
+		input = utf8_encode( input );
+		
+		while (i < input.length) {
+			chr1 = input.charCodeAt(i++);
+			chr2 = input.charCodeAt(i++);
+			chr3 = input.charCodeAt(i++);
+			enc1 = chr1 >> 2;
+			enc2 = ((chr1 & 3) << 4) | (chr2 >> 4);
+			enc3 = ((chr2 & 15) << 2) | (chr3 >> 6);
+			enc4 = chr3 & 63;
+ 
+			if( isNaN( chr2 ) ) enc3 = enc4 = 64;
+			else if( isNaN( chr3 ) ) enc4 = 64;
+ 
+			output = output +
+			key.charAt(enc1) + 
+			key.charAt(enc2) +
+			key.charAt(enc3) + 
+			key.charAt(enc4);
+ 
+		}
+		
+		function utf8_encode( string ){
+			var utftext = "", n, c;
+			
+			string = string.replace(/\r\n/g,"\n");
+			
+			for ( n = 0; n < string.length; n++ ){
+				c = string.charCodeAt(n);
+				
+				if ( c < 128 ) utftext += String.fromCharCode(c);
+				else if( (c > 127) && (c < 2048) ){
+					utftext += String.fromCharCode((c >> 6) | 192);
+					utftext += String.fromCharCode((c & 63) | 128);
+				}else {
+					utftext += String.fromCharCode((c >> 12) | 224);
+					utftext += String.fromCharCode(((c >> 6) & 63) | 128);
+					utftext += String.fromCharCode((c & 63) | 128);
+				}
+			}
+			return utftext;
+		}
+		
+		return output;
+		
+	};
+	
+	transit.util.base64.decode = function( input ){
+		var output = "",
+			chr1, chr2, chr3,
+			enc1, enc2, enc3, enc4, 
+			i = 0;
+		
+		input = input.replace( /[^A-Za-z0-9\+\/\=]/g, "" );
+		
+		while( i < input.length ){
+ 			enc1 = key.indexOf(input.charAt(i++));
+			enc2 = key.indexOf(input.charAt(i++));
+			enc3 = key.indexOf(input.charAt(i++));
+			enc4 = key.indexOf(input.charAt(i++));
+ 
+			chr1 = (enc1 << 2) | (enc2 >> 4);
+			chr2 = ((enc2 & 15) << 4) | (enc3 >> 2);
+			chr3 = ((enc3 & 3) << 6) | enc4;
+ 
+			output = output + String.fromCharCode(chr1);
+ 
+			if( enc3 != 64 ) output = output + String.fromCharCode(chr2);
+			if( enc4 != 64 ) output = output + String.fromCharCode(chr3);
+ 
+		}
+		
+		output = utf8_decode( output );
+		
+		function utf8_decode( textstr ) {
+			var string = "",
+				i = 0, 
+				c = c1 = c2 = 0;
+
+			while( i < textstr.length ){
+				c = textstr.charCodeAt(i);
+
+				if( c < 128 ) {
+					string += String.fromCharCode(c);
+					i++;
+					
+				}else if( (c > 191) && (c < 224) ) {
+					c2 = textstr.charCodeAt(i+1);
+					string += String.fromCharCode(((c & 31) << 6) | (c2 & 63));
+					i += 2;
+					
+				}else {
+					c2 = textstr.charCodeAt(i+1);
+					c3 = textstr.charCodeAt(i+2);
+					string += String.fromCharCode(((c & 15) << 12) | ((c2 & 63) << 6) | (c3 & 63));
+					i += 3;
+				}
+			}
+
+			return string;
+		}
+		
+		return output;
+		
+	};
+
+})(transit);

data/app/assets/javascripts/transit/lib/editor.js

@@ -0,0 +1,177 @@
+//= require transit/views/wym_iframe
+//= require transit/views/wym_box
+//= require transit/views/editor_toolbar
+
+(function(transit){
+	
+	var editor, editor_toolbar, proper, active_editor, richtext_buttons; 
+	
+	editor = function( element, options ){
+		var self = this,
+			tag  = jQuery(element)[0].tagName;
+		
+		if( (/[h1|h2|h3|h4|h5|h6]/i).test(tag) ) return new editor.inline( jQuery(element), options );
+		else return new editor.richtext( jQuery(element), options );
+		
+		return self;
+	};
+	
+ 	proper = new Proper();
+	richtext_buttons = {
+		bold: { action:'Bold', title:'Bold' },
+		italic: { action:'Italic', title:'Italic' },
+		underline: { action:'Underline', title:'Underline' },
+		undo: { action:'Undo', title:'Undo' },
+		redo: { action:'Redo', title:'Redo' },
+		ordered_list: { action:'InsertOrderedList', title:'Insert Ordered List' },
+		unordered_list: { action:'InsertUnorderedList', title:'Insert Unordered List' },
+		insert_link: { title:'Insert Link' },
+		unlink: { title:'Unlink', action:'Unlink' },
+		insert_image: { title:'Insert Image' }
+	};
+	
+	editor_toolbar = function(){
+		var content     = jQuery(transit.template.parse('transit/views/editor_toolbar', { buttons: richtext_buttons })),
+			initialized = false,
+			self 		= this,
+			widget;
+			
+		this.init = function( parent ){
+			if( initialized ) return true;
+			content.find('li a').bind('click', this.exec);
+			content.insertBefore( parent );
+			initialized = true;
+			return true;
+		};
+		
+		this.exec = function( event ){
+			var btn = jQuery(this), button;
+			event.preventDefault();
+			if( event.isPropagationStopped() ) return true;
+			event.stopPropagation();
+			
+			button = richtext_buttons[ btn.attr('rel') ];
+
+			if( button.action ) instance.exec( button.action );
+			else instance[ btn.attr('rel') ].call();
+			return true;
+			
+		};
+	};
+	
+	
+	editor.richtext = function( element, options ){
+		
+		var config = transit.merge(transit.config['richtext'], options),
+			editor, initialized = false,
+			self = this
+			toolbar;
+			
+		config.postInit   = setup_instance;
+		config.boxHtml    = transit.template.parse('transit/views/wym_box', { iframe: WYMeditor.IFRAME });
+		config.iframeHtml = transit.template.parse('transit/views/wym_iframe', { frame_index: WYMeditor.INDEX });
+		
+		jQuery(element)
+			.wymeditor(config)
+			.bind( "transit:update_richtext", update_callback );
+			
+		editor = jQuery.wymeditors(jQuery(element).data('wym_index'));
+		
+		this.exec = function( cmd ){
+			editor._exec( cmd );
+			return true;
+		};
+		
+		this.save = function(){
+			editor.update();
+		};
+		
+		this.insert_link = function( options ){
+			var href  = prompt('Enter the URL to link to:'),
+				stamp = editor.uniqueStamp(),
+				link;
+				
+			editor._exec(WYMeditor.CREATE_LINK, stamp);
+			link = jQuery("a[href=" + stamp + "]", editor._doc.body);
+			link.attr('href', href);
+		};
+		
+		this.insert_image = function( options ){
+			
+		};
+		
+		function setup_instance( wym ){
+			if( initialized ) return false;
+			
+			var parentbody  = jQuery('body'),
+				editorbody  = jQuery(wym._doc).find('body'),
+				docheight   = jQuery(wym._doc).height(),				
+				iframe	    = jQuery(wym._iframe),
+				box         = jQuery(wym._box);
+				
+			editordoc = jQuery(wym._doc);
+
+			editorbody.css({
+				'font-family': parentbody.css('font-family'),
+				'font-size': parentbody.css('font-size'),
+				'color': parentbody.css('color'),
+				'line-height': parentbody.css("line-height")
+			});
+			
+			if( docheight > 400 ) docheight = 400; 
+			
+			box.css({ height:docheight });
+			iframe.css({ height:'100%' });
+			
+			editordoc.find('body')
+				.bind('focus', function(e){
+					e.stopPropagation();
+					active_editor = self;
+				})
+				.bind('blur', function(e){
+					editor.update();
+				});
+							
+			if( wym._index == 0 ) active_editor = self;
+			
+			toolbar = new editor_toolbar();
+			toolbar.init( jQuery(wym._box) );
+			
+			initialized = true;
+			return true;
+		}
+		
+		function update_callback( event, method, options ){
+			if( active_editor != self || event.isPropagationStopped() ) return true;
+			self[ method ].call( options );
+		}
+		
+	};
+	
+	//
+	// The inline editor handles editing content within headings.
+	// Add the class .transit-editable to the heading, and set its rel attribute
+	// to match the form field that is to be updated on change.
+	//
+	editor.inline = function( element, options ){
+		
+		var target = jQuery('#'+ element.attr('rel')),
+			conf   = transit.merge({ markup: false, multiline: false }, options);
+		
+		element
+			.bind('click', function( event ){
+				event.preventDefault();
+				proper.activate( element, conf );
+			})
+			.bind('blur', function( event ){
+				if( target.length > 0 ) target.val( proper.content() );
+			});
+			
+			if( target.val() == "" ) target.val( element.text() );
+			
+	};
+	
+	transit.context.add('editor', editor);
+		
+	
+})(transit);