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

Added file and folder creation. Added icons. Added delete functionality. Added rename functionality.

Browse Source
This commit is contained in:
Maxim Stewart 2018-04-18 05:57:57 -05:00
parent 717efff6f5
commit 40591f2ef5
30 changed files with 419 additions and 152 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
Images/1.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.3 MiB

After

Width:  |  Height:  |  Size: 1.1 MiB

BIN
Images/2.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.5 MiB

After

Width:  |  Height:  |  Size: 1.1 MiB

BIN
Images/3.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.8 MiB

After

Width:  |  Height:  |  Size: 1.4 MiB

BIN
Images/4.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.4 MiB

After

Width:  |  Height:  |  Size: 1.8 MiB

BIN
Images/5.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.0 MiB

After

Width:  |  Height:  |  Size: 1.6 MiB

6
README.md
View File

@ -6,6 +6,9 @@ WebFM is a media and file viewer.
2. Use php -S 0.0.0.0:yourDesiredPort 2. Use php -S 0.0.0.0:yourDesiredPort
3. Use ufw or gufw to open the port on your computer to the network. 3. Use ufw or gufw to open the port on your computer to the network.
4. Place files or start uploading some to the folders. 4. Place files or start uploading some to the folders.
5. Single clic icons and thumbnails to open files.
6. Double click the text name to change the file's or folder's name and press enter to set it.
7. Right-click to get context menu options.
Notes: Notes:
1. Folders and files CAN NOT have & or ' in the names. Otherwise, you can't access that item with the viewer. 1. Folders and files CAN NOT have & or ' in the names. Otherwise, you can't access that item with the viewer.
@ -14,7 +17,6 @@ Notes:
4. The media and image pane can be moved by dragging from the transparentish bar that has the close button and other controls. 4. The media and image pane can be moved by dragging from the transparentish bar that has the close button and other controls.
5. Edit the resources/php/config.php file and put your own programs there. 5. Edit the resources/php/config.php file and put your own programs there.
# TO-DO # TO-DO
1. Allow for move, copy, delete functionality. 1. Allow for move, copy, delete functionality.
2. Allow for creating folders through the web interface. 2. Allow for creating folders through the web interface.
@ -23,9 +25,7 @@ Notes:
5. Impliment themes functionality. 5. Impliment themes functionality.
6. Look to refactor code. 6. Look to refactor code.
# Images # Images
![1 Home](Images/1.png) ![1 Home](Images/1.png)
![2 Images Listed](Images/2.png) ![2 Images Listed](Images/2.png)
![3 Image Open](Images/3.png) ![3 Image Open](Images/3.png)

28
index.html
View File

@ -7,20 +7,22 @@
<link type="text/css" rel="stylesheet" href="resources/css/main.css"/> <link type="text/css" rel="stylesheet" href="resources/css/main.css"/>
<link rel="shortcut icon" type="image/png" href="favicon.png"/> <link rel="shortcut icon" type="image/png" href="favicon.png"/>
</head> </head>
<body onload="onloadSetBG(); getDir('/')"> <body onload="onloadSetBG(); getDir('/')" contextmenu="menu">
<!-- Background --> <!-- Background -->
<img id="bg" /> <img id="bg" />
<!-- Uploader --> <!-- Uploader -->
<h2 id="fullPathHeader"> <h2 id="fullPathHeader">
<form action="resources/php/upload.php" method="post" enctype="multipart/form-data" target="FormSubmitter"> <form action="resources/php/upload.php" method="post" enctype="multipart/form-data" target="FormSubmitter">
<input type="button" onclick="tgglServerMsgView()" title="Show Server Messages" value="Show Server Messages">
<input type="reset" title="Clear" value="Clear">
<input type="submit" name="UploadFiles" title="Upload File(s)" value="Upload File(s)" />
<input type="text" id="DIRPATHUL" name="DIRPATHUL" value="">
<input class="ulFile" type="file" title="files To Upload" name="filesToUpload[]" data-multiple-caption="{count} files selected" multiple /> <input class="ulFile" type="file" title="files To Upload" name="filesToUpload[]" data-multiple-caption="{count} files selected" multiple />
<button type="button" onclick="clearDirCookie()">Home Directory</button> <input type="submit" name="UploadFiles" title="Upload File(s)" value="Upload File(s)" />
<input type="reset" title="Clear" id="CLEARBTTN" value="Clear" style="display:none;">
<input type="text" id="DIRPATHUL" name="DIRPATHUL" value="">
</form> </form>
<br/>
<input type="text" id="NewItem" style="text-align: center; background-color: #ffffff; color: #000000;" value="" />
<input type="button" value="New Dir" onclick="createDir()">
<input type="button" value="New File" onclick="createFile()">
<br/> <br/>
&nbsp;&nbsp;&nbsp;&nbsp;Path:&nbsp;&nbsp;<span id="path"></span> &nbsp;&nbsp;&nbsp;&nbsp;Path:&nbsp;&nbsp;<span id="path"></span>
</h2> </h2>
@ -35,8 +37,18 @@
<iframe id="FormSubmitter" name="FormSubmitter" frameborder="0" ></iframe> <iframe id="FormSubmitter" name="FormSubmitter" frameborder="0" ></iframe>
</div> </div>
<!-- Create the menu -->
<menu type="context" id="menu">
<menuitem label="Home Directory" onclick="clearDirCookie()"></menuitem>
<menuitem label="Show Server Messages" onclick="tgglServerMsgView()"></menuitem>
<menuitem label="Clear Upload List" onclick="clearDlList()"></menuitem>
<menuitem label="Delete File/Directory" onclick="deleteItem()"></menuitem>
</menu>
<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/controlers.js" charset="utf-8"></script> <script type="text/javascript" src="resources/js/uiEvents.js" charset="utf-8"></script>
<script type="text/javascript" src="resources/js/dragContainer.js" charset="utf-8"></script> <script type="text/javascript" src="resources/js/uiControls.js" charset="utf-8"></script>
<script type="text/javascript" src="resources/js/dragContainerEvents.js" charset="utf-8"></script>
<script type="text/javascript" src="resources/js/fileSystemControls.js" charset="utf-8"></script>
</body> </body>
</html> </html>

