Browse Source

Rework web interface (3 columns).

master
flabbergast 9 years ago
parent
commit
d296f19a3d
  1. 6
      public/css/style.styl
  2. 6
      public/js/index.js
  3. 29
      views/index.jade
  4. 11
      views/layout.jade

6
public/css/style.styl

@ -23,10 +23,6 @@ body
.navbar .brand
padding 10px 0 10px 0
#wrapper
padding 15px 50px 0 50px
margin auto
footer
text-align center
padding 30px 0
@ -36,4 +32,4 @@ footer
.footer p
margin-bottom 0
color #777
color #999

6
public/js/index.js

@ -10,15 +10,15 @@ $(document).ready(function(){
*/
if( socket && socket_connected ){
socket.emit('send-llap-msg', {
content:$('#wrapper #serialtalk #serialtalk-text').val()
content:$('#serialtalk #serialtalk-text').val()
});
} else {
// socket unavailable: can't send
}
}
$('#wrapper #serialtalk #serialtalk-btn').click(sendLLAPmessageEvent);
$('#wrapper #serialtalk #serialtalk-text').keyup(function(e){
$('#serialtalk #serialtalk-btn').click(sendLLAPmessageEvent);
$('#serialtalk #serialtalk-text').keyup(function(e){
if (e.keyCode==13) { sendLLAPmessageEvent(e); }
});
});

29
views/index.jade

@ -1,17 +1,28 @@
extends layout
block content
block top
.navbar
.navbar-inner
#user-id.brand
#wrapper
#serialtalk(style="text-align: center;")
//form.form-inline
.input-append
input#serialtalk-text.span2(type="text", placeholder="LLAP message")
button#serialtalk-btn.btn Send
p Last response: 
span#serialtalk-resp nothing yet
block left-column
#serialtalk.well
h5 Communicate over serial
//form.form-inline
.input-append
input#serialtalk-text.span7(type="text", placeholder="LLAP message")
button#serialtalk-btn.btn Send
p Last response: 
span#serialtalk-resp nothing yet
block main-column
#devices
.well wazzaup?
block right-column
#logs.well
h5 Log
block footer
p <strong>Server info:</strong>&nbsp;

11
views/layout.jade

@ -3,6 +3,7 @@ html
head
title Node LED
link(rel='stylesheet', href='/vendor/bootstrap.min.css')
//link(rel='stylesheet', href='/vendor/bootstrap-responsive.min.css')
link(rel='stylesheet', href='/css/style.css')
meta(http-equiv="cache-control", content="no-cache")
meta(name="apple-touch-fullscreen", content="yes")
@ -10,7 +11,15 @@ html
meta(name="apple-mobile-web-app-status-bar-style", content="black")
meta(name="viewport", content="initial-scale=1.0, maximum-scale=1.0, user-scalable=0")
body
block content
block top
.container-fluid
.row-fluid
#left-column.span3
block left-column
#main-column.span6
block main-column
#right-column.span3
block right-column
footer.footer
block footer
script(src='/vendor/jquery-1.9.0.min.js')

Loading…
Cancel
Save