| this.end(JSON.stringify(obj)); | this.end(JSON.stringify(obj)); | ||||
| }, | }, | ||||
| err404: function() { | |||||
| this.setStatus(404); | |||||
| this.end(this.view("404")); | |||||
| }, | |||||
| template: function(name, args) { | template: function(name, args) { | ||||
| var str = this.templates[name]; | var str = this.templates[name]; | ||||
| if (!str) | if (!str) | ||||
| if (!str) | if (!str) | ||||
| throw new Error("No such view: "+name); | throw new Error("No such view: "+name); | ||||
| if (name === "404") | |||||
| this.setStatus(404); | |||||
| return templatify(str, args, this, {view: name}); | return templatify(str, args, this, {view: name}); | ||||
| }, | }, | ||||
| var vals = { | var vals = { | ||||
| env: "[^\\s}]+#[^\\s}]+", | env: "[^\\s}]+#[^\\s}]+", | ||||
| string: "\"[^\"}]+\"" | |||||
| string: "'[^'}]*'" | |||||
| } | } | ||||
| //Get regex for all values | //Get regex for all values |
| <div class="collection"> | <div class="collection"> | ||||
| <span class="date-created">{{arg#date_created}}</span> | <span class="date-created">{{arg#date_created}}</span> | ||||
| <a class="name" href="/view?{{arg#id}}">{{arg#name}}</a> | <a class="name" href="/view?{{arg#id}}">{{arg#name}}</a> | ||||
| {{arg#own_profile ? '<button class="delete btn btn-default">X</button>' : ''}} | |||||
| </div> | </div> |
| <div class="image"> | |||||
| <div class="image small-width bordered"> | |||||
| <div class="title">{{arg#title}}</div> | <div class="title">{{arg#title}}</div> | ||||
| <a href="/i?{{arg#id}}.{{arg#extension}}"> | <a href="/i?{{arg#id}}.{{arg#extension}}"> | ||||
| <img class="img-rounded" src="/i?{{arg#id}}.{{arg#extension}}"> | <img class="img-rounded" src="/i?{{arg#id}}.{{arg#extension}}"> |
| <button class="btn btn-default" onclick="$('#uploader-input').click()" id="uploader-select-files"> | <button class="btn btn-default" onclick="$('#uploader-input').click()" id="uploader-select-files"> | ||||
| Select Files | Select Files | ||||
| </button> | </button> | ||||
| <input type="text" id="uploader-collection-name" placeholder="Collection"> | |||||
| <input type="text" id="uploader-collection-name" placeholder="Collection Name"> | |||||
| <button class="btn btn-default" id="uploader-upload" disabled> | <button class="btn btn-default" id="uploader-upload" disabled> | ||||
| Upload | Upload | ||||
| </button> | </button> |
| <div id="profile" class="container small-width-container"> | <div id="profile" class="container small-width-container"> | ||||
| <div class="title">{{arg#username}}</div> | <div class="title">{{arg#username}}</div> | ||||
| <div id="collections" class="container small-width"> | |||||
| <div id="collections" class="container small-width bordered"> | |||||
| {{noescape#collections}} | {{noescape#collections}} | ||||
| </div> | </div> | ||||
| </div> | </div> |
| {{template#body}} | {{template#body}} | ||||
| <div id="register" class="container small-width-container"> | <div id="register" class="container small-width-container"> | ||||
| <form id="register-form" class="container small-width"> | |||||
| <form id="register-form" class="container small-width bordered"> | |||||
| <div class="form-group"> | <div class="form-group"> | ||||
| <label>Username<br> | <label>Username<br> | ||||
| <input type="text" id="register-username"> | <input type="text" id="register-username"> |
| <div id="settings" class="container small-width-container"> | <div id="settings" class="container small-width-container"> | ||||
| <div class="title" href="/profile?{{session#userId}}">{{session#username}}</div> | <div class="title" href="/profile?{{session#userId}}">{{session#username}}</div> | ||||
| <form id="collections-form" class="container small-width"> | |||||
| <form id="collections-form" class="container small-width bordered"> | |||||
| <div class="title">My Collections</div> | <div class="title">My Collections</div> | ||||
| <div class="submit-container"> | <div class="submit-container"> | ||||
| <a class="btn btn-default" href="/profile?{{session#userId}}">My Collections</a> | <a class="btn btn-default" href="/profile?{{session#userId}}">My Collections</a> | ||||
| </div> | </div> | ||||
| </form> | </form> | ||||
| <form id="password-form" class="container small-width"> | |||||
| <form id="password-form" class="container small-width bordered"> | |||||
| <div class="title">Change Password</div> | <div class="title">Change Password</div> | ||||
| <div class="form-group"> | <div class="form-group"> | ||||
| <label>Old Password<br> | <label>Old Password<br> | ||||
| </div> | </div> | ||||
| </form> | </form> | ||||
| <form id="logout-form" class="container small-width"> | |||||
| <form id="logout-form" class="container small-width bordered"> | |||||
| <div class="title">Log Out</div> | <div class="title">Log Out</div> | ||||
| <div class="submit-container"> | <div class="submit-container"> | ||||
| <button type="submit" class="btn btn-default">Log Out</button> | <button type="submit" class="btn btn-default">Log Out</button> |
| <body> | <body> | ||||
| {{template#body}} | {{template#body}} | ||||
| <div id="viewer" class="container"> | |||||
| <div id="viewer" class="container small-width-container"> | |||||
| {{noescape#images}} | {{noescape#images}} | ||||
| </div> | </div> | ||||
| </body> | </body> |
| module.exports = function(ctx) { | module.exports = function(ctx) { | ||||
| ctx.end(ctx.view("404")); | |||||
| ctx.err404(); | |||||
| } | } |
| } else if (favicon) { | } else if (favicon) { | ||||
| ctx.res.end(favicon); | ctx.res.end(favicon); | ||||
| } else { | } else { | ||||
| ctx.res.writeHead(404); | |||||
| ctx.end(ctx.view("404")); | |||||
| ctx.err404(); | |||||
| } | } | ||||
| } | } |
| form label { | form label { | ||||
| width: 100%; | width: 100%; | ||||
| } | } | ||||
| form.container { | |||||
| .bordered { | |||||
| border: 1px solid #CCC; | border: 1px solid #CCC; | ||||
| border-radius: 4px; | border-radius: 4px; | ||||
| padding: 10px !important; | padding: 10px !important; | ||||
| margin-bottom: 10px; | |||||
| } | } | ||||
| .title { | .title { | ||||
| .small-width { | .small-width { | ||||
| width: auto !important; | width: auto !important; | ||||
| text-align: left !important; | text-align: left !important; | ||||
| max-width: 400px !important; | |||||
| max-width: 540px !important; | |||||
| width: 90% !important; | width: 90% !important; | ||||
| margin-left: auto; | |||||
| margin-right: auto; | |||||
| } | } | ||||
| #notify-box { | #notify-box { |
| module.exports = function(ctx) { | module.exports = function(ctx) { | ||||
| var id = ctx.query.replace(/\..*/, ""); | var id = ctx.query.replace(/\..*/, ""); | ||||
| if (!id) | if (!id) | ||||
| return ctx.end(ctx.view("404")); | |||||
| return ctx.err404(); | |||||
| ctx.res.setHeader( | ctx.res.setHeader( | ||||
| "Cache-Control", | "Cache-Control", | ||||
| readStream.on("error", function(err){ | readStream.on("error", function(err){ | ||||
| if (err.code === "ENOENT") | if (err.code === "ENOENT") | ||||
| ctx.end(ctx.view("404")); | |||||
| ctx.err404(); | |||||
| else | else | ||||
| ctx.end(err.toString()); | ctx.end(err.toString()); | ||||
| }); | }); |
| module.exports = function(ctx) { | module.exports = function(ctx) { | ||||
| var id = ctx.query; | |||||
| var id = parseInt(ctx.query); | |||||
| if (isNaN(id)) | |||||
| return ctx.err404(); | |||||
| ctx.db.query( | ctx.db.query( | ||||
| "SELECT name, date_created, id "+ | "SELECT name, date_created, id "+ | ||||
| return ctx.fail(err); | return ctx.fail(err); | ||||
| if (!res.collections || !res.users) | if (!res.collections || !res.users) | ||||
| return ctx.end(ctx.view("404")); | |||||
| return ctx.err404(); | |||||
| var user = res.users.rows[0]; | var user = res.users.rows[0]; | ||||
| if (!user) | if (!user) | ||||
| return ctx.end(ctx.view("404")); | |||||
| return ctx.err404(); | |||||
| var collections = ""; | var collections = ""; | ||||
| res.collections.rows.forEach(function(row) { | res.collections.rows.forEach(function(row) { | ||||
| collections += ctx.template("collection", { | collections += ctx.template("collection", { | ||||
| name: row.name, | name: row.name, | ||||
| date_created: d.toString(), | date_created: d.toString(), | ||||
| id: row.id | |||||
| id: row.id, | |||||
| own_profile: (ctx.session.userId === id) | |||||
| }); | }); | ||||
| }); | }); | ||||
| .collection { | |||||
| height: 45px; | |||||
| white-space: nowrap; | |||||
| box-sizing: content-box; | |||||
| padding-bottom: 1px; | |||||
| border-bottom: 1px solid #CCC; | |||||
| } | |||||
| .collection:last-child { | |||||
| border: none; | |||||
| } | |||||
| .collection .date-created, | |||||
| .collection .name { | |||||
| line-height: 45px; | |||||
| display: inline-block; | |||||
| overflow: hidden; | |||||
| white-space: nowrap; | |||||
| text-overflow: ellipsis; | |||||
| vertical-align: middle; | |||||
| } | |||||
| .collection .date-created { | |||||
| width: 45%; | |||||
| } | |||||
| .collection .name { | |||||
| width: calc(55% - 43px); | |||||
| } |
| module.exports = function(ctx) { | module.exports = function(ctx) { | ||||
| if (!ctx.session.loggedIn) | if (!ctx.session.loggedIn) | ||||
| return ctx.end(ctx.view("404")); | |||||
| return ctx.err404(); | |||||
| ctx.end(ctx.view("settings")); | ctx.end(ctx.view("settings")); | ||||
| } | } |
| var id = parseInt(ctx.query); | var id = parseInt(ctx.query); | ||||
| if (isNaN(id)) | if (isNaN(id)) | ||||
| return ctx.end(ctx.view("404")); | |||||
| return ctx.err404(); | |||||
| ctx.db.query( | ctx.db.query( | ||||
| "SELECT id, name, description, extension "+ | "SELECT id, name, description, extension "+ | ||||
| return ctx.fail(err); | return ctx.fail(err); | ||||
| if (!res.rows[0]) | if (!res.rows[0]) | ||||
| return ctx.end(ctx.view("404")); | |||||
| return ctx.err404(); | |||||
| var images = ""; | var images = ""; | ||||
| res.rows.forEach(function(row) { | res.rows.forEach(function(row) { |
| #viewer { | |||||
| max-width: 400px; | |||||
| #viewer .image { | |||||
| margin-bottom: 20px; | |||||
| } | } | ||||
| #viewer .image img { | #viewer .image img { | ||||
| width: 100%; | width: 100%; | ||||
| } | } | ||||
| #viewer .image .url { | #viewer .image .url { | ||||
| width: 100%; | width: 100%; | ||||
| } | } | ||||
| #viewer .image { | |||||
| margin-bottom: 20px; | |||||
| border: 1px solid #CCC; | |||||
| border-radius: 4px; | |||||
| padding: 6px; | |||||
| } |