yunkong2/yunkong2.vis
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Initial commit

Browse Source
This commit is contained in:
zhongjin
2018-09-16 09:00:12 +08:00
commit f85cec8fd1
350 changed files with 42458 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

92
www/widgets/basic/css/table.css Normal file
View File

@@ -0,0 +1,92 @@
/* ---------------------- Sample for table widget ------------------------- */
.tclass-overflow {
overflow-y: auto;
}
.tclass {
border: 0px solid black;
width: 100%;
table-layout: fixed;
font-family: Arial;
}
.tclass-inner {
border: 0px solid black;
width: 100%;
table-layout: fixed;
height: 100%;
}
.tclass-inner-overflow {
overflow-y: auto;
height: calc(100% - 30px);
}
.tclass-th {
background-color: black;
color: white;
font-weight: bold;
}
.tclass-th1 {
width: 20px;
text-align: center;
}
.tclass-th2 {
width: 20px;
text-align: center;
}
.tclass-th3 {
width: 150px;
}
.tclass-th4 {
width: 200px;
}
.tclass-tr {
color: black;
}
.tclass-tr-even {
background-color: darkgray;
}
.tclass-tr-odd {
background-color: lightgray;
}
.tclass-tr:hover {
color:blue;
cursor: pointer;
}
.tclass-tr-selected {
background-color: lightblue;
/* color: white;*/
}
.tclass-detail {
width: 100%
}
.tclass-detail-tr {
width: 100%
}
.tclass-detail-tr-even {
}
.tclass-detail-tr-odd {
}
.tclass-detail-td-name {
width:200px;
font-weight: bold;
}
.tclass-detail-td-value {
}
.tclass-print-button {
position: absolute;
bottom: 5%;
right: 5%;
}
.tclass-tr-error {
color:red;
}
.tclass-tr-warning {
color:yellow;
}
.tclass-img-type {
width:16px;
height:16px
}
.tclass-img-person {
width:16px;
height:16px
}

393
www/widgets/basic/doc.html Normal file
View File

