diff --git a/index.html b/index.html index e094a32..e16a877 100644 --- a/index.html +++ b/index.html @@ -106,7 +106,7 @@ - + diff --git a/resources/js/ajax.js b/resources/js/ajax.js index cfbc18e..b653bbe 100644 --- a/resources/js/ajax.js +++ b/resources/js/ajax.js @@ -20,8 +20,8 @@ const doAjax = async (actionPath, data) => { xhttp.onreadystatechange = function() { if (this.readyState === 4 && this.status === 200) { // Send the returned data to further process - if (this.responseXML != null) { - handleXMLReturnData(this.responseXML); + if (this.responseText != null) { + handleJSONReturnData(JSON.parse(this.responseText)); } else { document.getElementById('dynDiv').innerHTML = "
"
@@ -32,7 +32,7 @@ const doAjax = async (actionPath, data) => {
xhttp.open("POST", actionPath, true);
xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
- xhttp.overrideMimeType('application/xml'); // Force return to be XML
+ xhttp.overrideMimeType('application/json'); // Force return to be JSON
xhttp.send(data);
}
diff --git a/resources/js/filesystemActions.js b/resources/js/filesystemActions.js
index a1607eb..4664a75 100644
--- a/resources/js/filesystemActions.js
+++ b/resources/js/filesystemActions.js
@@ -56,7 +56,7 @@ const getDir = (query) => {
data = "dirQuery=" + encodeURIComponent(data);
document.cookie = data + "; expires=Sun, 31 Dec 2034 12:00:00 UTC";
data +="&mergeType=" + mergeType.checked
- + "Here&passwd=" + passwd;
+ + "&passwd=" + passwd;
doAjax("resources/php/getDirList.php", data);
}
diff --git a/resources/js/xmlParser.js b/resources/js/jsonParser.js
similarity index 53%
rename from resources/js/xmlParser.js
rename to resources/js/jsonParser.js
index 3cadc66..e311819 100644
--- a/resources/js/xmlParser.js
+++ b/resources/js/jsonParser.js
@@ -1,58 +1,60 @@
const insertArea = document.getElementById('dynDiv');
-const handleXMLReturnData = (data) => {
- if (data.activeElement.tagName == "DIR_LIST") {
+const handleJSONReturnData = (data) => {
+ if (data.message) {
+ if (data.message.type == "locked") {
+ createPassField();
+ } else {
+ const text = document.createTextNode(data.message.text)
+ document.getElementById("serverMsgView").appendChild(text);
+ }
+ return ;
+ }
+
+ if (data.list) {
updateHTMLDirList(data);
- } else if (data.activeElement.tagName == "LOCK_MESSAGE") {
- createPassField(data);
- } else if (data.activeElement.tagName == "SERV_MSG") {
- document.getElementById("serverMsgView").appendChild(data.activeElement);
- } else if (data.activeElement.tagName == "FAVES_LIST") {
- generateFavesList(data);
+ } else if (data.FAVES_LIST) {
+ generateFavesList(data.FAVES_LIST);
}
}
const generateFavesList = (data) => {
let listView = document.getElementById("favesList");
- let favesList = data.getElementsByTagName("FAVE_LINK");
- let size = favesList.length;
listView.innerHTML = "";
- for (i = 0; i < size; i++) {
+ data.forEach(fave => {
let liTag = document.createElement("LI");
- let name = favesList[i].innerHTML;
- let parts = (name.includes("/")) ? name.split("/") : name.split("\\");
+ let parts = (fave.includes("/")) ? fave.split("/") : fave.split("\\");
let txtNode = document.createTextNode(parts[parts.length - 2]);
- liTag.setAttribute("name", name);
- liTag.setAttribute("title", name);
+ liTag.setAttribute("name", fave);
+ liTag.setAttribute("title", fave);
liTag.setAttribute("onclick", "loadFave(this)");
liTag.appendChild(txtNode);
listView.appendChild(liTag);
- }
+ });
}
const updateHTMLDirList = async (data) => {
- let isInFaves = data.getElementsByTagName('IN_FAVE')[0].innerHTML;
- let dirPath = data.getElementsByTagName('PATH_HEAD')[0].innerHTML;
- let dirs = Array.prototype.slice.call(data.getElementsByTagName('DIR'), 0);
- let videos = Array.prototype.slice.call(data.getElementsByTagName('VID_FILE'), 0);
- let images = Array.prototype.slice.call(data.getElementsByTagName('IMG_FILE'), 0);
- let files = Array.prototype.slice.call(data.getElementsByTagName('FILE'), 0);
var dirTemplate = document.querySelector('#dirTemplate');
var vidTemplate = document.querySelector('#vidTemplate');
var imgTemplate = document.querySelector('#imgTemplate');
var filTemplate = document.querySelector('#filTemplate');
+ let dirPath = data.PATH_HEAD;
+ let isInFaves = data.IN_FAVE;
+ let dirs = (data.list.dirs) ? data.list.dirs : [];
+ let videos = (data.list.vids) ? data.list.vids : [];
+ let images = (data.list.imgs) ? data.list.imgs : [];
+ let files = (data.list.files) ? data.list.files : [];
let i = 0;
let size = 0;
-
document.getElementById("path").innerHTML = dirPath;
insertArea.innerHTML = "";
// Setup background if there is a 000.* in selection
- let bgImgPth = images[0] ? images[0].innerHTML : "";
+ let bgImgPth = images[0] ? images[0].image : "";
if (bgImgPth.match(/000\.(jpg|png|gif)\b/) != null) {
updateBG(dirPath + bgImgPth);
} else {
@@ -69,87 +71,64 @@ const updateHTMLDirList = async (data) => {
elm.style.color = "";
}
-
// Insert dirs
- let dirImg = "resources/images/icons/folder.png";
- size = dirs.length;
- sortElms(dirs);
+ let dirClone = document.importNode(dirTemplate.content, true);
+ let dirImg = "resources/images/icons/folder.png";
+ let dir = null;
+ size = dirs.length;
for (; i < size; i++) {
- let dir = dirs[i].innerHTML;
- if (dir != "resources/") {
- let dirClone = document.importNode(dirTemplate.content, true);
- createElmBlock(dirClone, dirImg, dir);
- }
+ dir = dirs[i].dir;
+ const clone = dirClone.cloneNode(true);
+ createElmBlock(clone, dirImg, dir);
}
// Insert videos
+ let vidClone = document.importNode(vidTemplate.content, true);
let thumbnail = "";
- let vidNme = "";
+ let title = "";
size = videos.length;
- sortVidElms(videos);
for (i = 0; i < size; i++) {
- vidNme = videos[i].children[0].innerHTML;
- thumbnail = videos[i].children[1].innerHTML;
- let vidClone = document.importNode(vidTemplate.content, true);
-
- createElmBlock(vidClone, thumbnail, vidNme, true);
+ title = videos[i].video.title;
+ thumbnail = videos[i].video.thumbnail;
+ const clone = vidClone.cloneNode(true);
+ createElmBlock(clone, thumbnail, title, true, dirPath);
}
// Insert images
+ let imgClone = document.importNode(imgTemplate.content, true);
thumbnail = "";
size = images.length;
- sortElms(images);
for (i = 0; i < size; i++) {
- thumbnail = images[i].innerHTML;
+ thumbnail = images[i].image;
if (thumbnail.match(/000\.(jpg|png|gif)\b/) == null &&
!thumbnail.includes("favicon.png")) {
- let imgClone = document.importNode(imgTemplate.content, true);
- let imgTag = imgClone.firstElementChild;
- imgTag.src = dirPath + thumbnail;
+ const clone = imgClone.cloneNode(true);
+ let imgTag = clone.firstElementChild;
+ console.log(imgTag);
+ imgTag.src = dirPath + '/' + thumbnail;
imgTag.alt = thumbnail;
- insertArea.appendChild(imgClone);
+ insertArea.appendChild(clone);
}
}
// Insert files
- size = files.length;
- sortElms(files);
+ let filClone = document.importNode(filTemplate.content, true);
+ size = files.length;
for (i = 0; i < size; i++) {
- let filClone = document.importNode(filTemplate.content, true);
- let fileName = files[i].innerHTML;
- createElmBlock(filClone, setFileIconType(fileName), fileName);
+ const clone = imgClone.cloneNode(true);
+ let fileName = files[i].file;
+ createElmBlock(clone, setFileIconType(fileName), fileName);
}
}
-const sortVidElms = (obj) => {
- obj.sort(function(a,b) {
- var n1 = a.children[0].innerHTML;
- var n2 = b.children[0].innerHTML;
- if (n1 > n2) return 1;
- if (n1 < n2) return -1;
- return 0;
- });
-}
-
-const sortElms = (obj) => {
- obj.sort(function(a,b) {
- var n1 = a.innerHTML;
- var n2 = b.innerHTML;
- if (n1 > n2) return 1;
- if (n1 < n2) return -1;
- return 0;
- });
-}
-
-const createElmBlock = (elm, imgSrc, fileName, isVideo = null) => {
+const createElmBlock = (elm, imgSrc, fileName, isVideo = null, path = null) => {
contnrTag = elm.firstElementChild;
let imgTag = null;
let inputTag = elm.querySelector("input");
if (isVideo) {
- contnrTag.style = "background-image: url('" + imgSrc + "')";
+ contnrTag.style = "background-image: url('/resources/images/thumbnails/" + imgSrc + "')";
inputTag.className = "videoInputField";
- let path = document.getElementById("path").innerHTML;
let fullMedia = path + fileName;
elm.querySelector("div").addEventListener("click", function (eve) {
openInLocalProg(fullMedia);
diff --git a/resources/js/passwordFieldInsert.js b/resources/js/passwordFieldInsert.js
index 603698a..65ed10b 100644
--- a/resources/js/passwordFieldInsert.js
+++ b/resources/js/passwordFieldInsert.js
@@ -1,4 +1,4 @@
-const createPassField = (data) => {
+const createPassField = () => {
let passField = document.createElement("INPUT");
let submitBttn = document.createElement("BUTTON");
passField.id = "PASSWD";
diff --git a/resources/php/dbController.php b/resources/php/dbController.php
index 86abe82..a283381 100644
--- a/resources/php/dbController.php
+++ b/resources/php/dbController.php
@@ -4,13 +4,14 @@ include_once 'serverMessenger.php';
function getTabLinks() {
GLOBAL $db;
- $res = $db->query('Select * FROM faves');
- $GeneratedXML = "