Mercurial > hg > batmud > maputils
changeset 1787:ccf488dac4c2
Some prototyping/initial code for the map search client-side stuff, JavaScript part.
author | Matti Hamalainen <ccr@tnsp.org> |
---|---|
date | Sun, 29 Oct 2017 05:16:50 +0200 |
parents | eb98e57d3969 |
children | 6539555f00b0 |
files | www/search.js |
diffstat | 1 files changed, 158 insertions(+), 0 deletions(-) [+] |
line wrap: on
line diff
--- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/www/search.js Sun Oct 29 05:16:50 2017 +0200 @@ -0,0 +1,158 @@ +// +// Frontend map/location search JavaScript functionality +// Written by Matti 'ccr' Hamalainen <ccr@tnsp.org> +// (C) Copyright 2017 Tecnic Software productions (TNSP) +// + +var fieldPattern, fieldRes, fieldLog; +var msgLog, mapWS, mapList; + + +function mapAddEventOb(evobj, evtype, evcallback) +{ + if (evobj == null || typeof(evobj) == 'undefined') + return; + + if (evobj.addEventListener) + evobj.addEventListener(evtype, evcallback, false); + else + if (evobj.attachEvent) + evobj.attachEvent("on" + evtype, evcallback); + else + evobj["on"+evtype] = evcallback; +} + + +function mapAddEvent(obname, evtype, evcallback) +{ + mapAddEventOb(document.getElementById(obname), evtype, evcallback); +} + + +function mapLog(msg) +{ + if (msgLog.length >= 10) + msgLog = msgLog.slice(1, 10); + + msgLog.push(msg); + + if (fieldLog) + { + fieldLog.innerHTML = msgLog.join("<br>"); + } +} + + +function mapPerformSearch() +{ + if (fieldPattern.value.trim() == "") + { + mapLog("Nothing to search for."); + return; + } + + if (mapWS) + { + mapLog("Old query not finished."); + return; + } + + mapWS = new WebSocket("ws://localhost:9999/mapSearch"); + if (!mapWS) + { + mapLog("Could not create WebSocket connection?"); + return; + } + + mapLog("WebSocket connection to server established."); + btnSearch.disabled = true; + + mapWS.onopen = function() + { + // Web Socket is connected, send data using send() + mapLog("Sending query to server."); + mapWS.send("MAPSEARCH\n" + fieldPattern.value); + }; + + mapWS.onmessage = function(evt) + { + if (evt.data.substr(0, 6) == "ERROR:") + { + mapLog("ERROR! "+ evt.data.substr(6)); + } + else + if (evt.data.substr(0, 7) == "RESULT:" && evt.data.length > 10) + { + var results = JSON.parse(evt.data.substr(7)); + mapLog("Receiving results."); + if (results) + { + var str = ""; + for (var i = 0; i < results.length; i++) + { + var res = results[i]; + str += "<div class=\"result\">"+ + "<a href=\"http://jeskko.pupunen.net/gmap2/?x="+ + res[5] +"&y="+ res[6] +"&zoom=10\">"+ + res[3] +", "+ res[4] +" at "+ res[2] +"</a>"+ + " <span class=\"glob\">["+ res[5] +", "+ res[6] +" global]</span>"+ + " <span class=\"perc\">("+ res[0] +"% match)</span>"+ + (res[1] ? " <span class=\"cent\">centered</span>" : "")+ + "</div>"; + } + fieldRes.innerHTML = str; + } + else + fieldRes.innerHTML = "ERROR!"; + } + else + if (evt.data.substr(0, 9) == "PROGRESS:") + { + mapLog("Search progress "+ evt.data.substr(9) +"% .."); + } + else + if (evt.data == "END") + { + mapLog("Server ending communication."); + mapWS.close(); + } + else + { + mapLog("Sir! A message for you! "+ evt.data); + } + }; + + mapWS.onclose = function() + { + mapLog("WebSocket connection closed."); + mapWS = null; + btnSearch.disabled = false; + }; + + mapWS.onerror = function() + { + mapLog("Error!"); + mapWS = null; + btnSearch.disabled = false; + }; +} + + +function mapInitSearch() +{ + msgLog = []; + + fieldPattern = document.getElementById("pattern"); + fieldRes = document.getElementById("results"); + fieldLog = document.getElementById("log"); + btnSearch = document.getElementById("btnSearch"); + + mapAddEventOb(btnSearch, "click", mapPerformSearch); + mapAddEvent("btnClear", "click", + function () + { + mapLog("Cleared pattern and results."); + fieldRes.innerHTML = ""; + fieldPattern.value = ""; + }); +}