37
resources/css/main.css
View File

@ -101,17 +101,41 @@
.movieStyle { .movieStyle {
float: left; float: left;
width: 15em; width: 15em;
height: 10em; height: 8.5em;
overflow: hidden; overflow: hidden;
margin: 0.5em; margin: 0.5em;
padding: 0.5em; padding: 0.5em;
} }
.movieTitle { .dirTitle, .fileTitle, .movieTitle {
width: 15em;
white-space: nowrap; white-space: nowrap;
text-overflow: ellipsis; text-overflow: ellipsis;
text-align: center;
overflow: hidden; overflow: hidden;
border-style: none;
font-size: 75%;
}
.dirTitle, .fileTitle {
width: auto;
background-color: #00000000;
color: #ffffff;
}
.movieTitle {
width: 18em;
background-color: #ffffff00;
color: #ffffff;
}
.thumbnail {
width: 12em;
height: 6.5em;
}
.systemIcon {
width: 2em;
height: auto;
} }
.iconImg { .iconImg {
@ -136,7 +160,10 @@
/* Hover events */ /* Hover events */
.closeBttn:hover, .popOutBttn:hover { .dirTitle:hover,
.iconImg:hover,
.closeBttn:hover,
.popOutBttn:hover {
cursor: pointer; cursor: pointer;
} }
@ -151,8 +178,6 @@
clear: both; clear: both;
} }
.errorStyling { background-color: rgb(255,0,0); }
.error { color: rgb(255, 0, 0); } .error { color: rgb(255, 0, 0); }
.warnning { color: rgb(255, 168, 0); } .warnning { color: rgb(255, 168, 0); }
.success { color: rgb(136, 204, 39); } .success { color: rgb(136, 204, 39); }

BIN
resources/images/icons/arc.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 39 KiB

BIN
resources/images/icons/bin.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 19 KiB

BIN
resources/images/icons/doc.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 43 KiB

BIN
resources/images/icons/folder.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 38 KiB

BIN
resources/images/icons/html.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 14 KiB

BIN
resources/images/icons/img.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 82 KiB

BIN
resources/images/icons/pdf.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 18 KiB

BIN
resources/images/icons/scrip.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 24 KiB

BIN
resources/images/icons/text.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.9 KiB

85
resources/js/ajax.js
View File

