karesansui/templates/default/hostby1networksettings/hostby1networksettings.part

   1 <%doc>Copyright (C) 2009-2010 HDE, Inc.</%doc>
   2 <%inherit file="../include/common.part" />
   3 <script type="text/javascript">
   4 <!--
   5 $(document).ready(function(){
   6
   7
   8 // init
   9 tool_invalid("#edit_settings");
  10
  11 $("#action>a").hover(
  12     function(){tool_over(this);},
  13     function(){tool_over(this);}
  14 ).mousedown(function(){
  15     var id = $(this).attr("id");
  16     tool_active(this);
  17 });
  18
  19 renew_main_event("#tool_renew", "${ctx.homepath}${ctx.path}");
  20
  21 $("#device_tab td").each(function(){
  22     $(this).click(function(){
  23         var target = $(this).attr("id");
  24
  25         var target_val = target.split("_");
  26
  27         unbind_event();
  28         switch(target_val[0]){
  29             case "general":
  30                 ajax_get("#settings_value",
  31                  "${ctx.homepath}/host/${host_id}/networksettings/general.part",
  32                  null);
  33                 tool_reset("#edit_settings");
  34                 bind_edit_event();
  35                 break;
  36             case "nic":
  37                 ajax_get("#settings_value",
  38                  "${ctx.homepath}/host/${host_id}/networksettings/nic/" + target_val[1] + ".part",
  39                  null);
  40                 tool_reset("#edit_settings");
  41                 if(target_val[1].substr(0,3) == "eth") {
  42                   bind_edit_event();
  43                 } else {
  44                   tool_invalid("#edit_settings");
  45                 }
  46                 break;
  47             default:
  48                 _ajax_alert_on("ERROR", "${_('Received an unexpected value.')}");
  49         }
  50         // icon active
  51         $("#device_tab td").each(function(){
  52             if($(this).attr("id") != target){
  53                 $(this).removeClass("device_active");
  54             } else {
  55                 $(this).addClass("device_active");
  56             }
  57         });
  58
  59     });
  60 });
  61
  62
  63 });
  64 // lib
  65 function get_target_id(){
  66     var target_id = null;
  67     $("#device_tab td").each(function(){
  68         if($(this).hasClass("device_active") == true){
  69             target_id = $(this).attr("id");
  70         }
  71     });
  72     return target_id;
  73 }
  74
  75 function bind_edit_event() {
  76     $("#edit_settings").one("click.edit", function(){
  77         var target_id = get_target_id();
  78         var val = target_id.split("_");
  79         var edit_url;
  80
  81         if(val[1] == ""){
  82             edit_url = "${ctx.homepath}/host/${host_id}/networksettings/" + val[0] + ".part?mode=input";
  83         } else {
  84             edit_url = "${ctx.homepath}/host/${host_id}/networksettings/" + val[0] + "/" + val[1] + ".part?mode=input";
  85         }
  86
  87         grayout_view("GET",
  88             edit_url,
  89             "${_('Edit Settings')}",
  90             "${ctx.homepath}/host/${host_id}/networksettings.part");
  91     });
  92 }
  93
  94 function unbind_event() {
  95     $("#edit_settings").unbind("click.edit");
  96 }
  97
  98 -->
  99 </script>
 100                     <div id="settings_dialog"></div>
 101                     <div id="action">
 102                         <div class="left"></div>
 103                         <a href="#" name="edit_settings" id="edit_settings" class="tool-link">
 104                             <div class="tool-mid">
 105                                 <div class="tool-left"></div>
 106                                 <div class="tool-img">
 107                                     <img src="${ctx.homepath}/static/images/tool-edit.png" alt="" />
 108                                 </div>
 109                                 <div class="tool-right">
 110                                     <div class="tool-text" >${_('Edit')}</div>
 111                                 </div>
 112                             </div>
 113                         </a>
 114                         <div class="right">
 115                             <a href="#" class="tool-link" >
 116                                 <div class="tool-mid">
 117                                     <img src="${ctx.homepath}/static/images/reload.gif" alt="renew" id="tool_renew"/>
 118                                 </div>
 119                             </a>
 120                         </div>
 121                     </div>
 122                     <br style="clear: both;"/>
 123                     <div class="space"></div>
 124                     <br style="clear: both;"/>
 125                     <div class="alert"></div>
 126                     <div id="view">
 127                         <div id="device">
 128
 129 <table width="99.8%" cellspacing="1" border="0" style="background-color:#bcbcbc;">
 130     <tr>
 131         <td style="background-color:#E4E4DD; padding:0px; text-align:left;" bgcolor="#FFFFFF" width="20%" valign="top">
 132             <table id="device_tab" width="100%" cellspacing="0" border="0" style="background-color:#e4e4dd;">
 133                 <tr>
 134                     <td id="general_" style="font-size:10px;">
 135                                             <img src="${ctx.homepath}/static/images/device-console.png">
 136                         <span class="status">${_('General Settings')}</span>
 137                     </td>
 138                 </tr>
 139 % for dev in sorted(current.keys()):
 140                 <tr>
 141                     <td id="nic_${dev}" style="font-size:10px;" width="100">
 142                         <img src="${ctx.homepath}/static/images/device-network.png">
 143                         <span class="status">${_('Device')} ${dev}</span>
 144                     </td>
 145                 </tr>
 146 % endfor
 147             </table>
 148         </td>
 149         <td bgcolor="#FFFFFF" valign="top" id="settings_value" width="80%" style="padding:30px;">
 150         ${_("Settings")}
 151         </td>
 152     </tr>
 153 </table>
 154
 155
 156                         </div>
 157                     </div>
 158                     <br style="clear: both;"/>