view www/search.js @ 1813:d7deea635463

Cleanups.
author Matti Hamalainen <ccr@tnsp.org>
date Mon, 30 Oct 2017 01:14:51 +0200
parents d419124e284a
children 41469a2f3904
line wrap: on
line source

//
// Frontend map/location search JavaScript functionality
// Written by Matti 'ccr' Hamalainen <ccr@tnsp.org>
// (C) Copyright 2017 Tecnic Software productions (TNSP)
//

var mapServer = "wss://tnsp.org:4200";
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 mapCapitalize(str)
{
  return str.substr(0,1).toUpperCase() + str.substr(1);
}


function mapLog(msg)
{
  if (msgLog.length >= 10)
    msgLog = msgLog.slice(1, 10);

  msgLog.push(msg);

  if (fieldLog)
  {
    fieldLog.innerHTML = msgLog.join("<br>");
  }
}


function mapPerformSearch()
{
  // Check the search pattern for some sanity before
  // submitting to the server .. though we do checks there also.
  var tmp = fieldPattern.value.trim();
  if (tmp == "")
  {
    mapLog("Nothing to search for.");
    return;
  }

  if (tmp.length > 40*40)
  {
    mapLog("Search pattern too large!");
    return;
  }

  // Check which maps are enabled, if any
  var searchList = [];
  for (var i = 0; i < mapList.length; i++)
  {
    var res = mapList[i];
    var elem = document.getElementById("map_"+ res[0]);
    if (elem && elem.checked)
      searchList.push(res[0]);
  }

  if (searchList.length == 0 && mapList.length > 0)
  {
    mapLog("No maps selected!");
    return;
  }

  // Are we running an old query?
  if (mapWS)
  {
    mapLog("Old query not finished.");
    return;
  }

  // Open a WebSocket connection ..
  mapWS = new WebSocket(mapServer);
  if (!mapWS)
  {
    mapLog("Could not create WebSocket connection?");
    return;
  }

  btnSearch.disabled = true;

  mapWS.onopen = function()
  {
    // Web Socket is connected, send data using send()
    mapLog("Sending query to server.");
    mapWS.send("MAPSEARCH:"+ -1 +":"+ searchList.join(":") +"\n" + fieldPattern.value);
  };

  // Register events
  mapWS.onmessage = function(evt)
  {
    if (evt.data.substr(0, 6) == "ERROR:")
    {
      var str = "ERROR! "+ evt.data.substr(6);
      mapLog(str);
      fieldRes.innerHTML = str;
    }
    else
    if (evt.data.substr(0, 7) == "RESULT:" && evt.data.length >= 9)
    {
      var results = JSON.parse(evt.data.substr(7));
      var str = "";
      mapLog("Receiving results.");

      if (results)
      {
        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 "+ mapCapitalize(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>";
        }

        if (str.length == 0)
          str = "No matches found.";
      }
      else
        str = "ERROR: Could not parse result dataset."

      fieldRes.innerHTML = str;
    }
    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()
  {
    mapWS = null;
    btnSearch.disabled = false;
  };

  mapWS.onerror = function()
  {
    mapLog("WebSocket error occured.");
  };
}


function mapGetData()
{
  var tmpWS = new WebSocket(mapServer);
  if (!tmpWS)
  {
    mapLog("Could not create WebSocket connection?");
    return;
  }

  tmpWS.onopen = function()
  {
    tmpWS.send("GETMAPS");
  };

  tmpWS.onmessage = function(evt)
  {
    if (evt.data.substr(0, 6) == "ERROR:")
    {
      mapLog("ERROR! "+ evt.data.substr(6));
    }
    else
    if (evt.data.substr(0, 5) == "MAPS:" && evt.data.length > 8)
    {
      var results = JSON.parse(evt.data.substr(5));
      mapLog("Receiving map information.");
      if (results && Array.isArray(results))
      {
        mapList = results;
        var str = "";
        for (var i = 0; i < results.length; i++)
        {
          var res = results[i];
          var id = "map_"+ res[0];
          str +=
            "<input class=\"map\" id=\""+ id +
            "\" type=\"checkbox\" checked=\"checked\">"+
            "<label for=\""+ id +"\">"+ mapCapitalize(res[0]) +"</label>";
        }
        var elem = document.getElementById("mapList");
        elem.innerHTML = str;
      }
      else
        fieldRes.innerHTML = "ERROR!";
    }
    else
    if (evt.data == "END")
    {
      tmpWS.close();
    }
    else
    {
      mapLog("Sir! A message for you! "+ evt.data);
    }
  };

  tmpWS.onclose = function()
  {
    tmpWS = null;
  };

  tmpWS.onerror = function()
  {
    mapLog("WebSocket error occured.");
  };
}


function mapInitSearch()
{
  msgLog = [];
  mapGetData();

  fieldPattern = document.getElementById("pattern");
  fieldRes = document.getElementById("results");
  fieldLog = document.getElementById("log");
  btnSearch = document.getElementById("btnSearch");

  mapAddEventOb(btnSearch, "click", mapPerformSearch);

  mapAddEvent("btnReset", "click",
  function ()
  {
    mapLog("Cleared pattern and results.");
    fieldRes.innerHTML = "";
    fieldPattern.value = "";
  });

  mapAddEvent("btnMaps", "click",
  function ()
  {
    var same = true, first = true;
    for (var i = 0; i < mapList.length; i++)
    {
      var res = mapList[i];
      var elem = document.getElementById("map_"+ res[0]);
      if (elem)
      {
        if (first)
          same = elem.checked;
        else
        if (elem.checked != same)
        {
          same = false;
          break;
        }
        first = false;
      }
    }

    same = !same;

    for (var i = 0; i < mapList.length; i++)
    {
      var res = mapList[i];
      var elem = document.getElementById("map_"+ res[0]);
      if (elem)
        elem.checked = same;
    }
  });
}