5 files changed, 26 insertions, 2 deletions

diff --git a/detail.php b/detail.php
index 777294b..270a935 100644
--- a/detail.php
+++ b/detail.php
@@ -55,7 +55,9 @@ print "</ul>\n";
 
 if ($CONFIG['graph_type'] == 'canvas') {
         chdir($CONFIG['webdir']);
+        printf('<canvas id="%s" class="rrd">', generate_uuid());
         include $CONFIG['webdir'].'/graph.php';
+        print '</canvas>';
 } else {
         printf("<img src=\"%s%s\">\n",
                 htmlentities($CONFIG['weburl']),
diff --git a/inc/functions.inc.php b/inc/functions.inc.php
index abe0763..df02d20 100644
--- a/inc/functions.inc.php
+++ b/inc/functions.inc.php
@@ -59,3 +59,13 @@ function error_image() {
         readfile('layout/error.png');
         exit;
 }
+
+function generate_uuid() {
+        return sprintf( '%04x%04x-%04x-%04x-%04x-%04x%04x%04x',
+                mt_rand( 0, 0xffff ), mt_rand( 0, 0xffff ),
+                mt_rand( 0, 0xffff ),
+                mt_rand( 0, 0x0fff ) | 0x4000,
+                mt_rand( 0, 0x3fff ) | 0x8000,
+                mt_rand( 0, 0xffff ), mt_rand( 0, 0xffff ), mt_rand( 0, 0xffff )
+        );
+}
diff --git a/inc/html.inc.php b/inc/html.inc.php
index 161af73..bc22ba3 100644
--- a/inc/html.inc.php
+++ b/inc/html.inc.php
@@ -338,7 +338,15 @@ function graphs_from_plugin($host, $plugin, $overview=false) {
                         isset($items['t']) ? $_GET['t'] = $items['t'] : $_GET['t'] = '';
                         isset($items['ti']) ? $_GET['ti'] = $items['ti'] : $_GET['ti'] = '';
                         $_GET['s'] = $time;
+                        $uuid = generate_uuid();
+                        printf('<canvas id="%s" class="rrd">', $uuid);
                         include $CONFIG['webdir'].'/graph.php';
+                        print '</canvas>';
+                        printf('<a href="%s%s"><img id="%s-img" alt="graph"></a>'."\n",
+                                htmlentities($CONFIG['weburl']),
+                                htmlentities(build_url('detail.php', $items, $time)),
+                                $uuid
+                        );
                 } else {
                         printf('<a href="%1$s%2$s"><img src="%1$s%3$s"></a>'."\n",
                                 htmlentities($CONFIG['weburl']),
diff --git a/js/CGP.js b/js/CGP.js
index a4fdd5b..a83380f 100644
--- a/js/CGP.js
+++ b/js/CGP.js
@@ -130,6 +130,12 @@ var CGP = (function() {
         var canvases = document.getElementsByClassName('rrd');
         for (var i = 0; i < canvases.length; i++) {
             draw(canvases[i].id, async);
+
+            if (document.getElementById(canvases[i].id + '-img')) {
+                document.getElementById(canvases[i].id).style.display = 'none';
+                var dataURL = canvases[i].toDataURL();
+                document.getElementById(canvases[i].id + '-img').src = dataURL;
+            }
         }
     }
 
diff --git a/type/Base.class.php b/type/Base.class.php
index 8d51121..ee5050b 100644
--- a/type/Base.class.php
+++ b/type/Base.class.php
@@ -225,11 +225,9 @@ class Type_Base {
                                 print '</pre>';
                         break;
                         case 'canvas':
-                                printf('<canvas id="%s" class="rrd">', sha1(serialize($graphoptions)));
                                 foreach ($graphoptions as $d) {
                                         printf("\"%s\"\n", htmlentities($d));
                                 }
-                                print '</canvas>';
                         break;
                         case 'debug':
                         case 1: