Browse Source

basic layout done

master
mort 8 years ago
parent
commit
abc5ff1a66

+ 2
- 1
index.js View File

@@ -10,7 +10,8 @@ var endpoints = {

//General files
"/favicon.ico": "favicon.ico",
"/bootstrap.css": "bootstrap.css",
"/global.css": "global.css",
"/global.js": "global.js",
"/404": "404.html",

//Index files

+ 25
- 0
lib/context.js View File

@@ -36,5 +36,30 @@ module.exports.prototype = {
throw new Error("No such view: "+name);

return templatify(str, args);
},

getPostData: function(cb) {
if (this.req.method != "POST")
return cb(new Error("Expected POST request, got "+this.req.method));

if (this._postData)
return cb(null, this._postData);

var str = "";

this.req.on("data", function(data) {
str += data;
});

this.req.on("end", function() {
try {
var obj = JSON.parse(str);
} catch (err) {
return cb(err);
}

this._postData = obj;
cb(null, obj);
});
}
}

+ 16
- 0
templates/global.html View File

@@ -0,0 +1,16 @@
<div class="navbar navbar-default navbar-fixed-top">
<div class="navbar-inner">
<div class="container-fluid">
<a class="navbar-brand" href="/">Mimg</a>
<ul class="nav navbar-nav navbar-right">
{{profile}}
</ul>
</div>
</div>
</div>

<div id="notify-box">
<a href="#" class="close" onclick="this.parentNode.className = ''">Close</a>
<div class="title"></div>
<div class="body"></div>
</div>

+ 7
- 0
templates/head.html View File

@@ -0,0 +1,7 @@
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<link rel="stylesheet" href="/global.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<script src="https://code.jquery.com/jquery-2.1.4.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<script src="/global.js"></script>

+ 0
- 9
templates/header.html View File

@@ -1,9 +0,0 @@
<div class="navbar navbar-fixed-top">
<div class="navbar-inner">
<div class="container">
<div class="pull-right">
Log In
</div>
</div>
</div>
</div>

+ 22
- 0
templates/navbar-profile-login.html View File

@@ -0,0 +1,22 @@
<li class="dropdown" id="login-dropdown">
<a href="#" data-toggle="dropdown" class="dropdown-toggle" style="float: right">
Log In
<b class="caret"></b>
</a>
<ul class="dropdown-menu"><li>
<form id="login-form">
<div class="form-group">
<label>Username<br>
<input type="text">
</label>
</div>
<div class="form-group">
<label>Password<br>
<input type="password">
</label>
</div>
<div class="submit-container">
<button type="submit" class="btn btn-default">Log In</button>
</div>
</li></ul>
</li>

+ 3
- 3
views/index.html View File

@@ -1,10 +1,10 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="/bootstrap.css">
{{head}}
</head>
<body>
{{header}}
{{global}}
<script src="/index/script.js"></script>
</body>
</html>

+ 2
- 3
views/viewer.html View File

@@ -1,10 +1,9 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>{{title}}</title>
{{head}}
</head>
<body>
{{header}}
{{global}}
</body>
</html>

+ 0
- 9
web/bootstrap.css
File diff suppressed because it is too large
View File


+ 60
- 0
web/global.css View File

@@ -0,0 +1,60 @@
.navbar .navbar-nav {
margin-bottom: 0px;
}

#login-dropdown .dropdown-menu {
padding: 10px;
}

#login-dropdown label,
#login-dropdown input {
width: 100%;
}

#login-dropdown .submit-container {
text-align: right;
}

#notify-box {
transition: max-height 0.2s;
max-height: 0px;

background-color: #F8F8F8;
border: 1px solid #E7E7E7;

overflow: hidden;
line-height: 48px;
position: fixed;
bottom: 0px;
width: 100%;
}

#notify-box .close {
height: 48px;
line-height: 48px;
float: right;
padding: 0px;

position: absolute;
top: 0px;
bottom: 0px;
margin: auto;
right: 12px;
}
#notify-box .title,
#notify-box .body {
line-height: 48px;
margin-left: 12px;
width: calc(100% - 42px);
}
#notify-box .title {
font-weight: bold;
}

#notify-box.active {
max-height: 48px;
}
#notify-box.active:hover {
transition: max-height 0.6s;
max-height: 200px;
}

+ 24
- 0
web/global.js View File

@@ -0,0 +1,24 @@
$(document).ready(function() {
window.util = {};

util.notify = function notify(title, body) {
var elem = $("#notify-box");

elem.children(".title").html(title);
elem.children(".body").html(body || "");
elem.addClass("active");

notify.timeout = setTimeout(function() {
elem.removeClass("active");
}, 5000);
}
$("#notify-box").on("mouseenter", function() {
clearTimeout(util.notify.timeout);
});

$("#login-form").on("submit", function(evt) {
evt.stopPropagation();
evt.preventDefault();
util.notify("Feature Not Implemented", "This feature is not implemented.");
});
});

+ 4
- 1
web/index/index.node.js View File

@@ -1,5 +1,8 @@
module.exports = function(ctx) {
ctx.end(ctx.view("index", {
header: ctx.template("header")
head: ctx.template("head"),
global: ctx.template("global", {
profile: ctx.template("navbar-profile-login")
})
}));
}

+ 4
- 1
web/viewer/index.node.js View File

@@ -1,5 +1,8 @@
module.exports = function(ctx) {
ctx.end(ctx.view("viewer", {
header: ctx.template("header")
head: ctx.template("head"),
global: ctx.template("global", {
profile: ctx.template("navbar-profile-login")
})
}));
}

Loading…
Cancel
Save