[Jifty-commit] r694 - in jifty/trunk: . lib/Jifty/Mason share/web/static/js share/web/templates/__jifty

jifty-commit at lists.jifty.org jifty-commit at lists.jifty.org
Thu Mar 16 18:02:50 EST 2006


Author: alexmv
Date: Thu Mar 16 18:02:48 2006
New Revision: 694

Modified:
   jifty/trunk/   (props changed)
   jifty/trunk/lib/Jifty/Mason/Halo.pm
   jifty/trunk/share/web/static/css/halos.css
   jifty/trunk/share/web/static/js/halo.js
   jifty/trunk/share/web/templates/__jifty/halo

Log:
 r8531 at zoq-fot-pik:  chmrr | 2006-03-15 19:32:35 -0500
  * More halo work


Modified: jifty/trunk/lib/Jifty/Mason/Halo.pm
==============================================================================
--- jifty/trunk/lib/Jifty/Mason/Halo.pm	(original)
+++ jifty/trunk/lib/Jifty/Mason/Halo.pm	Thu Mar 16 18:02:48 2006
@@ -72,7 +72,7 @@
     my $self    = shift;
     my $context = shift;
 
-    return if $context->comp->path eq "/__jifty/halo";
+    return if $context->comp->path =~ "^/__jifty/halo";
 
     my $STACK = $context->request->notes('_halo_stack');
     my $INDEX_STACK = $context->request->notes('_halo_index_stack');
@@ -83,7 +83,6 @@
     my $frame = $STACK->[$FRAME_ID];
     $frame->{'render_time'} = int((Time::HiRes::time - $frame->{'start_time'}) * 1000)/1000;
 
-
     push @{$frame->{sql_statements}}, Jifty->handle->sql_statement_log;
     Jifty->handle->clear_sql_statement_log;
 
@@ -99,23 +98,6 @@
 
 }
 
-
-=head2 render_halo_actions STACK_FRAME
-
-When we're rendering the whole Mason component tree, this routine will
-render our bits for just one stack frame.
-
-
-=cut
-
-sub render_halo_actions {
-    my $self    = shift;
-    my $stack_frame = shift;
-
-    Jifty->web->mason->comp("/__jifty/halo", frame => $stack_frame);
-}
-
-
 =head2 _unrendered_component CONTEXT
 
 Returns true if we're not currently inside the "Body" section of the
@@ -151,44 +133,12 @@
     my $self  = shift;
     my @stack = @{ Jifty->web->mason->notes('_halo_stack') };
 
-    my $depth = 1;
-    Jifty->web->mason->out(q{<a href="#" id="render_info" onClick="Element.toggle('render_info_tree'); return false">Page info</a>});
-    Jifty->web->mason->out('<div style="display: none" id="render_info_tree">');
-    Jifty->web->mason->out('<ul>');
-
-    foreach my $item (@stack) {
-        $item->{'render_time'} ||= int((Time::HiRes::time - $item->{'start_time'}) * 1000)/1000;
-        if ( $item->{depth} > $depth ) {
-            Jifty->web->mason->out("<ul>");
-        } elsif ( $item->{depth} < $depth ) {
-            Jifty->web->mason->out("</ul>\n") for ($item->{depth}+1 .. $depth);
-        }
-
-        Jifty->web->mason->out( "<li>");
-
-        Jifty->web->mason->out(qq{<a href="#" class="halo_comp_info" } );
-        my $id = $item->{id};
-        Jifty->web->mason->out(qq|onMouseOver="halo_over('@{[$id]}')" |); 
-        Jifty->web->mason->out(qq|onMouseOut="halo_out('@{[$id]}')" |); 
-        Jifty->web->mason->out(qq|onClick="halo_toggle('$id'); return false;">|);
-        Jifty->web->mason->out(
-                  $item->{'path'} . " - "
-                . $item->{'render_time'}
-                . qq{</a> }
-        );
-
-        Jifty->web->mason->out(Jifty->web->tangent( url =>"/=/edit/mason_component/".$item->{'path'}, label => 'Edit'))
-          unless ($item->{subcomponent});
-        Jifty->web->mason->out( "</li>");
-        $depth = $item->{'depth'};
+    for (@stack) {
+        $_->{'render_time'} = int((Time::HiRes::time - $_->{'start_time'}) * 1000)/1000
+          unless defined $_->{'render_time'};
     }
 
-    Jifty->web->mason->out("</ul>\n") for (1 .. $depth);
-    Jifty->web->mason->out('</div>');
-
-    foreach my $item (@stack) {
-        $self->render_halo_actions($item);
-    }
+    Jifty->web->mason->comp("/__jifty/halo", stack => \@stack );
 }
 
 

