unageanu-jiji 0.1.0

data/html/js/edit_area/elements_functions.js

@@ -0,0 +1,337 @@
+/****
+ * This page contains some general usefull functions for javascript
+ *
+ ****/  
+	
+	
+	// need to redefine this functiondue to IE problem
+	function getAttribute( elm, aname ) {
+		try{
+			var avalue = elm.getAttribute( aname );
+		}catch(exept){
+		
+		}
+		if ( ! avalue ) {
+			for ( var i = 0; i < elm.attributes.length; i ++ ) {
+				var taName = elm.attributes [i] .name.toLowerCase();
+				if ( taName == aname ) {
+					avalue = elm.attributes [i] .value;
+					return avalue;
+				}
+			}
+		}
+		return avalue;
+	};
+	
+	// need to redefine this function due to IE problem
+	function setAttribute( elm, attr, val ) {
+		if(attr=="class"){
+			elm.setAttribute("className", val);
+			elm.setAttribute("class", val);
+		}else{
+			elm.setAttribute(attr, val);
+		}
+	};
+	
+	/* return a child element
+		elem: element we are searching in
+		elem_type: type of the eleemnt we are searching (DIV, A, etc...)
+		elem_attribute: attribute of the searched element that must match
+		elem_attribute_match: value that elem_attribute must match
+		option: "all" if must return an array of all children, otherwise return the first match element
+		depth: depth of search (-1 or no set => unlimited)
+	*/
+	function getChildren(elem, elem_type, elem_attribute, elem_attribute_match, option, depth)
+	{           
+		if(!option)
+			var option="single";
+		if(!depth)
+			var depth=-1;
+		if(elem){
+			var children= elem.childNodes;
+			var result=null;
+			var results= new Array();
+			for (var x=0;x<children.length;x++) {
+				strTagName = new String(children[x].tagName);
+				children_class="?";
+				if(strTagName!= "undefined"){
+					child_attribute= getAttribute(children[x],elem_attribute);
+					if((strTagName.toLowerCase()==elem_type.toLowerCase() || elem_type=="") && (elem_attribute=="" || child_attribute==elem_attribute_match)){
+						if(option=="all"){
+							results.push(children[x]);
+						}else{
+							return children[x];
+						}
+					}
+					if(depth!=0){
+						result=getChildren(children[x], elem_type, elem_attribute, elem_attribute_match, option, depth-1);
+						if(option=="all"){
+							if(result.length>0){
+								results= results.concat(result);
+							}
+						}else if(result!=null){                                                                          
+							return result;
+						}
+					}
+				}
+			}
+			if(option=="all")
+			   return results;
+		}
+		return null;
+	};       
+	
+	function isChildOf(elem, parent){
+		if(elem){
+			if(elem==parent)
+				return true;
+			while(elem.parentNode != 'undefined'){
+				return isChildOf(elem.parentNode, parent);
+			}
+		}
+		return false;
+	};
+	
+	function getMouseX(e){
+		/*if(document.all)
+			return event.x + document.body.scrollLeft;
+		else
+			return e.pageX;*/
+		if(e!=null && typeof(e.pageX)!="undefined"){
+			return e.pageX;
+		}else{
+			return (e!=null?e.x:event.x)+ document.documentElement.scrollLeft;
+		}
+		//return (e!=null) ? e.pageX : event.x + document.documentElement.scrollLeft;
+	};
+	
+	function getMouseY(e){
+		/*if(document.all)
+			return event.y + document.body.scrollTop;
+		else
+			return e.pageY;*/
+		if(e!=null && typeof(e.pageY)!="undefined"){
+			return e.pageY;
+		}else{
+			return (e!=null?e.y:event.y)+ document.documentElement.scrollTop;
+		}
+		//return (e!=null) ? e.pageY : event.y + document.documentElement.scrollTop;
+	};
+	
+	function calculeOffsetLeft(r){
+	  return calculeOffset(r,"offsetLeft")
+	};
+	
+	function calculeOffsetTop(r){
+	  return calculeOffset(r,"offsetTop")
+	};
+	
+	function calculeOffset(element,attr){
+	  var offset=0;
+	  while(element){
+		offset+=element[attr];
+		element=element.offsetParent
+	  }
+	  return offset;
+	};
+	
+	/** return the computed style
+	 *	@param: elem: the reference to the element
+	 *	@param: prop: the name of the css property	 
+	 */
+	function get_css_property(elem, prop)
+	{
+		if(document.defaultView)
+		{
+			return document.defaultView.getComputedStyle(elem, null).getPropertyValue(prop);
+		}
+		else if(elem.currentStyle)
+		{
+			var prop = prop.replace(/-\D/gi, function(sMatch)
+			{
+				return sMatch.charAt(sMatch.length - 1).toUpperCase();
+			});
+			return elem.currentStyle[prop];
+		}
+		else return null;
+	}
+	
+/****
+ * Moving an element 
+ ***/  
+	
+	var move_current_element;
+	/* allow to move an element in a window
+		e: the event
+		id: the id of the element
+		frame: the frame of the element 
+		ex of use:
+			in html:	<img id='move_area_search_replace' onmousedown='return parent.start_move_element(event,"area_search_replace", parent.frames["this_frame_id"]);' .../>  
+		or
+			in javascript: document.getElementById("my_div").onmousedown= start_move_element
+	*/
+	function start_move_element(e, id, frame){
+		var elem_id=(e.target || e.srcElement).id;
+		if(id)
+			elem_id=id;		
+		if(!frame)
+			frame=window;
+		if(frame.event)
+			e=frame.event;
+			
+		move_current_element= frame.document.getElementById(elem_id);
+		move_current_element.frame=frame;
+		frame.document.onmousemove= move_element;
+		frame.document.onmouseup= end_move_element;
+		/*move_current_element.onmousemove= move_element;
+		move_current_element.onmouseup= end_move_element;*/
+		
+		//alert(move_current_element.frame.document.body.offsetHeight);
+		
+		mouse_x= getMouseX(e);
+		mouse_y= getMouseY(e);
+		//window.status=frame+ " elem: "+elem_id+" elem: "+ move_current_element + " mouse_x: "+mouse_x;
+		move_current_element.start_pos_x = mouse_x - (move_current_element.style.left.replace("px","") || calculeOffsetLeft(move_current_element));
+		move_current_element.start_pos_y = mouse_y - (move_current_element.style.top.replace("px","") || calculeOffsetTop(move_current_element));
+		return false;
+	};
+	
+	function end_move_element(e){
+		move_current_element.frame.document.onmousemove= "";
+		move_current_element.frame.document.onmouseup= "";		
+		move_current_element=null;
+	};
+	
+	function move_element(e){
+		/*window.status="move"+frame;
+		window.status="move2"+frame.event;*/
+		if(move_current_element.frame && move_current_element.frame.event)
+			e=move_current_element.frame.event;
+		var mouse_x=getMouseX(e);
+		var mouse_y=getMouseY(e);
+		var new_top= mouse_y - move_current_element.start_pos_y;
+		var new_left= mouse_x - move_current_element.start_pos_x;
+		
+		var max_left= move_current_element.frame.document.body.offsetWidth- move_current_element.offsetWidth;
+		max_top= move_current_element.frame.document.body.offsetHeight- move_current_element.offsetHeight;
+		new_top= Math.min(Math.max(0, new_top), max_top);
+		new_left= Math.min(Math.max(0, new_left), max_left);
+		
+		move_current_element.style.top= new_top+"px";
+		move_current_element.style.left= new_left+"px";		
+		return false;
+	};
+	
+/***
+ * Managing a textarea (this part need the navigator infos from editAreaLoader
+ ***/ 
+	
+	var nav= editAreaLoader.nav;
+	
+	// allow to get infos on the selection: array(start, end)
+	function getSelectionRange(textarea){
+		//if(nav['isIE'])
+		//	get_IE_selection(textarea);
+		return {"start": textarea.selectionStart, "end": textarea.selectionEnd};
+	};
+	
+	// allow to set the selection
+	function setSelectionRange(textarea, start, end){
+		textarea.focus();
+		
+		start= Math.max(0, Math.min(textarea.value.length, start));
+		end= Math.max(start, Math.min(textarea.value.length, end));
+	
+		if(nav['isOpera']){	// Opera bug when moving selection start and selection end
+			textarea.selectionEnd = 1;	
+			textarea.selectionStart = 0;			
+			textarea.selectionEnd = 1;	
+			textarea.selectionStart = 0;		
+		}
+		textarea.selectionStart = start;
+		textarea.selectionEnd = end;		
+		//textarea.setSelectionRange(start, end);
+		
+		if(nav['isIE'])
+			set_IE_selection(textarea);
+	};
+
+	
+	// set IE position in Firefox mode (textarea.selectionStart and textarea.selectionEnd). should work as a repeated task
+	function get_IE_selection(textarea){
+			
+		if(textarea && textarea.focused)
+		{	
+			if(!textarea.ea_line_height)
+			{	// calculate the lineHeight
+				var div= document.createElement("div");
+				div.style.fontFamily= get_css_property(textarea, "font-family");
+				div.style.fontSize= get_css_property(textarea, "font-size");
+				div.style.visibility= "hidden";			
+				div.innerHTML="0";
+				document.body.appendChild(div);
+				textarea.ea_line_height= div.offsetHeight;
+				document.body.removeChild(div);
+			}
+			//textarea.focus();
+			var range = document.selection.createRange();	
+			var stored_range = range.duplicate();
+			stored_range.moveToElementText( textarea );
+			stored_range.setEndPoint( 'EndToEnd', range );
+			if(stored_range.parentElement()==textarea){
+				// the range don't take care of empty lines in the end of the selection
+				var elem= textarea;
+				var scrollTop= 0;
+				while(elem.parentNode){
+					scrollTop+= elem.scrollTop;
+					elem= elem.parentNode;
+				}
+			
+			//	var scrollTop= textarea.scrollTop + document.body.scrollTop;
+				
+			//	var relative_top= range.offsetTop - calculeOffsetTop(textarea) + scrollTop;
+				var relative_top= range.offsetTop - calculeOffsetTop(textarea)+ scrollTop;
+			//	alert("rangeoffset: "+ range.offsetTop +"\ncalcoffsetTop: "+ calculeOffsetTop(textarea) +"\nrelativeTop: "+ relative_top);
+				var line_start = Math.round((relative_top / textarea.ea_line_height) +1);
+				
+				var line_nb= Math.round(range.boundingHeight / textarea.ea_line_height);
+				
+		//		alert("store_range: "+ stored_range.text.length+"\nrange: "+range.text.length+"\nrange_text: "+ range.text);
+				var range_start= stored_range.text.length - range.text.length;
+				var tab= textarea.value.substr(0, range_start).split("\n");			
+				range_start+= (line_start - tab.length)*2;		// add missing empty lines to the selection
+				textarea.selectionStart = range_start;
+				
+				var range_end= textarea.selectionStart + range.text.length;
+				tab= textarea.value.substr(0, range_start + range.text.length).split("\n");			
+				range_end+= (line_start + line_nb - 1 - tab.length)*2;
+				textarea.selectionEnd = range_end;
+			}
+		}
+		setTimeout("get_IE_selection(document.getElementById('"+ textarea.id +"'));", 50);
+	};
+	
+	function IE_textarea_focus(){
+		event.srcElement.focused= true;
+	}
+	
+	function IE_textarea_blur(){
+		event.srcElement.focused= false;
+	}
+	
+	// select the text for IE (take into account the \r difference)
+	function set_IE_selection(textarea){
+		if(!window.closed){ 
+			var nbLineStart=textarea.value.substr(0, textarea.selectionStart).split("\n").length - 1;
+			var nbLineEnd=textarea.value.substr(0, textarea.selectionEnd).split("\n").length - 1;
+			var range = document.selection.createRange();
+			range.moveToElementText( textarea );
+			range.setEndPoint( 'EndToStart', range );
+			range.moveStart('character', textarea.selectionStart - nbLineStart);
+			range.moveEnd('character', textarea.selectionEnd - nbLineEnd - (textarea.selectionStart - nbLineStart)  );
+			range.select();
+		}
+	};
+	
+	
+	editAreaLoader.waiting_loading["elements_functions.js"]= "loaded";

