fileTree updated

Author: AnandPilania

public/assets/css/jquery.contextMenu.min.css

@@ -115,4 +115,11 @@ body{position:fixed;top:0;left:0;right:0;bottom:0;overflow:hidden;line-height:1.
 
 .online{background-color:#00ff00;}
 .offline{background-color:#ff0000;}
-.till{padding-left:5px;}
+.till{padding-left:5px;}
+
+.alert{position:absolute;top:0;z-index:99999;}
+.alert ul{background-color:#111111;border:1px solid #000000;padding:5px 10px;}
+.alert li{color:#ff4040;}
+.alert li.success{color:#40ff40;}
+.alert li{text-align:center;height:25px;line-height:25px;border-bottom:1px solid #111111;}
+.alert li:last-child{border:none;}

public/assets/editor/css/_main.css

@@ -1 +1,3 @@
-.fileTree{}
+.fileTree{height:100%;width:100%;overflow:auto;}
+.fileTree li{cursor:default;line-height:25px;padding:0 5px;border-bottom:1px solid #222222;background-repeat:no-repeat;background-size:15px 15px;background-position:center left;text-indent:13px;}
+.fileTree li:last-child{border:none;}

public/assets/editor/css/fileTree.css

@@ -1 +1,50 @@
-ch.fileTree=(function(){})();
+ch.fileTree=(function(){
+	var context={
+		file: {
+			edit:{name:"Edit",icon:"edit",callback:function(key,opt){alert("Edit!");}},
+			cut:{name:"Cut",icon:"cut",callback:function(key,opt){alert("Cut!");}},
+			copy:{name:"Copy",icon:"copy",callback:function(key,opt){alert("Edit!");}},
+			delete:{name:"Delete",icon:"delete",callback:function(key,opt){alert("Delete!")}},
+			rename:{name:"Rename",icon:"",callback:function(key,opt){alert("Rename!");}},
+			sep1: "----------",
+			share:{name:"Share",icon:"",callback:function(key,opt){alert("Share!");}},
+			fold1: {
+				name: "Download",
+				items: {
+					"fold1-key1":{name:"As file",icon:"",callback:function(key,opt){alert("Share!");}},
+					"fold1-key2":{name:"As ZIP",icon:"",callback:function(key,opt){alert("Share!");}}
+				}
+			},
+			"sep2": "---------",
+			properties:{name:"Properties",icon:"properties",callback:function(key,opt){alert("Propertise!");}}
+		},
+		dir: {
+			move:{name:"Move",icon:"move",callback:function(key,opt){alert("Move!");}},
+			copy:{name:"Copy",icon:"copy",callback:function(key,opt){alert("Copy!");}},
+			delete:{name:"Delete",icon:"delete",callback:function(key,opt){alert("Delete!")}},
+			rename:{name:"Rename",icon:"",callback:function(key,opt){alert("Rename!");}},
+			sep1: "----------",
+			share:{name:"Share",icon:"",callback:function(key,opt){alert("Share!");}},
+			fold1: {
+				name: "Download",
+				items: {
+					"fold1-key1":{name:"As gz",icon:"",callback:function(key,opt){alert("Share!");}},
+					"fold1-key2":{name:"As ZIP",icon:"",callback:function(key,opt){alert("Share!");}}
+				}
+			},
+			"sep2": "---------",
+			properties:{name:"Properties",icon:"properties",callback:function(key,opt){alert("Propertise!");}}
+		}
+	};
+
+	$.contextMenu({
+	  selector:"#fileTree li[data-type='file']",
+	  items:context.file
+	});
+	$.contextMenu({
+	  selector:"#fileTree li[data-type='dir']",
+	  items:context.dir
+	});
+
+	return {};
+})();

public/assets/editor/js/_main.js

@@ -0,0 +1,99 @@
+/*
+ * jQuery Hotkeys Plugin
+ * Copyright 2010, John Resig
+ * Dual licensed under the MIT or GPL Version 2 licenses.
+ *
+ * Based upon the plugin by Tzury Bar Yochay:
+ * http://github.com/tzuryby/hotkeys
+ *
+ * Original idea by:
+ * Binny V A, http://www.openjs.com/scripts/events/keyboard_shortcuts/
+*/
+
+(function(jQuery){
+	
+	jQuery.hotkeys = {
+		version: "0.8",
+
+		specialKeys: {
+			8: "backspace", 9: "tab", 13: "return", 16: "shift", 17: "ctrl", 18: "alt", 19: "pause",
+			20: "capslock", 27: "esc", 32: "space", 33: "pageup", 34: "pagedown", 35: "end", 36: "home",
+			37: "left", 38: "up", 39: "right", 40: "down", 45: "insert", 46: "del", 
+			96: "0", 97: "1", 98: "2", 99: "3", 100: "4", 101: "5", 102: "6", 103: "7",
+			104: "8", 105: "9", 106: "*", 107: "+", 109: "-", 110: ".", 111 : "/", 
+			112: "f1", 113: "f2", 114: "f3", 115: "f4", 116: "f5", 117: "f6", 118: "f7", 119: "f8", 
+			120: "f9", 121: "f10", 122: "f11", 123: "f12", 144: "numlock", 145: "scroll", 191: "/", 224: "meta"
+		},
+	
+		shiftNums: {
+			"`": "~", "1": "!", "2": "@", "3": "#", "4": "$", "5": "%", "6": "^", "7": "&", 
+			"8": "*", "9": "(", "0": ")", "-": "_", "=": "+", ";": ": ", "'": "\"", ",": "<", 
+			".": ">",  "/": "?",  "\\": "|"
+		}
+	};
+
+	function keyHandler( handleObj ) {
+		// Only care when a possible input has been specified
+		if ( typeof handleObj.data !== "string" ) {
+			return;
+		}
+		
+		var origHandler = handleObj.handler,
+			keys = handleObj.data.toLowerCase().split(" ");
+	
+		handleObj.handler = function( event ) {
+			// Don't fire in text-accepting inputs that we didn't directly bind to
+			if ( this !== event.target && (/textarea|select/i.test( event.target.nodeName ) ||
+				 event.target.type === "text") ) {
+				return;
+			}
+			
+			// Keypress represents characters, not special keys
+			var special = event.type !== "keypress" && jQuery.hotkeys.specialKeys[ event.which ],
+				character = String.fromCharCode( event.which ).toLowerCase(),
+				key, modif = "", possible = {};
+
+			// check combinations (alt|ctrl|shift+anything)
+			if ( event.altKey && special !== "alt" ) {
+				modif += "alt+";
+			}
+
+			if ( event.ctrlKey && special !== "ctrl" ) {
+				modif += "ctrl+";
+			}
+			
+			// TODO: Need to make sure this works consistently across platforms
+			if ( event.metaKey && !event.ctrlKey && special !== "meta" ) {
+				modif += "meta+";
+			}
+
+			if ( event.shiftKey && special !== "shift" ) {
+				modif += "shift+";
+			}
+
+			if ( special ) {
+				possible[ modif + special ] = true;
+
+			} else {
+				possible[ modif + character ] = true;
+				possible[ modif + jQuery.hotkeys.shiftNums[ character ] ] = true;
+
+				// "$" can be triggered as "Shift+4" or "Shift+$" or just "$"
+				if ( modif === "shift+" ) {
+					possible[ jQuery.hotkeys.shiftNums[ character ] ] = true;
+				}
+			}
+
+			for ( var i = 0, l = keys.length; i < l; i++ ) {
+				if ( possible[ keys[i] ] ) {
+					return origHandler.apply( this, arguments );
+				}
+			}
+		};
+	}
+
+	jQuery.each([ "keydown", "keyup", "keypress" ], function() {
+		jQuery.event.special[ this ] = { add: keyHandler };
+	});
+
+})( jQuery );

public/assets/editor/js/fileTree.js

@@ -1,3 +1,7 @@
+<asset src="assets/js/jquery.contextMenu.min.js" priority="8" type="js" />
+<asset src="assets/js/jquery.hotkeys-0.8.js" priority="8" type="js" />
+<asset src="assets/js/jquery.hotKeyMap-1.0.min.js" priority="8" type="js" />
+<asset src="assets/css/jquery.contextMenu.min.css" priority="8" type="css" />
 <asset src="assets/codemirror/codemirror.css" priority="9" type="css" />
 <asset src="assets/codemirror/codemirror.js" priority="9" type="js" />
 <asset src="assets/editor/css/_main.css" priority="8" type="css" />

public/assets/fonts/context-menu-icons.eot

@@ -4,7 +4,7 @@
 <div id="fileTree" class="fileTree">
 	<ul>
 	<repeat group="{{ @fileTree }}" key="{{ @key}}" value="{{ @value }}">
-		<li><h4>{{ @key }}</h4></li>
+		<li data-type="{{ @value['type'] }}" style="background-image:url(/assets/img/fileTree/{{ @value['type'] !== 'dir' ? @value['extension'] : @value['type'] }}.png)"><h4>{{ @key }}</h4></li>
 	</repeat>
 	</ul>
 </div>

public/assets/fonts/context-menu-icons.ttf

@@ -1,7 +1,7 @@
 <repeat group="{{ Flash::instance()->getMessages() }}" value="{{ @msg }}">
 <div class="alert">
 	<ul>
-		<li class ="{{ @msg.status }}">{{ @msg.text | esc }}</li>
+		<li class="{{ @msg.status }}">{{ @msg.text | esc }}</li>
 	</ul>
 </div>
 </repeat>