@ -81,10 +81,12 @@ function updatePage(returnData) {
var dir = dirs[i].innerHTML; var dir = dirs[i].innerHTML;
if (dir != "resources/") { if (dir != "resources/") {
insertArea.innerHTML += "<div class=\"dirStyle\" onclick=\"getDir('" insertArea.innerHTML += "<div class=\"dirStyle\"> <img id=\"dirID\""
+ dir + "')\" >" +" class=\"systemIcon\" src=\"resources/images/icons/folder.png\" />"
+ dir + "<input type=\"text\" id=\"titleID\" class=\"dirTitle\""
+ "</dir>"; + " readonly=\"true\" value=\"" + dir + "\" "
+ " onfocusout=\"disableEdits(this)\"/>"
+"</dir>";
} }
} }
@ -92,28 +94,29 @@ function updatePage(returnData) {
size = videos .length; size = videos .length;
for (i = 0; i < size; i++) { for (i = 0; i < size; i++) {
var thumbnail = videos[i].children[0].innerHTML; var thumbnail = videos[i].children[0].innerHTML;
var videoPth = videos[i].children[1].innerHTML; var vidNme = videos[i].children[1].innerHTML;
var vidNme = videos[i].children[2].innerHTML;
insertArea.innerHTML += "<span class=\"movieStyle\" title=\"" + vidNme insertArea.innerHTML += "<span class=\"movieStyle\" title=\"" + vidNme + "\" >"
+ "\" onclick='showMedia(\"" + videoPth + "\")'>" + "<img id=\"movieID\" class=\"thumbnail\""
+ "<img src=\"" + thumbnail + "\" alt=\"" + videoPth + "\">" + " src=\"" + thumbnail + "\" alt=\"" + vidNme + "\" />"
+ "<p class=\"movieTitle\">" + vidNme + "</p>" + "<input type=\"text\" id=\"titleID\" class=\"movieTitle\""
+ " readonly=\"true\"" + " value=\"" + vidNme + "\" "
+ " onfocusout=\"disableEdits(this)\"/>"
+ "</span>"; + "</span>";
} }
// Insert images // Insert images
size = images.length; var path = document.getElementById("path").innerHTML;
size = images.length;
for (i = 0; i < size; i++) { for (i = 0; i < size; i++) {
var thumbnail = images[i].children[0].innerHTML; var thumbnail = images[i].children[0].innerHTML;
var imgTitle = images[i].children[1].innerHTML;
if (!imgTitle.includes("favicon.png") && !imgTitle.includes("000.png") && if (!thumbnail.includes("favicon.png") && !thumbnail.includes("000.png") &&
!imgTitle.includes("000.jpg") && !imgTitle.includes("000.gif")) { !thumbnail.includes("000.jpg") && !thumbnail.includes("000.gif")) {
insertArea.innerHTML += "<img class=\"iconImg\" src=\"" insertArea.innerHTML += "<img id=\"imageID\" class=\"iconImg\""
+ thumbnail + " src=\"" + path + thumbnail
+ "\" alt=\"" + imgTitle + "\"" + "\" alt=\"" + thumbnail + "\"/>";
+ "onclick='showImg(\"" + thumbnail + "\")'/>";
} }
} }
@ -121,20 +124,52 @@ function updatePage(returnData) {
if (images[0].children[0].innerHTML.includes("000.jpg") || if (images[0].children[0].innerHTML.includes("000.jpg") ||
images[0].children[0].innerHTML.includes("000.png") || images[0].children[0].innerHTML.includes("000.png") ||
images[0].children[0].innerHTML.includes("000.gif")) { images[0].children[0].innerHTML.includes("000.gif")) {
updateBG(images[0].children[0].innerHTML); updateBG(path + images[0].children[0].innerHTML);
} else { updateBG("resources/images/backgrounds/000.jpg"); } } else {
} else { updateBG("resources/images/backgrounds/000.jpg"); } updateBG("resources/images/backgrounds/000.jpg");
}
} else {
updateBG("resources/images/backgrounds/000.jpg");
}
// Insert files // Insert files
size = files.length; size = files.length;
for (i = 0; i < size; i++) { for (i = 0; i < size; i++) {
var filePath = files[i].children[0].innerHTML; var fileName = files[i].children[0].innerHTML;
var fileName = files[i].children[1].innerHTML var iconImg = "<img id=\"fileID\" class=\"systemIcon\"";
if (fileName.includes(".doc") || fileName.includes(".docx") ||
fileName.includes(".xls") || fileName.includes(".xlsx") ||
fileName.includes(".rtf")) {
iconImg += " src=\"resources/images/icons/doc.png\" />";
} else if (fileName.includes(".7z") || fileName.includes(".7zip") ||
fileName.includes(".zip") || fileName.includes(".tar.gz") ||
fileName.includes(".tar.xz") || fileName.includes(".gz") ||
fileName.includes(".rar") || fileName.includes(".jar")) {
iconImg += " src=\"resources/images/icons/arc.png\" />";
} else if (fileName.includes(".pdf")) {
iconImg += " src=\"resources/images/icons/pdf.png\" />";
} else if (fileName.includes(".html")) {
iconImg += " src=\"resources/images/icons/html.png\" />";
} else if (fileName.includes(".txt") || fileName.includes(".conf")) {
iconImg += " src=\"resources/images/icons/text.png\" />";
} else if (fileName.includes(".iso") || fileName.includes(".img")) {
iconImg += " src=\"resources/images/icons/img.png\" />";
} else if (fileName.includes(".sh") || fileName.includes(".batch") ||
fileName.includes(".exe")) {
iconImg += " src=\"resources/images/icons/scrip.png\" />";
} else {
iconImg += " src=\"resources/images/icons/bin.png\" />";
}
if (fileName != "sse.php" && fileName != "upload.php" && if (fileName != "sse.php" && fileName != "upload.php" &&
fileName != "open.php" && fileName != "process.php") { fileName != "open.php" && fileName != "process.php") {
insertArea.innerHTML += "<div class=\"fileStyle\" onclick=\"showMedia('" insertArea.innerHTML += "<div class=\"fileStyle\">"
+ filePath + "')\">" + fileName + "</dir>"; + iconImg
+ "<input type=\"text\" id=\"titleID\" class=\"fileTitle\""
+ " readonly=\"true\"" + " value=\"" + fileName + "\" "
+ " onfocusout=\"disableEdits(this)\"/>"
+ "</dir>";
} }
} }
} }

