Commit 437d8afe authored by Moritz's avatar Moritz
Browse files

Added first mockup of Web-Interface

parent f119d8f1
......@@ -104,3 +104,15 @@ body {
border-color: transparent;
box-shadow: 0 0 0 3px rgba(255, 255, 255, .25);
}
canvas.drawingBuffer {
position: absolute;
width: 100%;
left: 0;
top: 0;
}
#barcodeTarget video {
width: 100%;
}
$('#barcodeModal').on('show.bs.modal', function() {
Quagga.init({
inputStream: {
type:"LiveStream",
constraints: {
width: {min: 640},
height: {min: 480},
aspectRatio: {
min: 1,
max: 100
},
facingMode: "environment"
},
target: document.querySelector('#barcodeTarget'),
},
locator: {
patchSize: "medium",
halfSample: true
},
numOfWorkers: 2,
frequency: 10,
decoder: {
readers: [
{format:"ean_reader", config:{}}
]
},
locate:true
}, function(err) {
if (err) {
console.log(err);
return
}
console.log("Initialization finished. Ready to start");
});
});
$('#barcodeModal').on('hidden.bs.modal', function() {
Quagga.stop();
});
Quagga.onProcessed(function(result) {
var drawingCtx = Quagga.canvas.ctx.overlay,
drawingCanvas = Quagga.canvas.dom.overlay;
if (result) {
if (result.boxes) {
drawingCtx.clearRect(0, 0, parseInt(drawingCanvas.getAttribute("width")),
parseInt(drawingCanvas.getAttribute("height")));
result.boxes.filter(function (box) {
return box !== result.box;
}).forEach(function (box) {
Quagga.ImageDebug.drawPath(box, {x: 0, y: 1}, drawingCtx,
{color: "green", lineWidth: 2});
});
}
if (result.box) {
Quagga.ImageDebug.drawPath(result.box, {x: 0, y: 1}, drawingCtx,
{color: "#00F", lineWidth: 2});
}
if (result.codeResult && result.codeResult.code) {
Quagga.ImageDebug.drawPath(result.line, {x: 'x', y: 'y'}, drawingCtx,
{color: 'red', lineWidth: 3});
}
}
});
This diff is collapsed.
This diff is collapsed.
......@@ -9,7 +9,10 @@
{# Load CSS and JavaScript #}
{% bootstrap_css %}
{% bootstrap_javascript jquery='full' %}
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.1/css/all.css" integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr" crossorigin="anonymous">
<script src="{% static 'facility/quagga.min.js' %}"></script>
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.1/css/all.css"
integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr"
crossorigin="anonymous">
<link href="{% static 'facility/css/dashboard.css' %}" rel="stylesheet">
<meta charset="UTF-8">
......@@ -17,51 +20,75 @@
<title>{% block 'title' %}{% endblock %}</title>
</head>
<body>
<nav class="navbar navbar-dark fixed-top bg-dark flex-md-nowrap p-0 shadow">
<a class="navbar-brand col-sm-3 col-md-2 mr-0" href="#">Company name</a>
<input class="form-control form-control-dark w-100" type="text"
placeholder="{% trans 'Search' %}" aria-label="Search">
<ul class="navbar-nav px-3">
<li class="nav-item text-nowrap">
<a class="nav-link" href="#"><i class="fas fa-sign-out-alt"></i> {% trans "Sign out" %}</a>
</li>
</ul>
</nav>
<div class="container-fluid">
<div class="row">
<nav class="col-md-2 d-none d-md-block bg-light sidebar">
<div class="sidebar-sticky">
<ul class="nav flex-column">
<li class="nav-item">
<a class="nav-link active" href="#">
<i class="fas fa-chart-line"></i>
{% trans "Dashboard" %}
</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">
<i class="fas fa-clipboard-list"></i>
{% trans "Checklists" %}
</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">
<i class="fas fa-map-marker-alt"></i>
{% trans "Locations" %}
</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">
<i class="fas fa-dolly"></i>
{% trans "Assets" %}
</a>
</li>
</ul>
</div>
</nav>
</div>
</div>
{% bootstrap_messages %}
<div class="modal fade" id="barcodeModal" tabindex="-1" role="dialog"
aria-labelledby="barcodeModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">
{% trans 'Scan barcode' %}
</h5>
<button type="button" class="close" data-dismiss="modal"
aria-label="{% trans 'Close' %}">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
<div id="barcodeTarget" class="viewport">
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-outline-danger"
data-dismiss="modal">{% trans 'Cancel' %}</button>
<button type="button" class="btn btn-success"
data-dismiss="modal">{% trans 'Apply' %}</button>
</div>
</div>
</div>
</div>
<div class="d-flex flex-column flex-md-row p-3 px-md-4 mb-3 bg-white border-bottom shadow-sm">
<h5 class="my-0 mr-md-auto font-weight-normal">{% trans 'Inventory' %}</h5>
<form class="form-inline">
<input class="form-control" type="text" placeholder="{% trans 'Search' %}"
aria-label="Search">
</form>
<a class="btn btn-outline-secondary mr-3" href="#" data-toggle="modal"
data-target="#barcodeModal">
<i class="fas fa-qrcode"></i> {% trans "Scan barcode" %}
</a>
<div class="dropdown">
<a class="btn btn-secondary dropdown-toggle" href="#" role="button"
id="dropdownMenuLink" data-toggle="dropdown" aria-haspopup="true"
aria-expanded="false">
<i class="fas fa-bars"></i>
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="dropdownMenuButton">
<a class="dropdown-item" href="#">
<i class="fas fa-clipboard-list"></i>
{% trans "Checklists" %}
</a>
<a class="dropdown-item" href="#">
<i class="fas fa-map-marker-alt"></i>
{% trans "Locations" %}
</a>
<a class="dropdown-item" href="#">
<i class="fas fa-dolly"></i>
{% trans "Assets" %}
</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="#">
<i class="fas fa-cog"></i>
{% trans "Setup" %}
</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="#">
<i class="fas fa-sign-out-alt"></i>
{% trans "Sign out" %}
</a>
</div>
</div>
</div>
{% bootstrap_messages %}
<script src="{% static 'facility/quagga-local.js' %}"></script>
</body>
</html>
......@@ -3,5 +3,5 @@ from django.urls import path
from . import views
urlpatterns = [
path('', views.index, name='index'),
path('', views.index),
]
......@@ -7,7 +7,7 @@ msgid ""
msgstr ""
"Project-Id-Version: 0.1\n"
"Report-Msgid-Bugs-To: \n"
"POT-Creation-Date: 2019-02-04 21:52+0100\n"
"POT-Creation-Date: 2020-07-11 16:03+0000\n"
"PO-Revision-Date: YEAR-MO-DA HO:MI+ZONE\n"
"Last-Translator: Moritz Rosenthal <moritz@mekelburger.org>\n"
"Language: de\n"
......@@ -106,32 +106,53 @@ msgstr "Gerät"
#: facility/models.py:131
msgid "equipments"
msgstr "Gefäte"
msgstr "Geräte"
#: facility/templates/facility/index.html:23
msgid "Search"
msgstr "Suchen"
#: facility/templates/facility/index.html:29
#: facility/templates/facility/index.html:57
msgid "Scan barcode"
msgstr "Barcode scannen"
#: facility/templates/facility/index.html:26
msgid "Sign out"
msgstr "Abmelden"
#: facility/templates/facility/index.html:32
msgid "Close"
msgstr ""
#: facility/templates/facility/index.html:42
msgid "Cancel"
msgstr ""
#: facility/templates/facility/index.html:44
msgid "Apply"
msgstr ""
#: facility/templates/facility/index.html:39
msgid "Dashboard"
msgstr "Dashboard"
#: facility/templates/facility/index.html:50
msgid "Inventory"
msgstr "Inventur"
#: facility/templates/facility/index.html:45
#: facility/templates/facility/index.html:52
msgid "Search"
msgstr "Suchen"
#: facility/templates/facility/index.html:68
msgid "Checklists"
msgstr "Prüflisten"
#: facility/templates/facility/index.html:51
#: facility/templates/facility/index.html:72
msgid "Locations"
msgstr "Orte"
#: facility/templates/facility/index.html:57
#: facility/templates/facility/index.html:76
msgid "Assets"
msgstr "Gegenstände"
#: facility/templates/facility/index.html:81
msgid "Setup"
msgstr "Einstellungen"
#: facility/templates/facility/index.html:86
msgid "Sign out"
msgstr "Abmelden"
#: pyinventory/settings.py:123
msgid "German"
msgstr "Deutsch"
......@@ -139,3 +160,6 @@ msgstr "Deutsch"
#: pyinventory/settings.py:124
msgid "English"
msgstr "Englisch"
#~ msgid "Dashboard"
#~ msgstr "Dashboard"
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment