itdominator
/
WebFM
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Convirted to using JSON returns...

This commit is contained in:
Maxim Stewart 2019-06-05 23:05:09 -05:00
parent a7299a0dbd
commit ccac2347a4
8 changed files with 120 additions and 139 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
index.html
View File

@ -106,7 +106,7 @@
<script type="text/javascript" src="resources/js/favorites.js" charset="utf-8"></script> <script type="text/javascript" src="resources/js/favorites.js" charset="utf-8"></script>
<script type="text/javascript" src="resources/js/passwordFieldInsert.js" charset="utf-8"></script> <script type="text/javascript" src="resources/js/passwordFieldInsert.js" charset="utf-8"></script>
<script type="text/javascript" src="resources/js/cookieHandler.js" charset="utf-8"></script> <script type="text/javascript" src="resources/js/cookieHandler.js" charset="utf-8"></script>
<script type="text/javascript" src="resources/js/xmlParser.js" charset="utf-8"></script> <script type="text/javascript" src="resources/js/jsonParser.js" charset="utf-8"></script>
<script type="text/javascript" src="resources/js/ajax.js" charset="utf-8"></script> <script type="text/javascript" src="resources/js/ajax.js" charset="utf-8"></script>
<script type="text/javascript" src="resources/js/uiActions.js" charset="utf-8"></script> <script type="text/javascript" src="resources/js/uiActions.js" charset="utf-8"></script>
<script type="text/javascript" src="resources/js/filesystemActions.js" charset="utf-8"></script> <script type="text/javascript" src="resources/js/filesystemActions.js" charset="utf-8"></script>

6
resources/js/ajax.js
View File