82
resources/js/controlers.js
View File

@ -1,82 +0,0 @@
function showImg(imgLoc) {
var imgView = document.getElementById("imgView");
var toPlayerButton = "<div title=\"Open In Local Program\" class=\"popOutBttn\" onclick=\"openInLocalProg('" + imgLoc + "')\">&#8765;</div>";
var popButton = "<a href=\"" + imgLoc + "\" target=\"_blank\"><div class=\"popOutBttn\">&#8599;</div></a>";
var CloseBttn = "<div class=\"closeBttn\" onclick=\"closeImg()\">X</div>";
imgView.style.display = "block";
imgView.innerHTML = CloseBttn + popButton + toPlayerButton;
imgView.innerHTML += "<div id=\"imgArea\"><img class=\"imgViewImg\" src=\"" + imgLoc + "\" /></div>";
dragContainer(imgView); // Set for dragging events
}
function showMedia(media) {
var tempRef = media.toLowerCase();
if (tempRef.includes(".mkv") || tempRef.includes(".avi") || tempRef.includes(".flv") ||
tempRef.includes(".mov") || tempRef.includes(".m4v") || tempRef.includes(".mpg") ||
tempRef.includes(".wmv") || tempRef.includes(".mpeg") || tempRef.includes(".psf")) {
openInLocalProg(media);
} else {
var mediaView = document.getElementById("fileView");
var toPlayerButton = "<div title=\"Open In Local Program\" class=\"popOutBttn\" onclick=\"openInLocalProg('" + media + "')\">&#8765;</div>";
var popButton = "<a title=\"New Tab\" href=\"" + media + "\" target=\"_blank\"><div class=\"popOutBttn\">&#8599;</div></a>";
var CloseBttn = "<div class=\"closeBttn\" title=\"Close\" onclick=\"closeMedia()\">X</div>";
mediaView.style.display = "block";
mediaView.innerHTML = CloseBttn + popButton + toPlayerButton;
mediaView.innerHTML += "<iframe id=\"fileViewInner\" src=\"" + media + "\"></iframe>";
dragContainer(mediaView); // Set for dragging events
}
}
function openInLocalProg(media) {
var xhttp = new XMLHttpRequest();
xhttp.open("POST", "resources/php/open.php", true);
xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhttp.send("media=" + media);
}
function tgglServerMsgView() {
var serverMsgView = document.getElementById("toggleServerMsg");
if (serverMsgView.style.display == "none") {
serverMsgView.style.display = "block";
} else {
serverMsgView.style.display = "none";
}
}
function closeImg() {
var imgView = document.getElementById("imgView");
imgView.style.display = "none";
}
function closeMedia() {
var mediaView = document.getElementById("fileView");
mediaView.style.display = "none";
mediaView.children[3].src = "";
}
function clearDirCookie() {
var expireDate = "Thu, 01 Jan 1970 00:00:00 UTC";
document.cookie = "dirQuery=; expires=" + expireDate;
location.reload();
}
function onloadSetBG() { updateBG("resources/images/backgrounds/000.jpg"); }
function updateBG(bgImg) { document.getElementById("bg").src = bgImg; }
// SSE events if supported
if(typeof(EventSource) !== "undefined") {
var source = new EventSource("resources/php/sse.php");
source.onmessage = function(event) {
if (event.data === "updateListing") {
getDirSSE();
}
};
} else {
console.log("SSE Not Supported In Browser...");
}

