Skip to content

Commit 2c1da3c

Browse files
mbm-ORmbm-OR
committed
Added navigation arrows
1 parent 515c658 commit 2c1da3c

File tree

6 files changed

+109
-97
lines changed

6 files changed

+109
-97
lines changed

‎Source/RunActivity/Viewer3D/WebServices/Web/TrainDpu/index.css‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -87,7 +87,7 @@ td[ColorCode= "$$$"]{
8787

8888
/* Developer: Used as help for cells alignement*/
8989
td {
90-
/*border: black 1px solid;
90+
/*border: black 1px solid;*/
9191
border-spacing: 0;
9292
border-radius: 7px;
9393
}

‎Source/RunActivity/Viewer3D/WebServices/Web/TrainDpu/index.js‎

Lines changed: 108 additions & 96 deletions
Original file line numberDiff line numberDiff line change
@@ -26,6 +26,7 @@ var hr = new XMLHttpRequest;
2626
var httpCodeSuccess = 200;
2727
var xmlHttpRequestCodeDone = 4;
2828
var normalTextMode = true;
29+
var arrowMode = true;
2930

3031
function ApiTrainDpu() {
3132
// GET to fetch data, POST to send it
@@ -55,131 +56,138 @@ function ApiTrainDpu() {
5556
var Fence = "\u2590";
5657

5758
// Table title
58-
var colspanValue = obj[0].LastCol.length + 5;
59-
Str += "<tr> <td colspan='" + colspanValue + "' style='text-align: center'>" + 'Train DPU Info' + "</td></tr>";
60-
Str += "<tr> <td colspan='" + colspanValue + "' class='separator'></td></tr>";
59+
var colspanValue = obj[0].LastCol.length + obj[0].SymbolCol.length + 1;// 1 = firstCol
60+
Str += "<tr> <td></td> <td colspan='" + colspanValue + "' style='text-align: center'>" + 'Train DPU Info' + "</td></tr>";
61+
Str += "<tr> <td colspan='" + colspanValue + 3 + "' class='separator'></td></tr>";
6162

63+
var lineCount = 0;
6264
// Customize data
6365
for (const data of obj) {
6466
if (data.FirstCol != "" && data.LastCol != null && data.SymbolCol != null) {
65-
Str += "<tr>";
66-
firstColor = false;
67-
let lastColor = [];
68-
let symbolColor = [];
69-
var n = 0;
70-
for (const dataCol of obj[0].LastCol) {
71-
lastColor[n] = false;
72-
symbolColor[n] = false;
73-
n++;
74-
}
75-
keyColor = false;
67+
if (lineCount < 6 && !arrowMode || arrowMode) {
68+
Str += "<tr>";
69+
firstColor = false;
70+
let lastColor = [];
71+
let symbolColor = [];
72+
var n = 0;
73+
for (const dataCol of obj[0].LastCol) {
74+
lastColor[n] = false;
75+
symbolColor[n] = false;
76+
n++;
77+
}
78+
keyColor = false;
7679

77-
// FirstCol
78-
if (data.FirstCol != null) {
79-
endIndexFirst = data.FirstCol.length;
80-
newDataFirst = data.FirstCol.slice(0, endIndexFirst - 3);
81-
stringColorFirst = data.FirstCol.slice(-3);
82-
}
80+
// FirstCol
81+
if (data.FirstCol != null) {
82+
endIndexFirst = data.FirstCol.length;
83+
newDataFirst = data.FirstCol.slice(0, endIndexFirst - 3);
84+
stringColorFirst = data.FirstCol.slice(-3);
85+
}
8386

84-
// LastCol
85-
if (data.LastCol != null) {
86-
n = 0;
87-
for (const dataCol of data.LastCol) {
88-
endIndexLast[n] = dataCol.length;
89-
newDataLast[n] = dataCol.slice(0, endIndexLast[n] - 3);
90-
stringColorLast[n] = dataCol.slice(-3);
91-
n++;
87+
// LastCol
88+
if (data.LastCol != null) {
89+
n = 0;
90+
for (const dataCol of data.LastCol) {
91+
endIndexLast[n] = dataCol.length;
92+
newDataLast[n] = dataCol.slice(0, endIndexLast[n] - 3);
93+
stringColorLast[n] = dataCol.slice(-3);
94+
n++;
95+
}
9296
}
93-
}
9497

95-
// smallSymbol
96-
if (data.SymbolCol != null) {
97-
n = 0;
98-
for (const dataSymbol of data.SymbolCol) {
99-
endIndexSymbol[n] = dataSymbol.length;
100-
newDataSymbol[n] = dataSymbol.slice(0, endIndexSymbol[n] - 3);
101-
smallSymbolColor[n] = dataSymbol.slice(-3);
102-
n++;
98+
// smallSymbol
99+
if (data.SymbolCol != null) {
100+
n = 0;
101+
for (const dataSymbol of data.SymbolCol) {
102+
endIndexSymbol[n] = dataSymbol.length;
103+
newDataSymbol[n] = dataSymbol.slice(0, endIndexSymbol[n] - 3);
104+
smallSymbolColor[n] = dataSymbol.slice(-3);
105+
n++;
106+
}
103107
}
104-
}
105108

106-
// detects color
107-
if (codeColor.indexOf(stringColorFirst) != -1) { firstColor = true; }
108-
//detect color inside array
109-
if (data.LastCol != null) {
110-
n = 0;
111-
for (const dataCol of data.LastCol) {
112-
if (codeColor.indexOf(stringColorLast[n]) != -1) { lastColor[n] = true; }
113-
n++;
109+
// detects color
110+
if (codeColor.indexOf(stringColorFirst) != -1) { firstColor = true; }
111+
//detect color inside array
112+
if (data.LastCol != null) {
113+
n = 0;
114+
for (const dataCol of data.LastCol) {
115+
if (codeColor.indexOf(stringColorLast[n]) != -1) { lastColor[n] = true; }
116+
n++;
117+
}
114118
}
115-
}
116-
if (data.SymbolCol != null) {
117-
n = 0;
118-
for (const dataSymbol of data.SymbolCol) {
119-
if (codeColor.indexOf(smallSymbolColor[n]) != -1) { symbolColor[n] = true; }
120-
n++;
119+
if (data.SymbolCol != null) {
120+
n = 0;
121+
for (const dataSymbol of data.SymbolCol) {
122+
if (codeColor.indexOf(smallSymbolColor[n]) != -1) { symbolColor[n] = true; }
123+
n++;
124+
}
121125
}
122-
}
123126

124-
if (data.FirstCol == null) {
125-
Str += "<td></td>";
126-
}
127-
else if (data.FirstCol == "Sprtr") {
128-
Str += "<td colspan='" + colspanValue + "' class='separator'></td>";
129-
}
130-
else {
131-
// first col = FirstCol data
132-
if (firstColor == true) {
133-
Str += "<td ColorCode=" + stringColorFirst + ">" + newDataFirst + "</td>";
127+
if (data.FirstCol == null) {
128+
Str += "<td></td>";
134129
}
135-
else {
136-
Str += "<td>" + data.FirstCol + "</td>";
130+
else if (data.FirstCol == "Sprtr") {
131+
Str += "<td colspan='" + colspanValue + "' class='separator'></td>";
137132
}
133+
else {
134+
// left space
135+
Str += "<td></td>";
138136

139-
// second col = LastCol && SymbolCol data
140-
n = 0;
141-
if (data.LastCol != null) {
142-
for (const dataCol of data.LastCol) {
143-
if (symbolColor[n] == true) { // with color
144-
Str += "<td ColorCode=" + smallSymbolColor[n] + " width='16' style='text-align: left'>" + newDataSymbol[n] + "</td>";
145-
}
146-
else { // not color
147-
Str += "<td width='16' style='text-align: center'>" + data.SymbolCol[n] + "</td>";
148-
}
149-
if (lastColor[n] == true) { // with color
150-
if (newDataLast[n].indexOf("|") != -1) {
151-
newDataLast[n] = newDataLast[n].replace("|", "");// replace fence
137+
// first col = FirstCol data
138+
if (firstColor == true) {
139+
Str += "<td ColorCode=" + stringColorFirst + ">" + newDataFirst + "</td>";
140+
}
141+
else {
142+
Str += "<td>" + data.FirstCol + "</td>";
143+
}
144+
145+
// second col = LastCol && SymbolCol data
146+
n = 0;
147+
if (data.LastCol != null) {
148+
for (const dataCol of data.LastCol) {
149+
if (symbolColor[n] == true) { // with color
150+
Str += "<td ColorCode=" + smallSymbolColor[n] + " width='16' style='text-align: left'>" + newDataSymbol[n] + "</td>";
152151
}
153-
Str += "<td ColorCode=" + stringColorLast[n] + ">" + newDataLast[n] + "</td>";
154-
}
155-
else { // not color
156-
if (data.FirstCol == obj[0].FirstCol) {
157-
Str += "<td style='text-align: center'>" + data.LastCol[n] + "</td>";
152+
else { // not color
153+
Str += "<td width='16' style='text-align: center'>" + data.SymbolCol[n] + "</td>";
158154
}
159-
else {
160-
if (data.LastCol[n].indexOf("|") != -1) {
161-
data.LastCol[n] = data.LastCol[n].replace("|", "");// replace fence
155+
if (lastColor[n] == true) { // with color
156+
if (newDataLast[n].indexOf("|") != -1) {
157+
newDataLast[n] = newDataLast[n].replace("|", "");// replace fence
158+
}
159+
Str += "<td ColorCode=" + stringColorLast[n] + ">" + newDataLast[n] + "</td>";
160+
}
161+
else { // not color
162+
if (data.FirstCol == obj[0].FirstCol) {
163+
Str += "<td style='text-align: center'>" + data.LastCol[n] + "</td>";
164+
}
165+
else {
166+
if (data.LastCol[n].indexOf("|") != -1) {
167+
data.LastCol[n] = data.LastCol[n].replace("|", "");// replace fence
168+
}
169+
Str += "<td style='text-align: left'>" + data.LastCol[n] + "</td>";
162170
}
163-
Str += "<td style='text-align: left'>" + data.LastCol[n] + "</td>";
164171
}
172+
n++
165173
}
166-
n++
167174
}
168-
}
169175

170-
// separator
171-
if (data.FirstCol == obj[0].FirstCol) {
172-
Str += "<tr> <td colspan='" + colspanValue + "' class='separator'></td></tr>";
176+
// separator
177+
if (data.FirstCol == obj[0].FirstCol) {
178+
Str += "<tr> <td colspan='" + colspanValue + "' class='separator'></td></tr>";
179+
}
173180
}
181+
Str += "</tr>";
174182
}
175-
Str += "</tr>";
183+
lineCount++;
176184
}
177185
}
178186
// separator at bottom
179187
Str += "<tr> <td colspan='" + colspanValue + "' class='separator'></td></tr>";
180-
Str += "</table>";
181-
// space at bottom
182-
Str += "<tr> <td colspan='" + colspanValue + "' onclick='changeNormalTextMode()' style='text-align: center'><img src='/or_logo.png' height='16' width='16'></img></td> </tr>";
188+
// nav arrows bottom
189+
Str += "<tr> <td> </td> <td colspan='" + colspanValue / 2 + "' onclick='changeNormalTextMode()' style='text-align: center'><img src='" + (normalTextMode ? '/arrow_left.png' : '/arrow_right.png') + "' height='16' width='16'></img></td>";
190+
Str += "<td colspan='" + (colspanValue / 2) + 1 + "' onclick='changeDisplayMode()'style='text-align: center'><img src='" + (arrowMode ? '/arrow_up.png' : '/arrow_down.png') + "' height='16' width='16'></img></td> <td></td> </tr>";
183191
Str += "</table>";
184192
TrainDpu.innerHTML = Str;
185193
}
@@ -205,4 +213,8 @@ function changePageColor() {
205213

206214
function changeNormalTextMode() {
207215
normalTextMode = !normalTextMode;
216+
};
217+
218+
function changeDisplayMode() {
219+
arrowMode = !arrowMode;
208220
};

‎Source/RunActivity/Viewer3D/WebServices/Web/arrow_down.png‎

355 Bytes
Loading

‎Source/RunActivity/Viewer3D/WebServices/Web/arrow_left.png‎

491 Bytes
Loading

‎Source/RunActivity/Viewer3D/WebServices/Web/arrow_right.png‎

490 Bytes
Loading

‎Source/RunActivity/Viewer3D/WebServices/Web/arrow_up.png‎

349 Bytes
Loading

0 commit comments

Comments
 (0)