Changeset a81a9050542449e79efe26e1d0a3cfe159e85821

Show
Ignore:
Timestamp:
12/02/08 23:10:14 (5 years ago)
Author:
Umar Farooq <umar@omniti.com>
git-committer:
Umar Farooq <umar@omniti.com> 1228259414 +0000
git-parent:

[9bac9ef78989b8afdc9ffdccd996e4cfeab65643]

git-author:
Umar Farooq <umar@omniti.com> 1228259414 +0000
Message:

locking and unlocking graphs for editing, still some bugs when a blank graph is made

Files:

Legend:

Unmodified
Added
Removed
Modified
Copied
Moved
  • ui/web/htdocs/css/style.css

    r86bd53e ra81a905  
    783783padding:0 4px; 
    784784} 
     785span.editGraph { 
     786border:1px solid #DDDDDD; 
     787float:right; 
     788margin-left:4px; 
     789padding:0 4px; 
     790font-weight: bold; 
     791color:#660000; 
     792} 
     793 
    785794span.rememberGraph { 
    786795border:1px solid #DDDDDD; 
  • ui/web/htdocs/graph_panel.inc

    r9bac9ef ra81a905  
    1212var color_pool = Array('#33aa33','#4a00dc','#caac00','#3377cc','#00acfa','#cc3333') 
    1313var color_sel = 0; 
     14var locked = true; 
     15                 
     16function lock_forms() { 
     17        $("input[@type='text']").attr("disabled", "true"); 
     18        $("input[@type='checkbox']").attr("disabled", "true"); 
     19        $("input[@type='radio']").attr("disabled", "true"); 
     20        $("select").attr("disabled", "true"); 
     21        $("h2#graphTitle").unbind(); 
     22        $(".datatitle").unbind(); 
     23} 
     24 
     25function unlock_forms() { 
     26        $("input[@type='text']").removeAttr("disabled"); 
     27        $("input[@type='checkbox']").removeAttr("disabled"); 
     28        $("input[@type='radio']").removeAttr("disabled"); 
     29        $("select").removeAttr("disabled"); 
     30 
     31        $("h2#graphTitle").editable(function(value, settings) {  
     32           graphinfo.title = value; 
     33           update_current_graph(false); 
     34           return(value); 
     35           }, { }); 
     36 
     37        $(".datatitle").editable(function(value, settings) {       
     38           d.name = value; 
     39           update_current_graph(true); 
     40           return(value); 
     41        }, { }); 
     42}  
    1443 
    1544function set_current_graph_id(id) { 
    16   if(id!='')  graphinfo.saved = true; 
     45  if(id!='')  { 
     46    graphinfo.saved = true; 
     47    locked = false; 
     48    unlock_forms(); 
     49  } 
    1750  current_graph_id = id; 
    1851  fetch_graph_info(current_graph_id); 
     
    4881} 
    4982function graph_add_datapoint(d) { 
    50   if(d.axis == undefined) { d.axis = 'l'; } 
    51   if(d.name == undefined) { d.name = d.target + '`' + d.metric_name; } 
    52   graphinfo.datapoints.push(d); 
    53   gtool_add_datapoint(d); 
    54   update_current_graph(true); 
     83  if(!locked){            
     84    if(d.axis == undefined) { d.axis = 'l'; } 
     85    if(d.name == undefined) { d.name = d.target + '`' + d.metric_name; } 
     86    graphinfo.datapoints.push(d); 
     87    gtool_add_datapoint(d); 
     88    update_current_graph(true); 
     89  } 
    5590} 
    5691function gtool_add_guide() { 
     
    97132                                   (d.opacity == null) ? 0.2 : d.opacity); 
    98133  o.find('.colorSelector').bind('click', function() { 
    99     var activecp = $(this).parent().find('.colorPickerHolder'); 
    100     var h = activecp.height(); 
    101     $("#gtool #dataPoints .colorPickerHolder").filter(function(index) { 
    102       return ($(this) != activecp); 
    103     }).stop().animate({height:0}, 0);; 
    104     $(this).parent().find('.colorPickerHolder').stop().animate({height: h != 0 ? 0 : 173}, 500); 
     134    if(!locked){ 
     135        var activecp = $(this).parent().find('.colorPickerHolder'); 
     136        var h = activecp.height(); 
     137        $("#gtool #dataPoints .colorPickerHolder").filter(function(index) { 
     138             return ($(this) != activecp); 
     139        }).stop().animate({height:0}, 0);; 
     140        $(this).parent().find('.colorPickerHolder').stop().animate({height: h != 0 ? 0 : 173}, 500); 
     141    } 
    105142  }); 
    106143 
    107144  o.find(d.axis == "l" ? ".axisl" : ".axisr").addClass("axison"); 
    108145  o.find("span.axis").click(function(){ 
    109     $(this).siblings().removeClass("axison"); 
    110     $(this).addClass("axison"); 
    111     d.axis = $(this).hasClass("axisl") ? "l" : "r"; 
    112     update_current_graph(true); 
     146    if(!locked) { 
     147       $(this).siblings().removeClass("axison"); 
     148       $(this).addClass("axison"); 
     149       d.axis = $(this).hasClass("axisl") ? "l" : "r"; 
     150       update_current_graph(true); 
     151    } 
    113152  }); 
    114153  if(!d.hidden){o.find('input[@name="view"]').attr("checked","checked");} 
     
    119158 
    120159  o.find('.deletedatapoint').click(function(){ 
    121     for(var i=0; i<graphinfo.datapoints.length; i++) { 
    122       if(graphinfo.datapoints[i] == d) { 
    123         graphinfo.datapoints.splice(i,1); 
    124         break; 
    125       } 
    126     } 
    127     update_current_graph(true); 
    128     refresh_graph_from_json(graphinfo); 
     160    if(!locked){ 
     161       for(var i=0; i<graphinfo.datapoints.length; i++) { 
     162         if(graphinfo.datapoints[i] == d) { 
     163           graphinfo.datapoints.splice(i,1); 
     164           break; 
     165         } 
     166       } 
     167       update_current_graph(true); 
     168       refresh_graph_from_json(graphinfo); 
     169       } 
    129170    return false; 
    130171  }); 
     
    156197 
    157198  o.find(".datatitle").html(d.name); 
    158   o.find(".datatitle").editable(function(value, settings) { 
    159       d.name = value; 
    160       update_current_graph(true); 
    161       return(value); 
    162     }, { }); 
     199   
    163200 
    164201  recurse--; 
     
    169206  if(graphinfo.datapoints == undefined) graphinfo.datapoints = Array(); 
    170207  $("h2#graphTitle").html(graphinfo.title ? graphinfo.title : 'Graph Title (click to edit)'); 
    171   $("h2#graphTitle").editable(function(value, settings) {  
    172       graphinfo.title = value; 
    173       update_current_graph(false); 
    174       return(value); 
    175     }, { }); 
     208 
    176209  $("input[@name='graphtype']:checked").removeAttr("checked"); 
    177210  $("input[@name='graphtype']") 
     
    209242<span class="rememberGraph"></span> 
    210243<span class="blankGraph">New Blank</span> 
     244<span class="editGraph">Edit Graph</span> 
    211245<h2 id="graphTitle"></h2> 
    212246<!-- date range box --> 
    213247<script type="text/javascript"> 
    214248$(document).ready(function(){ 
     249 
     250        lock_forms(); 
     251 
    215252        var time_windows = { '2d' : 86400*2, 
    216253                              '1w' : 86400*7, 
     
    220257                            }; 
    221258        var state = false; 
     259 
     260        $(".editGraph").click(function() {               
     261                if(locked){ 
     262                    locked = false;                  
     263                    unlock_forms(); 
     264                    $(".editGraph").html('Editing!').fadeIn('slow'); 
     265                } 
     266                else if(!locked){ 
     267                    locked = true;       
     268                    lock_forms(); 
     269                    $(".editGraph").html('Edit Graph').fadeIn('slow'); 
     270                } 
     271        }); 
     272 
    222273        $("#graph_datetool .btn-slide").click(function(){ 
    223274                $("#graph_widgetCalendar").stop().animate({ 
     
    266317        }); 
    267318        $("span.addGuide").click(function() { 
    268           gtool_add_guide(); 
     319          if(!locked){ 
     320            gtool_add_guide(); 
     321          } 
    269322        }); 
    270323        set_current_graph_id(''); 
     
    340393        <tbody id="guideeditor"> 
    341394        <tr> 
    342                 <td><input name="view" type="checkbox" value="1"/></td> 
     395                <td><input name="view" type="checkbox" value="1" /></td> 
    343396                <td class="data datatitle"></td> 
    344397                <td><div class="colorPicker"><div class="colorSelector"><div style="background-color: #fff"></div></div><div class="colorPickerHolder"></div></div></td>