0
resources/js/dragContainer.js → resources/js/dragContainerEvents.js
View File

128
resources/js/fileSystemControls.js Normal file
View File

@ -0,0 +1,128 @@
var formerFileName = "";
function showImg(imgLoc) {
var path = document.getElementById("path").innerHTML;
var imgView = document.getElementById("imgView");
var fullImage = path + imgLoc;
var toPlayerButton = "<div title=\"Open In Local Program\" class=\"popOutBttn\" onclick=\"openInLocalProg('" + fullImage + "')\">&#8765;</div>";
var popButton = "<a href=\"" + fullImage + "\" target=\"_blank\"><div class=\"popOutBttn\">&#8599;</div></a>";
var CloseBttn = "<div class=\"closeBttn\" onclick=\"closeImg()\">X</div>";
imgView.style.display = "block";
imgView.innerHTML = CloseBttn + popButton + toPlayerButton;
imgView.innerHTML += "<div id=\"imgArea\"><img class=\"imgViewImg\" src=\"" + fullImage + "\" /></div>";
dragContainer(imgView); // Set for dragging events
}
function showMedia(media) {
var path = document.getElementById("path").innerHTML;
var tempRef = media.toLowerCase();
var fullMedia = path + media;
if (tempRef.includes(".mp4") || tempRef.includes(".webm") ||
tempRef.includes(".mp3") || tempRef.includes(".ogg") ||
tempRef.includes(".pdf") || tempRef.includes(".flac")) {
var mediaView = document.getElementById("fileView");
var toPlayerButton = "<div title=\"Open In Local Program\" class=\"popOutBttn\" onclick=\"openInLocalProg('" + fullMedia + "')\">&#8765;</div>";
var popButton = "<a title=\"New Tab\" href=\"" + fullMedia + "\" target=\"_blank\"><div class=\"popOutBttn\">&#8599;</div></a>";
var CloseBttn = "<div class=\"closeBttn\" title=\"Close\" onclick=\"closeMedia()\">X</div>";
mediaView.style.display = "block";
mediaView.innerHTML = CloseBttn + popButton + toPlayerButton;
mediaView.innerHTML += "<iframe id=\"fileViewInner\" src=\"" + fullMedia + "\"></iframe>";
dragContainer(mediaView); // Set for dragging events
} else {
openInLocalProg(fullMedia);
}
}
function openInLocalProg(media) {
var xhttp = new XMLHttpRequest();
xhttp.open("POST", "resources/php/open.php", true);
xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhttp.send("media=" + media);
}
function enableEdit(obj) {
obj.style.backgroundColor = "#ffffffff";
obj.style.color = '#000000ff';
obj.readOnly = '';
formerFileName = obj.value;
}
function disableEdits(obj) {
obj.style.backgroundColor = "#ffffff00";
obj.style.color = '#ffffff';
obj.value = formerFileName;
obj.readOnly = "true";
}
function renameItem(obj) {
var path = document.getElementById("path").innerHTML;
var oldName = formerFileName;
var newName = obj.value;
var formData = "oldName=" + oldName + "&newName=" + newName + "&path=" + path;
var xhttp = new XMLHttpRequest();
console.log("Old name: " + oldName);
console.log("New name: " + newName);
xhttp.open("POST", "resources/php/rename.php", false);
xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhttp.send(formData);
getDirSSE();
}
function createDir() {
var path = document.getElementById("path").innerHTML;
var newItem = document.getElementById("NewItem").value;
var fullPth = path + newItem;
var xhttp = new XMLHttpRequest();
xhttp.open("POST", "resources/php/newFileOrDir.php", false);
xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhttp.send("item=" + fullPth + "&isDir=dir");
getDirSSE();
}
function createFile() {
var path = document.getElementById("path").innerHTML;
var newItem = document.getElementById("NewItem").value;
var fullPth = path + newItem;
var xhttp = new XMLHttpRequest();
xhttp.open("POST", "resources/php/newFileOrDir.php", false);
xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhttp.send("item=" + fullPth + "&isFile=file");
getDirSSE();
}
function startDeleteItem(item) {
// Get the item name
itemObj = item;
}
function deleteItem(item) {
var path = document.getElementById("path").innerHTML;
// Clicked yes to delete and there is an item
if (itemObj != undefined && itemObj != null) {
var fullPth = path + itemObj;
var answer = confirm("Are you sure you want to delete: " + fullPth);
if (answer == true) {
var xhttp = new XMLHttpRequest();
xhttp.open("POST", "resources/php/delete.php", false);
xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhttp.send("item=" + fullPth);
console.log("Deleted: " + fullPth);
itemObj = null;
getDirSSE();
}
}
}

