[master] Fixes

UPDATELOG.md

@@ -1,3 +1,10 @@
+8.2.2
+- Added Error Handling to the contextMenu
+- No longer relying on CDNs
+- Fixed IP route
+- Separated css files and separated EJS files
+- There is no longer an error when canceling creation of a file
+
 8.2.1
 - Reworked the routes
 

handlers/ip/controller/controller.js

@@ -4,7 +4,7 @@
 const { Server }	= require( 'event_request' );
 const IpLookup		= require( '../../main/ip_address_lookup' );
 
-const router		= Server().Router();
+const app			= Server();
 
 /**
  * @brief	Adds a '/ip' route with method GET
@@ -14,12 +14,10 @@ const router		= Server().Router();
  *
  * @return	void
  */
-router.get( '/ip', async( event ) => {
+app.get( '/ip', async( event ) => {
 		const ipInterfaces	= IpLookup.getLocalIpV4s();
 		const externalIP	= await IpLookup.getExternalIpv4().catch( event.next );
 
 		event.render( 'ip', { ipInterfaces, externalIP } );
 	}
 );
-
-module.exports	= router;

package.json

@@ -1,6 +1,6 @@
 {
   "name": "server-emulator",
-  "version": "8.2.1",
+  "version": "8.2.2",
   "description": "Server emulator used to easily emulate the FS in a browser and allow streaming,downloading,deletion, etc.",
   "main": "index.js",
   "scripts": {

public/css/browse.css

@@ -0,0 +1,158 @@
+.folder
+{
+	text-decoration: none;
+	color: deepskyblue;
+	cursor: pointer;
+}
+
+.add-folder
+{
+	border: 1px dashed rgba(0,0,0,.125) !important;
+}
+
+.file-size
+{
+	margin-left: 5px;
+}
+
+.file
+{
+	text-decoration: none;
+	color: deepskyblue;
+	cursor: pointer;
+}
+
+.folder-name
+{
+	font-size: 20px !important;
+	text-align: center;
+	white-space: nowrap;
+	color: gray;
+}
+
+.folder-icon
+{
+	color:darkgray;
+	text-align: center;
+	font-size: 20px !important;
+	margin-right: 5px;
+}
+
+.file-name-hr
+{
+	margin-bottom: 0;
+	margin-top: 3px;
+	border-top: 1px dashed lightgray;
+}
+
+.file-name-icon
+{
+	color: indianred;
+}
+
+.item
+{
+	user-select:none;
+}
+
+.item-row
+{
+	border-radius: 10px;
+	border: 1px solid rgba(0,0,0,.125);
+}
+
+.no-preview
+{
+	color: black;
+	text-decoration: none;
+	cursor: default;
+	text-underline: none;
+	text-underline-color: black;
+}
+
+.has-preview
+{
+	color: deepskyblue;
+}
+
+.no-preview:hover
+{
+	color: black;
+}
+
+.card-body
+{
+	text-align: center;
+}
+
+.file-name
+{
+	margin-left: 10px;
+	text-decoration: none;
+}
+
+.face-button {
+	margin: auto;
+	margin-top: 20px;
+	width: 120px;
+	border-radius: 25px;
+	height: 40px;
+	display: block;
+	border: 1.5px dashed deepskyblue;
+	font-family: 'Roboto', sans-serif;
+	font-size: 15px;
+	font-weight: 500;
+	text-align: center;
+	text-decoration: none;
+	color: white;
+	overflow: hidden;
+}
+.face-button .face-primary, .face-button .face-secondary {
+	display: block;
+	line-height: 40px;
+	color: deepskyblue;
+	transition: margin 0.4s;
+}
+.face-button .face-primary {
+	background-color: white;
+	color: deepskyblue ;
+}
+.face-button:hover .face-primary {
+	margin-top: -40px;
+}
+
+.file-delete.face-button {
+	margin: auto;
+	margin-top: 20px;
+	width: 120px;
+	border-radius: 25px;
+	height: 40px;
+	display: block;
+	border: 1.5px dashed indianred;
+	font-family: 'Roboto', sans-serif;
+	font-size: 15px;
+	font-weight: 500;
+	text-align: center;
+	text-decoration: none;
+	overflow: hidden;
+}
+.file-delete.face-button .face-primary, .file-delete.face-button .face-secondary {
+	display: block;
+	line-height: 40px;
+	color: indianred;
+	transition: margin 0.4s;
+}
+.file-delete.face-button .file-delete.face-primary {
+	background-color: white;
+	color: indianred;
+}
+.file-delete.face-button:hover .face-primary {
+	margin-top: -40px;
+}
+
+.deleteButton {
+	float: right;
+	color: indianred;
+	display: inline-block;
+	font-size: 20px;
+}

public/css/contextmenu.css

@@ -0,0 +1,62 @@
+.contextmenu {
+	display: none;
+	position: absolute;
+	width: 200px;
+	margin: 0;
+	padding: 0;
+	background: whitesmoke;
+	border-radius: 5px;
+	list-style: none;
+	box-shadow:
+			0 15px 35px rgba(50,50,90,0.1),
+			0 5px 15px rgba(0,0,0,0.07);
+	overflow: hidden;
+	z-index: 999999;
+}
+
+.contextmenu li {
+	border-left: 3px solid transparent;
+	transition: ease .2s;
+}
+
+.contextmenu li a {
+	display: block;
+	padding: 10px;
+	color: black;
+	text-decoration: none;
+	transition: ease .2s;
+}
+
+.contextmenu li #context-copy:hover {
+	background: green;
+	border-left: 3px solid lawngreen;
+}
+
+.contextmenu li #context-cut:hover {
+	background: green;
+	border-left: 3px solid lawngreen;
+}
+
+.contextmenu li #context-download:hover {
+	background: deepskyblue;
+	border-left: 3px solid cornflowerblue;
+}
+
+.contextmenu li #context-delete:hover {
+	background: indianred;
+	border-left: 3px solid #FF8377;
+}
+
+.contextmenu li #context-paste:hover {
+	background: green;
+	border-left: 3px solid lawngreen;
+}
+
+.contextmenu li #context-rename:hover {
+	background: violet;
+	border-left: 3px solid darkorchid;
+}
+
+.contextmenu li:hover a {
+	color: #FFFFFF;
+}

public/css/folder-upload.css

@@ -0,0 +1,32 @@
+
+.inputfile {
+	width: 0.1px;
+	height: 0.1px;
+	opacity: 0;
+	overflow: hidden;
+	position: absolute;
+	z-index: -1;
+}
+.inputfile + label {
+	border-radius: 10px;
+	font-size: 1.25em;
+	font-weight: 700;
+	color: white;
+	padding: 10px;
+	background-color: slategrey;
+	display: inline-block;
+}
+
+.inputfile:focus + label,
+.inputfile + label:hover {
+	background-color: indianred;
+}
+
+.inputfile + label {
+	cursor: pointer; /* "hand" cursor */
+}
+
+.inputfile:focus + label {
+	outline: 1px dotted #000;
+	outline: -webkit-focus-ring-color auto 5px;
+}