1 |
package Frey::jQuery::flot; |
2 |
use Moose; |
3 |
|
4 |
extends 'Frey'; |
5 |
with 'Frey::Web'; |
6 |
#with 'Frey::Storage'; |
7 |
with 'Frey::jQuery'; |
8 |
|
9 |
has skeleton => ( |
10 |
is => 'rw', |
11 |
isa => 'Str', |
12 |
required => 1, |
13 |
default => 'skeleton', |
14 |
); |
15 |
|
16 |
sub as_markup { |
17 |
my ($self) = @_; |
18 |
|
19 |
my $path = 'static/js/flot'; |
20 |
|
21 |
$self->add_js(qq| |
22 |
<!--[if IE]><script language="javascript" type="text/javascript" src="/$path/excanvas.pack.js"></script><![endif]--> |
23 |
<script language="javascript" type="text/javascript" src="/$path/jquery.flot.js"></script> |
24 |
|); |
25 |
|
26 |
$self->add_css("$path/layout.css"); |
27 |
|
28 |
q| |
29 |
<div id="placeholder" style="width:600px;height:300px;"></div> |
30 |
|
31 |
<script id="source" language="javascript" type="text/javascript"> |
32 |
$(function () { |
33 |
var d1 = []; |
34 |
for (var i = 0; i < 14; i += 0.5) |
35 |
d1.push([i, Math.sin(i)]); |
36 |
|
37 |
var d2 = [[0, 3], [4, 8], [8, 5], [9, 13]]; |
38 |
|
39 |
// a null signifies separate line segments |
40 |
var d3 = [[0, 12], [7, 12], null, [7, 2.5], [12, 2.5]]; |
41 |
|
42 |
$.plot($("#placeholder"), [ d1, d2, d3 ]); |
43 |
}); |
44 |
</script> |
45 |
|; |
46 |
} |
47 |
|
48 |
1; |