@@ -0,0 +1,393 @@
<html>
<head>
<link rel="stylesheet" href="../../css/doc.css" />
<title>Dokumentation Widget-Set basic</title>
</head>
<body>
<h3><a name="tplContainerView">container - view in widget</a></h3>
Dieses Widget kann Views innerhalb von Views darstellen. Sinnvoll z.B. für eine Navigation: Man baut eine View mit
Navigations-Elementen auf und bindet diese dann in beliebig vielen anderen Views ein.
<h4>Attribute</h4>
<dl>
<dt>contains_view</dt>
<dd>Name der View die im Container angezeigt werden soll.</dd>
</dl>
<hr/>
<h3><a name="tplHtml">static - HTML</a></h3>
Dieses Widget stellt beliebigen HTML-Code dar. Es ist auch möglich Javascript innerhalb des Widgets zu verwenden.
<h4>Attribute</h4>
<dl>
<dt>html</dt>
<dd>Selbsterklärend ;) ...hier den HTML-Code einfügen</dd>
</dl>
<hr/>
<h3><a name="tplIFrame">static - iFrame</a></h3>
Dieses Widget bindet ein iFrame ein
<h4>Attribute</h4>
<dl>
<dt>src</dt>
<dd>Die URL (src Attribut)</dd>
<dt>refreshInterval</dt>
<dd>iFrame in Intervall neuladen: Angabe in milli-sekunden</dd>
</dl>
<hr/>
<h3><a name="tplImage">static - Image</a></h3>
Dieses Widget stellt ein Bild dar. (HTML &lt;img&gt; Tag)
<h4>Attribute</h4>
<dl>
<dt>src</dt>
<dd>Die Bild-URL</dd>
<dt>refreshInterval</dt>
<dd>Bild in Intervall neuladen: Angabe in milli-sekunden</dd>
</dl>
<hr/>
<h3><a name="tplLink">static - link</a></h3>
Dieses Widget entspricht dem <a href="#tplHtml">Widget "static - HTML"</a> ist aber zusätzlich auf seiner ganzen Fläche
ein klickbarer Link. Kann für die Navigation zwischen Views oder für externe Links genutzt werden.
<dl>
<dt>html</dt>
<dd>Selbsterklärend ;) ...hier den HTML-Code einfügen</dd>
<dt>href</dt>
<dd>Die Link-URL. Um einen Link auf eine andere View zu nutzen einfach den View-Namen mit vorangestelltem Hash-Symbol (#)
eintragen</dd>
<dt>target</dt>
<dd>Das Ziel des Links. Leer lassen um im gleichen Browser-Fenster zu bleiben, möchte man ein neues Fenster öffnen _blank eintragen</dd>
</dl>
<hr/>
<h3><a name="tplStatefulContainerView8">stateful/container - view in widget 8</a></h3>
Zeigt eine von 8 Views in Abhängigkeit von einem Zustand an.
<dl>
<dt>persistent</dt>
<dd>Views die einmal gerendert wurden nicht mehr aus dem DOM Entfernen</dd>
</dl>
<hr/>
<h3><a name="tplStatefulIFrame8">stateful - iFrame 8</a></h3>
Zeigt einen von 8 iFrames in Abhängigkeit von einem Zustand an.
<hr/>
<h3><a name="tplStatefulImage8">stateful - Image 8</a></h3>
Zeigt eines von 8 Bildern in Abhängigkeit von einem Zustand an.
<hr/>
<h3><a name="tplHtmlNav">navigation - HTML</a></h3>
Dieses Widget dient dazu eine Navigation zwischen den Views aufzubauen. Entspricht dem <a href="#tplLink">Widget "static - link"</a>,
ist jedoch ausschließlich für die Navigation zwischen den Views nutzbar und bietet zusätzlich die Möglichkeit animierte
Effekte beim Wechsel der Views zu verwenden.
<h4>Attribute</h4>
<dl>
<dt>html</dt>
<dd>Selbsterklärend ;) ...hier den HTML-Code einfügen</dd>
<dt>nav_view</dt>
<dd>Hier muss der Name der View zu der navigiert werden soll eingetragen werden</dd>
<dt>hide_effect</dt>
<dd>Hier kann der Name eines jQueryUI Effektes eingetragen werden der beim verlassen der View genutzt wird.
Verfügbare Effekte sind: Blind, Bounce, Clip, Drop, Explode, Fade, Fold, Highlight, Puff, Pulsate, Scale, Shake, Size,
Slide und Transfer.
<a href="http://jqueryui.com/effect/" target="_blank">Hier gibt es Demos der Effekte</a>.
</dd>
<dt>hide_duration</dt>
<dd>Dauer des Effekts in ms</dd>
<dt>show_effect</dt>
<dd>siehe oben, das gleiche aber dieses mal für das einblenden der neuen View</dd>
<dt>show_duration</dt>
<dd>Siehe oben, Zeit in ms für das einblenden der neuen View</dd>
</dl>
<hr/>
<h3><a name="tplValueFloat">hm_val - Number</a></h3>
Dieses Widget stellt einen Zahlenwert dar (sowohl für Integer als auch Float verwendbar)
<h4>Attribute</h4>
<dl>
<dt>html_prepend</dt>
<dd>Text oder HTML-Code der vor dem Zahlenwert angezeigt wird</dd>
<dt>html_append</dt>
<dd>Text oder HTML-Code der hinter dem Zahlenwert angezeigt wird</dd>
<dt>digits</dt>
<dd>Anzahl der dargestellten Nachkommastellen</dd>
<dt>factor</dt>
<dd>Faktor mit dem der Zahlenwert multipliziert wird</dd>
</dl>
<h4>Beispiel</h4>
<img src="/dashui/widgets/basic/doc_example_hm_val_number.png" />
<hr/>
<h3><a name="tplValueString">hm_val - String</a></h3>
Dieses Widget stellt einen Datenpunkt vom Typ Zeichenkette dar.
<dl>
<dt>html_prepend</dt>
<dd>Text oder HTML-Code der vor dem String angezeigt wird</dd>
<dt>html_append</dt>
<dd>Text oder HTML-Code der hinter dem String angezeigt wird</dd>
</dl>
<hr/>
<h3><a name="tplValueStringRaw">hm_val - String (unescaped)</a></h3>
Dieses Widget stellt einen Datenpunkt vom Typ Zeichenkette dar. Im Unterschied zum <a href="#tplValueString">Widget "hm_val - String"</a>
werden dabei keine Sonderzeichen "escaped" - d.h. die Variable kann auch HTML-Code enthalten und dieser wird dann dargestellt.
<dl>
<dt>html_prepend</dt>
<dd>Text oder HTML-Code der vor dem String angezeigt wird</dd>
<dt>html_append</dt>
<dd>Text oder HTML-Code der hinter dem String angezeigt wird</dd>
</dl>
<hr/>
<h3><a name="tplValueStringImg">hm_val - String img src</a></h3>
Diesem Widget kann ein Variable vom Typ Zeichenkette zugeordnet werden, eine dort enthaltene URL wird dann als Bild dargestellt
<dl>
<dt>html_prepend</dt>
<dd>Text oder HTML-Code der vor dem Bild angezeigt wird</dd>
<dt>html_append</dt>
<dd>Text oder HTML-Code der hinter dem Bild angezeigt wird</dd>
</dl>
<hr/>
<h3><a name="tplValueList">hm_val - ValueList Text</a></h3>
Dieses Widget stellt eine Variable vom Typ Werteliste dar.
<dl>
<dt>valuelist</dt>
<dd>Eine Semikolon-getrennte Liste von Texten für die jeweiligen Werte.</dd>
<dt>html_prepend</dt>
<dd>Text oder HTML-Code der vor dem Bild angezeigt wird</dd>
<dt>html_append</dt>
<dd>Text oder HTML-Code der hinter dem Bild angezeigt wird</dd>
</dl>
<hr/>
<h3><a name="tplValueListHtml">hm_val - ValueList HTML</a></h3>
Dieses Widget stellt eine Variable vom Typ Werteliste dar. Entspricht dem <a href="#tplValueList">Widget "hm_val - ValueList Text</a>,
allerdings wird nicht "escaped", d.h. in valuelist kann HTML-Code eingetragen werden.
<dl>
<dt>valuelist</dt>
<dd>Eine Semikolon-getrennte Liste von HTML-Code für die jeweiligen Werte.</dd>
<dt>html_prepend</dt>
<dd>Text oder HTML-Code der vor dem Bild angezeigt wird</dd>
<dt>html_append</dt>
<dd>Text oder HTML-Code der hinter dem Bild angezeigt wird</dd>
</dl>
<hr/>
<h3><a name="tplValueListHtml8">hm_val - ValueList HTML 8</a></h3>
Dieses Widget stellt eine Variable vom Typ Werteliste dar. Entspricht dem <a href="#tplValueListHTML">Widget "hm_val - ValueList HTML</a>,
bietet aber die Möglichkeit für 8 verschiedene Werte (0-7) auch 8 verschiedene CSS-Angaben zu verwenden.
<dl>
<dt>html_prepend</dt>
<dd>Text oder HTML-Code der vor dem Bild angezeigt wird</dd>
<dt>html_append</dt>
<dd>Text oder HTML-Code der hinter dem Bild angezeigt wird</dd>
<dt>value0 bis value7</dt>
<dd>Text oder HTML-Code für die Werte 0 bis 7</dd>
<dt>style0 bis style7</dt>
<dd>CSS-Angaben für die Werte 0 bis 7</dd>
</dl>
<hr/>
<h3><a name="tplValueBool">hm_val - Bool HTML</a></h3>
Dieses Widget stellt Bool-Werte dar.
<dl>
<dt>html_prepend</dt>
<dd>Text oder HTML-Code der vor dem Bild angezeigt wird</dd>
<dt>html_append</dt>
<dd>Text oder HTML-Code der hinter dem Bild angezeigt wird</dd>
<dt>html_true</dt>
<dd>Text oder HTML-Code der im True-Fall angezeigt wird</dd>
<dt>html_false</dt>
<dd>Text oder HTML-Code der im False-Fall angezeigt wird</dd>
</dl>
<hr/>
<h3><a name="tplValueBoolCheckbox">hm_ctrl - Bool Checkbox</a></h3>
Dieses Widget zeigt Bool-Werte als einfache Checkbox an und erlaubt außerdem den Wert zu umzuschalten.
<dl>
<dt>html_prepend</dt>
<dd>Text oder HTML-Code der vor der Checkbox angezeigt wird</dd>
<dt>html_append</dt>
<dd>Text oder HTML-Code der hinter der Checkbox angezeigt wird</dd>
</dl>
<hr/>
<h3><a name="tplValueBoolSelect">hm_ctrl - Bool Select</a></h3>
Dieses Widget stellt Bool-Werte als Dropdown dar und erlaubt außerdem den Wert umzuschalten.
<dl>
<dt>html_prepend</dt>
<dd>Text oder HTML-Code der vor dem Bild angezeigt wird</dd>
<dt>html_append</dt>
<dd>Text oder HTML-Code der hinter dem Bild angezeigt wird</dd>
<dt>text_true</dt>
<dd>Text für den True-Fall</dd>
<dt>text_false</dt>
<dd>Text für den False-Fall</dd>
</dl>
<hr/>
<h3><a name="tplValueBoolCtrl">hm_ctrl - Bool HTML</a></h3>
Dieses Widget stellt Bool-Werte dar und erlaubt außerdem den Wert auf Klick innerhalb der Widget-Fläche umzuschalten.
<dl>
<dt>html_prepend</dt>
<dd>Text oder HTML-Code der vor dem Bild angezeigt wird</dd>
<dt>html_append</dt>
<dd>Text oder HTML-Code der hinter dem Bild angezeigt wird</dd>
<dt>html_true</dt>
<dd>Text oder HTML-Code der im True-Fall angezeigt wird</dd>
<dt>html_false</dt>
<dd>Text oder HTML-Code der im False-Fall angezeigt wird</dd>
</dl>
<hr/>
<h3><a name="tplBasicState">hm_ctrl - HTML State</a></h3>
Dieses Widget setzt bei Klick innerhalb der Widget-Fläche einen Wert.
<dl>
<dt>html</dt>
<dd>Text oder HTML-Code der angezeigt wird</dd>
<dt>value</dt>
<dd>Wert der gesetzt werden soll</dd>
</dl>
<hr/>
<h3><a name="tplHide">hm_val - Hide on 0/false</a></h3>
Dieses Widget verschwindet wenn der Wert des zugeordneten Datenpunkts 0 bzw false ist. Geschickt z.B. für die Anzeige von Servicemeldungen
<hr/>
<h3><a name="tplRedNumber">hm_val - Red Number</a></h3>
Anzeige eines numerischen Werts im Stil der iOS Benachrichtigungs-Symbole. Verschwindet beim Wert 0.
<hr/>
<h3><a name="tplBulbOnOff">hm_val - Bulb on/off</a></h3>
Dieses Widget stellt einen Wert als ausgeschaltete oder leuchtende Glühbirne auf schwarzem Hintergrund dar. Ist für Bool und Float-Werte (Dimmer) einsetzbar.
<hr/>
<h3><a name="tplBulbOnOffCtrl">hm_ctrl - Bulb on/off</a></h3>
Dieses Widget stellt einen Wert als ausgeschaltete oder leuchtende Glühbirne auf schwarzem Hintergrund dar. Bei Klick auf das Widget
wird der Wert umgeschaltet.
<hr/>
<h3><a name="tplHmWindowRotary">hm_val - Drehgriff</a></h3>
Dieses Widget stellt eine Drehgriff-Sensor mit den originalen Homematic-Icons dar.
<hr/>
<h3><a name="tplHmWindow">hm_val - TFK</a></h3>
Dieses Widget stellt einen Tür-/Fenster-Kontakt mit den originalen Homematic-Icons dar.
<hr/>
<h3><a name="tplValueFloatBar">hm_val - Bar Horizontal</a></h3>
Dieses Widget stellt einen Wert von 0-100 als horizontalen Balken dar.
<dl>
<dt>factor</dt>
<dd>Faktor mit dem der Wert multipliziert wird. Beispiel: für einen Dimmer (der von 0.00 bis 1.00 geht) muss 100 eingetragen werden.</dd>
<dt>color</dt>
<dd>CSS-Eigenschaft background-color des Balkens</dd>
<dt>border</dt>
<dd>CSS-Eigenschaft border des Balkens</dd>
<dt>shadow</dt>
<dd>CSS-Eigenschaft box-shadow des Balkens</dd>
<dt>reverse</dt>
<dd>Wenn hier true eingetragen wird wird der Balken von rechts nach links statt von links nach rechts angezeigt</dd>
</dl>
<hr/>
<h3><a name="tplValueFloatBarVertical">hm_val - Bar Vertical</a></h3>
Entspricht dem <a href="#tplValueFloatBar">Widget "hm_val - Bar Horizontal</a>, allerdings vertikal statt horiziontal.
<dl>
<dt>factor</dt>
<dd>Faktor mit dem der Wert multipliziert wird. Beispiel: für einen Dimmer (der von 0.00 bis 1.00 geht) muss 100 eingetragen werden.</dd>
<dt>color</dt>
<dd>CSS-Eigenschaft background-color des Balkens</dd>
<dt>border</dt>
<dd>CSS-Eigenschaft border des Balkens</dd>
<dt>shadow</dt>
<dd>CSS-Eigenschaft box-shadow des Balkens</dd>
<dt>reverse</dt>
<dd>Wenn hier true eingetragen wird wird der Balken von unten nach oben statt von oben nach unten angezeigt</dd>
</dl>
<hr/>
</body>
</html>