@ -20,8 +20,8 @@ const doAjax = async (actionPath, data) => {
xhttp.onreadystatechange = function() { xhttp.onreadystatechange = function() {
if (this.readyState === 4 && this.status === 200) { if (this.readyState === 4 && this.status === 200) {
// Send the returned data to further process // Send the returned data to further process
if (this.responseXML != null) { if (this.responseText != null) {
handleXMLReturnData(this.responseXML); handleJSONReturnData(JSON.parse(this.responseText));
} else { } else {
document.getElementById('dynDiv').innerHTML = document.getElementById('dynDiv').innerHTML =
"<p class=\"error\" style=\"width:100%;text-align:center;\"> " "<p class=\"error\" style=\"width:100%;text-align:center;\"> "
@ -32,7 +32,7 @@ const doAjax = async (actionPath, data) => {
xhttp.open("POST", actionPath, true); xhttp.open("POST", actionPath, true);
xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); 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); xhttp.send(data);
} }

2
resources/js/filesystemActions.js
View File

@ -56,7 +56,7 @@ const getDir = (query) => {
data = "dirQuery=" + encodeURIComponent(data); data = "dirQuery=" + encodeURIComponent(data);
document.cookie = data + "; expires=Sun, 31 Dec 2034 12:00:00 UTC"; document.cookie = data + "; expires=Sun, 31 Dec 2034 12:00:00 UTC";
data +="&mergeType=" + mergeType.checked data +="&mergeType=" + mergeType.checked
+ "Here&passwd=" + passwd; + "&passwd=" + passwd;
doAjax("resources/php/getDirList.php", data); doAjax("resources/php/getDirList.php", data);
} }

127
resources/js/xmlParser.js → resources/js/jsonParser.js
View File

@ -1,58 +1,60 @@
const insertArea = document.getElementById('dynDiv'); const insertArea = document.getElementById('dynDiv');
const handleXMLReturnData = (data) => { const handleJSONReturnData = (data) => {
if (data.activeElement.tagName == "DIR_LIST") { 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); updateHTMLDirList(data);
} else if (data.activeElement.tagName == "LOCK_MESSAGE") { } else if (data.FAVES_LIST) {
createPassField(data); generateFavesList(data.FAVES_LIST);
} else if (data.activeElement.tagName == "SERV_MSG") {
document.getElementById("serverMsgView").appendChild(data.activeElement);
} else if (data.activeElement.tagName == "FAVES_LIST") {
generateFavesList(data);
} }
} }
const generateFavesList = (data) => { const generateFavesList = (data) => {
let listView = document.getElementById("favesList"); let listView = document.getElementById("favesList");
let favesList = data.getElementsByTagName("FAVE_LINK");
let size = favesList.length;
listView.innerHTML = ""; listView.innerHTML = "";
for (i = 0; i < size; i++) { data.forEach(fave => {
let liTag = document.createElement("LI"); let liTag = document.createElement("LI");
let name = favesList[i].innerHTML; let parts = (fave.includes("/")) ? fave.split("/") : fave.split("\\");
let parts = (name.includes("/")) ? name.split("/") : name.split("\\");
let txtNode = document.createTextNode(parts[parts.length - 2]); let txtNode = document.createTextNode(parts[parts.length - 2]);
liTag.setAttribute("name", name); liTag.setAttribute("name", fave);
liTag.setAttribute("title", name); liTag.setAttribute("title", fave);
liTag.setAttribute("onclick", "loadFave(this)"); liTag.setAttribute("onclick", "loadFave(this)");
liTag.appendChild(txtNode); liTag.appendChild(txtNode);
listView.appendChild(liTag); listView.appendChild(liTag);
} });
} }
const updateHTMLDirList = async (data) => { 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 dirTemplate = document.querySelector('#dirTemplate');
var vidTemplate = document.querySelector('#vidTemplate'); var vidTemplate = document.querySelector('#vidTemplate');
var imgTemplate = document.querySelector('#imgTemplate'); var imgTemplate = document.querySelector('#imgTemplate');
var filTemplate = document.querySelector('#filTemplate'); 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 i = 0;
let size = 0; let size = 0;
document.getElementById("path").innerHTML = dirPath; document.getElementById("path").innerHTML = dirPath;
insertArea.innerHTML = ""; insertArea.innerHTML = "";
// Setup background if there is a 000.* in selection // 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) { if (bgImgPth.match(/000\.(jpg|png|gif)\b/) != null) {
updateBG(dirPath + bgImgPth); updateBG(dirPath + bgImgPth);
} else { } else {
@ -69,87 +71,64 @@ const updateHTMLDirList = async (data) => {
elm.style.color = ""; elm.style.color = "";
} }
// Insert dirs // Insert dirs
let dirImg = "resources/images/icons/folder.png"; let dirClone = document.importNode(dirTemplate.content, true);
size = dirs.length; let dirImg = "resources/images/icons/folder.png";
sortElms(dirs); let dir = null;
size = dirs.length;
for (; i < size; i++) { for (; i < size; i++) {
let dir = dirs[i].innerHTML; dir = dirs[i].dir;
if (dir != "resources/") { const clone = dirClone.cloneNode(true);
let dirClone = document.importNode(dirTemplate.content, true); createElmBlock(clone, dirImg, dir);
createElmBlock(dirClone, dirImg, dir);
}
} }
// Insert videos // Insert videos
let vidClone = document.importNode(vidTemplate.content, true);
let thumbnail = ""; let thumbnail = "";
let vidNme = ""; let title = "";
size = videos.length; size = videos.length;
sortVidElms(videos);
for (i = 0; i < size; i++) { for (i = 0; i < size; i++) {
vidNme = videos[i].children[0].innerHTML; title = videos[i].video.title;
thumbnail = videos[i].children[1].innerHTML; thumbnail = videos[i].video.thumbnail;
let vidClone = document.importNode(vidTemplate.content, true); const clone = vidClone.cloneNode(true);
createElmBlock(clone, thumbnail, title, true, dirPath);
createElmBlock(vidClone, thumbnail, vidNme, true);
} }
// Insert images // Insert images
let imgClone = document.importNode(imgTemplate.content, true);
thumbnail = ""; thumbnail = "";
size = images.length; size = images.length;
sortElms(images);
for (i = 0; i < size; i++) { for (i = 0; i < size; i++) {
thumbnail = images[i].innerHTML; thumbnail = images[i].image;
if (thumbnail.match(/000\.(jpg|png|gif)\b/) == null && if (thumbnail.match(/000\.(jpg|png|gif)\b/) == null &&
!thumbnail.includes("favicon.png")) { !thumbnail.includes("favicon.png")) {
let imgClone = document.importNode(imgTemplate.content, true); const clone = imgClone.cloneNode(true);
let imgTag = imgClone.firstElementChild; let imgTag = clone.firstElementChild;
imgTag.src = dirPath + thumbnail; console.log(imgTag);
imgTag.src = dirPath + '/' + thumbnail;
imgTag.alt = thumbnail; imgTag.alt = thumbnail;
insertArea.appendChild(imgClone); insertArea.appendChild(clone);
} }
} }
// Insert files // Insert files
size = files.length; let filClone = document.importNode(filTemplate.content, true);
sortElms(files); size = files.length;
for (i = 0; i < size; i++) { for (i = 0; i < size; i++) {
let filClone = document.importNode(filTemplate.content, true); const clone = imgClone.cloneNode(true);
let fileName = files[i].innerHTML; let fileName = files[i].file;
createElmBlock(filClone, setFileIconType(fileName), fileName); createElmBlock(clone, setFileIconType(fileName), fileName);
} }
} }
const sortVidElms = (obj) => { const createElmBlock = (elm, imgSrc, fileName, isVideo = null, path = null) => {
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) => {
contnrTag = elm.firstElementChild; contnrTag = elm.firstElementChild;
let imgTag = null; let imgTag = null;
let inputTag = elm.querySelector("input"); let inputTag = elm.querySelector("input");
if (isVideo) { if (isVideo) {
contnrTag.style = "background-image: url('" + imgSrc + "')"; contnrTag.style = "background-image: url('/resources/images/thumbnails/" + imgSrc + "')";
inputTag.className = "videoInputField"; inputTag.className = "videoInputField";
let path = document.getElementById("path").innerHTML;
let fullMedia = path + fileName; let fullMedia = path + fileName;
elm.querySelector("div").addEventListener("click", function (eve) { elm.querySelector("div").addEventListener("click", function (eve) {
openInLocalProg(fullMedia); openInLocalProg(fullMedia);

2
resources/js/passwordFieldInsert.js
View File

@ -1,4 +1,4 @@
const createPassField = (data) => { const createPassField = () => {
let passField = document.createElement("INPUT"); let passField = document.createElement("INPUT");
let submitBttn = document.createElement("BUTTON"); let submitBttn = document.createElement("BUTTON");
passField.id = "PASSWD"; passField.id = "PASSWD";

11
resources/php/dbController.php
View File

@ -4,13 +4,14 @@ include_once 'serverMessenger.php';
function getTabLinks() { function getTabLinks() {
GLOBAL $db; GLOBAL $db;
$res = $db->query('Select * FROM faves');
$GeneratedXML = "<?xml version=\"1.0\" encoding=\"UTF-8\"?><FAVES_LIST>"; $res = $db->query('Select * FROM faves');
$GeneratedJSON = array('FAVES_LIST' => array());
while ($row = $res->fetchArray(SQLITE3_ASSOC)) { while ($row = $res->fetchArray(SQLITE3_ASSOC)) {
$GeneratedXML .= "<FAVE_LINK>" . $row['link'] . "</FAVE_LINK>"; $GeneratedJSON['FAVES_LIST'][] = $row['link'];
} }
$GeneratedXML .= "</FAVES_LIST>";
echo $GeneratedXML; echo json_encode($GeneratedJSON);
} }
function manageLink($ACTION, $PATH) { function manageLink($ACTION, $PATH) {

98
resources/php/getDirList.php
View File

@ -8,74 +8,70 @@ function startListing($NEWPATH, $MERGESEASSONS, $PASSWD) {
include_once 'lockedFolders.php'; include_once 'lockedFolders.php';
if (checkForLock($NEWPATH, $PASSWD) == false) { if (checkForLock($NEWPATH, $PASSWD) == false) {
$GeneratedXML = "<?xml version=\"1.0\" encoding=\"UTF-8\"?><DIR_LIST>"
. "<PATH_HEAD>" . $NEWPATH . "</PATH_HEAD>";
$subPath = ""; // This is used for season scanning as a means of properly getting $subPath = ""; // This is used for season scanning as a means of properly getting
// the video src.... It's left blank when not in a sub dir // the video src.... It's left blank when not in a sub dir
listDir($GeneratedXML, $NEWPATH, $MERGESEASSONS, $subPath); $GeneratedJSON = array('PATH_HEAD' => $NEWPATH,
'IN_FAVE' => isInDBCheck($NEWPATH),
'list' => array()
);
$GeneratedXML .= "<IN_FAVE>" . isInDBCheck($NEWPATH) . "</IN_FAVE>"; listDir($GeneratedJSON, $NEWPATH, $MERGESEASSONS, $subPath);
$GeneratedXML .= "</DIR_LIST>"; echo json_encode($GeneratedJSON);
echo $GeneratedXML;
} else { } else {
$GeneratedXML = "<?xml version=\"1.0\" encoding=\"UTF-8\"?>" $message = "Server: [Error] --> Folder is locked.";
. "<LOCK_MESSAGE>Folder is locked." serverMessage("locked", $message);
. "</LOCK_MESSAGE>";
echo $GeneratedXML;
} }
} }
} }
function listDir(&$GeneratedXML, &$NEWPATH, &$MERGESEASSONS, &$subPath) { function listDir(&$GeneratedJSON, &$NEWPATH, &$MERGESEASSONS, &$subPath) {
$handle = opendir($NEWPATH); if ($MERGESEASSONS !== "true") {
$files = array_diff(scandir($NEWPATH), array('..', '.', 'resources'));
// Note: We'll be filtering out . and .. items We have controls for these actions foreach ($files as $fileName) {
if ($MERGESEASSONS !== "trueHere") { $fullPath = $NEWPATH . '/' . $fileName;
while (false !== ($fileName = readdir($handle))) { // error_log($fullPath, 4);
if ($fileName !== "." && $fileName !== "..") { processItem($GeneratedJSON, $fullPath, $fileName, $subPath);
$fullPath = $NEWPATH . $fileName;
processItem($GeneratedXML, $fullPath, $fileName, $subPath);
}
} }
} else { } else {
while (false !== ($fileName = readdir($handle))) { $files = array_diff(scandir($NEWPATH), array('..', '.', 'resources'));
if ($fileName !== "." && $fileName !== "..") { foreach ($files as $fileName) {
$fullPath = $NEWPATH . $fileName; $fullPath = $NEWPATH . $fileName;
if (filetype($fullPath) == "dir" && strpos(strtolower($fileName), // error_log($fullPath, 4);
'season') !== false) { if (filetype($fullPath) == "dir" && strpos(strtolower($fileName),
$fileName .= "/"; 'season') !== false) {
listDir($GeneratedXML, $fullPath, $MERGESEASSONS, $fileName); $fileName .= "/";
} else { listDir($GeneratedJSON, $fullPath, $MERGESEASSONS, $fileName);
processItem($GeneratedXML, $fullPath, $fileName, $subPath); } else {
} processItem($GeneratedJSON, $fullPath, $fileName, $subPath);
} }
} }
} }
closedir($handle);
} }
// Assign XML Markup based on file type // Assign JSON Markup based on file type
function processItem(&$GeneratedXML, &$fullPath, &$fileName, $subPath) { function processItem(&$GeneratedJSON, &$fullPath, &$fileName, $subPath) {
if (filetype($fullPath) == "dir") { if (preg_match('/^.*\.(mkv|avi|flv|mov|m4v|mpg|wmv|mpeg|mp4|webm)$/i', strtolower($fileName))) {
$GeneratedXML .= "<DIR>" . $fileName . "/</DIR>"; $NAMEHASH = hash('sha256', $fileName);
} elseif (preg_match('/^.*\.(mkv|avi|flv|mov|m4v|mpg|wmv|mpeg|mp4|webm)$/i', strtolower($fileName))) { if (!file_exists('resources/images/thumbnails/' . $NAMEHASH . '.jpg')) {
$NAMEHASH = hash('sha256', $fileName); shell_exec('resources/ffmpegthumbnailer -t 65% -s 320 -c jpg '
if (!file_exists('resources/images/thumbnails/' . $NAMEHASH . '.jpg')) { . '-i "' . $subPath . $fullPath . '" '
shell_exec('resources/ffmpegthumbnailer -t 65% -s 320 -c jpg -i "' . '-o resources/images/thumbnails/' . $NAMEHASH . '.jpg'
. $subPath . $fullPath . '" -o resources/images/thumbnails/' );
. $NAMEHASH . '.jpg'); }
}
$GeneratedXML .= $GeneratedJSON['list']['vids'][] = array('video' =>
"<VID_FILE>" array('title' => $subPath . $fileName,
. "<VID_NAME>" . $subPath . $fileName . "</VID_NAME>" 'thumbnail' => $NAMEHASH . '.jpg'
. "<VID_IMG>/resources/images/thumbnails/" . $NAMEHASH . ".jpg</VID_IMG>" . )
"</VID_FILE>"; );
} elseif (preg_match('/^.*\.(png|jpg|gif|jpeg)$/i', strtolower($fileName))) { } elseif (preg_match('/^.*\.(png|jpg|gif|jpeg)$/i', strtolower($fileName))) {
$GeneratedXML .= "<IMG_FILE>" . $subPath . $fileName . "</IMG_FILE>"; $GeneratedJSON['list']['imgs'][] = array('image' => $subPath . $fileName);
} elseif (filetype($fullPath) == "dir") {
$GeneratedJSON['list']['dirs'][] = array('dir' => $fileName . "/");
} else { } else {
$GeneratedXML .= "<FILE>" . $subPath . $fileName . "</FILE>"; $GeneratedJSON['list']['files'][] = array('file' => $subPath . $fileName);
} }
} }
function isInDBCheck($PATH) { function isInDBCheck($PATH) {

11
resources/php/serverMessenger.php
View File

@ -1,7 +1,12 @@
<?php <?php
function serverMessage($TYPE, $MESSAGE) { function serverMessage($TYPE, $MESSAGE) {
$GeneratedXML = "<?xml version=\"1.0\" encoding=\"UTF-8\"?>"; $GeneratedJSON = array( 'message' =>
$GeneratedXML .= "<SERV_MSG class='" . $TYPE . "'>" . $MESSAGE ."</SERV_MSG>"; array(
echo $GeneratedXML; 'type' => $TYPE,
'text' => $MESSAGE
)
);
echo json_encode($GeneratedJSON);
} }
?> ?>