mirror of
https://github.com/binary-kitchen/doorlockd
synced 2024-12-22 02:14:26 +01:00
layout: improve design
All pages now user twitter bootstrap layout. Signed-off-by: Ralf Ramsauer <ralf@binary-kitchen.de>
This commit is contained in:
parent
84e9440ed6
commit
1268e28a5d
@ -80,7 +80,7 @@ class DoorState(Enum):
|
||||
led = 'red'
|
||||
if self == DoorState.Open:
|
||||
led = 'green'
|
||||
return '<img src="static/led-%s.png">' % led
|
||||
return 'static/led-%s.png' % led
|
||||
|
||||
def to_html(self):
|
||||
if self == DoorState.Open:
|
||||
@ -258,7 +258,7 @@ def home():
|
||||
authentication_form=authentication_form,
|
||||
response=response,
|
||||
state_text=logic.state.to_html(),
|
||||
state_img=Markup(logic.state.to_img()),
|
||||
led=logic.state.to_img(),
|
||||
title=html_title)
|
||||
|
||||
|
||||
@ -270,6 +270,6 @@ if __name__ == '__main__':
|
||||
|
||||
logic = Logic()
|
||||
|
||||
socketio.run(webapp, port=8080)
|
||||
socketio.run(webapp, host='0.0.0.0', port=8080)
|
||||
|
||||
sys.exit(0)
|
||||
|
@ -10,7 +10,7 @@
|
||||
socket.emit('connected');
|
||||
});
|
||||
socket.on('status', function(status) {
|
||||
$('#led').html(status.led)
|
||||
$('#led').attr('src', status.led)
|
||||
$('#message').html(status.message)
|
||||
});
|
||||
});
|
||||
@ -21,7 +21,7 @@
|
||||
<h1 class="text-center">Willkommen in der Binary Kitchen!</h1>
|
||||
<div class="row">
|
||||
<div class="col-md-3 text-center">
|
||||
<div id="led"></div>
|
||||
<img id="led" src="">
|
||||
<div id="message"></div>
|
||||
</div>
|
||||
<div class="col-md-8">
|
||||
|
@ -1,24 +0,0 @@
|
||||
{% macro render_field_label(field) %}
|
||||
<dt>{{ field.label }}
|
||||
<dd>{{ field(**kwargs)|safe }}
|
||||
{% if field.errors %}
|
||||
<ul class=errors>
|
||||
{% for error in field.errors %}
|
||||
<li>{{ error }}</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% endif %}
|
||||
</dd>
|
||||
{% endmacro %}
|
||||
|
||||
{% macro render_field(field) %}
|
||||
<dd>{{ field(**kwargs)|safe }}
|
||||
{% if field.errors %}
|
||||
<ul class=errors>
|
||||
{% for error in field.errors %}
|
||||
<li>{{ error }}</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% endif %}
|
||||
</dd>
|
||||
{% endmacro %}
|
@ -1,56 +1,21 @@
|
||||
{% from "formhelpers.html" import render_field_label, render_field %}
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>{{ title }}</title>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
|
||||
</head>
|
||||
{% extends "layout.html" %}
|
||||
{% import "bootstrap/wtf.html" as wtf %}
|
||||
|
||||
<body>
|
||||
<style>
|
||||
* {
|
||||
font: normal 30px Arial,sans-serif;
|
||||
}
|
||||
body {
|
||||
background-color: #037;
|
||||
color: white;
|
||||
background-image: url('static/logo.svg');
|
||||
background-repeat: repeat;
|
||||
background-size: 100%;
|
||||
background-position: -0px -0px;
|
||||
}
|
||||
form {
|
||||
position: relative;
|
||||
display: block;
|
||||
width: auto;
|
||||
text-align: center;
|
||||
}
|
||||
input {
|
||||
position: relative;
|
||||
display: block;
|
||||
width: auto;
|
||||
width: 100%;
|
||||
}
|
||||
button {
|
||||
width: 100%;
|
||||
margin-top: 40px;
|
||||
}
|
||||
</style>
|
||||
{{ state_img }}
|
||||
<form name="login" method="POST" action="{{ url_for('home') }}">
|
||||
{{ render_field_label(authentication_form.username) }}
|
||||
{{ render_field_label(authentication_form.password) }}
|
||||
{% block content %}
|
||||
<h1 class="text-center">Binary Kitchen Doorlock</h1>
|
||||
<div class="row">
|
||||
<div class="col-md-3 text-center">
|
||||
<img src="{{ led }}">
|
||||
</div>
|
||||
<div class="col-md-8">
|
||||
{{ wtf.quick_form(authentication_form, button_map={'open': 'success btn-lg btn-block', 'close': 'danger btn-lg btn-block'}) }}
|
||||
{% if response %}
|
||||
<hr/>
|
||||
{{ render_field(authentication_form.open) }}
|
||||
{{ render_field(authentication_form.close) }}
|
||||
{{ authentication_form.csrf_token }}
|
||||
</form>
|
||||
{% if response %}
|
||||
<hr/>
|
||||
<h1>{{ response.to_html() }}</h1>
|
||||
{% endif %}
|
||||
<hr/>
|
||||
Die Kitchen ist: {{ state_text }}
|
||||
</body>
|
||||
</html>
|
||||
<h1>{{ response.to_html() }}</h1>
|
||||
{% endif %}
|
||||
<hr/>
|
||||
Die Kitchen ist: {{ state_text }}
|
||||
</div>
|
||||
</div>
|
||||
{{ super() }}
|
||||
{% endblock %}
|
||||
|
Loading…
Reference in New Issue
Block a user