46
resources/js/uiControls.js Normal file
View File

@ -0,0 +1,46 @@
function tgglServerMsgView() {
var serverMsgView = document.getElementById("toggleServerMsg");
if (serverMsgView.style.display == "none") {
serverMsgView.style.display = "block";
} else {
serverMsgView.style.display = "none";
}
}
function closeImg() {
var imgView = document.getElementById("imgView");
imgView.style.display = "none";
}
function closeMedia() {
var mediaView = document.getElementById("fileView");
mediaView.style.display = "none";
mediaView.children[3].src = "";
}
function clearDirCookie() {
var expireDate = "Thu, 01 Jan 1970 00:00:00 UTC";
document.cookie = "dirQuery=; expires=" + expireDate;
location.reload();
}
function clearDlList() {
document.getElementById("CLEARBTTN").click();
}
function onloadSetBG() { updateBG("resources/images/backgrounds/000.jpg"); }
function updateBG(bgImg) { document.getElementById("bg").src = bgImg; }
// SSE events if supported
if(typeof(EventSource) !== "undefined") {
var source = new EventSource("resources/php/sse.php");
source.onmessage = function(event) {
if (event.data === "updateListing") {
getDirSSE();
}
};
} else {
console.log("SSE Not Supported In Browser...");
}

49
resources/js/uiEvents.js Normal file
View File

@ -0,0 +1,49 @@
// ondblclick
document.onclick = function (event) {
var obj = event.target;
var callingID = obj.id;
var classNM = obj.className;
// Left click detect
if (event.which == 1) {
if (callingID == "dirID") {
var node = obj.parentNode;
getDir(node.children[1].value);
} else if (callingID == "movieID") {
var node = obj.parentNode;
showMedia(node.children[1].value);
} else if (callingID == "fileID") {
var node = obj.parentNode;
showMedia(node.children[1].value);
} else if (callingID == "imageID") {
showImg(obj.alt);
} else if (callingID == "titleID") {
enableEdit(obj);
}
// Right click detect
} else if (event.which == 3) {
if (callingID == "imageID") {
startDeleteItem(obj.alt);
} else if (callingID == "dirID" || callingID == "fileID" ||
callingID == "movieID") {
var node = obj.parentNode;
startDeleteItem(node.children[1].value);
} else if (classNM == "fileStyle" || classNM == "dirStyle" ||
classNM == "movieStyle") {
startDeleteItem(obj.children[1].value);
}
}
}
document.onkeydown = function (event) {
var obj = event.target;
var callingID = event.target.id;
var keyCodeVal = event.keyCode;
// If keycode == Enter
if (keyCodeVal == 13) {
if (callingID == "titleID") {
renameItem(obj);
}
}
}

22
resources/php/delete.php Normal file
View File

@ -0,0 +1,22 @@
<?php
function deleteItem($FILE) {
if (is_dir($FILE)){
//GLOB_MARK adds a slash to directories returned
$files = glob($FILE . '*', GLOB_MARK);
foreach ($files as $file) {
deleteItem($file);
}
rmdir($FILE);
} else if (is_file($FILE)) {
unlink($FILE);
}
}
chdir("../../");
if (isset($_POST["item"])) {
deleteItem($_POST["item"]);
}
?>

21
resources/php/newFileOrDir.php Normal file
View File

@ -0,0 +1,21 @@
<?php
function createItem($FILE, $TYPE) {
if ($TYPE == "dir"){
mkdir($FILE, 0755);
} else if ($TYPE == "file") {
$myfile = fopen($FILE, "w");
fclose($myfile);
}
}
chdir("../../");
if (isset($_POST["item"])) {
if (isset($_POST["isDir"])) {
createItem($_POST["item"], $_POST["isDir"]);
} else if (isset($_POST["isFile"])) {
createItem($_POST["item"], $_POST["isFile"]);
}
}
?>

23
resources/php/open.php
View File

