summaryrefslogtreecommitdiffstats
path: root/js/messaging.js
diff options
context:
space:
mode:
Diffstat (limited to 'js/messaging.js')
-rw-r--r--js/messaging.js462
1 files changed, 258 insertions, 204 deletions
diff --git a/js/messaging.js b/js/messaging.js
index 42bbd0b..4004147 100644
--- a/js/messaging.js
+++ b/js/messaging.js
@@ -1,3 +1,10 @@
+const API_ENDPOINT = "https://gimb.tk/test.php";
+const DIRECTORY_URL = "/directory.json";
+// const API_ENDPOINT = "http://localhost:5000/test.php";
+
+// "Global" object for name directory
+var directory = null;
+
async function checkLogin() {
localforage.getItem("logged_in").then(function (value) {
// This code runs once the value has been loaded
@@ -11,31 +18,72 @@ async function checkLogin() {
});
}
-function htmlEncode(value){
- // Create a in-memory element, set its inner text (which is automatically encoded)
- // Then grab the encoded contents back out. The element never exists on the DOM.
- return $('<textarea/>').text(value).html();
+// -----------HTML HELPERS-----------
+function htmlEncode(value) {
+ // Create a in-memory element, set its inner text (which is automatically encoded)
+ // Then grab the encoded contents back out. The element never exists on the DOM.
+ return $("<textarea/>").text(value).html();
}
-function htmlDecode(value){
- return $('<textarea/>').html(value).text();
+function htmlDecode(value) {
+ return $("<textarea/>").html(value).text();
}
+// ---------------------------------
-const API_ENDPOINT = "https://gimb.tk/test.php";
-// const API_ENDPOINT = "http://localhost:5000/test.php";
+// Try to fetch name:id directory
+function loadDirectory() {
+ $.ajax({
+ url: DIRECTORY_URL,
+ crossDomain: true,
-localforage.setItem('directory', {
-"Anton Luka Šijanec": 6326,
-"Rok Štular": 5313
-}).then(function (value) {
- // Do other things once the value has been saved.
- console.log("fake directory set");
-}).catch(function(err) {
- // This code runs if there were any errors
- M.toast({ html: "Unable to set fake directory."});
- console.log(err);
-});
+ dataType: "json",
+ cache: false,
+ type: "GET",
+
+ success: (data) => {
+ // If we were able to retrieve it, update the saved directory
+ localforage.setItem("directory", data);
+ directory = data;
+ // Populate autocomplete
+ populateAutocomplete();
+ },
+
+ error: () => {
+ // Otherwise, try to retrieve stored directory
+ localforage.getItem("directory").then((stored_directory) => {
+ if (stored_directory === null) {
+ // If unable, set directory to null (so other functions know that we don't have it)
+ M.toast({ html: "Name directory not set, sending disabled" });
+ directory = null;
+ // Disable send button
+ document.getElementById("msg-send").disabled = true;
+ } else {
+ directory = stored_directory;
+ // Populate autocomplete
+ populateAutocomplete();
+ }
+ });
+ }
+ });
+}
+
+function populateAutocomplete() {
+ let elems = document.querySelectorAll('.autocomplete-fullname');
+
+ // vse editam v nanotu
+ let autocomplete_entries = directory;
+ for (let variableKey in autocomplete_entries) {
+ autocomplete_entries[variableKey] = null;
+ }
+ M.Autocomplete.init(elems, {
+ data: autocomplete_entries,
+ onAutocomplete: validateName,
+ minLength: 0
+ });
+}
+
+// Function to toggle loading bar
function setLoading(state) {
if (state) {
$("#loading-bar").removeClass("hidden");
@@ -43,6 +91,7 @@ function setLoading(state) {
$("#loading-bar").addClass("hidden");
}
}
+
// Function, responsible for fetching and displaying data
async function loadMessages(force_refresh = true, katera = 0) {
setLoading(true);
@@ -58,8 +107,9 @@ async function loadMessages(force_refresh = true, katera = 0) {
messages = value;
})
];
+
Promise.all(promises_to_run).then(() => {
- // If we don't have a list of teachers, query it
+
if (messages === null || force_refresh) {
$.ajax({
url: API_ENDPOINT,
@@ -68,18 +118,20 @@ async function loadMessages(force_refresh = true, katera = 0) {
"u": username,
"p": password,
"m": "fetchsporocilaseznam",
- "a": katera // prejeta
+ "a": katera // Message type, see API doc for details
},
dataType: "json",
cache: false,
type: "GET",
+
success: (data) => {
// If data is null, the request failed
if (data === null) {
M.toast({ html: "Request failed!" });
setLoading(false);
} else {
- // Save teachers & populate table
+ // Save messages & populate view
+ console.log(data);
localforage.setItem("messages", data).then((value) => {
messages = value;
displayData();
@@ -100,6 +152,7 @@ async function loadMessages(force_refresh = true, katera = 0) {
}
});
}
+
async function loadMsg(id) {
setLoading(true);
// Load required data
@@ -111,111 +164,116 @@ async function loadMsg(id) {
password = value;
}),
];
- Promise.all(promises_to_run).then(() => {
- $.ajax({
- url: API_ENDPOINT,
- crossDomain: true,
- data: {
- "u": username,
- "p": password,
- "m": "fetchsporocilo",
- "a": id
- },
- dataType: "json",
- cache: false,
- type: "GET",
- success: (data) => {
- // If data is null, the request failed
- if (data === null) {
- M.toast({ html: "Unable to receive the message, Request failed!" });
- setLoading(false);
- } else {
- displayMessage(id, data);
- setLoading(false);
- }
- },
- error: () => {
- M.toast({ html: "Error fetching message, No Internet connnection?" });
+ Promise.all(promises_to_run).then(() => {
+ $.ajax({
+ url: API_ENDPOINT,
+ crossDomain: true,
+ data: {
+ "u": username,
+ "p": password,
+ "m": "fetchsporocilo",
+ "a": id
+ },
+ dataType: "json",
+ cache: false,
+ type: "GET",
+ success: (data) => {
+ // If data is null, the request failed
+ if (data === null) {
+ M.toast({ html: "Unable to receive the message, Request failed!" });
+ setLoading(false);
+ } else {
+ displayMessage(id, data);
setLoading(false);
}
+ },
- })
+ error: () => {
+ M.toast({ html: "Error fetching message, No Internet connnection?" });
+ setLoading(false);
+ }
+
+ })
});
}
+
+
async function deleteMsg(id) {
setLoading(true);
// Load required data
let promises_to_run = [
localforage.getItem("username").then((value) => {
username = value;
- }), localforage.getItem("password").then((value) => {
+ }), localforage.getItem("password").then((value) => {
password = value;
}),
];
Promise.all(promises_to_run).then(() => {
- $.ajax({
- url: API_ENDPOINT,
- crossDomain: true,
- data: {
- "u": username,
- "p": password,
- "m": "izbrisisporocilo",
- "a": id
- },
- dataType: "json",
- cache: false,
- type: "GET",
- success: (data) => {
- // If data is null, the request failed
- if (data === null) {
- M.toast({ html: "Unable to delete the message, Request failed!" });
- setLoading(false);
- } else {
- document.getElementById("msg_box-"+id).remove();
- setLoading(false);
- }
- },
-
- error: () => {
- M.toast({ html: "Unable to delete the message, No Internet connnection?" });
+ $.ajax({
+ url: API_ENDPOINT,
+ crossDomain: true,
+ data: {
+ "u": username,
+ "p": password,
+ "m": "izbrisisporocilo",
+ "a": id
+ },
+ dataType: "json",
+ cache: false,
+ type: "GET",
+ success: (data) => {
+ // If data is null, the request failed
+ if (data === null) {
+ M.toast({ html: "Unable to delete the message, Request failed!" });
+ setLoading(false);
+ } else {
+ document.getElementById("msg-box-" + id).remove();
setLoading(false);
}
+ },
- })
+ error: () => {
+ M.toast({ html: "Unable to delete the message, No Internet connnection?" });
+ setLoading(false);
+ }
+
+ })
});
}
+
function displayMessage(id, data) {
- document.getElementById("msg_body-"+id).innerHTML = filterXSS(data["telo"]);
+ document.getElementById("msg-body-" + id).innerHTML = filterXSS(data["telo"]);
}
+
// Function for displaying data
function displayData() {
- var msg_list = document.getElementById("msg_list");
- msg_list.innerHTML = "";
+ let msg_list = document.getElementById("msg_list");
+ msg_list.innerHTML = "";
messages.forEach(element => {
- if(element["zadeva"].substr(0, 14) != "beziapp-ctlmsg")
- msg_list.innerHTML += '<div class="col s12 m6" id="msg_box-'+
-filterXSS(element["id"])+
-'"><div class="card blue-grey darken-1"><div class="card-content white-text"><span class="card-title">'+
-filterXSS(element["zadeva"])+
-'</span><p id="msg_body-'+
-filterXSS(element["id"])+
-'"><button class="btn waves-effect waves-light" onclick=loadMsg("'+
-filterXSS(element["id"])+
-'"); type="submit">Load message body<i class="material-icons right">system_update</i></button></p></div><div class="card-action"><a href=javascript:deleteMsg("'+
-filterXSS(element["id"])+
-'");><i class="material-icons">delete</i></a><a href=\'javascript:document.getElementById("full_name").value="'+
-filterXSS(element["posiljatelj"])+
-'";document.getElementById("msg_subject").value="Re: '+
-filterXSS(element["zadeva"])+
-'";M.updateTextFields();document.getElementById("navigation-main").scrollIntoView();\'><i class="material-icons">reply</i></a>'+
-filterXSS(element["posiljatelj"])+" &raquo; "+filterXSS(element["datum"]["dan"])+". "+filterXSS(element["datum"]["mesec"])+". "+filterXSS(element["datum"]["leto"])+" at "+
-filterXSS(element["cas"]["ura"])+":"+filterXSS(element["cas"]["minuta"])+
-'</div></div></div>';
+ if (element["zadeva"].substr(0, 14) != "beziapp-ctlmsg")
+ msg_list.innerHTML += '<div class="col s12 m6" id="msg_box-' +
+ filterXSS(element["id"]) +
+ '"><div class="card blue-grey darken-1"><div class="card-content white-text"><span class="card-title">' +
+ filterXSS(element["zadeva"]) +
+ '</span><p id="msg_body-' +
+ filterXSS(element["id"]) +
+ '"><button class="btn waves-effect waves-light" onclick=loadMsg("' +
+ filterXSS(element["id"]) +
+ '"); type="submit">Load message body<i class="material-icons right">system_update</i></button></p></div><div class="card-action"><a href=javascript:deleteMsg("' +
+ filterXSS(element["id"]) +
+ '");><i class="material-icons">delete</i></a><a href=\'javascript:document.getElementById("full_name").value="' +
+ filterXSS(element["posiljatelj"]) +
+ '";document.getElementById("msg_subject").value="Re: ' +
+ filterXSS(element["zadeva"]) +
+ '";M.updateTextFields();document.getElementById("navigation-main").scrollIntoView();\'><i class="material-icons">reply</i></a>' +
+ filterXSS(element["posiljatelj"]) + " &raquo; " + filterXSS(element["datum"]["dan"]) + ". " + filterXSS(element["datum"]["mesec"]) + ". " + filterXSS(element["datum"]["leto"]) + " at " +
+ filterXSS(element["cas"]["ura"]) + ":" + filterXSS(element["cas"]["minuta"]) +
+ '</div></div></div>';
});
}
-async function sendMessage(number, subject, bofdy) {
+async function sendMessage(recipient_number, subject, body) {
setLoading(true);
let promises_to_run = [
localforage.getItem("username").then((value) => {
@@ -226,117 +284,113 @@ async function sendMessage(number, subject, bofdy) {
}),
];
Promise.all(promises_to_run).then(() => {
- $.ajax({
- url: API_ENDPOINT,
- crossDomain: true,
- data: {
- "u": username,
- "p": password,
- "m": "posljisporocilo",
- "a": number,
- "b": subject,
- "c": bofdy
- },
- dataType: "json",
- cache: false,
- type: "POST", // big data not good, maybe u wanna many charzz
- success: (data) => {
- // we CAN't know wether the mesgg was delievered
- M.toast({ html: "Message was probably sent, but check the Sent folder to be sure!" });
- setLoading(false);
- },
- error: () => {
- M.toast({ html: "Error sending message, No Internet connnection?" });
- setLoading(false);
- }
- })
+ $.ajax({
+ url: API_ENDPOINT,
+ crossDomain: true,
+ data: {
+ "u": username,
+ "p": password,
+ "m": "posljisporocilo",
+ "a": recipient_number,
+ "b": subject,
+ "c": body
+ },
+
+ dataType: "json",
+ cache: false,
+
+ type: "POST",
+ success: () => {
+ // we CAN'T know wether the mesgg was delievered
+ M.toast({ html: "Message was <i>probably</i> sent, check the Sent folder to be sure!" });
+ setLoading(false);
+ },
+ error: () => {
+ M.toast({ html: "Error sending message, no Internet connnection?" });
+ setLoading(false);
+ }
+ })
});
}
+
function validateName() {
- localforage.getItem('directory').then(function(value) {
- if(value == null) {
- M.toast({ html: "Unable to read directory of people. Name could not be verified. Directory is empty."});
+ if (directory !== null) {
+
+ if ($("#full-name").val() in directory) {
+ $("#full-name").addClass("valid");
+ $("#full-name").removeClass("invalid");
+ document.getElementById("msg-send").disabled = false;
+ } else {
+ $("#full-name").addClass("invalid");
+ $("#full-name").removeClass("valid");
+ document.getElementById("msg-send").disabled = true;
+ }
+
+ }
+}
+
+// Setup event listeners for buttons
+function setupEventListeners() {
+ // Button to add a photo
+ $("#msg-add-photo").click(() => {
+ let input = document.createElement("input");
+ input.type = "file";
+ input.onchange = (e) => {
+ // getting a hold of the file reference
+ let file = e.target.files[0];
+ // setting up the reader
+ let reader = new FileReader();
+ reader.readAsDataURL(file); // this is reading as data url
+ // here we tell the reader what to do when it's done reading...
+ reader.onload = readerEvent => {
+ additionalstufftoaddtomessage += '<br><img src="' + readerEvent.target.result + '" />'; // this is the content!
+ M.toast({ html: "Image added as an attachment." });
}
- var evals = value;
- for (var variableKey in evals){
- if (evals.hasOwnProperty(variableKey)){
- evals[variableKey] = null;
- }
- }
- array =Object.getOwnPropertyNames(evals);
- if(array.includes(document.getElementById("full_name").value)) {
- document.getElementById("full_name").classList.add("valid");
- document.getElementById("msg_send").disabled = false;
- } else {
- document.getElementById("full_name").classList.add("invalid");
- document.getElementById("msg_send").disabled = true;
- }
- }).catch(function(err) {
- M.toast({ html: "Unable to read directory of people. Name could not be verified."});
+ }
+ input.click();
+ });
+
+ // Verify recipient when input loses focus
+ $("#full-name").on("blur", validateName);
+
+ // Button to send message
+ $("#msg-send").click(() => {
+ localforage.getItem("directory").then(function (value) {
+ sendMessage(value[document.getElementById("full-name").value], document.getElementById("msg-subject").value,
+ htmlEncode(document.getElementById("msg-body").value + additionalstufftoaddtomessage));
+ document.getElementById("msg-body").value = "";
+ document.getElementById("full-name").value = "";
+ document.getElementById("msg-subject").value = "";
+ additionalstufftoaddtomessage = "";
+ }).catch(function (err) {
+ M.toast({ html: "Unable to read directory of people. Message could not be sent." });
console.log(err);
});
+ });
+}
+
+function getUrlParameter(sParam) {
+ const url_params = new URLSearchParams(window.location.search);
+ const found_param = url_params.get(sParam);
+ return found_param
}
+
var additionalstufftoaddtomessage = "";
- document.addEventListener('DOMContentLoaded', function() {
- checkLogin();
- var elems = document.querySelectorAll('.autocomplete-fullname');
- localforage.getItem('directory').then(function(value) {
- // vse editam v nanotu
- var evals = value;
- for (var variableKey in evals){
- if (evals.hasOwnProperty(variableKey)){
- evals[variableKey] = null;
- }
- }
- var instances = M.Autocomplete.init(elems, {
- data: evals,
- onAutocomplete: validateName,
- minLength: 0
- });
- }).catch(function(err) {
- M.toast({ html: "Unable to read directory of people. Unable to autocomplete the name of the person."});
- console.log(err);
- });
- if(window.location.search.substring(1)) {
- document.getElementById("full_name").value = decodeURIComponent(window.location.search.substring(1));
- M.updateTextFields();
- validateName();
- }
- document.getElementById("full_name").addEventListener("blur", validateName);
- document.getElementById("msg_send").addEventListener("click", function() {
- localforage.getItem('directory').then(function(value) {
- sendMessage(value[document.getElementById("full_name").value], document.getElementById("msg_subject").value,
- htmlEncode(document.getElementById("msg_body").value+additionalstufftoaddtomessage));
- document.getElementById("msg_body").value = "";
- document.getElementById("full_name").value = "";
- document.getElementById("msg_subject").value = "";
- additionalstufftoaddtomessage = "";
- }).catch(function(err) {
- M.toast({ html: "Unable to read directory of people. Message could not be sent."});
- console.log(err);
- });
- });
- // Setup side menu
- const menus = document.querySelectorAll(".side-menu");
- M.Sidenav.init(menus, { edge: "right", draggable: true });
- var receivedmessages = null;
- loadMessages(true, 0);
-
- document.getElementById("msg_add_a_photo").addEventListener("click", function() {
- var input = document.createElement('input');
- input.type = 'file';
- input.onchange = e => {
- // getting a hold of the file reference
- var file = e.target.files[0];
- // setting up the reader
- var reader = new FileReader();
- reader.readAsDataURL(file); // this is reading as data url
- // here we tell the reader what to do when it's done reading...
- reader.onload = readerEvent => {
- additionalstufftoaddtomessage += '<br><img src="' + readerEvent.target.result + '" />'; // this is the content!
- M.toast({html:"Image added as an attachment."});
- }
- }
- input.click();
- });
- });
+document.addEventListener("DOMContentLoaded", () => {
+
+ checkLogin();
+ loadDirectory();
+ setupEventListeners();
+
+ var receivedmessages = null;
+ loadMessages(true, 0);
+
+ document.getElementById("full-name").value = getUrlParameter("m");
+ M.updateTextFields();
+ validateName();
+
+ // Setup side menu
+ const menus = document.querySelectorAll(".side-menu");
+ M.Sidenav.init(menus, { edge: "right", draggable: true });
+
+});
generated by cgit v1.2.3 (git 2.25.1) at 2024-06-09 22:58:44 +0200