BIN
www/widgets/basic/img/Prev_AckBool.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.5 KiB

BIN
www/widgets/basic/img/Prev_BasicState.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.6 KiB

BIN
www/widgets/basic/img/Prev_BulbOnOffCtrl.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.4 KiB

BIN
www/widgets/basic/img/Prev_ContainerView.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 51 KiB

BIN
www/widgets/basic/img/Prev_FilterDropdown.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.1 KiB

BIN
www/widgets/basic/img/Prev_FullScreen.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.0 KiB

BIN
www/widgets/basic/img/Prev_HTML.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 51 KiB

BIN
www/widgets/basic/img/Prev_HTMLnavigation.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.3 KiB

BIN
www/widgets/basic/img/Prev_HtmlLogout.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.0 KiB

BIN
www/widgets/basic/img/Prev_Image.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 53 KiB

BIN
www/widgets/basic/img/Prev_Note.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1003 B

BIN
www/widgets/basic/img/Prev_RedNumber.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.3 KiB

BIN
www/widgets/basic/img/Prev_ScreenResolution.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.2 KiB

BIN
www/widgets/basic/img/Prev_Shape.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 51 KiB

BIN
www/widgets/basic/img/Prev_Speech2Text.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 6.0 KiB

BIN
www/widgets/basic/img/Prev_StatefulContainerView8.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 51 KiB

BIN
www/widgets/basic/img/Prev_StatefulIFrame8.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 52 KiB

BIN
www/widgets/basic/img/Prev_StatefulImage.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 53 KiB

BIN
www/widgets/basic/img/Prev_TableBody.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.6 KiB

BIN
www/widgets/basic/img/Prev_ValueBool.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.3 KiB

BIN
www/widgets/basic/img/Prev_ValueBoolCheckbox.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.5 KiB

BIN
www/widgets/basic/img/Prev_ValueBoolCtrl.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.9 KiB

BIN
www/widgets/basic/img/Prev_ValueBoolCtrlSvg.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.7 KiB

BIN
www/widgets/basic/img/Prev_ValueBoolSelect.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.8 KiB

BIN
www/widgets/basic/img/Prev_ValueFloat.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.8 KiB

BIN
www/widgets/basic/img/Prev_ValueFloatBar.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.0 KiB

BIN
www/widgets/basic/img/Prev_ValueGesture.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.9 KiB

BIN
www/widgets/basic/img/Prev_ValueInput.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.7 KiB

BIN
www/widgets/basic/img/Prev_ValueLastchange.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.1 KiB

BIN
www/widgets/basic/img/Prev_ValueList.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.9 KiB

BIN
www/widgets/basic/img/Prev_ValueListHtml.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.1 KiB

BIN
www/widgets/basic/img/Prev_ValueListHtml8.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.8 KiB

BIN
www/widgets/basic/img/Prev_ValueString.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.6 KiB

BIN
www/widgets/basic/img/Prev_ValueStringImg.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.8 KiB

BIN
www/widgets/basic/img/Prev_ValueStringRaw.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.8 KiB

BIN
www/widgets/basic/img/Prev_ValueTimestamp.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.9 KiB

BIN
www/widgets/basic/img/Prev_iFrame.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 52 KiB

