diff options
| author | Vasilii Chernov <vchernov@inr.ru> | 2016-02-25 17:02:35 +0100 | 
|---|---|---|
| committer | Vasilii Chernov <vchernov@inr.ru> | 2016-02-25 17:02:35 +0100 | 
| commit | 3bf5383a7ea03c5aa263aa4d8acf8b4949547319 (patch) | |
| tree | ef091c8d1084429ad8cb5d40220fe0546da04389 /html_server/templates/base.html | |
| parent | ed7a7ff66c64cc2e164070865306e7d79652063a (diff) | |
Move html_server to separate folder. Update html server templates.
Diffstat (limited to 'html_server/templates/base.html')
| -rw-r--r-- | html_server/templates/base.html | 219 | 
1 files changed, 219 insertions, 0 deletions
diff --git a/html_server/templates/base.html b/html_server/templates/base.html new file mode 100644 index 0000000..639dc00 --- /dev/null +++ b/html_server/templates/base.html @@ -0,0 +1,219 @@ +<!DOCTYPE html> +<html> +<head> +	<title>{% block title %}Device {{ device }}{% endblock %}</title> +	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/> +	<meta http-equiv="X-UA-Compatible" content="IE=edge"/> +	<link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='codebase/dhtmlx.css') }}"/> +   <script type=text/javascript src="{{ url_for('static', filename='jquery-2.2.1.js') }}"></script> +	<script src="{{ url_for('static', filename='codebase/dhtmlx.js') }}"></script> +   <script src="{{ url_for('static', filename='check_err.js') }}"></script> +	<script> +      var propsTree +      function createPropertyTree(branch, id) { +          +         function getPropertyItemsOnLevel(branch, id) { +            pathToProperties = "{{ url_for('get_property_list_json') }}" +            completePath = pathToProperties + '?branch=' + branch +             +            $.getJSON(completePath,  +                      function(json) { +                           checkError(json) +                           parsePropertyItems(json, branch, id) +                         }); +         } +          +         function parsePropertyItems(json, branch, id) { +             +            function loadPropertyInfo(branch) { +                +               var pathToProperties = "{{ url_for('get_property_list') }}" +               var completePath = pathToProperties + '?branch=' + branch +                +               $("#prop_info_place").load(completePath) +            } +             +             +            function setPropertyField(id, name, branch) { +                +               var func = function(){loadPropertyInfo(branch)} +               propsTree.insertNewItem(id, branch, +                                       name,  +                                       func); +               propsTree.closeAllItems() +            } +             +            for(var i = 0; i < json.length; i++) { +                +               setPropertyField(id, json[i].name, json[i].path) +               if(json[i].flags.indexOf("childs") != -1) +                  getPropertyItemsOnLevel(json[i].path, json[i].path) +            }   +         } +          +         getPropertyItemsOnLevel(branch, id) +      } +       +      var regTree +      function createRegistersList() { +         function parseJsonRegisterList(json) { +             +            checkError(json) +            if(json.lenght <= 0) +               return +             +            //sort registers by bank +            function compareRegistersByBank(a,b) { +               if (a.bank < b.bank) +                  return -1; +               else if (a.bank > b.bank) +                  return 1; +               else  +                  return 0; +            } +            json.sort(compareRegistersByBank) +             +             +            //create bank dirs +            var curBankName = json[0].bank +            var created = 0 +            for(var i = 0; i < json.length; i++) { +                +               //create new bank tab if it has not created already +               if(json[i].bank != curBankName) { +                  curBankName = json[i].bank +                  created = 0 +               } +                +               if(!created) { +                  regTree.insertNewItem(0, json[i].bank, json[i].bank, 0); +                  created = 1 +               } +                +                +               //insert register info to bank +               function loadRegisterInfo(bank, name) { +                  var pathToGetProperty = "{{ url_for('get_register_info') }}" +                  var completePath = pathToGetProperty + '?bank=' + bank + +                                 '&name=' + name +                +                  $("#reg_info_place").load(completePath) +               } +                +               function setRegisterField(id, bank, name) { +                   +                  var itemId = bank + "_" + name +                  var func = function(){loadRegisterInfo(bank, name)} +                   +                  regTree.insertNewItem(id, itemId, name, func) +                  regTree.closeAllItems() +               } +                +               setRegisterField(json[i].bank, json[i].bank, json[i].name) +            } +         } +          +         //get registers json list +         getRegistersListPath = "{{ url_for('get_registers_list_json') }}"  +         $.getJSON(getRegistersListPath, parseJsonRegisterList); +      } +       +		function doOnLoad() +      { +			propsTree = new dhtmlXTreeObject("treeboxbox_tree","100%","100%",0); +			propsTree.setImagePath("codebase/imgs/dhxtree_skyblue/"); +         //generating properties list +         createPropertyTree('', 0) +          +			regTree = new dhtmlXTreeObject("treeboxbox_tree2","100%","100%",0,0,0,0,'SELECT') +			regTree.setImagePath("codebase/imgs/dhxtree_skyblue/"); +         createRegistersList() +		} +	</script> +</head> +<body onload="doOnLoad()"> +	{% block info %} +      <div class="block1" > +         <h2>Device {{ device }} model={{ model }} control page </h2> +      </div> +   {% endblock %} +    +   <style> +      .tabs > div, .tabs > input { display: none; } + +      .tabs label { +               padding: 5px; +               border: 1px solid #aaa; +               line-height: 28px; +               cursor: pointer; +               position: relative; +               bottom: 1px; +               background: #fff; +            } +             +      .tabs input[type="radio"]:checked + label { border-bottom: 2px solid #fff; } + +      .tabs > input:nth-of-type(1):checked ~ div:nth-of-type(1), +      .tabs > input:nth-of-type(2):checked ~ div:nth-of-type(2) { +                                                      display: block;  +                                                      padding: 5px;  +                                                      border:  +                                                      1px solid #aaa; +                                                   } +      .tree { +               height: 85vh; +               padding: 5px; +               border: 1px solid #aaa; +               line-height: 28px; +               cursor: pointer; +               position: relative; +               bottom: 1px; +               background: #fff; +               overflow:auto; +            } +             +      .infoTable { +               padding: 5px; +                +               border: 1px solid #aaa; +               line-height: 28px; +               cursor: pointer; +               position: relative; +               background: #fff; +               overflow:auto; +               bottom: 1px; +                +               text-align: left; +            } +   </style> +    +   <div class="tabs"> +      <input type="radio" name="current" checked="checked" id="props_id"/> +      <label for="props_id">Properties</label> +      <input type="radio" name="current" id="labels_id"/> +      <label for="labels_id">Registers</label> +      <div> +         <table> +            <tr> +               <td valign="top"> +                  <div id="treeboxbox_tree" class = "tree"></div> +               </td> +               <td valign="top" id="prop_info_place" /> +            </tr> +         </table>          +      </div> +      <div> +         <table> +            <tr> +               <td valign="top"> +                  <div id="treeboxbox_tree2" class="tree"></div> +               </td> +               <td valign="top" id="reg_info_place" /> +            </tr> +         </table> +      </div> +   </div> +   {% block content %} +   {% endblock %} +</body> +</html>  | 
