diff --git a/index.js b/index.js
new file mode 100644
index 0000000..79e3db6
--- /dev/null
+++ b/index.js
@@ -0,0 +1,50 @@
+const http = require('http');
+const url = require('url');
+const fs = require('fs');
+const ws = require('ws');
+
+http.createServer(function (req, res) {
+ const q = url.parse(req.url, true);
+ let filename = "./public" + q.pathname;
+ if (filename === "./public/") filename = "./public/index.html";
+ fs.readFile(filename, function(err, data) {
+ if (err) {
+ res.writeHead(404, {'Content-Type': 'text/html'});
+ return res.end("404 Not Found");
+ }
+ res.writeHead(200, {'Content-Type': 'text/html'});
+ res.write(data);
+ return res.end();
+ });
+}).listen(8080);
+
+const wss = new ws.Server({
+ port: 8081,
+ perMessageDeflate: {
+ zlibDeflateOptions: {
+ // See zlib defaults.
+ chunkSize: 1024,
+ memLevel: 7,
+ level: 3
+ },
+ zlibInflateOptions: {
+ chunkSize: 10 * 1024
+ },
+ // Other options settable:
+ clientNoContextTakeover: true, // Defaults to negotiated value.
+ serverNoContextTakeover: true, // Defaults to negotiated value.
+ serverMaxWindowBits: 10, // Defaults to negotiated value.
+ // Below options specified as default values.
+ concurrencyLimit: 10, // Limits zlib concurrency for perf.
+ threshold: 1024 // Size (in bytes) below which messages
+ // should not be compressed.
+ }
+});
+
+wss.on('connection', ws => {
+ ws.on('message', message => {
+ console.log(`Received message => ${message}`)
+ if ({message} == 'long_url ') ws.send('error: url is empty')
+ })
+ ws.send('websocket connected')
+})
diff --git a/public/index.html b/public/index.html
new file mode 100644
index 0000000..f53bc7a
--- /dev/null
+++ b/public/index.html
@@ -0,0 +1,50 @@
+
+
+ short URL
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/public/sym/dark.css b/public/sym/dark.css
new file mode 100644
index 0000000..d59d4b5
--- /dev/null
+++ b/public/sym/dark.css
@@ -0,0 +1,348 @@
+html{
+ width: 100%;
+ height: 100%;
+ margin: 0px;
+ background-color: #14181b;
+}
+body{
+ position: relative;
+ width: 100%;
+ padding-top: 20px;
+ padding-bottom: 130px;
+ min-height: calc(100% - 150px);
+ max-width: 1000px;
+ min-width: 500px;
+ margin: auto;
+ background-color: #1f262b;
+}
+#stream{
+ position: relative;
+ top: 50px;
+ left: 0px;
+ margin: auto;
+ width: calc(100% - 50px);
+ height: auto;
+ max-width: 700px;
+ background-color: #ffffff;
+ border-radius: 10px;
+}
+#left-control{
+ position: absolute;
+ bottom: 70px;
+ left: calc(25% - 75px);
+ width: 150px;
+ height: 150px;
+ background-color: #ffffff;
+ border-radius: 75px;
+ box-shadow: 2px 2px 3px #14181b;
+}
+#right-control{
+ position: absolute;
+ bottom: 70px;
+ right: calc(25% - 75px);
+ width: 150px;
+ height: 150px;
+ background-color: #ffffff;
+ border-radius: 10px;
+ box-shadow: 2px 2px 3px #14181b;
+}
+div.control-buttons{
+ position: absolute;
+ width: 50px;
+ height: 50px;
+ background-color: #000000;
+ border-radius: 25px;
+ box-shadow: 1px 1px 3px #14181b;
+ cursor: pointer;
+}
+#left-control-up{
+ top: 10px;
+ left: 50px;
+}
+#left-control-down{
+ bottom: 10px;
+ left: 50px;
+}
+#left-control-left{
+ top: 50px;
+ left: 10px;
+}
+#left-control-right{
+ top: 50px;
+ right: 10px;
+}
+
+#left-control-rotate-l{
+ top: -10px;
+ left: -10px;
+}
+#left-control-rotate-r{
+ top: -10px;
+ right: -10px;
+}
+
+#right-control-up{
+ top: 10px;
+ left: 50px;
+}
+#right-control-down{
+ bottom: 10px;
+ left: 50px;
+}
+#right-control-left{
+ top: 50px;
+ left: 10px;
+}
+#right-control-right{
+ top: 50px;
+ right: 10px;
+}
+
+#right-control-forward{
+ top: 10px;
+ right: -60px;
+ border: 2px solid #fff;
+}
+#right-control-backward{
+ bottom: 10px;
+ right: -60px;
+ border: 2px solid #fff;
+}
+
+div.login {
+ position: absolute;
+ left: calc(50% - 200px);
+ top: calc(50% - 125px);
+ margin-left: 0px;
+ margin-top: 0px;
+ width: 400px;
+ height: 250px;
+ background-color: #14181b00;
+ border-radius: 8px;
+ border: 0px solid #fff;
+}
+div.inputbox {
+ position: relative;
+ left: 0px;
+ top: 0px;
+ margin-left: 0px;
+ margin-top: 20px;
+ width: 100%;
+ height: 40px;
+ background-color: #14181b;
+ border-radius: 8px;
+ border: 1px solid #fff;
+}
+.input {
+ position: absolute;
+ left: 25px;
+ top: 50%;
+ margin-left: -0px;
+ margin-top: -15px;
+ width: calc(100% - 50px);
+ height: 30px;
+ text-align: center;
+ color:#fff;
+ font-size: 15pt;
+ font-family:Arial, "lucida console", sans-serif;
+ border: 0px solid #fff;
+ background-color: transparent;
+ outline: 0 none;
+}
+input[id="name-input"]::-webkit-input-placeholder {
+ color: #ffffff;
+}
+#short-btn {
+ position: absolute;
+ width: 150px;
+ margin-left: calc(50% - 75px);
+ margin-top: 20px;
+}
+#bottom-link-btn {
+ position: fixed;
+ width: 150px;
+ left: calc(50% - 75px);
+ bottom: 20px;
+}
+#logout-link-btn {
+ position: fixed;
+ width: 100px;
+ right: 10px;
+ top: 10px;
+}
+.btn-blue{
+ cursor: pointer;
+ height: 40px;
+ background-color: #00BCD4;
+ box-shadow: 3px 3px 10px #333;
+ border-radius: 20px;
+}
+.btn-green{
+ cursor: pointer;
+ height: 40px;
+ background-color: #009688;
+ box-shadow: 3px 3px 10px #333;
+ border-radius: 20px;
+}
+.btn-text {
+ position: absolute;
+ top: 50%;
+ left: 50%;
+ transform: translate(-50%, -50%);
+ font-size: 15pt;
+ color:#fff;
+ font-family:Arial, "lucida console", sans-serif;
+}
+.sym_btn-red{
+ cursor: pointer;
+ height: 40px;
+ width: 40px;
+ background-color: #E53935;
+ border-radius: 20px;
+ box-shadow: 3px 3px 10px #333;
+ float: left;
+}
+.sym_btn-blue{
+ cursor: pointer;
+ height: 40px;
+ width: 40px;
+ background-color: #1E88E5;
+ border-radius: 20px;
+ box-shadow: 3px 3px 10px #333;
+ float: left;
+}
+.sym_btn-invisible{
+ cursor: pointer;
+ height: 40px;
+ width: 40px;
+ background-color: #fff0;
+ border-radius: 20px;
+ float: left;
+}
+img.icon {
+ margin-top: 8px;
+ margin-left: 8px;
+}
+.title {
+ text-align: center;
+ width: 100%;
+ color:#fff;
+ font-size: 30pt;
+ font-family:"Roboto", bold, sans-serif;
+}
+.title2 {
+ margin-top: 50px;
+ text-align: center;
+ width: 100%;
+ color:#fff;
+ font-size: 20pt;
+ font-family:"Roboto", bold, sans-serif;
+}
+#login-title {
+ position: absolute;
+ top: 0px;
+ margin-bottom: 30px;
+}
+.box-dark{
+ position: relative;
+ margin: auto;
+ width: calc(100% - 50px);
+ max-width: 600px;
+ background-color: #1f262b;
+ box-shadow: 3px 3px 10px #333;
+ border: 2px solid #fff;
+ border-radius: 10px;
+ color: #fff;
+ font-size: 15pt;
+ font-family:"Roboto", regular, sans-serif;
+}
+#user-line{
+ position: relative;
+ margin: auto;
+ width: calc(100% - 0px);
+ height: 50px;
+ max-width: 600px;
+ background-color: #1f262b;
+ border: 1px solid #fff;
+ border-radius: 10px;
+}
+#new_user-btn{
+ position: relative;
+ margin-top: 30px;
+ width: 250px;
+}
+#create_user-btn{
+ position: relative;
+ top: 50px;
+ width: 250px;
+}
+table{
+ position: relative;
+ margin: auto;
+ width: calc(100% - 50px);
+ max-width: 600px;
+ background-color: #1f262b;
+ box-shadow: 3px 3px 10px #333;
+ border: 2px solid #fff;
+ border-collapse: separate;
+ border-spacing: 2px;
+ border-radius: 10px;
+ color: #fff;
+ font-size: 15pt;
+ font-family:"Roboto", regular, sans-serif;
+}
+tr{
+ margin: auto;
+ border: 1px solid #fff;
+}
+th{
+ margin: auto;
+ border: 0px solid #aaa;
+ background-color: #546E7A;
+ padding: 20px;
+ border-radius: 8px;
+}
+td{
+ margin: auto;
+ border: 0px solid #aaa;
+ background-color: #37474F ;
+ padding: 10px;
+ border-radius: 8px;
+}
+td.left,th.left{
+ border-radius: 8px 0px 0px 8px;
+}
+td.right,th.right{
+ border-radius: 0px 8px 8px 0px;
+}
+td.mid,th.mid{
+ border-radius: 0px 0px 0px 0px;
+}
+#new-user-box{
+ position: fixed;
+ width: 400px;
+ height: 300px;
+ left: calc(50% - 200px);
+ top: calc(50% - 150px);
+ display: none;
+}
+#change-user-box{
+ position: fixed;
+ width: 400px;
+ height: 300px;
+ left: calc(50% - 200px);
+ top: calc(50% - 150px);
+ display: none;
+}
+.error{
+ position: absolute;
+ bottom: 10px;
+ left: 10px;
+ height: 150px;
+ width: 250px;
+ background-color: #E53935;
+ border-radius: 15px;
+}
+#error-box{
+ display: none;
+}
\ No newline at end of file
diff --git a/public/sym/ic_close_white_24px.svg b/public/sym/ic_close_white_24px.svg
new file mode 100644
index 0000000..e22ffd5
--- /dev/null
+++ b/public/sym/ic_close_white_24px.svg
@@ -0,0 +1,4 @@
+
\ No newline at end of file
diff --git a/public/sym/script.js b/public/sym/script.js
new file mode 100644
index 0000000..445706e
--- /dev/null
+++ b/public/sym/script.js
@@ -0,0 +1,32 @@
+function selected(id){
+ var element = document.getElementById(id);
+ element.style.boxShadow = '1px 1px 2px #999';
+ element.style.backgroundColor = "#ffffff";
+
+ var element = document.getElementById(id+'-input');
+ element.style.color = "#000000";
+}
+function deselected(id){
+ var element = document.getElementById(id);
+ element.style.boxShadow = '0px 0px 0px #999';
+ element.style.backgroundColor = "#14181b";
+
+ var element = document.getElementById(id+'-input');
+ element.style.color = "#ffffff";
+}
+
+function visible(id, status){
+ if(status == "on"){
+ document.getElementById(id).style.display = 'block';
+ }
+ else{
+ document.getElementById(id).style.display = 'none';
+ }
+}
+
+function session_end() {
+ if (confirm("Session timed out! Please login.")) {
+ window.location.replace('https://adb.sh/robo-remote/login.php');
+ } else {
+ }
+}