Frey/CSS/Area.pm

package Frey::CSS::Area;
use Moose;

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

=head1 DESCRIPTION

CSS area graph based on example from L<http://www.khanate.co.uk/graph/>

=cut

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

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

        $self->add_css( 'static/Frey/CSS/Area.css' );
        $self->add_js ( 'static/Frey/CSS/Area.js'  );

        qq|

<ul class="graph" onclick="gr.makeGraphs(); return false;">

<li><span class="name">Mon</span> <span class="val">100</span></li>
<li><span class="name">Tue</span> <span class="val">200</span></li>
<li><span class="name">Wed</span> <span class="val">150</span></li>
<li><span class="name">Thu</span> <span class="val">180</span></li>
<li><span class="name">Fri</span> <span class="val">100</span></li>
<li><span class="name">Sat</span> <span class="val">200</span></li>
<li><span class="name">Sun</span> <span class="val">150</span></li>
<li><span class="name">Mon</span> <span class="val">80</span></li>
<li><span class="name">Tue</span> <span class="val">75</span></li>
<li><span class="name">Wed</span> <span class="val">125</span></li>
<li><span class="name">Thu</span> <span class="val">125</span></li>
<li><span class="name">Fri</span> <span class="val">160</span></li>
<li><span class="name">Sat</span> <span class="val">160</span></li>
<li><span class="name">Sun</span> <span class="val">15</span></li>
</ul>
</div>

<br style="clear:both" />
<div class="note">
Click on the table or graph to switch view
</div>

        |;
}

1;
1	package Frey::CSS::Area;
2	use Moose;
3
4	extends 'Frey';
5	with 'Frey::Web';
6	#with 'Frey::Storage';
7
8	=head1 DESCRIPTION
9
10	CSS area graph based on example from L<http://www.khanate.co.uk/graph/>
11
12	=cut
13
14	has skeleton => (
15	is => 'rw',
16	isa => 'Str',
17	required => 1,
18	default => 'skeleton',
19	);
20
21	sub as_markup {
22	my ($self) = @_;
23
24	$self->add_css( 'static/Frey/CSS/Area.css' );
25	$self->add_js ( 'static/Frey/CSS/Area.js' );
26
27	qq\|
28
29	<ul class="graph" onclick="gr.makeGraphs(); return false;">
30
31	<li><span class="name">Mon</span> <span class="val">100</span></li>
32	<li><span class="name">Tue</span> <span class="val">200</span></li>
33	<li><span class="name">Wed</span> <span class="val">150</span></li>
34	<li><span class="name">Thu</span> <span class="val">180</span></li>
35	<li><span class="name">Fri</span> <span class="val">100</span></li>
36	<li><span class="name">Sat</span> <span class="val">200</span></li>
37	<li><span class="name">Sun</span> <span class="val">150</span></li>
38	<li><span class="name">Mon</span> <span class="val">80</span></li>
39	<li><span class="name">Tue</span> <span class="val">75</span></li>
40	<li><span class="name">Wed</span> <span class="val">125</span></li>
41	<li><span class="name">Thu</span> <span class="val">125</span></li>
42	<li><span class="name">Fri</span> <span class="val">160</span></li>
43	<li><span class="name">Sat</span> <span class="val">160</span></li>
44	<li><span class="name">Sun</span> <span class="val">15</span></li>
45	</ul>
46	</div>
47
48	<br style="clear:both" />
49	<div class="note">
50	Click on the table or graph to switch view
51	</div>
52
53	\|;
54	}
55
56	1;