Modified: jifty/trunk/share/web/static/css/halos.css
==============================================================================
--- jifty/trunk/share/web/static/css/halos.css	(original)
+++ jifty/trunk/share/web/static/css/halos.css	Thu Mar 16 18:02:48 2006
@@ -1,6 +1,5 @@
 .halo_actions {
     position: fixed;
-    width: 300px;
     border: 1px solid black;
     background: #ccc;
 }
@@ -19,6 +18,19 @@
     color: #fff;
 }
 
+.halo_actions .resize {
+    border: 5px solid #ccc;
+    border-bottom-color: #000;
+    border-right-color: #666;
+    border-left-color: #aaa;
+    cursor: pointer;
+    color: #ccc;
+    display: block;
+    height: 0;
+    width: 0;
+    overflow: hidden;
+}
+
 .halo_actions .section {
     color: #ccc;
     background-color: #300;

Modified: jifty/trunk/share/web/static/js/halo.js
==============================================================================
--- jifty/trunk/share/web/static/js/halo.js	(original)
+++ jifty/trunk/share/web/static/js/halo.js	Thu Mar 16 18:02:48 2006
@@ -1,14 +1,39 @@
+var halo_shown = null;
+
+var halo_top;
+var halo_left;
+var halo_width;
 
 function halo_toggle (id) {
+    if (halo_shown && (id != halo_shown)) {
+        halo_top   = $('halo-'+halo_shown+'-menu').style.top;
+        halo_left  = $('halo-'+halo_shown+'-menu').style.left;
+        halo_width = $('halo-'+halo_shown+'-menu').style.width;
+        Element.hide('halo-'+halo_shown+'-menu');
+    }
+    $('halo-'+id+'-menu').style.top   = halo_top;
+    $('halo-'+id+'-menu').style.left  = halo_left;
+    $('halo-'+id+'-menu').style.width = halo_width;
     Element.toggle('halo-'+id+'-menu');
+
+    Drag.init( $('halo-'+id+'-title'), $('halo-'+id+'-menu') );
+    init_resize($('halo-'+id+'-resize'), $('halo-'+id+'-menu') );
+
     var e = $('halo-'+id);
-//    new Draggable( $('halo-'+id+'-menu'), {starteffect: null, endeffect: null} );
-    Drag.init( $('halo-'+id+'-menu') );
+    if (Element.visible('halo-'+id+'-menu')) {
+        halo_shown = id;
+        Element.setStyle(e, {background: '#ffff80'});
+    } else {
+        halo_top   = $('halo-'+halo_shown+'-menu').style.top;
+        halo_left  = $('halo-'+halo_shown+'-menu').style.left;
+        halo_width = $('halo-'+halo_shown+'-menu').style.width;
+        halo_shown = null;
+        Element.setStyle(e, {background: 'inherit'});
+    }
+
     return false;
 }
 
-var halo_effects = {};
-
 function halo_over (id) {
     var e = $('halo-'+id);
     if (e) {
@@ -18,7 +43,22 @@
 
 function halo_out (id) {
     var e = $('halo-'+id);
-    if (e) {
+    if (e && ! Element.visible('halo-'+id+'-menu')) {
         Element.setStyle(e, {background: 'inherit'});
     }
 }
+
+function init_resize (e, w) {
+    e.xFrom = e.yFrom = 0;
+    Drag.init(e, null, null, null, null, null, true, true );
+    e.onDrag = function(x, y) {
+        resizeX( x, e, w );
+    };
+}
+
+function resizeX (x, grip, window) {
+    var width = parseInt( window.style.width );
+    var newWidth = Math.abs( width - ( x - grip.xFrom ) ) + 'px';
+    window.style.width = newWidth;
+    grip.xFrom = x;
+}

Modified: jifty/trunk/share/web/templates/__jifty/halo
==============================================================================
--- jifty/trunk/share/web/templates/__jifty/halo	(original)
+++ jifty/trunk/share/web/templates/__jifty/halo	Thu Mar 16 18:02:48 2006
@@ -1,12 +1,93 @@
-<div class="halo_actions" id="halo-<% $id %>-menu" style="display: none; top: 5px; left: 500px"  onMouseOver="halo_over('<% $id %>')"onMouseOut="halo_out('<% $id %>')">
+<a href="#" id="render_info" onClick="Element.toggle('render_info_tree'); return false">Page info</a>
+<div style="display: none" id="render_info_tree">
+<ul>
+% foreach my $item (@stack) {
+%     if ( $item->{depth} > $depth ) {
+<ul>
+%     } elsif ( $item->{depth} < $depth ) {
+%         for ($item->{depth}+1 .. $depth) {
+</ul>
+%         }
+%     }
+
+<li><a href="#" class="halo_comp_info" onMouseOver="halo_over('<% $item->{id} %>')"
+                                       onMouseOut="halo_out('<% $item->{id} %>')"
+                                       onClick="halo_toggle('<% $item->{id} %>'); return false;">
+<% $item->{'path'} %> - <% $item->{'render_time'} %></a> 
+% unless ($item->{subcomponent}) {
+<% Jifty->web->tangent( url =>"/=/edit/mason_component/".$item->{'path'}, label => 'Edit') %>
+% }
+</li>
+% $depth = $item->{'depth'};
+% }
+
+% for (1 .. $depth) {
+</ul>
+% }
+</div>
+
+% foreach my $item (@stack) {
+<& .frame, frame => $item &>
+% }
+<%args>
+ at stack
+</%args>
+<%init>
+for my $id (0..$#stack) {
+    my @kids;
+    my $looking = $id;
+    while (++$looking <= $#stack and $stack[$looking]->{depth} >= $stack[$id]->{depth} + 1) {
+        push @kids, {id => $stack[$looking]{id}, path => $stack[$looking]{path}, render_time => $stack[$looking]{render_time}}
+          if $stack[$looking]->{depth} == $stack[$id]->{depth} + 1;
+    }
+    $stack[$id]{kids} = \@kids;
+
+    if ($stack[$id]{depth} > 1) {
+        $looking = $id;
+        $looking-- while ($stack[$looking]{depth} >= $stack[$id]{depth});
+        $stack[$id]{parent} = {id => $stack[$looking]{id}, path => $stack[$looking]{path}, render_time => $stack[$looking]{render_time}};
+    }
+}
+
+my $depth = 1;
+
+</%init>
+
+
+
+<%def .frame>
+<div class="halo_actions" id="halo-<% $id %>-menu" style="display: none; top: 5px; left: 500px; min-width: 200px; width: 300px; z-index: 5;">
 <h1 id="halo-<% $id %>-title">
   <span style="float: right;"><a href="#" onClick="halo_toggle('<% $id %>'); return false">[ X ]</a></span>
   <% $frame->{name} %>
 </h1>
+<div style="position: absolute; bottom: 3px; right: 3px"><span class="resize" title="Resize" id="halo-<% $id %>-resize"></span></div>
+
 <div class="body">
 <div class="path"><% $frame->{path} %></div>
 <div class="time">Rendered in <% $frame->{'render_time'} %>s</div>
 </div>
+% if ($frame->{parent}) {
+<div class="section">Parent</div>
+<div class="body"><ul>
+<li><a href="#" class="halo_comp_info" onMouseOver="halo_over('<% $frame->{parent}{id} %>')"
+                                       onMouseOut="halo_out('<% $frame->{parent}{id} %>')"
+                                       onClick="halo_toggle('<% $frame->{parent}{id} %>'); return false;">
+<% $frame->{parent}{'path'} %> - <% $frame->{parent}{'render_time'} %></a></li>
+</ul></div>
+% }
+% if (@{$frame->{kids}}) {
+<div class="section">Children</div>
+<div class="body"><ul>
+% for my $item (@{$frame->{kids}}) {
+<li><a href="#" class="halo_comp_info" onMouseOver="halo_over('<% $item->{id} %>')"
+                                       onMouseOut="halo_out('<% $item->{id} %>')"
+                                       onClick="halo_toggle('<% $item->{id} %>'); return false;">
+<% $item->{'path'} %> - <% $item->{'render_time'} %></a></li>
+% }
+</ul>
+</div>
+% }
 % if (@args) {
 <div class="section">Variables</div>
 <div class="body"><ul class="fixed">
@@ -14,10 +95,12 @@
 <li><b><% $e->[0] %></b>:
 % if ($e->[1]) {
 % my $expanded = Jifty->web->serial;
-<span onmouseover="Element.show('<% $expanded %>')" onmouseout="Element.hide('<% $expanded %>')"><% $e->[1] %></span>
-<div id="<% $expanded %>" style="display: none; position: absolute; left: 200px; border: 1px solid black; background: #ccc; padding: 1em; padding-top: 0"><pre><% YAML::Dump($e->[2]) %></pre></div>
-% } else {
+<a href="#" onclick="Element.toggle('<% $expanded %>'); return false"><% $e->[1] %></a>
+<div id="<% $expanded %>" style="display: none; position: absolute; left: 200px; border: 1px solid black; background: #ccc; padding: 1em; padding-top: 0; width: 300px; height: 500px; overflow: auto"><pre><% YAML::Dump($e->[2]) %></pre></div>
+% } elsif (defined $e->[2]) {
 <% $e->[2] %>
+% } else {
+<i>undef</i>
 % }
 </li>
 % }
@@ -25,13 +108,25 @@
 % }
 % if (@stmts) {
 <div class="section">SQL Statements</div>
-<div class="body"><ul>
+<div class="body" style="height: 300px; overflow: auto"><ul>
 % for (@stmts) {
-<li class="fixed"><% $_ %></li>
+<li>
+<span class="fixed"><% $_->[1] %></span><br />
+% if (@{$_->[2]}) {
+<b>Bindings:</b> <tt><% join(',', @{$_->[2]}) %></tt><br />
+% }
+<i><% $_->[3] %> seconds</i>
+</li>
 % }
 </ul></div>
 % }
-<div class="section"><% Jifty->web->tangent( url =>"/=/edit/mason_component/".$frame->{'path'}, label => 'Edit') %></div>
+<div class="section">
+% unless ($frame->{subcomponent}) {
+<% Jifty->web->tangent( url =>"/=/edit/mason_component/".$frame->{'path'}, label => 'Edit') %>
+% } else {
+&nbsp;     
+% }
+</div>
 </div>
 <%args>
 $frame
@@ -46,10 +141,7 @@
 @args = sort {$a->[0] cmp $b->[0]} @args;
 
 my $prev = '';
-my @stmts;
-for (@{$frame->{'sql_statements'}}) {
-    push @stmts, $_->[1] if $_->[1] ne $prev;
-    $prev = $_->[1];
-}
+my @stmts = @{$frame->{'sql_statements'}};
 
-</%init>
\ No newline at end of file
+</%init>
+</%def>
\ No newline at end of file


More information about the Jifty-commit mailing list