data/html/js/edit_area/highlight.js

@@ -0,0 +1,283 @@
+	// change_to: "on" or "off"
+	EditArea.prototype.change_highlight= function(change_to){
+		if(this.settings["syntax"].length==0 && change_to==false){
+			this.switchClassSticky($("highlight"), 'editAreaButtonDisabled', true);
+			this.switchClassSticky($("reset_highlight"), 'editAreaButtonDisabled', true);
+			return false;
+		}
+		
+		if(this.do_highlight==change_to)
+			return false;
+	
+			
+		if(this.nav['isIE'])
+			this.getIESelection();
+		var pos_start= this.textarea.selectionStart;
+		var pos_end= this.textarea.selectionEnd;
+		
+		if(this.do_highlight===true || change_to==false)
+			this.disable_highlight();
+		else
+			this.enable_highlight();
+		this.textarea.focus();
+		this.textarea.selectionStart = pos_start;
+		this.textarea.selectionEnd = pos_end;
+		if(this.nav['isIE'])
+			this.setIESelection();
+				
+	};
+	
+	EditArea.prototype.disable_highlight= function(displayOnly){		
+		this.selection_field.innerHTML="";
+		this.content_highlight.style.visibility="hidden";
+		// replacing the node is far more faster than deleting it's content in firefox
+		var new_Obj= this.content_highlight.cloneNode(false);
+		new_Obj.innerHTML= "";			
+		this.content_highlight.parentNode.insertBefore(new_Obj, this.content_highlight);
+		this.content_highlight.parentNode.removeChild(this.content_highlight);	
+		this.content_highlight= new_Obj;
+		var old_class= parent.getAttribute(this.textarea,"class");
+		if(old_class){
+			var new_class= old_class.replace("hidden","");
+			parent.setAttribute(this.textarea, "class", new_class);
+		}
+	
+		this.textarea.style.backgroundColor="transparent";	// needed in order to see the bracket finders
+		
+		//var icon= document.getElementById("highlight");
+		//setAttribute(icon, "class", getAttribute(icon, "class").replace(/ selected/g, "") );
+		//this.restoreClass(icon);
+		//this.switchClass(icon,'editAreaButtonNormal');
+		this.switchClassSticky($("highlight"), 'editAreaButtonNormal', true);
+		this.switchClassSticky($("reset_highlight"), 'editAreaButtonDisabled', true);
+	
+		this.do_highlight=false;
+	
+		this.switchClassSticky($("change_smooth_selection"), 'editAreaButtonSelected', true);
+		if(typeof(this.smooth_selection_before_highlight)!="undefined" && this.smooth_selection_before_highlight===false){
+			this.change_smooth_selection_mode(false);
+		}
+		
+	//	this.textarea.style.backgroundColor="#FFFFFF";
+	};
+
+	EditArea.prototype.enable_highlight= function(){
+		this.show_waiting_screen();
+			
+		this.content_highlight.style.visibility="visible";
+		var new_class=parent.getAttribute(this.textarea,"class")+" hidden";
+		parent.setAttribute(this.textarea, "class", new_class);
+		
+		if(this.nav['isIE'])
+			this.textarea.style.backgroundColor="#FFFFFF";	// IE can't manage mouse click outside text range without this
+
+		//var icon= document.getElementById("highlight");
+		//setAttribute(icon, "class", getAttribute(icon, "class") + " selected");
+		//this.switchClass(icon,'editAreaButtonSelected');
+		//this.switchClassSticky($("highlight"), 'editAreaButtonNormal', false);
+		this.switchClassSticky($("highlight"), 'editAreaButtonSelected', false);
+		this.switchClassSticky($("reset_highlight"), 'editAreaButtonNormal', false);
+		
+		this.smooth_selection_before_highlight=this.smooth_selection;
+		if(!this.smooth_selection)
+			this.change_smooth_selection_mode(true);
+		this.switchClassSticky($("change_smooth_selection"), 'editAreaButtonDisabled', true);
+		
+		
+		this.do_highlight=true;
+		this.resync_highlight();
+					
+		this.hide_waiting_screen();
+		//area.onkeyup="";
+		/*if(!displayOnly){
+			this.do_highlight=true;
+			this.reSync();
+			if(this.state=="loaded")
+				this.textarea.focus();
+		}*/
+	
+	};
+	
+	
+	EditArea.prototype.maj_highlight= function(infos){
+		if(this.last_highlight_base_text==infos["full_text"] && this.resync_highlight!==true)
+			return;
+					
+		//var infos= this.getSelectionInfos();
+		if(infos["full_text"].indexOf("\r")!=-1)
+			text_to_highlight= infos["full_text"].replace(/\r/g, "");
+		else
+			text_to_highlight= infos["full_text"];
+		
+		// for optimisation process
+		var start_line_pb=-1;	
+		var end_line_pb=-1;		
+		
+		var stay_begin="";	
+		var stay_end="";
+		
+		
+		var debug_opti="";
+		
+		// for speed mesure
+		var date= new Date();
+		var tps_start=date.getTime();		
+		var tps_middle_opti=date.getTime();	
+		
+					
+		//  OPTIMISATION: will search to update only changed lines
+		if(this.reload_highlight===true){
+			this.reload_highlight=false;
+		}else if(text_to_highlight.length==0){
+			text_to_highlight="\n ";
+		}else{			
+			var base_step=200;
+			
+			var cpt= 0;
+			var end= Math.min(text_to_highlight.length, this.last_text_to_highlight.length);
+            var step= base_step;
+            // find how many chars are similar at the begin of the text						
+			while(cpt<end && step>=1){
+                if(this.last_text_to_highlight.substr(cpt, step) == text_to_highlight.substr(cpt, step)){
+                    cpt+= step;
+                }else{
+                    step= Math.floor(step/2);
+                }
+			}
+			var pos_start_change=cpt;
+			var line_start_change= text_to_highlight.substr(0, pos_start_change).split("\n").length -1;						
+			
+			cpt_last= this.last_text_to_highlight.length;
+            cpt= text_to_highlight.length;
+            step= base_step;			
+            // find how many chars are similar at the end of the text						
+			while(cpt>=0 && cpt_last>=0 && step>=1){
+                if(this.last_text_to_highlight.substr(cpt_last-step, step) == text_to_highlight.substr(cpt-step, step)){
+                    cpt-= step;
+                    cpt_last-= step;
+                }else{
+                    step= Math.floor(step/2);
+                }
+			}
+			//cpt_last=Math.max(0, cpt_last);
+			var pos_new_end_change= cpt;
+			var pos_last_end_change= cpt_last;
+			if(pos_new_end_change<=pos_start_change){
+				if(this.last_text_to_highlight.length < text_to_highlight.length){
+					pos_new_end_change= pos_start_change + text_to_highlight.length - this.last_text_to_highlight.length;
+					pos_last_end_change= pos_start_change;
+				}else{
+					pos_last_end_change= pos_start_change + this.last_text_to_highlight.length - text_to_highlight.length;
+					pos_new_end_change= pos_start_change;
+				}
+			} 
+			var change_new_text= text_to_highlight.substring(pos_start_change, pos_new_end_change);
+			var change_last_text= this.last_text_to_highlight.substring(pos_start_change, pos_last_end_change);			            
+			
+			var line_new_end_change= text_to_highlight.substr(0, pos_new_end_change).split("\n").length -1;
+			var line_last_end_change= this.last_text_to_highlight.substr(0, pos_last_end_change).split("\n").length -1;
+			
+			var change_new_text_line= text_to_highlight.split("\n").slice(line_start_change, line_new_end_change+1).join("\n");
+			var change_last_text_line= this.last_text_to_highlight.split("\n").slice(line_start_change, line_last_end_change+1).join("\n");
+		
+			// check if it can only reparse the changed text
+			var trace_new= this.get_syntax_trace(change_new_text_line);
+			var trace_last= this.get_syntax_trace(change_last_text_line);
+			if(trace_new == trace_last){
+						
+			
+			
+				date= new Date();		
+				tps_middle_opti=date.getTime();	
+			
+				stay_begin= this.last_hightlighted_text.split("\n").slice(0, line_start_change).join("\n");
+				if(line_start_change>0)
+					stay_begin+= "\n";
+				stay_end= this.last_hightlighted_text.split("\n").slice(line_last_end_change+1).join("\n");
+				if(stay_end.length>0)
+					stay_end= "\n"+stay_end;
+	
+	
+				if(stay_begin.length==0 && pos_last_end_change==-1)
+					change_new_text_line+="\n";
+				text_to_highlight=change_new_text_line;
+				
+			}
+			if(this.settings["debug"]){
+				debug_opti= (trace_new == trace_last)?"Optimisation": "No optimisation";
+				debug_opti+= " start: "+pos_start_change +"("+line_start_change+")";
+				debug_opti+=" end_new: "+ pos_new_end_change+"("+line_new_end_change+")";
+				debug_opti+=" end_last: "+ pos_last_end_change+"("+line_last_end_change+")";
+				debug_opti+="\nchanged_text: "+change_new_text+" => trace: "+trace_new;
+				debug_opti+="\nchanged_last_text: "+change_last_text+" => trace: "+trace_last;
+				//debug_opti+= "\nchanged: "+ infos["full_text"].substring(pos_start_change, pos_new_end_change);
+				debug_opti+= "\nchanged_line: "+change_new_text_line;
+				debug_opti+= "\nlast_changed_line: "+change_last_text_line;
+				debug_opti+="\nstay_begin: "+ stay_begin.slice(-200);
+				debug_opti+="\nstay_end: "+ stay_end;
+				//debug_opti="start: "+stay_begin_len+ "("+nb_line_start_unchanged+") end: "+ (stay_end_len)+ "("+(splited.length-nb_line_end_unchanged)+") ";
+				//debug_opti+="changed: "+ text_to_highlight.substring(stay_begin_len, text_to_highlight.length-stay_end_len)+" \n";
+				
+				//debug_opti+="changed: "+ stay_begin.substr(stay_begin.length-200)+ "----------"+ text_to_highlight+"------------------"+ stay_end.substr(0,200) +"\n";
+				debug_opti+="\n";
+			}
+	
+			
+			// END OPTIMISATION
+		}
+		date= new Date();
+		tps_end_opti=date.getTime();	
+				
+		// apply highlight
+		var updated_highlight= this.colorize_text(text_to_highlight);		
+		
+		// get the new highlight content
+			
+		date= new Date();
+		tps2=date.getTime();
+		//updated_highlight= "<div class='keywords'>"+updated_highlight+"</div>";
+		var hightlighted_text= stay_begin + updated_highlight + stay_end;
+		//this.previous_hightlight_content= tab_text.join("<br>");
+		
+		date= new Date();
+		inner1=date.getTime();		
+					
+		// update the content of the highlight div by first updating a clone node (as there is no display in the same time for this node it's quite faster (5*))
+		var new_Obj= this.content_highlight.cloneNode(false);
+		if(this.nav['isIE'] || this.nav['isOpera'] || this.nav['isFirefox'] >= 3 )
+			new_Obj.innerHTML= "<pre><span class='"+ this.settings["syntax"] +"'>" + hightlighted_text.replace("\n", "<br/>") + "</span></pre>";	
+		else
+			new_Obj.innerHTML= "<span class='"+ this.settings["syntax"] +"'>"+ hightlighted_text +"</span>";			
+		this.content_highlight.parentNode.replaceChild(new_Obj, this.content_highlight);
+		this.content_highlight= new_Obj;
+		if(infos["full_text"].indexOf("\r")!=-1)
+			this.last_text_to_highlight= infos["full_text"].replace(/\r/g, "");
+		else
+			this.last_text_to_highlight= infos["full_text"];
+		this.last_hightlighted_text= hightlighted_text;
+		date= new Date();
+		tps3=date.getTime();
+	
+		if(this.settings["debug"]){
+			tot1=tps_end_opti-tps_start;
+			tot_middle=tps_end_opti- tps_middle_opti;
+			tot2=tps2-tps_end_opti;
+			tps_join=inner1-tps2;			
+			tps_td2=tps3-inner1;
+			//lineNumber=tab_text.length;
+			//this.debug.value+=" \nNB char: "+$("src").value.length+" Nb line: "+ lineNumber;
+			this.debug.value= "Tps optimisation "+tot1+" (second part: "+tot_middle+") | tps reg exp: "+tot2+" | tps join: "+tps_join;
+			this.debug.value+= " | tps update highlight content: "+tps_td2+"("+tps3+")\n";
+			this.debug.value+=debug_opti;
+		//	this.debug.value+= "highlight\n"+hightlighted_text;
+		}
+		
+	};
+	
+	EditArea.prototype.resync_highlight= function(reload_now){
+		this.reload_highlight=true;
+		this.last_highlight_base_text="";
+		this.focus();		
+		if(reload_now)
+			this.check_line_selection(false); 
+	};