simple search page

master
Thomas Rudin 2018-10-23 14:58:37 +02:00
parent ee6c977a46
commit 172d9026c4
4 changed files with 101 additions and 3 deletions

View File

@ -12,7 +12,7 @@ var proxy = httpProxy.createProxy({
var app = connect()
.use("/", function(req, res, next){
if (req.url.substring(0,3) == "/js" || req.url == "/" || req.url.substring(0,5) == "/pics"){
if (req.url.substring(0,3) == "/js" || req.url == "/" || req.url.substring(0,5) == "/pics" || req.url == "/search.html" || req.url == "/index.html" || req.url.substring(0,4) == "/css"){
console.log("Local: " + req.url);
next();
return;

File diff suppressed because one or more lines are too long

View File

@ -1,5 +1,89 @@
(function(){
var state = {
keyword: ""
};
var shops = [];
function onSearchKeyword(e){
state.keyword = e.target.value;
}
var SearchField = m("input", {type: "text", class: "form-control", oninput: onSearchKeyword, placeholder: "Search POI or shop items"});
var ResultRows = {
view: function(){
var rows = [];
shops.forEach(function(shop){
var match = false;
if (shop.owner.indexOf(state.keyword) >= 0)
match = true;
if (shop.inItem.indexOf(state.keyword) >= 0)
match = true;
if (shop.outItem.indexOf(state.keyword) >= 0)
match = true;
if (!match)
return;
var icon = "pics/shop.png";
if (shop.outStock == 0)
icon = "pics/shop_empty.png";
rows.push(m("tr", [
m("td", m("span", [
m("img", {src:icon}),
shop.owner + " ",
m("span", {class:"badge badge-secondary"}, shop.type)
])
),
m("td", [m("span", {class:"badge badge-primary"}, shop.inCount + "x"), " " + shop.inItem]),
m("td", [m("span", {class:"badge badge-primary"}, shop.outCount + "x"), " " + shop.outItem]),
m("td", shop.outStock),
m("td", shop.x + "/" + shop.y + "/" + shop.z)
]));
});
return rows;
}
};
var ResultTable = {
view: function(){
return m("table", {class:"table table-condensed table-striped"}, [
m("thead", [
m("tr", [
m("th", "Owner"),
m("th", "In-item"),
m("th", "Out-item"),
m("th", "Stock"),
m("th", "Location/Distance"),
])
]),
m(ResultRows)
]);
}
};
var App = {
view: function(){
return m("div", {class: "row"}, [
SearchField, m(ResultTable)
]);
}
};
//TODO: POI, travelnet
m.request("shop")
.then(function(_shops){ shops = _shops; });
m.mount(document.getElementById("app"), App);
})();

View File

@ -4,6 +4,7 @@
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="theme-color" content="#000">
<link rel="stylesheet" href="css/bootstrap.min.css"/>
<title>Map search</title>
<style>
body {
@ -13,9 +14,10 @@
</head>
<body>
<div class="container-fluid" id="app"></div>
<script src="js/lib/moment.min.js"></script>
<script src="js/lib/mithril.min.js"></script>
<script src="js/search.js"></script>
</body>
</html>