cytoplasm 0.0.1

data/app/assets/javascripts/cytoplasm/cytoTable.js.erb

@@ -0,0 +1,48 @@
+// CytoTable v0.1
+// By MacKinley Smith
+(function($){
+	var defaults = {
+		widget:{
+			table:{
+				cell:{
+					padding:0,
+					spacing:0
+				}
+			}
+		},
+		events:{
+			create:function(cy){},
+			change:function(cy,event){},
+			destroy:function(cy){}
+		}
+	};
+	
+	var methods = {
+		init:function(options){
+			return this.each(function(){
+				var $this = $(this);
+				var settings = $.extend(true,{},defaults,options);
+				
+				// Setup table
+				$this.attr({cellpadding:0,cellspacing:0});
+				
+				$this.data('cytoTable',settings);
+			});
+		},
+		resize:function(){
+			
+		},
+		destroy:function(){
+			
+		}
+	};
+	
+	$.fn.cytoTable=function(method){
+		if (methods[method]) return methods[method].apply(this,Array.prototype.slice.call(arguments,1));
+		else if (typeof method == 'object' || !method) return methods.init.apply(this,arguments);
+		else $.error('Method ' + method + ' does not exist on $.cytoTable!');
+	};
+	
+	$(window).resize(function(){$('.cytoTable').cytoTable('resize');});
+	$.Cytoplasm("ready",function(){$('.cytoTable').cytoTable();});
+})(jQuery);

data/app/assets/javascripts/cytoplasm/cytoUpload.js.erb

