Frey/jQuery/flot.pm

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

extends 'Frey';
with 'Frey::Web';
#with 'Frey::Storage';
with 'Frey::jQuery';
with 'Frey::File'; # FIXME inline on demand?
with 'Frey::Web::IFrame';

use DateTimeX::Easy;

use lib 'lib';
use JSON;

has 'sponge' => (
        is => 'rw',
        isa => 'Sponge',
        required => 1,
);

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

        my $sponge = $self->sponge;

        my $by_col;
        my $unit_by_col;

        foreach my $row ( @{ $sponge->{rows} } ) {
                my $time = eval {
                        DateTimeX::Easy->new( $row->[0] )->epoch * 1000; # ms
                };
                die "FATAL: sponge first column ", $self->dump( $row->[0] ), " isn't valid time because of: $@" if $@;
                foreach my $col ( 1 .. $#$row ) {
                        my $v = $row->[$col];
                        $unit_by_col->{$col} = $1 if $v =~ s{([M%])$}{};
                        push @{ $by_col->{$col} }, [ $time, $v ];
                }
        }

        my $dataset;
        my @names;
        foreach my $nr ( keys %$by_col ) {
                my $name = $sponge->{NAME}->[$nr];
                $dataset->{ $name }->{label}
                        ||= $name
                          . ( $unit_by_col->{$nr} ? ' [' . $unit_by_col->{$nr} . ']' : '' )
                          ;
                $dataset->{ $name }->{data} = $by_col->{$nr};
        }

        my $placeholder = qq|<div class="frey-error">no data found</div>|;
        my $data_js = '';
        if ( $dataset ) {
                $data_js = 'var datasets = ' . to_json( $dataset ) . ";\n";
                $placeholder = qq|
                        <div id="placeholder" style="width:600px;height:300px;"></div>
                        <div id="selection">no selection</div>
                |
                . $self->iframe_html
                ;
        }

        warn "# $data_js" if $self->debug;

        my $form = '<!-- no sar_command in sponge -->';
        my $sar_command = $sponge->{sar_command} || warn "no sar_command in spunge";
        if ( my $c = $sar_command ) {
                $c =~ s{sar\s(-n\s*\d+)?(.*?)$}{sar $1};

                $form = qq|
                        <form method="post">
                        <b>From</b> <input type="submit" value="refresh"><br>
                |;

                my $flags = `atsar help 2>&1`;
                $flags =~ s{^.+flags:\s+}{}s;
                $flags =~ s{^\s*-[AS].+$}{}gm; # remove -A and -S flags which doesn't make sense
                $flags =~ s{^\s+}{}s;

                foreach my $line ( split(/\s*\n\s*/, $flags ) ) {
                        my ( $flag, $desc ) = split(/\s+/, $line, 2 );
                        warn "# $flag | $desc" if $self->debug;
                        my $v = "$c $flag";
                        my $checked = '';
                        $checked = " checked" if $sar_command =~ m{$flag};
                        $form .= qq|<input type="radio" name="sar_command" value="$v"$checked>$desc<br>\n|;
                }

                $form .= qq|
                        </form>
                |;

                $self->add_css(q|
                        #choices, form { float: left; }
                |);
        }

        return
        qq|

                <code>$sar_command</code>

                $placeholder

                $form

                <div id="choices"><b>Show</b></div>

        | . q|
                <script id="source" language="javascript" type="text/javascript">
                $(function () {
                        var options = {
                                selection: { mode: "x" },
                                //yaxis: { min: 0, max: 100 },
                                xaxis: { mode: "time" }
                        };

                        |
                        . $data_js
                        . $self->read_file('static/Frey/jQuery/flot/dataset_checkboxes.js')
                        . 
                        q|

                });
                </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	with 'Frey::File'; # FIXME inline on demand?