@ -3,19 +3,24 @@
function openFile($FILE) { function openFile($FILE) {
include 'config.php'; include 'config.php';
if (preg_match('(mkv|wmv|mp4|webm|avi|m4v|ogv|flv)', strtolower($FILE)) === 1) { if (preg_match('(.mkv|.avi|.flv|.mov|.m4v|.mpg|.wmv|.mpeg)', strtolower($FILE)) === 1) {
shell_exec('cd ../../ && ' . $MEDIAPLAYER . ' "' . $FILE . '" &'); shell_exec($MEDIAPLAYER . " \"" . $FILE . "\" &");
} else if (preg_match('(png|jpg|jpeg|gif)', strtolower($FILE)) === 1) { } else if (preg_match('(.png|.jpg|.jpeg|.gif)', strtolower($FILE)) === 1) {
shell_exec('cd ../../ && ' . $IMGVIEWER . ' "' . $FILE . '" &'); shell_exec($IMGVIEWER . ' "' . $FILE . '" &');
} else if (preg_match('(psf|mp3|ogg|flac)', strtolower($FILE)) === 1) { } else if (preg_match('(.psf|.mp3|.ogg|.flac)', strtolower($FILE)) === 1) {
shell_exec('cd ../../ && ' . $MUSICPLAYER . ' "' . $FILE . '" &'); shell_exec($MUSICPLAYER . ' "' . $FILE . '" &');
} else if (preg_match('(pdf)', strtolower($FILE)) === 1) { } else if (preg_match('(.txt)', strtolower($FILE)) === 1) {
shell_exec('cd ../../ && ' . $PDFVIEWER . ' "' . $FILE . '" &'); shell_exec($TEXTVIEWER . ' "' . $FILE . '" &');
} else if (preg_match('(.pdf)', strtolower($FILE)) === 1) {
shell_exec($PDFVIEWER . ' "' . $FILE . '" &');
// Has to be below b/c pdf somehow regesters and an office app.... wtf....
} else if (preg_match('(.odt|.doc|.docx|.rtf)', strtolower($FILE)) === 1) {
shell_exec($OFFICEPROG . ' "' . $FILE . '" &');
} }
} }
chdir("../../");
if (isset($_POST["media"])) { if (isset($_POST["media"])) {
openFile($_POST["media"]); openFile($_POST["media"]);
} }

18
resources/php/process.php
View File