@@ -0,0 +1,200 @@
+// CytoUpload v2.0
+// By MacKinley Smith
+(function($){
+	var defaults = {
+		widget:{
+			button:{
+				placeholder:"Click to select a file for upload…",
+				css:{
+					"text-align":"left",
+					width:"100%",
+					height:30
+				},
+				element:null,
+				nameReadout:{
+					css:{},
+					element:null
+				},
+				sizeReadout:{
+					css:{
+						font:'<%=Cytoplasm.vars("fonts.sizes.small")+" "+Cytoplasm.vars("fonts.faces.medium")%>',
+						float:'right'
+					},
+					element:null,
+					precision:2,
+					units:['b','Kb','Mb','Gb','Tb']
+				},
+				active:false
+			},
+			input:{
+				css:{display:'none'},
+				element:null
+			},
+			wrapper:{
+				css:{},
+				element:null
+			}
+		},
+		events:{
+			create:function(){},
+			change:function(file){},
+			destroy:function(){}
+		},
+		filters:{
+			name:false,
+			type:false,
+			size:false
+		},
+		errors:{
+			name:"The file you have chosen is not named correctly.",
+			size:"The file you have chosen is larger that the allowed size.",
+			type:"The file you have chosen is not the correct type."
+		}
+	};
+	var methods = {
+		init:function(options,reinit){
+			if (reinit==null) reinit = false;
+			return this.each(function(){
+				var $this = $(this);
+				if ($this.data("cytoUpload")!=null && $this.hasClass("cytoUpload")) return console.warn("You cannot reinstatiate cytoUpload before calling the destroy method.\nProtip: Use the refresh method to reinstantiate in one move.");
+				
+				// Instantiate settings
+				var settings = $.extend(true,{},defaults,options);
+				$this.data('cytoUpload',settings);
+				
+				// Generate widget
+				settings.widget.wrapper.element = $this.wrap("<div></div>").parent().addClass('cytoUpload-wrapper').css(settings.widget.wrapper.css);
+				settings.widget.input.element = $this.addClass('cytoUpload').css(settings.widget.input.css);
+				settings.widget.button.element = $('<button />').addClass('cytoButton cytoUpload-button').css(settings.widget.button.css).appendTo(settings.widget.wrapper.element)
+				settings.widget.button.nameReadout.element = $('<span />').addClass('cytoUpload-nameReadout').css(settings.widget.button.nameReadout.css).html(settings.widget.button.placeholder).appendTo(settings.widget.button.element);
+				settings.widget.button.sizeReadout.element = $('<span />').addClass('cytoUpload-sizeReadout').css(settings.widget.button.sizeReadout.css).appendTo(settings.widget.button.element);
+				
+				// Bindings
+				settings.widget.button.element.bind('click.cytoUpload',function(e){
+					e.preventDefault();
+					$this.click();
+				});
+				$this.bind('change.cytoUpload',function(){
+					var file = this.files[0];
+					methods.activate.apply($this,[file]);
+					var size = file.size;
+					
+					for (u=0;size>=1024;u++) size/=1024;
+					settings.widget.button.element.html(file.name).append($('<span />').css(settings.widget.button.sizeReadout.css).html(size.toFixed(2)+" "+settings.widget.button.sizeReadout.units[u])).addClass('active');
+					settings.events.change.apply($this,[file]);
+				});
+				
+				// Store data in data-cytoUpload
+				$this.data('cytoUpload',settings);
+				
+				// Attempt to activate via JSON from data-file attribute
+				if ($this.data('file')!=null) try {
+					var file = $.parseJSON($this.data('file'));
+					methods.activate.apply($this,[file]);
+				} catch (e) {console.warn("The file parameter you passed did not contain valid JSON and therefore it has been ignored.");}
+				
+				settings.events.create.apply($this);
+			});
+		},
+		activate:function(file){
+			if (file==null || typeof file!="object" || typeof file.name!="string" || typeof file.size!="number" || typeof file.type!="string") return $.error("$.cytoUpload('activate') requires one parameter of type File Object ({name:(string containing filename),size:(integer containing filesize in bytes),type:(string containing a MIME type)}.");
+			return this.each(function(){
+				var $this = $(this);
+				var settings = $this.data('cytoUpload');
+				if (!$this.hasClass('cytoUpload') || settings==null) return console.warn("You must instanciate $.cytoUpload before you call the activate method!");
+				
+				// Run filters over the received data
+				var error;
+				if (typeof settings.filters.name == "string" && file.name != settings.filters.name) error = settings.errors.name;
+				if ((typeof settings.filters.type == "string" && file.type != settings.filters.type) || (typeof settings.filters.type=="object" && $.inArray(file.type,settings.filters.type)==-1)) error = settings.errors.type;
+				if (settings.filters.size && size > settings.filters.size) error = settings.errors.size;
+				if (error!=null) {
+					$.cytoAjaxResponse(error,"error");
+					return;
+				}
+				
+				// Calculate size
+				var size = file.size;
+				for (u=0;size>=1024;u++) size/=1024;
+				size = size.toFixed(settings.widget.button.sizeReadout.precision)+" "+settings.widget.button.sizeReadout.units[u];
+				
+				// Apply cosmetic changes
+				settings.widget.button.element.addClass('active');
+				settings.widget.button.nameReadout.element.html(file.name);
+				settings.widget.button.sizeReadout.element.html(size);
+			});
+		},
+		destroy:function(){
+			return this.each(function(){
+				var $this = $(this);
+				var settings = $this.data('cytoUpload');
+				if (!$this.hasClass('cytoUpload') || settings==null) return console.warn("You must instanciate $.cytoUpload before you call the destroy method!");
+				
+				$this.removeClass('cytoUpload').unbind('.cytoUpload').data('cytoUpload',null).siblings('*').remove().end().unwrap().show();
+			});
+		},
+		refresh:function(){
+			return this.each(function(){
+				var $this = $(this);
+				var settings = $this.data('cytoUpload');
+				if (!$this.hasClass('cytoUpload') || settings==null) return console.warn("You must instanciate $.cytoUpload before you call the refresh method!");
+				
+				methods.destroy.apply($this);
+				methods.init.apply($this,[settings,true]);
+				$this.trigger('change.cytoUpload');
+			});
+		},
+		error:function(message){
+			return this.each(function(){
+				var $this = $(this);
+				var settings = $this.data('cytoUpload');
+				if (!$this.hasClass('cytoUpload') || settings==null) return console.warn("You must instanciate $.cytoUpload before you call the error method!");
+				
+				settings.widget.errorMessage.element.html(((typeof message == "string")?message:"An error occurred, please try again.")).show(settings.widget.errorMessage.animationTime);
+				settings.widget.button.element.removeClass('active');
+				methods.refresh.apply($this);
+			});
+		},
+		resize:function(){
+			return this.each(function(){
+				var $this = $(this);
+				var settings = $this.data('cytoUpload');
+				if (!$this.hasClass('cytoUpload') || settings==null) return console.warn("You must instanciate $.cytoUpload before you call the resize method!");
+				
+				var w = settings.widget.wrapper.element.width(0);
+				setTimeout(function(){
+					w.width("100%").width(w.width()-2);
+				},1);
+			});
+		},
+		options:function(newOptions){
+			if (newOptions!=null) {
+				return this.each(function(){
+					var $this = $(this);
+					var settings = $this.data('cytoUpload');
+					if (!$this.hasClass("cytoUpload") || settings==null) return console.warn("You must instanciate $.cytoUpload before you call the options method!");
+					$this.data('cytoUpload',$.extend(true,{},settings,newOptions));
+					methods.refresh.apply($this);
+				});
+			} else {
+				var returnVal;
+				this.each(function(){
+					var $this = $(this);
+					var settings = $this.data('cytoUpload');
+					if (!$this.hasClass("cytoUpload") || settings==null) return console.warn("You must instanciate $.cytoUpload before you call the options method!");
+					returnVal = settings;
+				});
+				return returnVal;
+			}
+		}
+	};
+	
+	$.fn.cytoUpload = function(method){
+		if (methods[method]) return methods[method].apply(this,Array.prototype.slice.call(arguments,1));
+		else if (typeof method == 'object' || !method) return methods.init.apply(this,arguments);
+		else $.error('Method '+method+' does not exist on jQuery.cytoUpload!');
+	};
+	
+	$(window).resize(function(){$('.cytoUpload').cytoUpload('resize');});
+	$.Cytoplasm("ready",function(){$('.cytoUpload').cytoUpload();});
+})(jQuery);

