changeset 16:fb948097de39

fix bug: Edittaglist is working on Firefox. fix bug: name of regex used to show with strange <span id="transmark"></span> showing only on FF but not Saf. Change it to use "document.getElementById(id).textContent to get the pure text string.
author Zoe Hong <zhong@mpiwg-berlin.mpg.de>
date Fri, 20 Feb 2015 16:39:08 +0100
parents 1f98c92ebbfb
children 82f8c6bd2b69
files develop/controllers/extractapp.php develop/js/taggingtext.js develop/views/Extractapp/edittaglist.php develop/views/Extractapp/taggingtext.php
diffstat 4 files changed, 92 insertions(+), 39 deletions(-) [+]
line wrap: on
line diff
--- a/develop/controllers/extractapp.php	Thu Feb 19 18:11:11 2015 +0100
+++ b/develop/controllers/extractapp.php	Fri Feb 20 16:39:08 2015 +0100
@@ -97,6 +97,7 @@
                 $this->ReturnView($viewmodel->SaveWordlist($this->postdata), true);
                 break;
             default:    // EditWordlist
+                
                 $this->ReturnView($viewmodel->EditWordlist(), true);    
             break;
          } 
--- a/develop/js/taggingtext.js	Thu Feb 19 18:11:11 2015 +0100
+++ b/develop/js/taggingtext.js	Fri Feb 20 16:39:08 2015 +0100
@@ -488,18 +488,29 @@
 }
 
 $(document).on("click", '#smartRegexShowDiv > span', function (e) {
+    
     $('#smartRegexPopUpDiv').css("display", "block");
     $('#smartRegexPopUpDiv').css("background-color", "White");
     $('#smartRegexPopUpDiv').css("width", "400px");
     $('#smartRegexPopUpDiv').css("height", "300px");
     $('#smartRegexPopUpDiv').css("top", "100px");
-    $('#smartRegexPopUpDiv').css("left", "-200px");
+    $('#smartRegexPopUpDiv').css("left", "-400px");
     $('#smartRegexPopUpDiv').css("border", "1px solid black");
-    $('#smartRegexPopUpDiv').css("padding", "5px");
+    //$('#smartRegexPopUpDiv').css("padding", "5px");    
     
+
     $('#smartRegexPopUpDiv').attr("editID", $(this).attr("id"));
     
-    $('#smartRegexPopUpName').val($(this).html());
+    
+    var _id = $(this).attr("id");
+    var aa = document.getElementById(_id);
+    var name = aa.textContent;
+   
+    $('#smartRegexPopUpName').val(name);
+    // $('#smartRegexPopUpName').val($(this).html());
+    // why there is a <span i="transmark"></span> inbetween? 
+
+
     $('#smartRegexPopUpText').val($(this).attr("regexText"));
     $('#smartRegexPopUpSelectTag').val($(this).attr("regexReplace"));
     
@@ -641,16 +652,20 @@
         //cache: false,
         success: function (data) {
             $.each(data, function(index, element) {
+                // index is the filename (without '.txt')
+                // element is the content in the file
                 newselect.innerHTML += "<option value=\""+index+"\">"+index+"</option>\n";
                 //alert(index);
                 //alert(element);
                 var newdiv = document.createElement("div");
                 $(newdiv).css("display", "none");
                 $(newdiv).html(element);
+                
                 $(newdiv).attr("id", "div_"+index);
                 $('#load_regex_div').append(newdiv);
             });
             
+            
         },
         error: function (data) {
             console.log("SmartRegexLoad fails");
@@ -701,8 +716,9 @@
 var RegexLoadedName = "";
 function loadRegexAdd() {
     RegexLoadedName = $('#loadRegexSelect').val();
-    var divName = "div_"+$('#loadRegexSelect').val();
-    $('#smartRegexShowDiv').html( $('#'+divName).html() );
+    var divName = "#div_"+RegexLoadedName;
+    var name = $(divName).html();
+    $('#smartRegexShowDiv').html(name );
     $('#load_regex_div').css("display", "none");
 }
 // ===
--- a/develop/views/Extractapp/edittaglist.php	Thu Feb 19 18:11:11 2015 +0100
+++ b/develop/views/Extractapp/edittaglist.php	Fri Feb 20 16:39:08 2015 +0100
@@ -75,10 +75,28 @@
 			$('#colorSelector'+largestId+' div').css('backgroundColor', '#' + hex);
 		}
 	});
-	
+	/*
+	// addRule doesn't work in FF
 	document.styleSheets[0].addRule("#colorSelector"+largestId, "position: relative;	width: 36px;	height: 36px;	background: url(../images/select.png);")
 	document.styleSheets[0].addRule("#colorSelector"+largestId+" div", "position: absolute;	top: 3px;	left: 3px;	width: 30px;	height: 30px;	background: url(../images/select.png) center;")
-}
+	*/
+
+	// insertRule works in IE9, FF, Saf, Chrome, Opera
+	var x = document.styleSheets[1];
+	var selector1 = "#colorSelector"+largestId;
+	var selector2 = "#colorSelector"+largestId+" div";
+
+	if (x.insertRule) {
+		x.insertRule(selector1+' {position:relative; width:36px; height:36px; background:url(../images/select.png);}', x.cssRules.length);
+		x.insertRule(selector2+' {position: absolute; top: 3px; left: 3px; width: 30px; height: 30px; background:url(../images/select.png) center;}', x.cssRules.length);
+	
+	} else if (x.addRule) {
+		x.addRule(selector1, "position: relative;	width: 36px;	height: 36px;	background: url(../images/select.png);");
+		x.addRule(selector2, "position: absolute;	top: 3px;	left: 3px;	width: 30px;	height: 30px;	background: url(../images/select.png) center;");
+	}
+	
+
+}	
 
 
 function addNode( id, name, tag, color ) {
@@ -161,16 +179,27 @@
 	});
 
 
