snapshot

explorerjs.html

@@ -202,8 +202,8 @@
 
 
                    <li>
-                      <a href="#" id="statsicon" onclick="$('#statsmodal').modal('show');" >
-                        <img title="Network Stats" width="34px" src="img/stats.png"></img>
+                      <a href="#" id="snapicon" onclick="saveGraphIMG();" >
+                        <img title="Take a photo!" width="34px" src="img/camera.png"></img>
                       </a>
                   </li>
 	                
@@ -309,6 +309,7 @@
 </div> 
 
 
+
 <div id="modalloader" class="modal fade">
     <div id="loader">
         <img src="img/loader.gif"></img>
@@ -343,7 +344,7 @@
     <script src="jquery/jquery-ui.js" type="text/javascript"></script>
     <script src="libs/jquery/jquery.ba-dotimeout.min.js" type="text/javascript"></script>
     <script src="libs/jquery/jquery.mousewheel.min.js" type="text/javascript"></script>
-    <script src="libs/jquery/jquery.tokeninput.js" type="text/javascript"></script>
+    <!--<script src="libs/jquery/jquery.tokeninput.js" type="text/javascript"></script>-->
 
     <script type="text/javascript" src="libs/freshslider.1.0.js"></script>
     <!--source: http://www.jqueryscript.net/slider/Simple-Nice-jQuery-Value-Range-Slider-Plugin-Fresh-Slider.html-->
@@ -361,8 +362,10 @@
     <script src="geomap2/js/countries_iso3166.js" charset="utf-8" ></script>
     <link rel="stylesheet" type="text/css" href="geomap2/css/geo.css" />
     
-<!--    <script src="tinawebJS/js/canvas2image/base64.js" type="text/javascript"></script>-->
-<!--    <script src="tinawebJS/js/canvas2image/canvas2image.js" type="text/javascript"></script>-->
+    <!--
+    <script src="tinawebJS/js/canvas2image/base64.js" type="text/javascript"></script>
+    <script src="tinawebJS/js/canvas2image/canvas2image.js" type="text/javascript"></script>
+    -->
 
     
     <script src="tinawebJS/js/sigma.min.js" type="text/javascript" language="javascript"></script>

tinawebJS/js/methods.js

@@ -1793,7 +1793,6 @@ function saveGraph() {
     }
 
     $("#closesavemodal").click();
-
 }
 
 function saveGEXF(nodes,edges,atts){
@@ -1841,56 +1840,53 @@ function saveGEXF(nodes,edges,atts){
     newWindow=window.open(uriContent, 'neuesDokument');
 }
 
-function savePNG(){
-    $("#PhotoGraph").click(function (){
-        
-        //canvas=partialGraph._core.domElements.nodes;
-        
-        var nodesCtx = partialGraph._core.domElements.nodes;
-        /*
-        var edgesCtx = document.getElementById("sigma_edges_1").getContext('2d');
-        
-        var edgesImg = edgesCtx.getImageData(0, 0, document.getElementById("sigma_edges_1").width, document.getElementById("sigma_edges_1").height)
-        
-        nodesCtx.putImageData(edgesImg,0,0);
-        
+function saveGraphIMG(){
         
+        var strDownloadMime = "image/octet-stream"
         
+        var nodesDiv = partialGraph._core.domElements.nodes;
+        var nodesCtx = nodesDiv.getContext("2d");
+
+        var edgesDiv = partialGraph._core.domElements.edges;
+        var edgesCtx = edgesDiv.getContext("2d");
+
+        var labelsDiv = partialGraph._core.domElements.labels;
+        var labelsCtx = labelsDiv.getContext("2d");
+
+
+        nodesCtx.drawImage(labelsDiv,0,0);
+        edgesCtx.drawImage(nodesDiv,0,0);
+
+        var strData = edgesDiv.toDataURL("image/png");
+        document.location.href = strData.replace("image/png", strDownloadMime)
+}
+
+
+function testSave(){
         
-        //ctx.drawImage(partialGraph._core.domElements.edges,0,0)
-        //var oCanvas = ctx;  
-  */
-        //div = document.getElementById("sigma_nodes_1").getContext('2d');
-        //ctx = div.getContext("2d");
-        //oCanvas.drawImage(partialGraph._core.domElements.edges,0,0);
-        Canvas2Image.saveAsPNG(nodesCtx);
+        var strDownloadMime = "image/octet-stream"
         
-        /*
-        Canvas2Image.saveAsJPEG(oCanvas); // will prompt the user to save the image as JPEG.   
-        // Only supported by Firefox.  
-  
-        Canvas2Image.saveAsBMP(oCanvas);  // will prompt the user to save the image as BMP.  
-  
-  
-        // returns an <img> element containing the converted PNG image  
-        var oImgPNG = Canvas2Image.saveAsPNG(oCanvas, true);     
-  
-        // returns an <img> element containing the converted JPEG image (Only supported by Firefox)  
-        var oImgJPEG = Canvas2Image.saveAsJPEG(oCanvas, true);   
-                                                         
-        // returns an <img> element containing the converted BMP image  
-        var oImgBMP = Canvas2Image.saveAsBMP(oCanvas, true);   
-  
-  
-        // all the functions also takes width and height arguments.   
-        // These can be used to scale the resulting image:  
-  
-        // saves a PNG image scaled to 100x100  
-        Canvas2Image.saveAsPNG(oCanvas, false, 100, 100);  
-        */
-    });
+        var nodesDiv = partialGraph._core.domElements.nodes;
+        var nodesCtx = nodesDiv.getContext("2d");
+
+        var edgesDiv = partialGraph._core.domElements.edges;
+        var edgesCtx = edgesDiv.getContext("2d");
+
+        var labelsDiv = partialGraph._core.domElements.labels;
+        var labelsCtx = labelsDiv.getContext("2d");
+
+
+        nodesCtx.drawImage(labelsDiv,0,0);
+        edgesCtx.drawImage(nodesDiv,0,0);
+
+        var strData = edgesDiv.toDataURL("image/png");
+        pr(strData)
+        // document.location.href = strData.replace("image/png", strDownloadMime)
 }
 
+
+
+
 //obsolete
 function getSwitchButton(){
     return document.getElementById("switchbutton").src;