From 770ba5201f5c60b2bb36602ff9d359f641e33125 Mon Sep 17 00:00:00 2001 From: Yves Fischer Date: Sun, 23 Oct 2011 21:14:40 +0200 Subject: Charting with flask, rgraph and custom "timeseries database" --- .../RGraph/libraries/RGraph.common.context.js | 579 +++++++++++++++++++++ 1 file changed, 579 insertions(+) create mode 100644 schall/static/RGraph/libraries/RGraph.common.context.js (limited to 'schall/static/RGraph/libraries/RGraph.common.context.js') diff --git a/schall/static/RGraph/libraries/RGraph.common.context.js b/schall/static/RGraph/libraries/RGraph.common.context.js new file mode 100644 index 0000000..ee6c6ae --- /dev/null +++ b/schall/static/RGraph/libraries/RGraph.common.context.js @@ -0,0 +1,579 @@ + /** + * o------------------------------------------------------------------------------o + * | This file is part of the RGraph package - you can learn more at: | + * | | + * | http://www.rgraph.net | + * | | + * | This package is licensed under the RGraph license. For all kinds of business | + * | purposes there is a small one-time licensing fee to pay and for non | + * | commercial purposes it is free to use. You can read the full license here: | + * | | + * | http://www.rgraph.net/LICENSE.txt | + * o------------------------------------------------------------------------------o + */ + + if (typeof(RGraph) == 'undefined') RGraph = {isRGraph:true,type:'common'}; + + + /** + * This gunction shows a context menu containing the parameters + * provided to it + * + * @param object canvas The canvas object + * @param array menuitems The context menu menuitems + * @param object e The event object + */ + RGraph.Contextmenu = function (canvas, menuitems, e) + { + e = RGraph.FixEventObject(e); + + /** + * Fire the custom RGraph event onbeforecontextmenu + */ + RGraph.FireCustomEvent(canvas.__object__, 'onbeforecontextmenu'); + + /** + * Hide any existing menu + */ + if (RGraph.Registry.Get('chart.contextmenu')) { + RGraph.HideContext(); + } + + // Hide any zoomed canvas + RGraph.HideZoomedCanvas(); + + /** + * Hide the palette if necessary + */ + RGraph.HidePalette(); + + /** + * This is here to ensure annotating is OFF + */ + canvas.__object__.Set('chart.mousedown', false); + + var x = e.pageX; + var y = e.pageY; + var div = document.createElement('div'); + var bg = document.createElement('div'); + + div.className = 'RGraph_contextmenu'; + div.__canvas__ = canvas; /* Store a reference to the canvas on the contextmenu object */ + div.style.position = 'absolute'; + div.style.left = 0; + div.style.top = 0; + div.style.border = '1px solid black'; + div.style.backgroundColor = 'white'; + div.style.boxShadow = '3px 3px 3px rgba(96,96,96,0.5)'; + div.style.MozBoxShadow = '3px 3px 3px rgba(96,96,96,0.5)'; + div.style.WebkitBoxShadow = '3px 3px 3px rgba(96,96,96,0.5)'; + div.style.filter = 'progid:DXImageTransform.Microsoft.Shadow(color=#aaaaaa,direction=135)'; + div.style.opacity = 0; + + bg.className = 'RGraph_contextmenu_background'; + bg.style.position = 'absolute'; + bg.style.backgroundColor = '#ccc'; + bg.style.borderRight = '1px solid #aaa'; + bg.style.top = 0; + bg.style.left = 0; + bg.style.width = '18px'; + bg.style.height = '100%'; + bg.style.opacity = 0; + + + div = document.body.appendChild(div); + bg = div.appendChild(bg); + + + /** + * Now add the context menu items + */ + for (i=0; i document.body.offsetWidth) { + x -= div.offsetWidth; + } + + // Reposition the menu (now we have the real offsetWidth) + div.style.left = x + 'px'; + div.style.top = y + 'px'; + + /** + * Do a little fade in effect + */ + setTimeout("if (obj = RGraph.Registry.Get('chart.contextmenu')) obj.style.opacity = 0.2", 50); + setTimeout("if (obj = RGraph.Registry.Get('chart.contextmenu')) obj.style.opacity = 0.4", 100); + setTimeout("if (obj = RGraph.Registry.Get('chart.contextmenu')) obj.style.opacity = 0.6", 150); + setTimeout("if (obj = RGraph.Registry.Get('chart.contextmenu')) obj.style.opacity = 0.8", 200); + setTimeout("if (obj = RGraph.Registry.Get('chart.contextmenu')) obj.style.opacity = 1", 250); + + // The fade in effect on the left gray bar + setTimeout("if (obj = RGraph.Registry.Get('chart.contextmenu.bg')) obj.style.opacity = 0.2", 50); + setTimeout("if (obj = RGraph.Registry.Get('chart.contextmenu.bg')) obj.style.opacity = 0.4", 100); + setTimeout("if (obj = RGraph.Registry.Get('chart.contextmenu.bg')) obj.style.opacity = 0.6", 150); + setTimeout("if (obj = RGraph.Registry.Get('chart.contextmenu.bg')) obj.style.opacity = 0.8", 200); + setTimeout("if (obj = RGraph.Registry.Get('chart.contextmenu.bg')) obj.style.opacity = 1", 250); + + // Store the context menu in the registry + RGraph.Registry.Set('chart.contextmenu', div); + RGraph.Registry.Set('chart.contextmenu.bg', bg); + RGraph.Registry.Get('chart.contextmenu').oncontextmenu = function () {return false;}; + RGraph.Registry.Get('chart.contextmenu.bg').oncontextmenu = function () {return false;}; + + /** + * Install the event handlers that hide the context menu + */ + canvas.addEventListener('click', function () {RGraph.HideContext();}, false); + + window.onclick = function (e) + { + RGraph.HideContext(); + + // Removed on 3/7/10 - stops a bug in conjunction with annotating which presents itself on the Rscatter + //RGraph.Redraw(); + + // Fire the onclick event again + if (e.target.onclick && e.button == 0) { + e.target.onclick(e); + } + } + + window.onresize = function () {RGraph.HideContext();} + + /** + * Add the __shape__ object to the context menu + */ + + /** + * Set the shape coords from the .getShape() method + */ + if (typeof(canvas.__object__.getShape) == 'function') { + RGraph.Registry.Get('chart.contextmenu').__shape__ = canvas.__object__.getShape(e); + } + + + e.stopPropagation(); + + /** + * Fire the (RGraph) oncontextmenu event + */ + RGraph.FireCustomEvent(canvas.__object__, 'oncontextmenu'); + + return false; + } + + + /** + * Hides the context menu if it's currently visible + */ + RGraph.HideContext = function () + { + var cm = RGraph.Registry.Get('chart.contextmenu'); + var cmbg = RGraph.Registry.Get('chart.contextmenu.bg'); + + //Hide any submenu currently being displayed + RGraph.HideContextSubmenu(); + + if (cm) { + cm.parentNode.removeChild(cm); + cmbg.parentNode.removeChild(cmbg); + + cm.style.visibility = 'hidden'; + cm.style.display = 'none'; + RGraph.Registry.Set('chart.contextmenu', null); + + cmbg.style.visibility = 'hidden'; + cmbg.style.display = 'none'; + RGraph.Registry.Set('chart.contextmenu.bg', null); + } + } + + + /** + * Hides the context menus SUBMENU if it's currently visible + */ + RGraph.HideContextSubmenu = function () + { + var sub = RGraph.Registry.Get('chart.contextmenu.submenu'); + + if (sub) { + sub.style.visibility = 'none'; + sub.style.display = 'none'; + RGraph.Registry.Set('chart.contextmenu.submenu', null); + } + } + + + /** + * Shows the context menu after making a few checks - not opera (doesn't support oncontextmenu, + * not safari (tempermentality), not chrome (hmmm) + */ + RGraph.ShowContext = function (obj) + { + RGraph.HidePalette(); + + if (obj.Get('chart.contextmenu') && obj.Get('chart.contextmenu').length) { + + var isOpera = navigator.userAgent.indexOf('Opera') >= 0; + var isSafari = navigator.userAgent.indexOf('Safari') >= 0; + var isChrome = navigator.userAgent.indexOf('Chrome') >= 0; + var isMacFirefox = navigator.userAgent.indexOf('Firefox') > 0 && navigator.userAgent.indexOf('Mac') > 0; + var isIE9 = navigator.userAgent.indexOf('MSIE 9') >= 0; + + if (((!isOpera && !isSafari) || isChrome) && !isMacFirefox) { + + obj.canvas.oncontextmenu = function (e) + { + e = RGraph.FixEventObject(e); + + if (e.ctrlKey) return true; + + RGraph.Contextmenu(obj.canvas, obj.Get('chart.contextmenu'), e); + + return false; + } + + // Accomodate Opera and Safari - use double click event + } else { + + obj.canvas.addEventListener('dblclick', function (e) + { + if (e.ctrlKey) return true; + + if (!RGraph.Registry.Get('chart.contextmenu')) { + RGraph.Contextmenu(obj.canvas, obj.Get('chart.contextmenu'), e); + } + }, false); + } + } + } + + + /** + * This draws a submenu should it be necessary + * + * @param object obj The graph object + * @param object menu The context menu + */ + RGraph.Contextmenu_submenu = function (obj, menuitems, parentMenuItem) + { + RGraph.HideContextSubmenu(); + + var canvas = obj.canvas; + var context = obj.context; + var menu = parentMenuItem.parentNode; + + var subMenu = document.createElement('DIV'); + subMenu.style.position = 'absolute'; + subMenu.style.width = '100px'; + subMenu.style.top = menu.offsetTop + parentMenuItem.offsetTop + 'px'; + subMenu.style.left = (menu.offsetLeft + menu.offsetWidth - (RGraph.isIE8() ? 9 : 0)) + 'px'; + subMenu.style.backgroundColor = 'white'; + subMenu.style.border = '1px solid black'; + subMenu.className = 'RGraph_contextmenu'; + subMenu.__contextmenu__ = menu; + subMenu.style.boxShadow = '3px 3px 3px rgba(96,96,96,0.5)'; + subMenu.style.MozBoxShadow = '3px 3px 3px rgba(96,96,96,0.5)'; + subMenu.style.WebkitBoxShadow = '3px 3px 3px rgba(96,96,96,0.5)'; + subMenu.style.filter = 'progid:DXImageTransform.Microsoft.Shadow(color=#aaaaaa,direction=135)'; + document.body.appendChild(subMenu); + + for (var i=0; iURL:'; + div.innerHTML += '
A link using the URL: View
' + + + + /** + * Create the image rendition of the graph + */ + var img = document.createElement('IMG'); + RGraph.Registry.Set('chart.png', img); + img.__canvas__ = canvas; + img.__object__ = obj; + img.id = '__rgraph_image_img__'; + img.className = 'RGraph_png'; + + img.src = canvas.toDataURL(); + + div.appendChild(img); + + setTimeout(function () {document.getElementById("__rgraph_dataurl__").select();}, 50); + + window.addEventListener('resize', function (e){var img = RGraph.Registry.Get('chart.png');img.style.left = (document.body.clientWidth / 2) - (img.width / 2) + 'px';}, false); + + bg.onclick = function (e) + { + var div = document.getElementById("__rgraph_image_div__"); + var bg = document.getElementById("__rgraph_image_bg__"); + + if (div) { + div.style.opacity = 0; + + div.parentNode.removeChild(div); + + div.id = ''; + div.style.display = 'none'; + div = null; + } + + if (bg) { + bg.style.opacity = 0; + + bg.id = ''; + bg.style.display = 'none'; + bg = null; + } + } + + window.addEventListener('resize', function (e) {bg.onclick(e);}, false) + + /** + * This sets the image as a global variable, circumventing repeated calls to document.getElementById() + */ + __rgraph_image_bg__ = bg; + __rgraph_image_div__ = div; + + + setTimeout('__rgraph_image_div__.style.opacity = 0.2', 50); + setTimeout('__rgraph_image_div__.style.opacity = 0.4', 100); + setTimeout('__rgraph_image_div__.style.opacity = 0.6', 150); + setTimeout('__rgraph_image_div__.style.opacity = 0.8', 200); + setTimeout('__rgraph_image_div__.style.opacity = 1', 250); + + setTimeout('__rgraph_image_bg__.style.opacity = 0.1', 50); + setTimeout('__rgraph_image_bg__.style.opacity = 0.2', 100); + setTimeout('__rgraph_image_bg__.style.opacity = 0.3', 150); + setTimeout('__rgraph_image_bg__.style.opacity = 0.4', 200); + setTimeout('__rgraph_image_bg__.style.opacity = 0.5', 250); + + + + img.onclick = function (e) + { + if (e.stopPropagation) e.stopPropagation(); + else event.cancelBubble = true; + } + + if (event && event.stopPropagation) { + event.stopPropagation(); + } + } \ No newline at end of file -- cgit v1.2.1