-	console.log(document.styleSheets[0]);
-
-	
+	/* 
+	// addRule doesn't work in FF
 	document.styleSheets[0].addRule("#colorSelector"+id, "position: relative;	width: 36px;	height: 36px;	background: url(../images/select.png);")
 	document.styleSheets[0].addRule("#colorSelector"+id+" div", "position: absolute;	top: 3px;	left: 3px;	width: 30px;	height: 30px;	background: url(../images/select.png) center;")
+
+	*/
+	// insertRule works in IE9, FF, Saf, Chrome, Opera
+	var x = document.styleSheets[1];
+	var selector1 = "#colorSelector"+id;
+	var selector2 = "#colorSelector"+id+" div";
+
+	if (x.insertRule) {
+		x.insertRule(selector1+' {position:relative; width:36px; height:36px; background:url(../images/select.png);}', x.cssRules.length);
+		x.insertRule(selector2+' {position: absolute; top: 3px; left: 3px; width: 30px; height: 30px; background:url(../images/select.png) center;}', x.cssRules.length);
 	
-	/*
-	document.styleSheets[0].cssRules[0] // firefox
-	document.styleSheets[0].rules[0]    // IE
-	*/
+	} else if (x.addRule) {
+		x.addRule(selector1, "position: relative;	width: 36px;	height: 36px;	background: url(../images/select.png);");
+		x.addRule(selector2, "position: absolute;	top: 3px;	left: 3px;	width: 30px;	height: 30px;	background: url(../images/select.png) center;");
+	}
+	
+
 }
 
 function newTag( id ) {
@@ -178,15 +207,24 @@
 	var elname = document.getElementById("tdName"+id).innerHTML;
 	var eltag = document.getElementById("tdTag"+id).innerHTML;
 	var elcolor = $("#colorSelectorB"+id).css("background-color");
-	
+
+	console.log("elid="+elid+', elname='+elname);
+
 	$.ajax({
-		url : './',
+		url : './EditTaglist',
 		async : false,
 		type : 'POST',
-		data : 'func=NewTagElement'+'&id='+elid+'&name='+elname+'&tag='+eltag+'&color='+elcolor
+		data : 'func=NewTagElement'+'&id='+elid+'&name='+elname+'&tag='+eltag+'&color='+elcolor,
+		error: function (e) {
+			console.log("error when newTag");
+		},
+		success: function (e) {
+
+			alert("Saved!");
+			document.location.reload(true);
+		}
 	}).done(function(result) {
-		alert("Saved!");
-		document.location.reload(true);
+
 	});
 }
 
@@ -196,21 +234,29 @@
 	var eltag = document.getElementById("tdTag"+id).innerHTML;
 	var elcolor = $("#colorSelectorB"+id).css("background-color");
 	
+	console.log(elid+','+elname+','+eltag+','+elcolor);
+	
 	$.ajax({
-		url : './',
+		url : './EditTaglist',
 		async : false,
 		type : 'POST',
-		data : 'func=SaveTagElement'+'&id='+elid+'&name='+elname+'&tag='+eltag+'&color='+elcolor
+		data : 'func=SaveTagElement'+'&id='+elid+'&name='+elname+'&tag='+eltag+'&color='+elcolor,
+		error: function (e) {
+			console.log("error when saving Tag");
+		},
+		success: function (e) {
+			alert("Saved!");
+			document.location.reload(true);
+		}
 	}).done(function(result) {
-		alert("Saved!");
-		document.location.reload(true);
+		
 	});
 }
 
 function DeleteTag( id ) {	
 	$("#tr"+id).remove();
 	$.ajax({
-		url : './',
+		url : './EditTaglist',
 		async : false,
 		type : 'POST',
 		data : 'func=DeleteTag'+'&id='+id+'&type=delete'
--- a/develop/views/Extractapp/taggingtext.php	Thu Feb 19 18:11:11 2015 +0100
+++ b/develop/views/Extractapp/taggingtext.php	Fri Feb 20 16:39:08 2015 +0100
@@ -85,8 +85,10 @@
 
 $(document).ready(function(){
     //run once
+    /* no need, fixed sidebar
     var el=$('#follow-scroll');
     var originalelpos=el.offset().top; // take it where it originally is on the page
+    */
 
     //run on scroll
     /*
@@ -464,25 +466,14 @@
 ?>
 });
 
-$(function () {
-
-    $('#example').popover({
-          //selector: '.has-popover'
-        content: function () {
-            return;
-        },
-        //template: output_content,
-        title: "Load Regex"
-    });
-})
-
-
 
 // init for popover used in bootstrap
 $(function () {
   $('[data-toggle="popover"]').popover()
 })
 
+
+
 </script>
  
 
@@ -527,9 +518,8 @@
                 
             </div>
         </div>
-
         
-        <div id="follow-scroll" class="col-xs-4 col-xs-offset-8 col-sm-4 col-sm-offset-8 col-md-4 col-md-offset-8 col-lg-4 col-lg-offset-8" style="position:fixed; width:300px; height:900px; overflow:scroll; float:right">
+        <div id="follow-scroll" class="col-xs-4 col-xs-offset-8 col-sm-4 col-sm-offset-8 col-md-4 col-md-offset-8 col-lg-3 col-lg-offset-8" style="position:fixed; width:100%; height:700px; overflow:scroll;">
             <form action="javascript:void(0);">   
                 <fieldset>
                     <legend><h5 class="text-success"> Config Topic: </h5></legend>