diff options
Diffstat (limited to 'html_server/templates')
-rw-r--r-- | html_server/templates/base.html | 219 | ||||
-rw-r--r-- | html_server/templates/property_info.html | 93 | ||||
-rw-r--r-- | html_server/templates/register_info.html | 148 | ||||
-rw-r--r-- | html_server/templates/registers_list.html | 26 |
4 files changed, 486 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> diff --git a/html_server/templates/property_info.html b/html_server/templates/property_info.html new file mode 100644 index 0000000..ce974ac --- /dev/null +++ b/html_server/templates/property_info.html @@ -0,0 +1,93 @@ +{% block content %} + +{% if standalone %} +<script src="{{ url_for('static', filename='codebase/dhtmlx.js') }}"></script> +<script src="{{ url_for('static', filename='check_err.js') }}"></script> +{% endif %} + +<script> + function updateProperty(prop) { + var pathToGetProperty = "{{ url_for('get_property_json') }}" + var completePath = pathToGetProperty + '?prop=' + prop + + $.getJSON(completePath, function(json){ + checkError(json) + var valFieldId = "#actVal"+prop.split('/').join("_") + $(valFieldId).text(json.value) + }) + } + + function setProperty(prop) + { + var value = document.getElementById("set_val_" + prop).value; + if(value == "") + return + + var pathToGetProperty = "{{ url_for('set_property_json') }}" + var completePath = pathToGetProperty + '?prop=' + prop + + '&val=' + value; + + $.getJSON(completePath, + function(json) { + checkError(json) + updateProperty(prop) + }) + }; +</script> + +<table class="infoTable"> + <tr class="infoTable"> + <td class="infoTable">Name</td> + <td class="infoTable">Description</td> + <td class="infoTable">Value</td> + <td class="infoTable">Mode</td> + <td class="infoTable">Type</td> + <td class="infoTable">Unit</td> + <td class="infoTable">Path</td> + </tr> + {% for property in properties %} + <tr class="infoTable"> + <td class="infoTable">{{ property.name }}</td> + <td class="infoTable"> + {% if 'description' in property %} + {{ property.description }} + {% endif %} + </td> + <td class="infoTable"> + <table> + <tr> + <td id = "actVal{{ property.path.replace('/', '_') }}" class="infoTable"> + {{ value }} + </td> + {% if 'R' in property.mode %} + <td> + <input type="button" value="update" style="width:100%;height:100%" onclick="updateProperty('{{ property.path }}')"> + </td> + {% endif %} + </tr> + {% if 'W' in property.mode %} + <tr> + <td> + <input type="text" name="set_val_{{ property.path }}" id="set_val_{{ property.path }}" value="" /> + </td> + <td> + <input type="button" value="set" style="width:100%;height:100%" onclick="setProperty('{{ property.path }}')"> + </td> + </tr> + {% endif %} + </table> + </td> + <td class="infoTable"> + <ul> + {% for m in property.mode %} + {{ m + '; '}} + {% endfor %} + </ul> + </td> + <td class="infoTable"> {{ property.type }} </td> + <td class="infoTable"> {{ property.unit }} </td> + <td class="infoTable"> {{ property.path }} </td> + </tr> + {% endfor %} +</table> +{% endblock %} diff --git a/html_server/templates/register_info.html b/html_server/templates/register_info.html new file mode 100644 index 0000000..1118dbf --- /dev/null +++ b/html_server/templates/register_info.html @@ -0,0 +1,148 @@ +{% block content %} + +{% if standalone %} +<script src="{{ url_for('static', filename='codebase/dhtmlx.js') }}"></script> +<script src="{{ url_for('static', filename='check_err.js') }}"></script> +{% endif %} + +<script> + function updateRegister(bank, name) { + var pathToReadRegister = "{{ url_for('read_register_json') }}" + var completePath = pathToReadRegister + '?bank=' + bank + + '&name=' + name + + $.getJSON(completePath, function(json){ + checkError(json) + $("#actVal").text(json.value) + }) + } + + function writeRegister(bank, name) + { + var value = document.getElementById("set_val_box").value; + if(value == "") + return + + var pathToReadRegister = "{{ url_for('write_register_json') }}" + var completePath = pathToReadRegister + '?bank=' + bank + + '&name=' + name + '&val=' + value; + + $.getJSON(completePath, + function(json) { + checkError(json) + updateRegister(bank, name) + }) + }; +</script> + +<table class="infoTable"> + <tr class="infoTable"> + {% if 'description' in register %} + <td class="infoTable"> Description </td> + {% endif %} + <td class="infoTable"> Value </td> + <td class="infoTable">Default value</td> + <td class="infoTable">Bank</td> + <td class="infoTable">Mode</td> + {% if 'range' in register %} + <td class="infoTable">Range</td> + {% endif %} + {% if 'values' in register %} + <td class="infoTable">Values</td> + {% endif %} + </tr> + + <tr class="infoTable"> + {% if 'description' in register %} + <td class="infoTable"> {{ register.description }} </td> + {% endif %} + <td class="infoTable"> + <table> + <tr class="infoTable"> + <td id="actVal" class="infoTable"> {{ value }} </td> + {% if 'R' in register.mode %} + <td> + <input type="button" value="update" + style="width:100%;height:100%" + onclick="updateRegister('{{ register.bank }}', '{{ register.name }}')"> + </td> + {% endif %} + </tr> + {% if 'W' in register.mode %} + <tr class="infoTable"> + <td> + <input type="text" name="set_val_box" id="set_val_box" value="" /> + </td> + <td> + <input type="button" value="set" + style="width:100%;height:100%" + onclick="writeRegister('{{ register.bank }}', '{{ register.name }}')"> + </td> + </tr> + {% endif %} + </table> + </td> + <td class="infoTable">{{ register.defvalue }}</td> + <td class="infoTable">{{ register.bank }}</td> + <td class="infoTable"> + <ul> + {% for m in register.mode %} + {{ m + '; '}} + {% endfor %} + </ul> + </td> + {% if 'range' in register %} + <td class="infoTable"> + <table> + <tr class="infoTable"> + <td class="infoTable"> min </td> + <td class="infoTable"> max </td> + </tr> + <tr class="infoTable"> + <td class="infoTable"> {{ register.range.min }} </td> + <td class="infoTable"> {{ register.range.max }} </td> + </tr> + </table> + </td> + {% endif %} + {% if 'values' in register %} + <td class="infoTable"> + <table> + <tr> + {% for v in register['values'] %} + <td> + <table> + {% if 'name' in v %} + <tr class="infoTable"> + <td class="infoTable"> Name </td> + <td class="infoTable"> {{v.name}} </td> + </tr> + {% endif %} + {% if 'description' in v %} + <tr class="infoTable"> + <td class="infoTable"> Description </td> + <td class="infoTable"> {{ v.description }} </td> + </tr> + {% endif %} + <tr class="infoTable"> + <td class="infoTable"> Min </td> + <td class="infoTable"> {{ v.min }} </td> + </tr> + <tr class="infoTable"> + <td class="infoTable"> Max </td> + <td class="infoTable"> {{ v.max }} </td> + </tr> + <tr class="infoTable"> + <td class="infoTable"> Value </td> + <td class="infoTable"> {{ v.value }} </td> + </tr> + </table> + </td> + {% endfor %} + </tr> + </table> + </td> + {% endif %} + </tr> +</table> +{% endblock %} diff --git a/html_server/templates/registers_list.html b/html_server/templates/registers_list.html new file mode 100644 index 0000000..199475b --- /dev/null +++ b/html_server/templates/registers_list.html @@ -0,0 +1,26 @@ +{% extends "base.html" %} +{% block title %}Registers list{% endblock %} +{% block info %} +<h1>List of aviable registers</h1> +{% endblock %} + +{% block content %} +<table border="1" style="width:100%"> + <tr> + <th>Name</th> + <th>Description</th> + </tr> +{% for register in registers %} + <tr> + <td><a href="{{ url_for('get_register_info', bank=register.bank, name=register.name) }}">{{ register.name }}</td> + {% if 'description' in register %} + <td>{{ register.description }}</td> + {% else %} + <td></td> + {% endif %} + </tr> +{% endfor %} +</table> +{% endblock %} + + |