diff --git a/app.js b/app.js index 62dff0d03aeddb3cfc3e10ded315193fcf00f4c4..d2e41262b595200bb1ef7142ee614d7a4d83a2fa 100644 --- a/app.js +++ b/app.js @@ -38,4 +38,6 @@ app.use(function(err, req, res, next) { res.render('error'); }); + + module.exports = app; diff --git a/routes/index.js b/routes/index.js index bf01d5fd421e9de27144b8f2eb69a03ce27a66d7..12a51a70398742f6b5fd4dbc2f9ae0575b4cd564 100644 --- a/routes/index.js +++ b/routes/index.js @@ -1,19 +1,37 @@ var express = require('express'); var router = express.Router(); +var app = express(); var shell = require("shelljs"); + +var path = require("path"); + /* GET home page. */ + + +app.use(express.static('bin')) + router.get('/', function(req, res, next) { res.render('index', { title: 'Describo' }); }); + router.get('/files', function(req, res, next) { files = [] - for (let f of shell.ls(".")) { - files.push({"filename": f}) - + dirs = [] + + var dir_path = req.query.path; + var up_path = path.resolve(dir_path + "/.."); + for (let f of shell.ls(dir_path)) { + console.log(f) + var absolutePath = path.resolve(path.join(dir_path, f)); + if (shell.test('-d', absolutePath)) { + dirs.push({"absolute": absolutePath, "name": f}) + } else { + files.push({"filename": f, "name": f, "@id": absolutePath}) + } } - res.json(files) + res.json({"files": files, "dirs" : dirs, "up": up_path}) }); module.exports = router; diff --git a/views/index.ejs b/views/index.ejs index e70d07d5a23a13a9e4f66ee6bbdfaf40fba531f3..a21420b8f6d995e78e63a2d4cb076585f1b1f57a 100644 --- a/views/index.ejs +++ b/views/index.ejs @@ -7,19 +7,51 @@ </head> <body> <h1><%= title %></h1> - <p>Welcome to <%= title %></p> <div id="files"></div> <script src="https://unpkg.com/axios/dist/axios.min.js"></script> <!-- Vue app element --> - <div id="app"> - <table id="filelist" border="1"> - <tr v-for="file in files"> - <td>{{ file.filename }}</td> - <td><input v-model="file.description" type="text" size="45"/>describe = {{ file.description }}</td> - </tr> - </table> + <div id="app"> + <h1><a v-bind:href="'?path=' + files.up">.. </a>(Get me outa here!)</h1> + + <div id="filelist" border="1"> + <div v-for="file in files.files"> + <h1>{{ file.filename }}</h1> + + <table> + <tr> + <th>Name:</th> + <td><input v-model="file.name" type="text" size="45"/></td> + </tr> + <tr> + <th>Description:</th> + <td><input v-model="file.description" type="text" size="45"/></td> + </tr> + </table> + {{ file }} + </div> + </div> + + <div id="filelist" border="1"> + <ul v-for="dir in files.dirs"> + <li><a v-bind:href="'?path=' + dir.absolute">{{ dir.name }}</a></li> + </ul> + </div> + + <main> + <form @submit.prevent="submit"> + <input type="text" v-model="name"> + <button type="submit"> + Submit From Vue Property + </button> + </form> + </main> + + + </div> + + <!-- end Vue app element --> @@ -28,9 +60,29 @@ +new Vue({ + el : 'main', + data : { + name : '' + }, + methods : { + submit(){ + alert("HEre"); + axios.post('/your-url', {name: this.name}) + .then(res => { + // do something with res + }) + .catch(err => {}); + } + } +}); + + var files = []; document.addEventListener("DOMContentLoaded", function(event) { - axios.get('/files') + const urlParams = new URLSearchParams(window.location.search); + const path = urlParams.get('path'); + axios.get('/files?path=' + path) .then(function (response) { // handle success console.log(response); @@ -49,6 +101,7 @@ console.log(error); }) .then(function () { + console.log("done") // always executed }); });