data/app/assets/javascripts/cytoplasm/cytoplasm.js.erb

@@ -0,0 +1,220 @@
+// CytoPlasm jQuery Setup v0.1
+// By MacKinley Smith
+
+// Initialize global JS variables
+var Cytoplasm;
+
+(function($){
+	// Ensure that jQuery and jQuery UI get loaded
+	$.each(["/assets/jquery.js","/assets/jquery-ui.js"],function(i,script){if (!$('script[src="'+script+'"], script[src="'+script+'?body=1"]').is('*')) $('head').append("<script type='text/javascript' src='"+script+"'></script>");});
+	
+	var fixInputs = function(){$('.cytoField').width("100%").each(function(){$(this).width($(this).width()-16);});};
+	$(window).resize(fixInputs);
+	$(document).ready(fixInputs);
+	
+	$(document).ready(function(){
+		// Setup header
+		var header = $("header");
+		header.find('h1').click(function(){window.location = "<%=((defined? root_url) ? root_url : "/")%>";});
+		
+		// Setup callback messages
+		$.each(["success","sending","error"],function(i,v){
+			var $this = $('#'+v+'_message');
+			if (!$this.is('*')) {
+				$this = $('<p />').addClass('callback_message').attr("id",v+"_message");
+				if (header.children(':first-child').is('h1')) $this.insertAfter(header.children(':first-child'));
+				else $this.prependTo(header);
+				$this.hide();
+			}
+		});
+	});
+})(jQuery);
+
+// Cytoplasm plugin
+(function($){
+	
+	var defaults = {
+		
+	};
+	var conf = {};
+	var vars = {};
+	var ready = false;
+	
+	var reverseGradient = function(orig){
+		if (typeof orig != "string") return console.warn("Cytoplasm.reverseGradient only accepts string arguments!");
+		// Return untouched if not gradient
+		if (orig.indexOf("gradient")==-1) return orig;
+		// Get direction
+		var dir = orig.split("(")[1].split(",")[0];
+		// Reverse direction
+		var newdir = dir;
+		if (dir.indexOf("top")>-1) newdir = newdir.replace("top","bottom");
+		else if (dir.indexOf("bottom")>-1) newdir = newdir.replace("bottom","top");
+		if (dir.indexOf("left")>-1) newdir = newdir.replace("left","right");
+		else if (dir.indexOf("right")>-1) newdir = newdir.replace("right","left");
+		return orig.replace(dir,newdir)
+	};
+	var compileStyles = function(element,styles){
+		output = "";
+		output += element+" { ";
+		$.each(styles,function(prop,value){output += (typeof value == "object") ? compileStyles(prop,value) : prop+" : "+value+"; ";});
+		output += " } ";
+		return output;
+	};
+	
+	var methods = {
+		init:function(options){
+			var settings = $.extend(true,{},defaults,options);
+			
+			// Fetch latest settings via AJAX
+			$.cytoAjax("/cytoplasm/settings/fetch",{},function(data){
+				conf = data.conf;
+				vars = data.vars;
+				methods.setStyles.apply(this);
+				$('body').data('cytoplasm',settings);
+				ready = true;
+			});
+		},
+		setStyles:function(){
+			// Remove existing cytoplasm styles
+			if ($('#cytoplasm_dynamic_styles').is("*")) $('#cytoplasm_dynamic_styles').remove();
+			
+			// Set variables
+			var boldweight = (vars.fonts.faces.bold==vars.fonts.faces.regular)?"bold":"normal";
+			var lightweight = (vars.fonts.faces.light==vars.fonts.faces.regular)?"lighter":"normal";
+			var styletag = "";
+			var styles = {
+				body:{
+					background:vars.colors.global.background,
+					font:vars.fonts.sizes.normal+" "+vars.fonts.faces.regular,
+					color:vars.colors.global.text
+				},
+				'::selection':{
+					background:vars.colors.global.accent,
+					color:"contrast("+vars.colors.global.accent+",black,white)"
+				},
+				'::-moz-selection':{
+					background:vars.colors.global.accent,
+					color:"contrast("+vars.colors.global.accent+",black,white)"
+				},
+				a:{
+					"font-family":vars.fonts.faces.light,
+					"&:hover":{color:vars.colors.global.accent}
+				},
+				'h1,h3,h5,b,strong':{
+					"font-family":vars.fonts.faces.bold,
+					"font-weight":boldweight
+				},
+				'h2,h4,h6,table.cytoTable,.cytoButton':{
+					"font-family":vars.fonts.faces.light,
+					"font-weight":lightweight
+				},
+				header:{
+					'#logo':{
+						position:vars.layout.header.logo.position,
+						top:vars.layout.header.logo.y+10
+					},
+					h1:{
+						color:"contrast("+vars.colors.global.background+",black,white)"
+					}
+				},
+				'table.cytoTable':{
+					background:vars.colors.plugins.cytoTable.background,
+					td:{
+						border:vars.colors.plugins.cytoTable.border,
+						"&.labelcell":{"font-size":vars.fonts.sizes.small}
+					}
+				},
+				'input.cytoField':{"font-family":vars.fonts.faces.regular},
+				'.cytoButton':{
+					border:vars.colors.plugins.cytoButton.border,
+					color:vars.colors.plugins.cytoButton.text,
+					"&:not(.active),&:not(:active)":{background:vars.colors.plugins.cytoButton.background},
+					"&.active,&:active":{background:reverseGradient(vars.colors.plugins.cytoButton.background)}
+				}
+			};
+			
+			// Heading sizes
+			$.each([1,2,3,4,5,6],function(i,num){$('h'+num.toString()).css("font-size",parseInt(vars.fonts.sizes.huge) - (parseInt(vars.fonts.sizes.heading_factor)*i));});
+			// Logo positioning
+			if (vars.layout.header.logo.align == "center") styles.header["#logo"].left = (($(window).width()-$('header #logo').width())/2) + vars.layout.header.logo.x;
+			else styles.header["#logo"][vars.layout.header.logo.align] = vars.layout.header.logo.x+10;
+			
+			// Compile the styles for HTML and add to <head>
+			$.each(styles,function(e,s){styletag += compileStyles(e,s);});
+			var parser = new(less.Parser)({});
+			parser.parse(styletag,function(e,tree){$("<style type='text/css' rel='stylesheet' media='screen' id='cytoplasm_dynamic_styles'>"+tree.toCSS({compress:true})+"</style>").appendTo("head");});
+		},
+		conf:function(which,value){
+			var returnvar;
+			if (which==null) return conf;
+			if (typeof which != "string") return console.warn("Incorrect argument type passed to $.Cytoplasm(\"conf\")!");
+			if (which.indexOf(".")>-1) {
+				returnvar = conf;
+				var levels = [];
+				$.each(which.split("."),function(i,level){
+					levels.push(level);
+					if (returnvar[level]!=null) returnvar = returnvar[level];
+				});
+			} else returnvar = conf[which];
+			if (returnvar==null) return console.warn("Failed to find Cytoplasm config variable "+which+"!");
+			if (value==null) return returnvar;
+			else {
+				if (levels==null || levels==[]) return conf[which] = value;
+				var exp = "conf";
+				$.each(levels,function(i,level){exp += "["+level.toString()+"]"});
+				exp += " = "+value.toString();
+				return eval(exp);
+			}
+		},
+		vars:function(which,value){
+			var returnvar;
+			if (which==null) return vars;
+			if (typeof which != "string") return console.warn("Incorrect argument type passed to $.Cytoplasm(\"vars\")!");
+			if (which.indexOf(".")>-1) {
+				returnvar = vars;
+				var levels = [];
+				$.each(which.split("."),function(i,level){
+					levels.push(level);
+					if (returnvar[level]!=null) returnvar = returnvar[level];
+				});
+			} else returnvar = vars[which];
+			if (returnvar==null) return console.warn("Failed to find Cytoplasm variable "+which+"!");
+			if (value==null) {
+				return returnvar;
+			} else {
+				if (levels==null || levels==[]) return vars[which] = value;
+				var exp = "vars";
+				$.each(levels,function(i,level){exp += "["+level.toString()+"]"});
+				exp += " = "+value.toString();
+				return eval(exp);
+			}
+		},
+		style:function(){
+			
+		},
+		refresh:function(){
+			
+		},
+		destroy:function(){
+			$('body').data('cytoplasm',null);
+		},
+		ready:function(callback){
+			var interval = setInterval(function(){
+				if (ready) {
+					callback.apply();
+					clearInterval(interval)
+				}
+			},10);
+		}
+	};
+	
+	$.Cytoplasm = function(method){
+		if (methods[method]) return methods[method].apply(this,Array.prototype.slice.call(arguments,1));
+		else if (typeof method == 'object' || !method) return methods.init.apply(this,arguments);
+		else $.error('Method ' + method + ' does not exist on jQuery.Cytoplasm!');
+	};
+	
+	$(document).ready(function(){$.Cytoplasm()});
+	
+})(jQuery);