@ -1,40 +1,35 @@
<?php <?php
// Retrieve data // Retrieve data
function dirListing($PATH) { function dirListing($PATH) {
$CLEANPATH = $PATH;
$PATH = "../../" . $PATH;
$GeneratedXML = "<?xml version=\"1.0\" encoding=\"UTF-8\"?><DIR_LIST>" $GeneratedXML = "<?xml version=\"1.0\" encoding=\"UTF-8\"?><DIR_LIST>"
. "<PATH_HEAD>" . $CLEANPATH . "</PATH_HEAD>"; . "<PATH_HEAD>" . $PATH . "</PATH_HEAD>";
$dirContents = scandir($PATH); $dirContents = scandir($PATH);
foreach ($dirContents as $fileName) { foreach ($dirContents as $fileName) {
$fullPath = $CLEANPATH . $fileName; $fullPath = $PATH . $fileName;
if (is_dir($PATH . $fileName)) { if (is_dir($PATH . $fileName)) {
$GeneratedXML .= "<DIR>" . $fileName . "/</DIR>"; $GeneratedXML .= "<DIR>" . $fileName . "/</DIR>";
} elseif (preg_match('/^.*\.(mkv|avi|flv|mov|m4v|mpg|wmv|mpeg|mp4|webm)$/i', strtolower($fileName))) { } elseif (preg_match('/^.*\.(mkv|avi|flv|mov|m4v|mpg|wmv|mpeg|mp4|webm)$/i', strtolower($fileName))) {
$NAMEHASH = hash('sha256', $fileName); $NAMEHASH = hash('sha256', $fileName);
if (!file_exists('../images/thumbnails/' . $NAMEHASH . '.jpg')) { if (!file_exists('resources/images/thumbnails/' . $NAMEHASH . '.jpg')) {
shell_exec('../ffmpegthumbnailer -t 65% -s 320 -c jpg -i "' shell_exec('resources/ffmpegthumbnailer -t 65% -s 320 -c jpg -i "'
. $PATH . $fileName . '" -o ../images/thumbnails/' . $fullPath . '" -o resources/images/thumbnails/'
. $NAMEHASH . '.jpg'); . $NAMEHASH . '.jpg');
} }
$GeneratedXML .= $GeneratedXML .=
"<VID_FILE>" "<VID_FILE>"
. "<VID_IMG>/resources/images/thumbnails/" . $NAMEHASH . ".jpg</VID_IMG>" . "<VID_IMG>/resources/images/thumbnails/" . $NAMEHASH . ".jpg</VID_IMG>"
. "<VID_PTH>" . $fullPath . "</VID_PTH>"
. "<VID_NAME>" . $fileName . "</VID_NAME>" . . "<VID_NAME>" . $fileName . "</VID_NAME>" .
"</VID_FILE>"; "</VID_FILE>";
} elseif (preg_match('/^.*\.(png|jpg|gif|jpeg)$/i', strtolower($fileName))) { } elseif (preg_match('/^.*\.(png|jpg|gif|jpeg)$/i', strtolower($fileName))) {
$GeneratedXML .= $GeneratedXML .=
"<IMG_FILE>" "<IMG_FILE>"
. "<IMAGE_LINK>". $fullPath . "</IMAGE_LINK>"
. "<IMAGE_NAME>" . $fileName . "</IMAGE_NAME>" . "<IMAGE_NAME>" . $fileName . "</IMAGE_NAME>"
. "</IMG_FILE>"; . "</IMG_FILE>";
} else { } else {
$GeneratedXML .= $GeneratedXML .=
"<FILE>" "<FILE>"
. "<FILE_PATH>" . $fullPath . "</FILE_PATH>"
. "<FILE_NAME>" . $fileName . "</FILE_NAME>" . "<FILE_NAME>" . $fileName . "</FILE_NAME>"
. "</FILE>"; . "</FILE>";
} }
@ -44,10 +39,11 @@ function dirListing($PATH) {
} }
// Determin action // Determin action
chdir("../../");
if (isset($_POST['dirQuery'])) { if (isset($_POST['dirQuery'])) {
dirListing(trim($_POST['dirQuery'])); dirListing(trim($_POST['dirQuery']));
} else { } else {
echo "<h2 class='errorStyling'>Error! Illegal Access Method!</h2>"; echo "<h2 class='error'>Error! Illegal Access Method!</h2>";
} }
?> ?>

12
resources/php/rename.php Normal file
View File

@ -0,0 +1,12 @@
<?php
function renameItem($OLDFILE, $NEWNAME, $PATH) {
rename($PATH . $OLDFILE, $PATH . $NEWNAME);
}
chdir("../../");
if (isset($_POST["oldName"]) && isset($_POST["newName"]) && isset($_POST["path"])) {
renameItem($_POST["oldName"], $_POST["newName"], $_POST["path"]);
}
?>

9
resources/php/sse.php
View File

@ -1,13 +1,10 @@
<?php <?php
// Prompt an update clint side when sse checks that there is updateListing. // Prompt an update clint side when sse checks that there is updateListing.
$myfile = fopen("../vars.txt", "wa+"); $myfile = fopen("../vars.txt", "r");
$state = fgets($myfile); $state = fgets($myfile);
fclose($myfile);
if ($state == "updateListing") { $myfile = fopen("../vars.txt", "w");
$txt = "Null";
fwrite($myfile, $txt);
}
fclose($myfile); fclose($myfile);
header('Content-Type: text/event-stream'); header('Content-Type: text/event-stream');

5
resources/php/upload.php
View File

@ -13,7 +13,7 @@ function uploadFiles($targetDir) {
$fileTmpName = $_FILES['filesToUpload']['tmp_name'][$i]; $fileTmpName = $_FILES['filesToUpload']['tmp_name'][$i];
// Check if file already exists // Check if file already exists
$targetFile = "../../" . $targetDir . $fileName; $targetFile = $targetDir . $fileName;
if (file_exists($targetFile)) { if (file_exists($targetFile)) {
unlink($targetFile); unlink($targetFile);
echo "<span class='warnning'>Server: [Warnning] --> This file already exists. Overwriting it.</span>"; echo "<span class='warnning'>Server: [Warnning] --> This file already exists. Overwriting it.</span>";
@ -55,13 +55,14 @@ function uploadFiles($targetDir) {
echo "</body></html>"; echo "</body></html>";
// Prompt an update clint side when sse checks that there is updateListing. // Prompt an update clint side when sse checks that there is updateListing.
$myfile = fopen("../vars.txt", "wa+"); $myfile = fopen("../vars.txt", "w+");
$txt = "updateListing"; $txt = "updateListing";
fwrite($myfile, $txt); fwrite($myfile, $txt);
fclose($myfile); fclose($myfile);
} }
// Check access type. // Check access type.
chdir("../../");
if(isset($_POST["UploadFiles"])) { if(isset($_POST["UploadFiles"])) {
uploadFiles($_POST["DIRPATHUL"]); uploadFiles($_POST["DIRPATHUL"]);
} else { } else {