9	with 'Frey::Web::IFrame';
10
11	use DateTimeX::Easy;
12
13	use lib 'lib';
14	use JSON;
15
16	has 'sponge' => (
17	is => 'rw',
18	isa => 'Sponge',
19	required => 1,
20	);
21
22	sub as_markup {
23	my ($self) = @_;
24
25	my $path = 'static/js/flot';
26
27	$self->add_js(qq\|
28	<!--[if IE]><script language="javascript" type="text/javascript" src="/$path/excanvas.pack.js"></script><![endif]-->
29	<script language="javascript" type="text/javascript" src="/$path/jquery.flot.js"></script>
30	\|);
31
32	my $sponge = $self->sponge;
33
34	my $by_col;
35	my $unit_by_col;
36
37	foreach my $row ( @{ $sponge->{rows} } ) {
38	my $time = eval {
39	DateTimeX::Easy->new( $row->[0] )->epoch * 1000; # ms
40	};
41	die "FATAL: sponge first column ", $self->dump( $row->[0] ), " isn't valid time because of: $@" if $@;
42	foreach my $col ( 1 .. $#$row ) {
43	my $v = $row->[$col];
44	$unit_by_col->{$col} = $1 if $v =~ s{([M%])$}{};
45	push @{ $by_col->{$col} }, [ $time, $v ];
46	}
47	}
48
49	my $dataset;
50	my @names;
51	foreach my $nr ( keys %$by_col ) {
52	my $name = $sponge->{NAME}->[$nr];
53	$dataset->{ $name }->{label}
54	\|\|= $name
55	. ( $unit_by_col->{$nr} ? ' [' . $unit_by_col->{$nr} . ']' : '' )
56	;
57	$dataset->{ $name }->{data} = $by_col->{$nr};
58	}
59
60	my $placeholder = qq\|<div class="frey-error">no data found</div>\|;
61	my $data_js = '';
62	if ( $dataset ) {
63	$data_js = 'var datasets = ' . to_json( $dataset ) . ";\n";
64	$placeholder = qq\|
65	<div id="placeholder" style="width:600px;height:300px;"></div>
66	<div id="selection">no selection</div>
67	\|
68	. $self->iframe_html
69	;
70	}
71
72	warn "# $data_js" if $self->debug;
73
74	my $form = '<!-- no sar_command in sponge -->';
75	my $sar_command = $sponge->{sar_command} \|\| warn "no sar_command in spunge";
76	if ( my $c = $sar_command ) {
77	$c =~ s{sar\s(-n\s\d+)?(.?)$}{sar $1};
78
79	$form = qq\|
80	<form method="post">
81	<b>From</b> <input type="submit" value="refresh"><br>
82	\|;
83
84	my $flags = `atsar help 2>&1`;
85	$flags =~ s{^.+flags:\s+}{}s;
86	$flags =~ s{^\s*-[AS].+$}{}gm; # remove -A and -S flags which doesn't make sense
87	$flags =~ s{^\s+}{}s;
88
89	foreach my $line ( split(/\s\n\s/, $flags ) ) {
90	my ( $flag, $desc ) = split(/\s+/, $line, 2 );
91	warn "# $flag \| $desc" if $self->debug;
92	my $v = "$c $flag";
93	my $checked = '';
94	$checked = " checked" if $sar_command =~ m{$flag};
95	$form .= qq\|<input type="radio" name="sar_command" value="$v"$checked>$desc<br>\n\|;
96	}
97
98	$form .= qq\|
99	</form>
100	\|;
101
102	$self->add_css(q\|
103	#choices, form { float: left; }
104	\|);
105	}
106
107	return
108	qq\|
109
110	<code>$sar_command</code>
111
112	$placeholder
113
114	$form
115
116	<div id="choices"><b>Show</b></div>
117
118	\| . q\|
119	<script id="source" language="javascript" type="text/javascript">
120	$(function () {
121	var options = {
122	selection: { mode: "x" },
123	//yaxis: { min: 0, max: 100 },
124	xaxis: { mode: "time" }
125	};
126
127	\|
128	. $data_js
129	. $self->read_file('static/Frey/jQuery/flot/dataset_checkboxes.js')
130	.
131	q\|
132
133	});
134	</script>
135
136	\|;
137	}
138
139	1;