diff --git a/public/assets/css/picoreflow.css b/public/assets/css/picoreflow.css
index 74ea3f8..067abac 100644
--- a/public/assets/css/picoreflow.css
+++ b/public/assets/css/picoreflow.css
@@ -6,6 +6,14 @@
url('/picoreflow/assets/fonts/LCDN.ttf') format("truetype");
}
+@font-face{
+ font-family: "Digi";
+ src: url('/picoreflow/assets/fonts/digital-7-webfont.eot');
+ src: local("Digital 7"),
+ url('/picoreflow/assets/fonts/digital-7-webfont.woff') format("woff"),
+ url('/picoreflow/assets/fonts/digital-7-webfont.ttf') format("truetype");
+}
+
@font-face{
font-family: "NoticeStd";
src: url('/picoreflow/assets/fonts/noticestd-webfont.eot');
@@ -25,63 +33,86 @@ body {
-webkit-border-radius: 7px;
-moz-border-radius: 7px;
border-radius: 7px;
- background: #3F3E3A url('/picoreflow/assets/images/panel_bg.png') repeat;
- -moz-box-shadow: 0 0 1.1em 0 rgba(0,0,0,0.85),inset 0 0 9px 2px #000;
- -webkit-box-shadow: 0 0 1.5em 0 rgba(0,0,0,0.85),inset 0 0 9px 2px #000;
- box-shadow: 0 0 1.1em 0 rgba(0,0,0,0.85),inset 0 0 9px 2px #000;
- border-color: #282828;
- height: 65px;
+ border: 1px solid #ddd;
+ height: 86px;
+ -moz-box-shadow: 0 0 1.1em 0 rgba(0,0,0,0.55);
+ -webkit-box-shadow: 0 0 1.5em 0 rgba(0,0,0,0.55);
+ box-shadow: 0 0 1.1em 0 rgba(0,0,0,0.55);
}
.display {
display: inline-block;
text-align: right;
- padding-right: 10px;
- font-size: 28px;
+ padding-right: 5px;
+ font-size: 40px;
font-weight: normal;
- text-shadow: 0px 0px 10px #000000, -1px -1px #000;
height: 45px;
line-height: 45px;
- width: 90px;
+ width: 100px;
vertical-align: middle;
color: #d8d3c5;
border-color: #000000;
}
.ds-panel {
- background-color: rgba(33, 32, 28, 0.55);
- -webkit-border-top-left-radius: 7px;
- -webkit-border-top-right-radius: 7px;
- -moz-border-radius-topleft: 7px;
- -moz-border-radius-topright: 7px;
- border-top-left-radius: 7px;
- border-top-right-radius: 7px;
+ border-top: 1px solid #000;
+ background: #3F3E3A url('/picoreflow/assets/images/panel_bg.png') repeat;
+ -moz-box-shadow: inset 0 0 10px 0 #000;
+ -webkit-box-shadow: inset 0 0 10px 0 #000;
+ box-shadow: inset 0 0 10px 0 #000;
+}
+
+.ds-title-panel {
+ -webkit-border-top-left-radius: 6px;
+ -webkit-border-top-right-radius: 6px;
+ -moz-border-radius-topleft: 6px;
+ -moz-border-radius-topright: 6px;
+ border-top-left-radius: 6px;
+ border-top-right-radius: 6px;
+ background-image: -webkit-gradient(linear,left 0,left 100%,from(#f5f5f5),to(#e8e8e8));
+ background-image: -webkit-linear-gradient(top,#f5f5f5 0,#e8e8e8 100%);
+ background-image: -moz-linear-gradient(top,#f5f5f5 0,#e8e8e8 100%);
+ background-image: linear-gradient(to bottom,#f5f5f5 0,#e8e8e8 100%);
+ background-repeat: repeat-x;
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff5f5f5',endColorstr='#ffe8e8e8',GradientType=0);
+ height: 18px;
}
.ds-title {
display: inline-block;
font-size: 10px;
-}
-
-.ds-title p {
- -webkit-transform: rotate(-90deg);
- -moz-transform: rotate(-90deg);
- -ms-transform: rotate(-90deg);
- -o-transform: rotate(-90deg);
- filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
+ height: 18px;
+ line-height: 18px;
+ width: 100px;
+ border-right: 1px solid #b9b6af;
+ vertical-align: top;
+ text-align: center;
+ color: #8B8989;
+ text-shadow: 1px 1px 0px rgba(255, 255, 255, 0.75);
}
.ds-num {
- font-family: "LCDN";
- line-height: 48px;
+ font-family: "Digi";
border-right: 1px solid #b9b6af;
+ white-space: nowrap;
+}
+
+.ds-unit {
+ font-family: "Arial";
+ font-size: 22px;
+ text-shadow:
+ -1px -1px 0 #000,
+ 1px 1px 0 #000;
+ vertical-align: top;
+ line-height: 35px;
+ margin-left: 4px;
}
.ds-led {
margin-top: 1px;
padding-top: 1px;
font-family: "NoticeStd";
- font-size: 28px;
+ font-size: 32px;
font-weight: 400;
text-align: center;
color: #1F1E1A;
@@ -150,7 +181,7 @@ body {
.progress {
-webkit-border-radius: 0;
-moz-border-radius: 0;
- background: none;
+ background: #3f3e3a;
border-color: #000000;
border-top: 1px solid #b9b6af;
margin: 0;
@@ -167,6 +198,15 @@ body {
text-shadow: 0 -1px #333, 1px 0 #333, 0 1px #333, -1px 0 #333;
}
+
+.graph {
+ width: 100%;
+ height: 300px;
+ font-size: 14px;
+ line-height: 1.2em;
+}
+
+
.btn-success {
background: rgb(164,179,87);
background: -moz-linear-gradient(top, rgba(164,179,87,1) 0%, rgba(117,137,12,1) 100%);
@@ -236,13 +276,6 @@ body {
color: #fff;
}
-.graph {
- width: 100%;
- height: 300px;
- font-size: 14px;
- line-height: 1.2em;
-}
-
td {
width: 50%;
}
diff --git a/public/assets/fonts/digital-7-webfont.eot b/public/assets/fonts/digital-7-webfont.eot
new file mode 100644
index 0000000..d93fb82
Binary files /dev/null and b/public/assets/fonts/digital-7-webfont.eot differ
diff --git a/public/assets/fonts/digital-7-webfont.svg b/public/assets/fonts/digital-7-webfont.svg
new file mode 100644
index 0000000..51e05c1
--- /dev/null
+++ b/public/assets/fonts/digital-7-webfont.svg
@@ -0,0 +1,135 @@
+
+
+
\ No newline at end of file
diff --git a/public/assets/fonts/digital-7-webfont.ttf b/public/assets/fonts/digital-7-webfont.ttf
new file mode 100644
index 0000000..c6c5357
Binary files /dev/null and b/public/assets/fonts/digital-7-webfont.ttf differ
diff --git a/public/assets/fonts/digital-7-webfont.woff b/public/assets/fonts/digital-7-webfont.woff
new file mode 100644
index 0000000..5691d4b
Binary files /dev/null and b/public/assets/fonts/digital-7-webfont.woff differ
diff --git a/public/assets/js/picoreflow.js b/public/assets/js/picoreflow.js
index 8ebc0f4..d7db97a 100644
--- a/public/assets/js/picoreflow.js
+++ b/public/assets/js/picoreflow.js
@@ -12,6 +12,7 @@ var ws_status = new WebSocket(host+"/status");
var ws_control = new WebSocket(host+"/control");
var ws_storage = new WebSocket(host+"/storage");
+if(window.webkitRequestAnimationFrame) window.requestAnimationFrame = window.webkitRequestAnimationFrame;
graph.profile =
{
@@ -402,8 +403,9 @@ $(document).ready(function()
eta = minutes+':'+ (seconds < 10 ? "0" : "") + seconds;
updateProgress(parseFloat(x.runtime)/parseFloat(x.totaltime)*100);
- $('#state').html(parseInt(parseFloat(x.runtime)/parseFloat(x.totaltime)*100) + '% ' + eta);
- $('#target_temp').html(parseInt(x.target) + ' \xB0C');
+ $('#state_prg').html(parseInt(parseFloat(x.runtime)/parseFloat(x.totaltime)*100) + '%');
+ $('#state_eta').html(eta);
+ $('#target_temp').html(parseInt(x.target));
}
else
@@ -413,7 +415,7 @@ $(document).ready(function()
$('#state').html(state);
}
- $('#act_temp').html(parseInt(x.temperature) + ' \xB0C');
+ $('#act_temp').html(parseInt(x.temperature));
$('#heat').css("background-color", (x.heat > 0.5 ? "rgba(233, 28, 0, 0.84)" : "rgba(46, 12, 12, 0.62") );
$('#heat').css("box-shadow", (x.heat > 0.5 ? "0 0 5px 0 rgba(233, 28, 0, 0.84), inset 0 0 5px 2px rgba(255,255,255,0.25)" : "0 0 1.1em 0 rgba(0,0,0,0.75)") );
$('#air').css("background-color", (x.air > 0.5 ? "rgba(240, 199, 67, 0.84)" : "rgba(46, 38, 12, 0.62)") );
diff --git a/public/index.html b/public/index.html
index 2a207cc..6d430ed 100644
--- a/public/index.html
+++ b/public/index.html
@@ -28,18 +28,21 @@
+
+
Real Temp
+
Target Temp
+
Progress
+
ETA
+
-
-
25 °C
-
-
000 °C
-
Idle
-
-
+
25°C
+
---°C
+
---
+
--:--
+
n
t
,
-
@@ -83,21 +86,18 @@
+
-
+
-
-
-
-
+