2 * o------------------------------------------------------------------------------o
3 * | This file is part of the RGraph package - you can learn more at: |
5 * | http://www.rgraph.net |
7 * | This package is licensed under the RGraph license. For all kinds of business |
8 * | purposes there is a small one-time licensing fee to pay and for non |
9 * | commercial purposes it is free to use. You can read the full license here: |
11 * | http://www.rgraph.net/LICENSE.txt |
12 * o------------------------------------------------------------------------------o
15 if (typeof(RGraph) == 'undefined') RGraph = {};
18 * The LED lights constructor
20 * @param object canvas The canvas object
21 * @param array data The chart data
23 RGraph.LED = function (id, text)
25 // Get the canvas and context objects
27 this.canvas = document.getElementById(id);
28 this.context = this.canvas.getContext ? this.canvas.getContext("2d") : null;
29 this.canvas.__object__ = this;
35 * Compatibility with older browsers
37 RGraph.OldBrowserCompat(this.context);
41 * Set the string that is to be displayed
46 * The letters and numbers
49 'a': [[0,1,1,0],[1,0,0,1],[1,0,0,1],[1,1,1,1],[1,0,0,1],[1,0,0,1],[1,0,0,1]],
50 'b': [[1,1,1,0],[1,0,0,1],[1,0,0,1],[1,1,1,0],[1,0,0,1],[1,0,0,1],[1,1,1,0]],
51 'c': [[0,1,1,0],[1,0,0,1],[1,0,0,0],[1,0,0,0],[1,0,0,0],[1,0,0,1],[0,1,1,0]],
52 'd': [[1,1,1,0],[1,0,0,1],[1,0,0,1],[1,0,0,1],[1,0,0,1],[1,0,0,1],[1,1,1,0]],
53 'e': [[1,1,1,1],[1,0,0,0],[1,0,0,0],[1,1,1,0],[1,0,0,0],[1,0,0,0],[1,1,1,1]],
54 'f': [[1,1,1,1],[1,0,0,0],[1,0,0,0],[1,1,1,0],[1,0,0,0],[1,0,0,0],[1,0,0,0]],
55 'g': [[0,1,1,0],[1,0,0,1],[1,0,0,0],[1,0,1,1],[1,0,0,1],[1,0,0,1],[0,1,1,0]],
56 'h': [[1,0,0,1],[1,0,0,1],[1,0,0,1],[1,1,1,1],[1,0,0,1],[1,0,0,1],[1,0,0,1]],
57 'i': [[0,1,1,1],[0,0,1,0],[0,0,1,0],[0,0,1,0],[0,0,1,0],[0,0,1,0],[0,1,1,1]],
58 'j': [[0,1,1,1],[0,0,1,0],[0,0,1,0],[0,0,1,0],[0,0,1,0],[0,0,1,0],[0,1,0,0]],
59 'k': [[1,0,0,1],[1,0,0,1],[1,0,1,0],[1,1,0,0],[1,0,1,0],[1,0,0,1],[1,0,0,1]],
60 'l': [[1,0,0,0],[1,0,0,0],[1,0,0,0],[1,0,0,0],[1,0,0,0],[1,0,0,0],[1,1,1,1]],
61 'm': [[1,0,0,1],[1,1,1,1],[1,0,0,1],[1,0,0,1],[1,0,0,1],[1,0,0,1],[1,0,0,1]],
62 'n': [[1,0,0,1],[1,1,0,1],[1,0,1,1],[1,0,0,1],[1,0,0,1],[1,0,0,1],[1,0,0,1]],
63 'o': [[0,1,1,0],[1,0,0,1],[1,0,0,1],[1,0,0,1],[1,0,0,1],[1,0,0,1],[0,1,1,0]],
64 'p': [[1,1,1,0],[1,0,0,1],[1,0,0,1],[1,1,1,0],[1,0,0,0],[1,0,0,0],[1,0,0,0]],
65 'q': [[0,1,1,0],[1,0,0,1],[1,0,0,1],[1,0,0,1],[1,0,0,1],[1,0,1,1],[0,1,1,1]],
66 'r': [[1,1,1,0],[1,0,0,1],[1,0,0,1],[1,1,1,0],[1,0,1,0],[1,0,0,1],[1,0,0,1]],
67 's': [[0,1,1,0],[1,0,0,1],[1,0,0,0],[0,1,1,0],[0,0,0,1],[1,0,0,1],[0,1,1,0]],
68 't': [[1,1,1,0],[0,1,0,0],[0,1,0,0],[0,1,0,0],[0,1,0,0],[0,1,0,0],[0,1,0,0]],
69 'u': [[1,0,0,1],[1,0,0,1],[1,0,0,1],[1,0,0,1],[1,0,0,1],[1,0,0,1],[0,1,1,0]],
70 'v': [[1,0,1],[1,0,1],[1,0,1],[1,0,1],[1,0,1],[0,1,0],[0,1,0]],
71 'w': [[1,0,0,1],[1,0,0,1],[1,0,0,1],[1,0,0,1],[1,0,0,1],[1,1,1,1],[0,1,1,0]],
72 'x': [[0,1,0,1],[0,1,0,1],[0,1,0,1],[0,0,1,0],[0,1,0,1],[0,1,0,1],[0,1,0,1]],
73 'y': [[0,1,0,1],[0,1,0,1],[0,0,1,0],[0,0,1,0],[0,0,1,0],[0,0,1,0],[0,0,1,0]],
74 'z': [[1,1,1,1],[0,0,0,1],[0,0,1,0],[0,0,1,0],[0,1,0,0],[1,0,0,0],[1,1,1,1]],
75 ' ': [[],[],[],[],[], [], []],
76 '0': [[0,1,1,0],[1,0,0,1],[1,0,0,1],[1,0,0,1],[1,0,0,1],[1,0,0,1],[0,1,1,0]],
77 '1': [[0,0,1,0],[0,1,1,0],[0,0,1,0],[0,0,1,0],[0,0,1,0],[0,0,1,0],[0,1,1,1]],
78 '2': [[0,1,1,0],[1,0,0,1],[0,0,0,1],[0,0,1,0],[0,1,,0],[1,0,0,0],[1,1,1,1]],
79 '3': [[0,1,1,0],[1,0,0,1],[0,0,0,1],[0,1,1,0],[0,0,0,1],[1,0,0,1],[0,1,1,0]],
80 '4': [[1,0,0,0],[1,0,0,0],[1,0,1,0],[1,0,1,0],[1,1,1,1],[0,0,1,0],[0,0,1,0]],
81 '5': [[1,1,1,1],[1,0,0,0],[1,0,0,0],[1,1,1,0],[0,0,0,1],[1,0,0,1],[0,1,1,0]],
82 '6': [[0,1,1,0],[1,0,0,1],[1,0,0,0],[1,1,1,0],[1,0,0,1],[1,0,0,1],[0,1,1,0]],
83 '7': [[1,1,1,1],[0,0,0,1],[0,0,0,1],[0,0,1,0],[0,1,0,0],[0,1,0,0],[0,1,0,0]],
84 '8': [[0,1,1,0],[1,0,0,1],[1,0,0,1],[0,1,1,0],[1,0,0,1],[1,0,0,1],[0,1,1,0]],
85 '9': [[0,1,1,1],[1,0,0,1],[1,0,0,1],[0,1,1,1],[0,0,0,1],[0,0,0,1],[0,0,0,1]]
88 // Various config type stuff
90 'chart.background': 'white',
92 'chart.light': '#f66',
93 'chart.zoom.factor': 1.5,
94 'chart.zoom.fade.in': true,
95 'chart.zoom.fade.out': true,
96 'chart.zoom.hdir': 'right',
97 'chart.zoom.vdir': 'down',
98 'chart.zoom.frames': 10,
99 'chart.zoom.delay': 50,
100 'chart.zoom.shadow': true,
101 'chart.zoom.background': true,
102 'chart.zoom.action': 'zoom',
103 'chart.resizable': false
108 alert('[LED] No canvas support');
112 // Check the canvasText library has been included
113 if (typeof(RGraph) == 'undefined') {
114 alert('[LED] Fatal error: The common library does not appear to have been included');
122 * @param name string The name of the property to set
123 * @param value mixed The value of the property
125 RGraph.LED.prototype.Set = function (name, value)
127 this.properties[name.toLowerCase()] = value;
134 * @param name string The name of the property to get
136 RGraph.LED.prototype.Get = function (name)
138 return this.properties[name.toLowerCase()];
143 * This draws the LEDs
145 RGraph.LED.prototype.Draw = function ()
148 * Fire the onbeforedraw event
150 RGraph.FireCustomEvent(this, 'onbeforedraw');
153 // First clear the canvas, using the background colour
154 RGraph.Clear(this.canvas, this.Get('chart.background'));
156 for (var l=0; l<this.text.length; l++) {
157 this.DrawLetter(this.text.charAt(l), l);
161 * Set the title attribute on the canvas
163 this.canvas.title = RGraph.rtrim(this.text);
166 * Setup the context menu if required
168 if (this.Get('chart.contextmenu')) {
169 RGraph.ShowContext(this);
173 * This bit shows the mini zoom window if requested
175 if (this.Get('chart.zoom.mode') == 'thumbnail' || this.Get('chart.zoom.mode') == 'area') {
176 RGraph.ShowZoomWindow(this);
181 * This function enables resizing
183 if (this.Get('chart.resizable')) {
184 RGraph.AllowResizing(this);
188 * Fire the RGraph ondraw event
190 RGraph.FireCustomEvent(this, 'ondraw');
195 * Draws a single letter
197 * @param string lights The lights to draw to draw
198 * @param int index The position of the letter
200 RGraph.LED.prototype.DrawLetter = function (letter, index)
202 var light = this.Get('chart.light');
203 var dark = this.Get('chart.dark');
204 var lights = (this.lights[letter] ? this.lights[letter] : [[0,0,0,0,0],[0,0,0,0,0],[0,0,0,0,0],[0,0,0,0,0],[0,0,0,0,0],[0,0,0,0,0],[0,0,0,0,0]]);
205 var lwidth = this.canvas.width / this.text.length;
206 var diameter = lwidth / 5;
207 var radius = diameter / 2;
209 for (var i=0; i<7; i++) {
210 for (var j=0; j<5; j++) {
212 var x = (j * diameter) + (index * lwidth) + radius;
213 var y = (this.canvas.height / 2) + ((i * diameter) + 2) - (7 * radius);
216 this.context.fillStyle = (lights[i][j] ? light : dark);
217 this.context.strokeStyle = (lights[i][j] ? '#ccc' : 'rgba(0,0,0,0)');
218 this.context.beginPath();
219 this.context.arc(x, y, radius, 0, 6.28, 0);
221 this.context.stroke();