forked from parth-r-patel/outpost-polymer
-
Notifications
You must be signed in to change notification settings - Fork 0
/
tele-op.html
131 lines (125 loc) · 5.13 KB
/
tele-op.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
<link rel="import" href="bower_components/twbs-grid/twbs-grid.html">
<link rel="import" href="number-counter.html">
<polymer-element name = "tele-op">
<template>
<style>
ul{
list-style: none;
margin: 0px;
padding: 0px;
padding-right: 55px;
border-right: 3px solid;
}
/*
h5{
margin: 0px;
padding: 0px;
}
*/
.labels{
padding: 7px 7px 7px 7px;
height: 50px;
}
.labels > h5
{
margin: 0;
position: relative;
top: 34%;
}
</style>
<bs-container>
<!--
<bs-row>
<bs-col xs="12"><h3>Tele Op</h3></bs-col>
</bs-row>
-->
<bs-row style = "border-bottom: 3px solid #64FFDA">
<bs-col xs="2" style="padding-right: 0;">
<div class="labels"><h5>Landfill</h5></div>
<div class="labels"><h5>Human Load</h5></div>
<div class="labels"><h5>Step</h5></div>
<div class="labels"><h5>Upside Down</h5></div>
</bs-col>
<bs-col xs="4" style ="border-right: 3px solid #64FFDA">
<number-counter id = "totesAcquired" values = [0,0,0,0] valueLimits = [28,33,12,100]></number-counter>
</bs-col>
<bs-col xs="2">
<div class="labels"><h5>Step</h5></div>
<div class="labels"><h5>Ground</h5></div>
<div class="labels"><h5>Not Upright</h5></div>
</bs-col>
<bs-col xs="4">
<number-counter id = "binsAcquired" values = [0,0,0] valueLimits = [4,7,7]></number-counter>
</bs-col>
</bs-row>
<bs-row style = "border-bottom: 3px solid #64FFDA">
<bs-col xs="2" style="padding-right: 0;">
<div class="labels"><h5>Level 6</h5></div>
<div class="labels"><h5>Level 5</h5></div>
<div class="labels"><h5>Level 4</h5></div>
<div class="labels"><h5>Level 3</h5></div>
<div class="labels"><h5>Level 2</h5></div>
<div class="labels"><h5>Level 1</h5></div>
</bs-col>
<bs-col xs="4" style ="border-right: 3px solid #64FFDA">
<number-counter id = "totesScored" values = [0,0,0,0,0,0]></number-counter>
</bs-col>
<bs-col xs="2">
<div class="labels"><h5>Level 6</h5></div>
<div class="labels"><h5>Level 5</h5></div>
<div class="labels"><h5>Level 4</h5></div>
<div class="labels"><h5>Level 3</h5></div>
<div class="labels"><h5>Level 2</h5></div>
<div class="labels"><h5>Level 1</h5></div>
</bs-col>
<bs-col xs="4">
<number-counter id = "binsScored" values = [0,0,0,0,0,0] sumLimit = 7></number-counter>
</bs-col>
</bs-row>
<bs-row>
<bs-col xs="2" style="padding-right: 0;">
<div class="labels"><h5>Litter Processed</h5></div>
</bs-col>
<bs-col xs="4" style ="border-right: 3px solid #64FFDA">
<number-counter id = "litterProcessed" values = [0] sumLimit = 10></number-counter>
</bs-col>
<bs-col xs="2"><div class="labels"><h5>Litter Capped</h5></div></bs-col>
<bs-col xs="4"><number-counter id = "litterCapped" values = [0] sumLimit = 10></number-counter></bs-col>
</bs-row>
<bs-row>
<bs-col xs="3" style="padding-top: 20px; padding-bottom: 20px;"> <paper-button raised on-click="{{submitData}}">Submit that Data Doe</paper-button></bs-col>
</bs-row>
</bs-container>
<paper-toast id="toast" text="{{msg}}" duration="3000"></paper-toast>
</template>
<script>
Polymer({
submitData: function(){
var teleOpForm = {};
if(this.$.binsScored.sum > this.$.binsAcquired.sum){
this.msg = ("More Bins scored than acquired");
this.$.toast.show();
}
else if(this.$.totesScored.sum > this.$.totesAcquired.sum){
this.msg = ("More Totes scored than acquired");
this.$.toast.show();
}
else{
teleOpForm["TotesAcquiredLandfill"] = this.$.totesAcquired.values[0];
teleOpForm["TotesAcquiredHumanLoad"] = this.$.totesAcquired.values[1];
teleOpForm["TotesAcquiredStep"] = this.$.totesAcquired.values[2];
teleOpForm["UpsideDownTotesAcquired"] = this.$.totesAcquired.values[3];
teleOpForm["BinsAcquiredStep"] = this.$.binsAcquired.values[0];
teleOpForm["BinsAcquiredZone"] = this.$.binsAcquired.values[1];
teleOpForm["NonUprightBinsAcquired"] = this.$.binsAcquired.values[2];
teleOpForm["TotesScored"] = this.$.totesScored.values;
teleOpForm["BinsScored"] = this.$.binsScored.values;
teleOpForm["LitterProcessed"] = this.$.litterProcessed.values[0];
teleOpForm["LitterCapped"] = this.$.litterCapped.values[0];
window.sessionStorage.setItem("teleopForm", JSON.stringify(teleOpForm));
document.querySelector('outpost-header /deep/ paper-tabs').selected++;
}
}
});
</script>
</polymer-element>