BIN
www/widgets/basic/img/Prev_tplFrame.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 51 KiB

BIN
www/widgets/basic/img/Prev_tplLink.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 53 KiB

BIN
www/widgets/basic/img/doc_example_hm_val_number.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 32 KiB

6
www/widgets/basic/img/micActive.svg Normal file
View File

@@ -0,0 +1,6 @@
<?xml version="1.0" ?><svg id="Layer_1" style="enable-background:new 0 0 137.3 139.3;" version="1.1" viewBox="0 0 137.3 139.3" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><style type="text/css">
.st0{fill:#2C8AAA;}
.st1{opacity:0.19;clip-path:url(#XMLID_79_);fill:#070808;}
.st2{fill:#FFFFFF;}
.st3{fill:#22728E;}
</style><circle class="st0" cx="68.2" cy="69.6" id="XMLID_240_" r="66.2"/><g id="XMLID_55_"><defs><circle cx="68.4" cy="69.6" id="XMLID_56_" r="66.2"/></defs><clipPath id="XMLID_79_"><use style="overflow:visible;" xlink:href="#XMLID_56_"/></clipPath><polygon class="st1" id="XMLID_139_" points="70.8,30.5 136.1,81.8 133.6,135.8 88.9,133.9 51.8,105 70.2,99.3 "/></g><path class="st2" d="M60,54.2h21.1V39.7c0,0-0.4-9.2-10.3-9.2s-10.7,9.2-10.7,9.2L60,54.2z" id="XMLID_280_"/><path class="st2" d="M53.5,50.1C53.5,50.1,53.5,50.1,53.5,50.1l0,24.6c0,0,0.2,13.2,16.7,13.2 c16.7,0,16.7-13.2,16.7-13.2V50.1c0,0,0,0,0,0h-3.1c0,0,0,0,0,0v23.1c0,0-0.1,11.1-13.6,11.1c-6,0-9.2-2.6-10.9-5.2 c-1.3-2-2-4.3-2-6.7V50.1c0,0,0,0,0,0H53.5z" id="XMLID_277_"/><path class="st2" d="M59.4,56.2h22.4v16.3c0,0,0.2,9.3-11.2,9.3c-11.9,0-11.2-9.3-11.2-9.3V56.2z" id="XMLID_274_"/><rect class="st2" height="11.5" id="XMLID_265_" width="3.7" x="68.6" y="87.2"/><path class="st2" d="M51.8,105h38.1C89.9,105,72,89,51.8,105z" id="XMLID_256_"/><path class="st3" d="M76.6,57.8h3.1V72c0,0-0.9,8.1-8.6,8.2c0,0,4.7-2.4,5.4-8L76.6,57.8z" id="XMLID_253_"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.5 KiB

6
www/widgets/basic/img/micDetected.svg Normal file
View File

@@ -0,0 +1,6 @@
<?xml version="1.0" ?><svg id="Layer_1" style="enable-background:new 0 0 137.3 139.3;" version="1.1" viewBox="0 0 137.3 139.3" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><style type="text/css">
.st0{fill:#FFB051;}
.st1{opacity:0.19;clip-path:url(#XMLID_79_);fill:#070808;}
.st2{fill:#FFFFFF;}
.st3{fill:#FF8C00;}
</style><circle class="st0" cx="68.2" cy="69.6" id="XMLID_240_" r="66.2"/><g id="XMLID_55_"><defs><circle cx="68.4" cy="69.6" id="XMLID_56_" r="66.2"/></defs><clipPath id="XMLID_79_"><use style="overflow:visible;" xlink:href="#XMLID_56_"/></clipPath><polygon class="st1" id="XMLID_139_" points="70.8,30.5 136.1,81.8 133.6,135.8 88.9,133.9 51.8,105 70.2,99.3 "/></g><path class="st2" d="M60,54.2h21.1V39.7c0,0-0.4-9.2-10.3-9.2s-10.7,9.2-10.7,9.2L60,54.2z" id="XMLID_280_"/><path class="st2" d="M53.5,50.1C53.5,50.1,53.5,50.1,53.5,50.1l0,24.6c0,0,0.2,13.2,16.7,13.2 c16.7,0,16.7-13.2,16.7-13.2V50.1c0,0,0,0,0,0h-3.1c0,0,0,0,0,0v23.1c0,0-0.1,11.1-13.6,11.1c-6,0-9.2-2.6-10.9-5.2 c-1.3-2-2-4.3-2-6.7V50.1c0,0,0,0,0,0H53.5z" id="XMLID_277_"/><path class="st2" d="M59.4,56.2h22.4v16.3c0,0,0.2,9.3-11.2,9.3c-11.9,0-11.2-9.3-11.2-9.3V56.2z" id="XMLID_274_"/><rect class="st2" height="11.5" id="XMLID_265_" width="3.7" x="68.6" y="87.2"/><path class="st2" d="M51.8,105h38.1C89.9,105,72,89,51.8,105z" id="XMLID_256_"/><path class="st3" d="M76.6,57.8h3.1V72c0,0-0.9,8.1-8.6,8.2c0,0,4.7-2.4,5.4-8L76.6,57.8z" id="XMLID_253_"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.5 KiB

6
www/widgets/basic/img/micInactive.svg Normal file
View File

@@ -0,0 +1,6 @@
<?xml version="1.0" ?><svg id="Layer_1" style="enable-background:new 0 0 137.3 139.3;" version="1.1" viewBox="0 0 137.3 139.3" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><style type="text/css">
.st0{fill:#808080;}
.st1{opacity:0.19;clip-path:url(#XMLID_79_);fill:#070808;}
.st2{fill:#FFFFFF;}
.st3{fill:#404040;}
</style><circle class="st0" cx="68.2" cy="69.6" id="XMLID_240_" r="66.2"/><g id="XMLID_55_"><defs><circle cx="68.4" cy="69.6" id="XMLID_56_" r="66.2"/></defs><clipPath id="XMLID_79_"><use style="overflow:visible;" xlink:href="#XMLID_56_"/></clipPath><polygon class="st1" id="XMLID_139_" points="70.8,30.5 136.1,81.8 133.6,135.8 88.9,133.9 51.8,105 70.2,99.3 "/></g><path class="st2" d="M60,54.2h21.1V39.7c0,0-0.4-9.2-10.3-9.2s-10.7,9.2-10.7,9.2L60,54.2z" id="XMLID_280_"/><path class="st2" d="M53.5,50.1C53.5,50.1,53.5,50.1,53.5,50.1l0,24.6c0,0,0.2,13.2,16.7,13.2 c16.7,0,16.7-13.2,16.7-13.2V50.1c0,0,0,0,0,0h-3.1c0,0,0,0,0,0v23.1c0,0-0.1,11.1-13.6,11.1c-6,0-9.2-2.6-10.9-5.2 c-1.3-2-2-4.3-2-6.7V50.1c0,0,0,0,0,0H53.5z" id="XMLID_277_"/><path class="st2" d="M59.4,56.2h22.4v16.3c0,0,0.2,9.3-11.2,9.3c-11.9,0-11.2-9.3-11.2-9.3V56.2z" id="XMLID_274_"/><rect class="st2" height="11.5" id="XMLID_265_" width="3.7" x="68.6" y="87.2"/><path class="st2" d="M51.8,105h38.1C89.9,105,72,89,51.8,105z" id="XMLID_256_"/><path class="st3" d="M76.6,57.8h3.1V72c0,0-0.9,8.1-8.6,8.2c0,0,4.7-2.4,5.4-8L76.6,57.8z" id="XMLID_253_"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.5 KiB

6
www/widgets/basic/img/micSent.svg Normal file
View File

@@ -0,0 +1,6 @@
<?xml version="1.0" ?><svg id="Layer_1" style="enable-background:new 0 0 137.3 139.3;" version="1.1" viewBox="0 0 137.3 139.3" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><style type="text/css">
.st0{fill:#7E88D3;}
.st1{opacity:0.19;clip-path:url(#XMLID_79_);fill:#070808;}
.st2{fill:#FFFFFF;}
.st3{fill:#17269B;}
</style><circle class="st0" cx="68.2" cy="69.6" id="XMLID_240_" r="66.2"/><g id="XMLID_55_"><defs><circle cx="68.4" cy="69.6" id="XMLID_56_" r="66.2"/></defs><clipPath id="XMLID_79_"><use style="overflow:visible;" xlink:href="#XMLID_56_"/></clipPath><polygon class="st1" id="XMLID_139_" points="70.8,30.5 136.1,81.8 133.6,135.8 88.9,133.9 51.8,105 70.2,99.3 "/></g><path class="st2" d="M60,54.2h21.1V39.7c0,0-0.4-9.2-10.3-9.2s-10.7,9.2-10.7,9.2L60,54.2z" id="XMLID_280_"/><path class="st2" d="M53.5,50.1C53.5,50.1,53.5,50.1,53.5,50.1l0,24.6c0,0,0.2,13.2,16.7,13.2 c16.7,0,16.7-13.2,16.7-13.2V50.1c0,0,0,0,0,0h-3.1c0,0,0,0,0,0v23.1c0,0-0.1,11.1-13.6,11.1c-6,0-9.2-2.6-10.9-5.2 c-1.3-2-2-4.3-2-6.7V50.1c0,0,0,0,0,0H53.5z" id="XMLID_277_"/><path class="st2" d="M59.4,56.2h22.4v16.3c0,0,0.2,9.3-11.2,9.3c-11.9,0-11.2-9.3-11.2-9.3V56.2z" id="XMLID_274_"/><rect class="st2" height="11.5" id="XMLID_265_" width="3.7" x="68.6" y="87.2"/><path class="st2" d="M51.8,105h38.1C89.9,105,72,89,51.8,105z" id="XMLID_256_"/><path class="st3" d="M76.6,57.8h3.1V72c0,0-0.9,8.1-8.6,8.2c0,0,4.7-2.4,5.4-8L76.6,57.8z" id="XMLID_253_"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.5 KiB

6
www/widgets/basic/img/micStarted.svg Normal file
View File

@@ -0,0 +1,6 @@
<?xml version="1.0" ?><svg id="Layer_1" style="enable-background:new 0 0 137.3 139.3;" version="1.1" viewBox="0 0 137.3 139.3" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><style type="text/css">
.st0{fill:#A5FF7F;}
.st1{opacity:0.19;clip-path:url(#XMLID_79_);fill:#070808;}
.st2{fill:#FFFFFF;}
.st3{fill:#00FF21;}
</style><circle class="st0" cx="68.2" cy="69.6" id="XMLID_240_" r="66.2"/><g id="XMLID_55_"><defs><circle cx="68.4" cy="69.6" id="XMLID_56_" r="66.2"/></defs><clipPath id="XMLID_79_"><use style="overflow:visible;" xlink:href="#XMLID_56_"/></clipPath><polygon class="st1" id="XMLID_139_" points="70.8,30.5 136.1,81.8 133.6,135.8 88.9,133.9 51.8,105 70.2,99.3 "/></g><path class="st2" d="M60,54.2h21.1V39.7c0,0-0.4-9.2-10.3-9.2s-10.7,9.2-10.7,9.2L60,54.2z" id="XMLID_280_"/><path class="st2" d="M53.5,50.1C53.5,50.1,53.5,50.1,53.5,50.1l0,24.6c0,0,0.2,13.2,16.7,13.2 c16.7,0,16.7-13.2,16.7-13.2V50.1c0,0,0,0,0,0h-3.1c0,0,0,0,0,0v23.1c0,0-0.1,11.1-13.6,11.1c-6,0-9.2-2.6-10.9-5.2 c-1.3-2-2-4.3-2-6.7V50.1c0,0,0,0,0,0H53.5z" id="XMLID_277_"/><path class="st2" d="M59.4,56.2h22.4v16.3c0,0,0.2,9.3-11.2,9.3c-11.9,0-11.2-9.3-11.2-9.3V56.2z" id="XMLID_274_"/><rect class="st2" height="11.5" id="XMLID_265_" width="3.7" x="68.6" y="87.2"/><path class="st2" d="M51.8,105h38.1C89.9,105,72,89,51.8,105z" id="XMLID_256_"/><path class="st3" d="M76.6,57.8h3.1V72c0,0-0.9,8.1-8.6,8.2c0,0,4.7-2.4,5.4-8L76.6,57.8z" id="XMLID_253_"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.5 KiB

152
www/widgets/basic/img/pin_red5.svg Normal file
View File

File diff suppressed because one or more lines are too long
Side by Side

After

Width:  |  Height:  |  Size: 34 KiB

615
www/widgets/basic/js/table.js Normal file
View File

@@ -0,0 +1,615 @@
"use strict";
// Following classes should be used if variable table_class="tclass"
// <table class="tclass">
// <tr class="tclass-th">
// <th class="tclass-th1">Time</th>
// <th class="tclass-th2">Event</th>
// </tr>
// <tr class="tclass-tr tclass-tr-even tclass-tr-selected">
// <td>12:34:34</td>
// <td>Door opened</td>
// </tr>
// <tr class="tclass-tr tclass-tr-odd tclass-tr-red">
// <td>12:34:35</td>
// <td>Door closed</td>
// </tr>
// <tr class="tclass-tr tclass-tr-even">
// <td>12:34:36</td>
// <td>Window opened</td>
// </tr>
// </table>
//
// following json string or object is expected:
// '[\
// {"Time": "12:34:34", "Event": "Door opened", "_data":{"Type": "1", "Event" : "SomeEvent1"}, "_class": "selected"},\
// {"Time": "12:34:35", "Event": "Door closed", "_data":{"Type": "2", "Event" : "SomeEvent2"}, "_class": "red" },\
// {"Time": "12:34:36", "Event": "Window opened", "_data":{"Type": "3", "Event" : "SomeEvent3"}}\
// ]'
//
// If _detail object found and detailed_wid is defined
// following object will be created by selecting of one row:
// <table class="tclass-detail">
// <tr class="tclass-detail-tr tclass-detail-tr-even"><td class="tclass-detail-td-name">Type</td><td class="tclass-detail-td-value">1</td></tr>
// <tr class="tclass-detail-tr tclass-detail-tr-odd"><td class="tclass-detail-td-name">Event</td><td class="tclass-detail-td-value">SomeEvent1</td></tr>
// </table>
//
// Dialog
// Can be opened by writing "open" into trigger_id.
// As dialog closed the trigger_id will be written with the text of button
// "show" option is active only in edit mode and has no effect
//
if (vis.editMode) {
// Add words for basic widgets
$.extend(true, systemDictionary, {
"table_oid": {"en": "Table Object ID", "de": "Table Object ID", "ru": "ID таблицы"},
"static_value": {"en": "Static JSON(If no ID)", "de": "Static JSON(If no ID)", "ru": "Значение, если нет ID таблицы"},
"event_oid": {"en": "Event ID", "de": "Ereigniss ID", "ru": "ID события"},
"hide_header": {"en": "Hide header", "de": "Kein Header", "ru": "Скрыть заголовок"},
"show_scroll": {"en": "Show scroll", "de": "Zeige Scrollbar", "ru": "Показать прокрутку"},
"detailed_wid": {"en": "Detailed widget", "de": "Detailed widget", "ru": "Виджет детализации"},
"colCount": {"en": "Column count", "de": "Kolumnanzahl", "ru": "Кол-во колонок"},
"group_header": {"en": "Headers", "de": "Headers", "ru": "Заголовок"},
"colName": {"en": "Name", "de": "Name", "ru": "Имя"},
"colWidth": {"en": "Width", "de": "Width", "ru": "Ширина"},
"colAttr": {"en": "Attribute in JSON", "de": "Attribut in JSON", "ru": "Атрибут в JSON"},
"ack_oid": {"en": "Acknowledge ID", "de": "Bestätigung ID", "ru": "ID для подтверждения"},
"new_on_top": {"en": "New event on top", "de": "Neus Ereignis am Anfang", "ru": "Новые события сначала"}
});
}
vis.binds.table = {
getBrowserScrollSize: function (){
var css = {
"border": "none",
"height": "200px",
"margin": "0",
"padding": "0",
"width": "200px"
};
var inner = $("<div>").css($.extend({}, css));
var outer = $("<div>").css($.extend({
"left": "-1000px",
"overflow": "scroll",
"position": "absolute",
"top": "-1000px"
}, css)).append(inner).appendTo("body")
.scrollLeft(1000)
.scrollTop(1000);
var scrollSize = {
height: (outer.offset().top - inner.offset().top) || 0,
width: (outer.offset().left - inner.offset().left) || 0
};
outer.remove();
return scrollSize;
},
// Show detailed information
onRowClick: function () {
var $this = $(this);
var data = $this.data('options');
// Deselect all rows
$('#' + data.wid + ' .vis-table-row').removeClass(data.tClass + '-tr-selected');
// Select a new one
$this.addClass(data.tClass + '-tr-selected');
// Get container for detailed information
var $el = $('#' + data.detailed_wid);
if ($el.length) {
var text = '';
if (data.content._detail) {
text += '<table class="' + data.tClass + '-detail">';
// Show that object
var r = 0;
var obj = '_detail';
// Go through all attributes
if (typeof data.content[obj] == 'object') {
for (var odata in data.content[obj]) {
if (typeof data.content[obj][odata] === 'function') continue;
var val = data.content[obj][odata].toString();
if (odata.length > 1 && odata[0] === '_' && obj !== '_class' && obj.substring(0, 4) !== '_btn' && obj !== '_id') {
continue;
}
text += '<tr class="' + data.tClass + '-detail-tr ' + data.tClass + '-detail-tr-' + ((r % 2) ? 'odd' : 'even') + '"><td class="' + data.tClass + '-detail-td-name">' + odata + '</td>' +
'<td class="' + data.tClass + '-detail-td-value">' + val + '</td></tr>';
if (val && val.length > 6 && val.substring(val.length - 6) === '&nbsp;') {
text += '<tr class="' + data.tClass + '-detail-tr"><td colspan="2">&nbsp;</td></tr>';
}
r++;
}
} else {
var val = data.content[obj].toString();
text += '<tr class="' + data.tClass + '-detail-tr ' + data.tClass + '-detail-tr-' + ((r % 2) ? 'odd' : 'even') + '"><td class="' + data.tClass + '-detail-td-name">' + obj.substring(1) + '</td>' +
'<td class="' + data.tClass + '-detail-td-value">' + val + '</td></tr>';
if (val && val.length > 6 && val.substring(val.length - 6) === '&nbsp;') {
text += '<tr class="' + data.tClass + '-detail-tr"><td colspan="2">&nbsp;</td></tr>';
}
r++;
}
text += '</table>';
} else {
// Try to find special attributes starting with '_'
for (var obj in data.content) {
if (!data.content.hasOwnProperty(obj) || typeof data.content[obj] === 'function') continue;
if (obj.length > 0 && obj[0] === '_' && obj !== '_class' && obj.substring(0, 4) !== '_btn' && obj !== '_id') {
text += '<table class="' + data.tClass + '-detail">';
// Show that object
var r = 0;
// Go through all attributes
if (typeof data.content[obj] === 'object') {
for (var odata in data.content[obj]) {
if (typeof data.content[obj][odata] === 'function') continue;
var val = data.content[obj][odata].toString();
if (odata.length > 1 && odata[0] === '_' && obj !== '_class' && obj.substring(0, 4) !== '_btn' && obj !== '_id') {
continue;
}
text += '<tr class="' + data.tClass + '-detail-tr ' + data.tClass + '-detail-tr-' + ((r % 2) ? 'odd' : 'even') + '"><td class="' + data.tClass + '-detail-td-name">' + odata + '</td>' +
'<td class="' + data.tClass + '-detail-td-value">' + val + '</td></tr>';
if (val && val.length > 6 && val.substring(val.length - 6) === '&nbsp;') {
text += '<tr class="' + data.tClass + '-detail-tr"><td colspan="2">&nbsp;</td></tr>';
}
r++;
}
} else {
var val = data.content[obj].toString();
text += '<tr class="' + data.tClass + '-detail-tr ' + data.tClass + '-detail-tr-' + ((r % 2) ? 'odd' : 'even') + '"><td class="' + data.tClass + '-detail-td-name">' + obj.substring(1) + '</td>' +
'<td class="' + data.tClass + '-detail-td-value">' + val + '</td></tr>';
if (val && val.length > 6 && val.substring(val.length - 6) === '&nbsp;') {
text += '<tr class="' + data.tClass + '-detail-tr"><td colspan="2">&nbsp;</td></tr>';
}
r++;
}
text += '</table>';
}
}
}
// If no special _data object found => show standard elements
if (!text) {
text = '<table class="' + data.tClass + '-detail">';
// Go through all attributes
var row = 0;
for (var data_obj in data.content) {
// Show that object
if (!data.content.hasOwnProperty(data_obj) ||
(data_obj.length > 1 && data_obj[0] === '_' && data_obj !== '_class' && data_obj.substring(0, 4) !== '_btn' && data_obj !== '_id')) {
continue;
}
var val = data.content[data_obj].toString();
text += '<tr class="' + data.tClass + '-detail-tr ' + data.tClass + '-detail-tr-' + ((row % 2) ? 'odd' : 'even') + '"><td class="' + data.tClass + '-detail-td-name">' + data_obj + '</td>' +
'<td class="' + data.tClass + '-detail-td-value">' + data.content[data_obj]+'</td></tr>';
if (val.length > 6 && val.substring(val.length - 6) === '&nbsp;') {
text += '<tr class="' + data.tClass + '-detail-tr"><td colspan="2">&nbsp;</td></tr>';
}
row++;
}
text += '</table>';
}
$el.html(text);
/*if (options.btn_print) {
$(el).append ('<button id="print_'+that._parent._wid+'" class="'+data.tClass+'-print-button">' + options.btn_print + '</button>');
var btn = document.getElementById ('print_'+that._parent._wid);
btn._parent = that._parent;
btn._print_id = that._data._print_id || JSON.stringify(that._data);
if (btn && !vis.editMode) {
$(btn).bind('click', function () {
if (that._parent._options.ack_oid) {
vis.setValue(that._parent._options.ack_oid, that._print_id);
}
if (that._parent._options.view_for_print) {
vis.changeView(that._parent._options.view_for_print);
}
setTimeout(function () {
window.print();
window.location.reload()
}, 500);
});
}
}*/
}
},
onAckButton: function () {
var data = $(this).data('options');
if (data.ack_oid) {
vis.setValue(data.ack_oid, data.ack_id);
}
},
createRow: function (rowData, wid, options, rowNumber, noTR, index, serverID) {
var tClass = options['class'] || 'tclass';
var _classes = rowData['_class'] ? rowData['_class'].split(' ') : null;
var text;
// Create row
if (!noTR) {
text = '<tr class="vis-table-row ' + tClass + '-tr ' +
tClass + ((rowNumber % 2) ? '-tr-even' : '-tr-odd');
if (_classes) {
for (var t = 0, len = _classes.length; t < len; t++) {
text += ' ' + (tClass + '-tr-' + _classes[t]);
}
}
text += '" data-index="' + index + '" data-server-id="' + serverID + '">';
} else {
text = '';
}
var k = 1;
for (var obj in rowData) {
if (!rowData.hasOwnProperty(obj) ||
obj.match(/^jQuery/) ||
typeof rowData[obj] === 'function') {
continue;
}
var attr = options['colAttr' + k] || obj;
if (attr && attr[0] === '_') {
if (attr.match(/^_btn/) || options['colAttr' + k]) {
var btnText = '';
var btnClass = '';
text += '<td class="' + tClass + '-th' + k + '" ' + (options['colWidth' + k] ? 'style="width:' + options['colWidth' + k] + '"' : '') + '>';
if (attr.match(/^_btn/)){
if (typeof rowData[attr] === 'string') {
btnText = rowData[attr];
} else {
btnText = rowData[attr].caption;
btnClass = rowData[attr]._class;
}
if (btnText) {
text += '<button data-index="' + index + '" data-server-id="' + serverID + '" class="vis-table-ack-button ' + tClass + '-ack-button ' + (btnClass ? ('-' + btnClass) : '') + '">' + btnText + '</button>';
}
} else {
text += rowData[attr];
}
text += '</td>';
k++;
}
continue;
}
if (!options.colCount || k <= options.colCount) {
text += '<td class="' + tClass + '-th' + k + '" ' + (options['colWidth' + k] ? 'style="width:' + options['colWidth' + k] + '"' : '') + '>' + rowData[attr] + '</td>';
}
k++;
}
if (!noTR) text += '</tr>';
return text;
},
showTable: function (view, wid, options) {
var $div = $('#' + wid);
if (!$div.length) {
setTimeout(function () {
vis.binds.table.showTable(view, wid, options);
}, 100);
return;
}
//vis.binds.table.initTable();
var tClass = options['class'] || 'tclass';
// read actual table as json string
var tableJson = options.table_oid ? vis.states.attr(options.table_oid + '.val') : (options.static_value || '');
var table = [];
if (typeof app !== 'undefined' && app.replaceFilePathJson) {
tableJson = app.replaceFilePathJson(tableJson);
}
if (tableJson && typeof tableJson === 'string') {
try {
table = JSON.parse(tableJson);
}
catch (e) {
console.log ("showTable: Cannot parse json table");
table = [];
}
} else {
table = tableJson;
}
if (!table) table = [];
// Create widget container
var $elem = $('#' + wid);
// Start creation of table
var header = '<table class="vis-table-header ' + tClass + '">';
var text = '<div class="vis-table-div ' + tClass + '-inner' + ((options.show_scroll) ? ' tclass-inner-overflow' : '') + '"><table class="vis-table-body ' + tClass + '">';
var headerDone = false;
var j = 0;
var selectedId = null;
if (options.max_rows) options.max_rows = parseInt(options.max_rows);
// Go through all lines
for (var ii = 0, ilen = table.length; ii < ilen; ii++) {
if (!table[ii]) continue;
var _classes = table[ii]['_class'] ? table[ii]['_class'].split(' ') : null;
// Create table header
if (!headerDone) {
header += '<tr class="' + tClass + '-th">';
var k = 1;
for (var obj in table[ii]) {
if (!table[ii].hasOwnProperty(obj) ||
obj.match(/^jQuery/) ||
typeof table[ii][obj] === 'function') {
continue;
}
var attr = options['colAttr' + k] || obj;
if (attr && attr[0] === '_') {
if (attr.match(/^_btn/) || options['colAttr' + k]) {
header += '<th class="' + tClass + '-th' + k + '" ' + (options['colWidth' + k] ? 'style="width:' + options['colWidth' + k] + '"' : '') + '>' + (options['colName' + k] || '') + '</th>';
k++;
}
continue;
}
if (!options.colCount || k <= options.colCount) {
header += '<th class="' + tClass + '-th' + k + '" ' + (options['colWidth' + k] ? 'style="width:' + options['colWidth' + k] + '"' : '') + '>' + (options['colName' + k] || attr) + '</th>';
}
k++;
}
if (options.show_scroll !== 'false' && options.show_scroll !== false && options.show_scroll !== undefined){
// Get the scroll width once
if (!vis.binds.table.scrollSize) vis.binds.table.scrollSize = vis.binds.table.getBrowserScrollSize();
header += '<td style="width:' + (vis.binds.table.scrollSize.width - 6) + 'px"></td></tr>';
}
//header += '</tr>';
headerDone = true;
}
if (_classes &&_classes.indexOf('selected') !== -1) selectedId = ii;
text += vis.binds.table.createRow(table[ii], wid, options, j, false, ii, table[ii]._id);
j++;
if (options.max_rows && j >= options.max_rows) break;
}
text += '</table></div>\n';
header += '</table>\n';
$elem.find('.vis-table-div').remove();
$elem.find('.vis-table-header').remove();
// Insert table into container
$elem.append((options.hide_header ? '' : header) + text);
var data = {
options: options,
wid: wid,
view: view
};
$elem.find('.vis-table-ack-button').unbind('click touchstart').bind('click touchstart', function (e) {
// Protect against two events
if (vis.detectBounce(this)) return;
vis.binds.table.onAckButton.call(this, e);
});
// Set additional data for every row
for (var i = 0, len = table.length; i < len; i++) {
if (!table[i]) continue;
$elem.find('.vis-table-ack-button[data-index="' + i + '"]')
.data('options', {
ack_id: table[i]._ack_id || JSON.stringify(table[i]),
ack_oid: options.ack_oid
});
}
// If detailed information desired
if (options.detailed_wid) {
// Bind on click event for every row
$elem.find('.vis-table-row').unbind('click touchstart').bind('click touchstart', function (e) {
// Protect against two events
if (vis.detectBounce(this)) return;
vis.binds.table.onRowClick.call(this, e);
});
// Set additional data for every row
for (i = 0, len = table.length; i < len; i++) {
if (!table[i]) continue;
$elem.find('.vis-table-row[data-index="' + i + '"]')
.data('options', {
content: table[i],
detailed_wid: options.detailed_wid,
tClass: tClass,
wid: wid
});
}
if (selectedId) {
setTimeout (function () {
$elem.find('.vis-table-row[data-index="' + selectedId + '"]').trigger('click');
}, 200);
}
}
// Remember index to calculate even or odd
data.rowNum = options.new_on_top ? 0 : ((j - 1) >= 0 ? j - 1 : 0);
function cbNewTable (e, newVal, oldVal) {
$elem.trigger('newTable', newVal);
}
function cbNewEvent (e, newVal, oldVal) {
$elem.trigger('newEvent', newVal);
}
if (!$('#' + wid).data('inited')) {
$('#' + wid).data('inited', true);
// New event coming
$elem.on('newEvent', function (e, newVal) {
if (e.handled) return;
e.handled = true;
var newEvent;
var data = $(this).data('options');
// Convert event to json
if (newVal) {
if (typeof newVal === 'string') {
try {
newEvent = JSON.parse(newVal);
}
catch (e)
{
console.log('elem.triggered: Cannot parse json new event ' + newVal);
return;
}
} else {
newEvent = newVal;
}
}
else {
return;
}
// Try to find, if this event yet exists
var $row = (newEvent._id !== undefined) ? $(this).find('tr[data-index="' + newEvent._id + '"]') : [];
// get next row number for new line
if (!$row.length) data.rowNum++;
var text = vis.binds.table.createRow(newEvent, data.wid, data.options, data.rowNum, ($row.length > 0), (newEvent._id === undefined) ? data.rowNum : newEvent._id);
if ($row.length) {
$row.html(text).addClass(newEvent._class || '');
} else {
// If add to the top of table
if (data.options.new_on_top) {
$('#' + this.id).find('.vis-table-body').prepend(text);
} else {
// Add to the bottom of table
$('#' + this.id).find('.vis-table-body').append(text);
}
}
var $el;
// If detailed widget desired
if (data.options.detailed_wid) {
$el = $('#' + this.id).find('.vis-table-row[data-index="' + ((newEvent._id === undefined) ? data.rowNum : newEvent._id) + '"]')
.data('options', {
content: newEvent,
detailed_wid: options.detailed_wid,
tClass: tClass,
wid: wid
}).unbind('click touchstart').bind('click touchstart', function (e) {
// Protect against two events
if (vis.detectBounce(this)) return;
vis.binds.table.onRowClick.call(this, e);
});
$el = $(this).find('.tr_' + ((newEvent._id === undefined) ? data.rowNum : newEvent._id));
}
$('#' + this.id).find('.ack_button_' + ((newEvent._id === undefined) ? data.rowNum : newEvent._id))
.data('options', {data: newEvent, parent: this, ack_id: newEvent._ack_id || JSON.stringify(newEvent)})
.unbind('click touchstart').bind('click touchstart', function (e) {
// Protect against two events
if (vis.detectBounce(this)) return;
vis.binds.table.onAckButton.call(this, e);
});
})
.on('newTable', function (e, newVal) {
if (e.handled) return;
e.handled = true;
var data = $(this).data('options');
// Update whole table
_setTimeout(vis.binds.table.showTable, 50, data.view, data.wid, data.options);
});
}
$('#' + wid).data('options', data);
if (options.event_oid) {
if ($('#' + wid).data('binded') !== options.event_oid) {
$('#' + wid).data('binded', options.event_oid);
vis.states.bind(options.event_oid + '.val', cbNewEvent);
}
} else {
if ($('#' + wid).data('binded') !== options.table_oid) {
$('#' + wid).data('binded', options.table_oid);
vis.states.bind(options.table_oid + '.val', cbNewTable);
}
}
},
showDialog: function (view, wid, options) {
var trigger_value = vis.states.attr(options.trigger_id + '.val');
// Register callback in dashUI
if (options.trigger_id) vis.binds.table.registerIds(wid, options.trigger_id);
// Create widget container
$('#' + wid).remove();
$('#visview_' + view).append('<div class="vis-widget ' + (options._class || "") + '" id="' + wid + '" data-oid="' + (options.trigger_id || '') + '" title="'+options.title+'">' +
'<table style="margin-left: ' + options.margin_left + 'px;margin-top:' + options.margin_top + 'px"><tr><td>' + (options.image ? '<img src="' + options.image + '"/>': '') + '</td><td>' + options.text + '</td></tr></table>' +
'</div>');
var elem = document.getElementById(wid);
var buttons = {};
for (var t = 0, len = options.buttons.length; t < len; t++) {
if (options.buttons[t]) {
buttons[options.buttons[t]] = {
text: options.buttons[t],
data: {data: options.buttons[t], trigger_id: options.trigger_id},
click: function (evt, ui) {
if (1 || !vis.editMode) {
if (vis.binds.dialog_trigger_id) {
vis.setValue(vis.binds.dialog_trigger_id, evt.currentTarget.textContent);
}
}
$(this).dialog('close');
}
}
}
}
elem._options = options;
// Disable autofocus in edit mode
if (vis.editMode) {
$.ui.dialog.prototype._focusTabbable = function () {
};
}
$(elem).dialog({
resizable: false,
height: options.height || 200,
width: options.width || 400,
autoOpen: false,
modal: (options.modal === true || options.modal === 'true'),
draggable: false,
buttons: buttons
});
if ((vis.editMode && options.show) || trigger_value === 'open') {
$(elem).dialog('open');
vis.binds.dialog_trigger_id = options.trigger_id;
}
elem.triggered = function (objId, _newEvent) {
if (_newEvent === 'open') {
$(this).dialog('open');
vis.binds.dialog_trigger_id = this._options.trigger_id;
}
}
}
};