X-Git-Url: https://git-public.kairo.at/?p=lantea.git;a=blobdiff_plain;f=js%2Fui.js;h=60abf40a4b42793f331645f98e9adbc04a6193c0;hp=a44a4625ee1f9b8ae1e64213795da61642d637a2;hb=c53a1969fd519687ca4d581077c8dc3792169bb8;hpb=6201b11296e29c248fcdd84c5f3237754fd98b60 diff --git a/js/ui.js b/js/ui.js index a44a462..60abf40 100644 --- a/js/ui.js +++ b/js/ui.js @@ -8,26 +8,15 @@ window.requestAnimationFrame = window.requestAnimationFrame || window.mozRequest var mainDB; var gAppInitDone = false; +var firstRun = false; var gUIHideCountdown = 0; var gWaitCounter = 0; var gTrackUpdateInterval; var gAction, gActionLabel; var gBackendURL = "https://backend.lantea.kairo.at"; var gAuthClientID = "lantea"; -var gOSMAPIURL = "https://api.openstreetmap.org/"; -var gOSMOAuthData = { - oauth_consumer_key: "6jjWwlbhGqyYeCdlFE1lTGG6IRGOv1yKpFxkcq2z", - oauth_secret: "A21gUeDM6mdoQgbA9uF7zJ13sbUQrNG7QQ4oSrKA", - url: "https://www.openstreetmap.org", - landing: "auth-done.html", -} window.onload = function() { - if (/\/login\.html/.test(window.location)) { - // If we are in the login window, call a function to complete the process and don't do anything else here. - completeLoginWindow(); - return; - } gAction = document.getElementById("action"); gActionLabel = document.getElementById("actionlabel"); @@ -39,7 +28,7 @@ window.onload = function() { mSel.add(opt, null); } - var areas = document.getElementsByClassName("overlayArea"); + var areas = document.getElementsByClassName("autoFade"); for (var i = 0; i <= areas.length - 1; i++) { areas[i].addEventListener("mouseup", uiEvHandler, false); areas[i].addEventListener("mousemove", uiEvHandler, false); @@ -74,6 +63,8 @@ window.onload = function() { gAuthClientID += "-dev"; } + document.getElementById("libCloseButton").onclick = hideLibrary; + // Set up the login area. document.getElementById("loginbtn").onclick = startLogin; document.getElementById("logoutbtn").onclick = doLogout; @@ -85,11 +76,6 @@ window.onload = function() { // Call any UI preparation that needs the backend. }); - if (gDebug) { - // Note that GPX upload returns an error 500 on the dev API right now. - gOSMAPIURL = "http://api06.dev.openstreetmap.org/"; - } - gAction.addEventListener("dbinit-done", initMap, false); gAction.addEventListener("mapinit-done", postInit, false); console.log("starting DB init..."); @@ -106,17 +92,22 @@ function postInit(aEvent) { gActionLabel.textContent = ""; gAction.style.display = "none"; setTracking(document.getElementById("trackCheckbox")); - gPrefs.get(gDebug ? "osm_dev_user" : "osm_user", function(aValue) { + gPrefs.get("devicename", function(aValue) { if (aValue) { - document.getElementById("uploadUser").value = aValue; - document.getElementById("uploadTrackButton").disabled = false; + document.getElementById("uploadDevName").value = aValue; } }); - gPrefs.get(gDebug ? "osm_dev_pwd" : "osm_pwd", function(aValue) { - var upwd = document.getElementById("uploadPwd"); - if (aValue) - document.getElementById("uploadPwd").value = aValue; - }); + if (firstRun) { + showFirstRunDialog(); + } + else { + gPrefs.get("lastInfoShown", function(aValue) { + if (!aValue || !parseInt(aValue) || parseInt(aValue) < 1) { + showInfoDialog(); + } + }); + } + gPrefs.set("lastInfoShown", 1); } window.onresize = function() { @@ -179,16 +170,6 @@ function prepareLoginButton(aCallback) { ); } -function completeLoginWindow() { - if (window.opener) { - window.opener.finishLogin(getParameterByName("code"), getParameterByName("state")); - window.close(); - } - else { - document.getElementById("logininfo").textContent = "You have called this document outside of the login flow, which is not supported."; - } -} - function finishLogin(aCode, aState) { if (aState == authData["state"]) { fetchBackend("login?code=" + aCode + "&state=" + aState + "&redirect_uri=" + encodeURIComponent(getRedirectURI()), "GET", null, @@ -219,6 +200,7 @@ function displayLogin() { document.getElementById("username").classList.remove("hidden"); document.getElementById("username").textContent = userData.email; document.getElementById("uploadTrackButton").disabled = false; + document.getElementById("libraryShowLine").classList.remove("hidden"); document.getElementById("logoutbtn").classList.remove("hidden"); } @@ -227,6 +209,7 @@ function displayLogout() { document.getElementById("username").classList.add("hidden"); document.getElementById("username").textContent = ""; document.getElementById("uploadTrackButton").disabled = true; + document.getElementById("libraryShowLine").classList.add("hidden"); document.getElementById("loginbtn").classList.remove("hidden"); document.getElementById("logindesc").classList.remove("hidden"); } @@ -255,6 +238,7 @@ function initDB(aEvent) { if (!mainDB.objectStoreNames.contains("prefs")) { // Create a "prefs" objectStore. var prefsStore = mainDB.createObjectStore("prefs"); + firstRun = true; } if (!mainDB.objectStoreNames.contains("track")) { // Create a "track" objectStore. @@ -274,7 +258,7 @@ function initDB(aEvent) { function showUI() { if (gUIHideCountdown <= 0) { - var areas = document.getElementsByClassName('overlayArea'); + var areas = document.getElementsByClassName('autoFade'); for (var i = 0; i <= areas.length - 1; i++) { areas[i].classList.remove("hidden"); } @@ -286,7 +270,7 @@ function showUI() { function maybeHideUI() { gUIHideCountdown--; if (gUIHideCountdown <= 0) { - var areas = document.getElementsByClassName('overlayArea'); + var areas = document.getElementsByClassName('autoFade'); for (var i = 0; i <= areas.length - 1; i++) { areas[i].classList.add("hidden"); } @@ -309,6 +293,7 @@ function updateTrackInfo() { function toggleTrackArea() { var fs = document.getElementById("trackArea"); if (fs.classList.contains("hidden")) { + prepareLoginButton(); fs.classList.remove("hidden"); showUI(); gTrackUpdateInterval = setInterval(updateTrackInfo, 1000); @@ -365,6 +350,11 @@ function showUploadDialog() { dia.classList.remove("hidden"); } +function cancelTrackDialog() { + document.getElementById("trackDialogArea").classList.add("hidden"); + document.getElementById("uploadTrackButton").disabled = false; +} + function showGLWarningDialog() { var dia = document.getElementById("dialogArea"); var areas = dia.children; @@ -375,9 +365,28 @@ function showGLWarningDialog() { dia.classList.remove("hidden"); } -function cancelTrackDialog() { - document.getElementById("trackDialogArea").classList.add("hidden"); - document.getElementById("uploadTrackButton").disabled = false; +function showFirstRunDialog() { + var dia = document.getElementById("dialogArea"); + var areas = dia.children; + for (var i = 0; i <= areas.length - 1; i++) { + areas[i].style.display = "none"; + } + document.getElementById("firstRunIntro").style.display = "block"; + dia.classList.remove("hidden"); +} + +function closeDialog() { + document.getElementById("dialogArea").classList.add("hidden"); +} + +function showInfoDialog() { + var dia = document.getElementById("dialogArea"); + var areas = dia.children; + for (var i = 0; i <= areas.length - 1; i++) { + areas[i].style.display = "none"; + } + document.getElementById("infoDialog").style.display = "block"; + dia.classList.remove("hidden"); } var uiEvHandler = { @@ -400,12 +409,8 @@ var uiEvHandler = { function setUploadField(aField) { switch (aField.id) { - case "uploadUser": - gPrefs.set(gDebug ? "osm_dev_user" : "osm_user", aField.value); - document.getElementById("uploadTrackButton").disabled = !aField.value.length; - break; - case "uploadPwd": - gPrefs.set(gDebug ? "osm_dev_pwd" : "osm_pwd", aField.value); + case "uploadDevName": + gPrefs.set("devicename", aField.value); break; } } @@ -497,7 +502,8 @@ function uploadTrack() { var desc = document.getElementById("uploadDesc").value; formData.append("comment", desc.length ? desc : "Track recorded via Lantea Maps"); - //formData.append("devicename", ""); + formData.append("devicename", + document.getElementById("uploadDevName").value); formData.append("public", document.getElementById("uploadPublic").value); @@ -506,21 +512,31 @@ function uploadTrack() { if (aStatusCode >= 400) { reportUploadStatus(false, aResult); } - else { + else if (aResult["id"]) { reportUploadStatus(true); } + else { // If no ID is returned, we assume a general error. + reportUploadStatus(false); + } } ); } -function reportUploadStatus(aSuccess, aMessage) { +function reportUploadStatus(aSuccess, aResponse) { document.getElementById("uploadStatusCloseButton").disabled = false; document.getElementById("uploadInProgress").style.display = "none"; if (aSuccess) { document.getElementById("uploadSuccess").style.display = "block"; } - else if (aMessage) { - document.getElementById("uploadErrorMsg").textContent = aMessage; + else if (aResponse["message"]) { + document.getElementById("uploadErrorMsg").textContent = aResponse["message"]; + if (aResponse["errortype"]) { + document.getElementById("uploadErrorMsg").textContent += " (" + aResponse["errortype"] + ")"; + } + document.getElementById("uploadError").style.display = "block"; + } + else if (aResponse) { + document.getElementById("uploadErrorMsg").textContent = aResponse; document.getElementById("uploadError").style.display = "block"; } else { @@ -673,7 +689,14 @@ function fetchBackend(aEndpoint, aMethod, aSendData, aCallback, aCallbackForward var result = {}; if (XHR.getResponseHeader("Content-Type") == "application/json") { // Got a JSON object, see if we have success. - result = JSON.parse(XHR.responseText); + try { + result = JSON.parse(XHR.responseText); + } + catch (e) { + console.log(e); + result = {"error": e, + "message": XHR.responseText}; + } } else { result = XHR.responseText; @@ -691,11 +714,3 @@ function fetchBackend(aEndpoint, aMethod, aSendData, aCallback, aCallbackForward aCallback(e, 500, aCallbackForwards); } } - -function getParameterByName(aName) { - // from http://stackoverflow.com/questions/901115/how-can-i-get-query-string-values-in-javascript - name = aName.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]"); - var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"), - results = regex.exec(location.search); - return results === null ? "" : decodeURIComponent(results[1].replace(/\+/g, " ")); -}