Merge pull request #1 from Cantalapiedra/cpc_branch

separated the ete.js and ete.css to a plugin/ folder, and made some changes to ete.js also, to accept path to the tree instead of newick. Also fixed the highlighting (and posted like 15 stories xD), and not sure what else... unhighlighting, highlight takes into account children, delete node takes into account empty parent nodes, purge is not an action now, root action fixed (needed to receive taxid parameter), etc.

.gitignore

@@ -2,3 +2,5 @@
 *~
 ~*
 #*
+*_old
+taxa.sqlite*

demo/ete.css

@@ -0,0 +1 @@
+../plugin/ete.css

demo/ete.js

@@ -0,0 +1 @@
+../plugin/ete.js

demo/webplugin_example.html

@@ -9,7 +9,7 @@
     <script src="ete.js"></script>
     <script>
        /* YOU MUST SET THIS VARIABLE */
-       var ete_webplugin_URL = "http://localhost:8989"
+       // var ete_webplugin_URL = "http://localhost:8989"
     </script>
 
     <link rel="stylesheet" type="text/css" href="ete.css" >
@@ -18,52 +18,52 @@
     <!-- This layer must be called "popup" -->
     <div id="popup"></div>
     <div style='text-align: left;'>
-    <b> Paste a tree in newick format:</b><br>
-<div style="float:left; margin-right:15px; ">
-      <textarea  id="tree" style='width: 500px; height: 80px; vertical-align:middle;'>
-        (((Rangifer_tarandus, Cervus_elaphus)Cervidae, (Bos_taurus, Ovis_orientalis)Bovidae), (Suricata_suricatta, (Cistophora_cristata,Mephitis_mephitis))Carnivora);
-      </textarea>
-
-<br> 
-<br>
-
-      <b> prune taxid list:</b><br>
-<div style="float:left; margin-right:15px; ">
-      <textarea  id="taxid" style='width: 500px; height: 80px; vertical-align:middle;'>
-        taxid
-      </textarea>      
-
-
-<br> 
-<br>
-
-      <b> Paste alignment path and press "Draw tree":</b><br>
-<div style="float:left; margin-right:15px; ">
-      <textarea  id="aln" style='width: 500px; height: 80px; vertical-align:middle;'>
-        ALG
-      </textarea>
-      
-
-
-<br>
-<div id='server_status'></div>
-
-<div style="clear:both;" >
-      <!-- Start tree visualization by calling draw_tree_image functionn and
-      pointing to a div container.  -->
-      <input type='submit' value='Draw tree'  onClick='get_tree_image(($("#tree").val()), ($("#aln").val()), ($("#taxid").val()),"#img1") ;'>
-      <input type='button' value='Clear' onClick='$(".ete_image").html("");'>
-</div>
-    </div>
-    </div>
-
-    <br>
-
-    <div id="highlighter"></div>
-
-    <!-- Tree container -->
-    <div class="ete_image" id="img1"></div>
-    <br>
-
+      <b> Paste a tree in newick format:</b><br>
+      <div style="float:left; margin-right:15px; ">
+	<textarea  id="tree" style='width: 500px; height: 80px; vertical-align:middle;'>
+          (((Rangifer_tarandus, Cervus_elaphus)Cervidae, (Bos_taurus, Ovis_orientalis)Bovidae), (Suricata_suricatta, (Cistophora_cristata,Mephitis_mephitis))Carnivora);
+	</textarea>
+	
+	<br> 
+	<br>
+	
+	<b> prune taxid list:</b><br>
+	<div style="float:left; margin-right:15px; ">
+	  <textarea  id="taxid" style='width: 500px; height: 80px; vertical-align:middle;'>
+            taxid
+	  </textarea>      
+	  
+	  
+	  <br> 
+	  <br>
+	  
+	  <b> Paste alignment path and press "Draw tree":</b><br>
+	  <div style="float:left; margin-right:15px; ">
+	    <textarea  id="aln" style='width: 500px; height: 80px; vertical-align:middle;'>
+              ALG
+	    </textarea>
+	    
+	    
+	    
+	    <br>
+	    <div id='server_status'></div>
+	    
+	    <div style="clear:both;" >
+	      <!-- Start tree visualization by calling draw_tree_image functionn and
+		   pointing to a div container.  -->
+	      <input type='submit' value='Draw tree'  onClick='get_tree_image(($("#tree").val()), ($("#aln").val()), ($("#taxid").val()),"#img1") ;'>
+	      <input type='button' value='Clear' onClick='$(".ete_image").html("");'>
+	    </div>
+	  </div>
+	</div>
+	
+	<br>
+	
+	<div id="highlighter"></div>
+	
+	<!-- Tree container -->
+	<div class="ete_image" id="img1"></div>
+	<br>
+	
   </body>
 </html>

ete3_webserver/tree_handler.py

@@ -48,9 +48,7 @@ def redraw(self):
         html_map = self.get_html_map(img_map)
 
         html_img = """<img id="%s" class="ete_tree_img" USEMAP="#%s" onLoad="javascript:bind_popup();" src="data:image/gif;base64,%s">""" %(self.imgid, self.mapid, base64_img)
-        #html_img = """<img id="%s" class="ete_tree_img" USEMAP="#%s" onLoad="javascript:bind_popup();" src="data:image/gif;base64,">""" %(self.imgid, self.mapid)
         ete_link = '<div style="margin:0px;padding:0px;text-align:left;"><a href="http://etetoolkit.org" style="font-size:7pt;" target="_blank" >Powered by etetoolkit</a></div>'
-
 
         tree_div_id = self.boxid
         return html_map+ '<div id="%s" >'%tree_div_id + html_img + ete_link + "</div>"
@@ -61,7 +59,7 @@ def get_html_map(self, img_map):
             for x1, y1, x2, y2, nodeid, text in img_map["nodes"]:
                 text = "" if not text else text
                 area = img_map["node_areas"].get(int(nodeid), [0,0,0,0])
-                html_map += """ <AREA SHAPE="rect" COORDS="%s,%s,%s,%s"
+                html_map += """ <AREA SHAPE="rect" COORDS="%s,%s,%s,%s" 
                                 onMouseOut='unhighlight_node();'
                                 onMouseOver='highlight_node("%s", "%s", "%s", %s, %s, %s, %s);'
                                 onClick='show_actions("%s", "%s");'
@@ -100,7 +98,7 @@ def run_action(self, aindex, nodeid):
         target = self.tree.search_nodes(_nid=int(nodeid))[0]
         taxid = self.taxid
         run_fn = self.tree.actions.actions[aindex][2]
-        return run_fn(self.tree, target,taxid)
+        return run_fn(self.tree, target, taxid)
 
 
 
@@ -128,4 +126,4 @@ def clear_default_actions(self):
 
     def add_action(self, action_name, show_fn, run_fn):
         aindex = "act_"+id_generator()
-        self.actions[aindex] = [action_name, show_fn, run_fn]
+        self.actions[aindex] = [action_name, show_fn, run_fn]