Frey/jQuery/flot.pm

package Frey::jQuery::flot;
use Moose;

extends 'Frey';
with 'Frey::Web';
#with 'Frey::Storage';
with 'Frey::jQuery';

has skeleton => (
        is => 'rw',
        isa => 'Str',
        required => 1,
        default => 'skeleton',
);

sub as_markup {
        my ($self) = @_;

        my $path = 'static/js/flot';

        $self->add_js(qq|
                <!--[if IE]><script language="javascript" type="text/javascript" src="/$path/excanvas.pack.js"></script><![endif]-->
                <script language="javascript" type="text/javascript" src="/$path/jquery.flot.js"></script>
        |);

        $self->add_css("$path/layout.css");

        q|
        <div id="placeholder" style="width:600px;height:300px;"></div>

                <script id="source" language="javascript" type="text/javascript">
                $(function () {
                        var d1 = [];
                        for (var i = 0; i < 14; i += 0.5)
                                d1.push([i, Math.sin(i)]);

                        var d2 = [[0, 3], [4, 8], [8, 5], [9, 13]];

                        // a null signifies separate line segments
                        var d3 = [[0, 12], [7, 12], null, [7, 2.5], [12, 2.5]];
                        
                        $.plot($("#placeholder"), [ d1, d2, d3 ]);
                });
                </script>
        |;
}

1;
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;