adding sammy
This commit is contained in:
Max Ogden
parent
06a331493f
commit
d74b6d749d
@ -10,134 +10,26 @@
|
||||
<script type="text/javascript" src="script/jquery-1.6.1.min.js"></script>
|
||||
<script type="text/javascript" src="script/jquery.mustache.js"></script>
|
||||
<script type="text/javascript" src="script/jquery.request.js"></script>
|
||||
<script type="text/javascript">
|
||||
var config, render;
|
||||
$(function() {
|
||||
|
||||
function inVhost() {
|
||||
var vhost = false;
|
||||
if ( document.location.pathname.indexOf( "_design" ) === -1 ) {
|
||||
vhost = true;
|
||||
}
|
||||
return vhost;
|
||||
}
|
||||
|
||||
config = {
|
||||
db: "api" // relative vhost links defined in rewrites.json
|
||||
, design: "ddoc"
|
||||
, vhost: true
|
||||
, baseURL: "/"
|
||||
, host: window.location.href.split( "/" )[ 2 ]
|
||||
}
|
||||
|
||||
if ( !inVhost() ) {
|
||||
config.vhost = false
|
||||
config.db = document.location.href.split( '/' )[ 3 ];
|
||||
config.design = unescape( document.location.href ).split( '/' )[ 5 ];
|
||||
config.baseURL = "/" + config.db + "/_design/" + config.design + "/_rewrite/";
|
||||
}
|
||||
|
||||
var reqOpts = {
|
||||
uri: config.baseURL + "api",
|
||||
method: "GET",
|
||||
headers: {"Content-type": "application/json"},
|
||||
cache: true
|
||||
}
|
||||
|
||||
var csvUrl;
|
||||
|
||||
/** uses $.mustache to render a template out to a target DOM
|
||||
* template == camelcase ID (minus the word Template) of the DOM object containg your mustache template
|
||||
* target == ID of the DOM node you wish to render the template into
|
||||
* data == data object to pass into the mustache template when rendering
|
||||
*/
|
||||
render = function( template, target, data ) {
|
||||
if ( !data ) var data = {};
|
||||
$( "#" + target ).html( $.mustache( $( "#" + template + "Template" ).text(), data ) );
|
||||
}
|
||||
|
||||
function formatDiskSize(bytes) {
|
||||
return (parseFloat(bytes)/1024/1024).toString().substr(0,4) + "MB"
|
||||
}
|
||||
|
||||
function renderRows(err, resp, body) {
|
||||
var response = JSON.parse(body);
|
||||
var rows = [];
|
||||
response.rows.map(function(row) {
|
||||
var cells = [];
|
||||
config.headers.map(function(header) {
|
||||
var value = "";
|
||||
if (row.value[header]) {
|
||||
value = row.value[header];
|
||||
if (typeof(value) == "object") value = JSON.stringify(value);
|
||||
}
|
||||
cells.push(value);
|
||||
})
|
||||
rows.push({cells: cells});
|
||||
})
|
||||
render('dataTable', 'dataTableContainer', {
|
||||
rows: rows,
|
||||
headers: config.headers
|
||||
})
|
||||
|
||||
}
|
||||
|
||||
function gotDb( err, resp, body ) {
|
||||
|
||||
var dbInfo = JSON.parse(body);
|
||||
|
||||
$.extend(dbInfo, {
|
||||
"host": window.location.host,
|
||||
"disk_size": formatDiskSize(dbInfo.disk_size)
|
||||
});
|
||||
|
||||
if( config.vhost ) dbInfo.db_name = "api";
|
||||
|
||||
render('tableContainer', 'main', dbInfo);
|
||||
render('title', 'project-title', dbInfo);
|
||||
render( 'generating', 'project-controls' );
|
||||
|
||||
function gotHeaders( err, resp, body ) {
|
||||
csvUrl = config.baseURL + 'api/csv?headers=' + escape(body);
|
||||
render( 'actions', 'project-controls', $.extend({}, dbInfo, {url: csvUrl}) );
|
||||
config.headers = JSON.parse(body);
|
||||
$.request($.extend({}, reqOpts, {uri: config.baseURL + 'api/rows?limit=10'}), renderRows);
|
||||
}
|
||||
|
||||
$.request($.extend({}, reqOpts, {uri: config.baseURL + 'api/headers'}), gotHeaders);
|
||||
|
||||
}
|
||||
|
||||
$.request($.extend({}, reqOpts, {uri: config.baseURL + 'api'}), gotDb);
|
||||
|
||||
$( '.csv' ).live('click', ( function( e ) {
|
||||
window.location.href = csvUrl;
|
||||
e.preventDefault();
|
||||
}))
|
||||
|
||||
})
|
||||
</script>
|
||||
<script type="text/javascript" src="script/sammy-0.6.3.min.js"></script>
|
||||
<script type="text/javascript" src="script/util.js"></script>
|
||||
<script type="text/javascript" src="script/removalist.js"></script>
|
||||
<script type="text/javascript" src="script/site.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="container">
|
||||
<div id="header">
|
||||
<div id="project-title" style="display: block; ">
|
||||
|
||||
</div>
|
||||
<div id="project-controls" style="display: block; ">
|
||||
|
||||
</div>
|
||||
<div id="project-title" style="display: block; "></div>
|
||||
<div id="project-controls" style="display: block; "></div>
|
||||
</div>
|
||||
|
||||
<div id="main">
|
||||
|
||||
</div>
|
||||
|
||||
<div id="main_content"></div>
|
||||
<footer>
|
||||
<a href='https://github.com/maxogden/removalist'>Fork this project on Github</a>. The <a href="http://github.com/michenriksen/css3buttons">pretty CSS3 Buttons</a> were created by <a href="http://michaelhenriksen.dk" title="Website of Michael Henriksen">Michael Henriksen</a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
<script type='text/mustache' id="homeTemplate">
|
||||
</script>
|
||||
|
||||
<script type='text/mustache' id="dbTemplate">
|
||||
<div id="database" class="single_database">
|
||||
<div class="group" id="current-head-database">
|
||||
|
||||
61
attachments/script/removalist.js
Normal file
61
attachments/script/removalist.js
Normal file
@ -0,0 +1,61 @@
|
||||
var removalist = function() {
|
||||
|
||||
function formatDiskSize(bytes) {
|
||||
return (parseFloat(bytes)/1024/1024).toString().substr(0,4) + "MB"
|
||||
}
|
||||
|
||||
function renderRows(err, resp, body) {
|
||||
var response = JSON.parse(body);
|
||||
var rows = [];
|
||||
response.rows.map(function(row) {
|
||||
var cells = [];
|
||||
app.headers.map(function(header) {
|
||||
var value = "";
|
||||
if (row.value[header]) {
|
||||
value = row.value[header];
|
||||
if (typeof(value) == "object") value = JSON.stringify(value);
|
||||
}
|
||||
cells.push(value);
|
||||
})
|
||||
rows.push({cells: cells});
|
||||
})
|
||||
util.render('dataTable', 'dataTableContainer', {
|
||||
rows: rows,
|
||||
headers: app.headers
|
||||
})
|
||||
|
||||
}
|
||||
|
||||
function gotHeaders( err, resp, body ) {
|
||||
app.csvUrl = app.baseURL + 'api/csv?headers=' + escape(body);
|
||||
util.render( 'actions', 'project-controls', $.extend({}, app.dbInfo, {url: app.csvUrl}) );
|
||||
app.headers = JSON.parse(body);
|
||||
$.request($.extend({}, app.reqOpts, {uri: app.baseURL + 'api/rows?limit=10'}), renderRows);
|
||||
}
|
||||
|
||||
function gotDb( err, resp, body ) {
|
||||
|
||||
app.dbInfo = JSON.parse(body);
|
||||
|
||||
$.extend(app.dbInfo, {
|
||||
"host": window.location.host,
|
||||
"disk_size": formatDiskSize(app.dbInfo.disk_size)
|
||||
});
|
||||
|
||||
if( util.inURL("_rewrite", app.baseURL) ) app.dbInfo.db_name = "api";
|
||||
|
||||
util.render('tableContainer', app.container, app.dbInfo);
|
||||
util.render('title', 'project-title', app.dbInfo);
|
||||
util.render( 'generating', 'project-controls' );
|
||||
|
||||
$.request($.extend({}, app.reqOpts, {uri: app.baseURL + 'api/headers'}), gotHeaders);
|
||||
|
||||
}
|
||||
|
||||
return {
|
||||
formatDiskSize: formatDiskSize,
|
||||
renderRows: renderRows,
|
||||
gotHeaders: gotHeaders,
|
||||
gotDb: gotDb
|
||||
};
|
||||
}();
|
||||
5
attachments/script/sammy-0.6.3.min.js
vendored
Executable file
5
attachments/script/sammy-0.6.3.min.js
vendored
Executable file
File diff suppressed because one or more lines are too long
40
attachments/script/site.js
Normal file
40
attachments/script/site.js
Normal file
@ -0,0 +1,40 @@
|
||||
var app = {
|
||||
baseURL: util.getBaseURL(document.location.pathname),
|
||||
container: 'main_content'
|
||||
};
|
||||
|
||||
app.reqOpts = {
|
||||
uri: app.baseURL + "api",
|
||||
method: "GET",
|
||||
headers: {"Content-type": "application/json"},
|
||||
cache: true
|
||||
}
|
||||
|
||||
app.handler = function(route) {
|
||||
route = route.path.slice(1, route.path.length);
|
||||
if (route.length < 1) route = "home";
|
||||
util.render( route, app.container);
|
||||
window.scrollTo(0, 0);
|
||||
};
|
||||
|
||||
app.after = {
|
||||
home: function() {
|
||||
|
||||
$.request(app.reqOpts, removalist.gotDb);
|
||||
|
||||
$( '.csv' ).live('click', ( function( e ) {
|
||||
window.location.href = app.csvUrl;
|
||||
e.preventDefault();
|
||||
}))
|
||||
}
|
||||
}
|
||||
|
||||
app.s = $.sammy(function () {
|
||||
this.get('', app.handler);
|
||||
this.get("#/", app.handler);
|
||||
this.get("#:route", app.handler);
|
||||
});
|
||||
|
||||
$(function() {
|
||||
app.s.run();
|
||||
})
|
||||
132
attachments/script/util.js
Normal file
132
attachments/script/util.js
Normal file
@ -0,0 +1,132 @@
|
||||
var util = function() {
|
||||
|
||||
$.fn.serializeObject = function() {
|
||||
var o = {};
|
||||
var a = this.serializeArray();
|
||||
$.each(a, function() {
|
||||
if (o[this.name]) {
|
||||
if (!o[this.name].push) {
|
||||
o[this.name] = [o[this.name]];
|
||||
}
|
||||
o[this.name].push(this.value || '');
|
||||
} else {
|
||||
o[this.name] = this.value || '';
|
||||
}
|
||||
});
|
||||
return o;
|
||||
};
|
||||
|
||||
function inURL(url, str) {
|
||||
var exists = false;
|
||||
if ( url.indexOf( str ) > -1 ) {
|
||||
exists = true;
|
||||
}
|
||||
return exists;
|
||||
}
|
||||
|
||||
function render( template, target, options ) {
|
||||
if ( !options ) options = {data: {}};
|
||||
if ( !options.data ) options = {data: options};
|
||||
var html = $.mustache( $( "#" + template + "Template" ).html(), options.data ),
|
||||
targetDom = $( "#" + target );
|
||||
if( options.append ) {
|
||||
targetDom.append( html );
|
||||
} else {
|
||||
targetDom.html( html );
|
||||
}
|
||||
if (template in app.after) app.after[template]();
|
||||
}
|
||||
|
||||
function formatMetadata(data) {
|
||||
out = '<dl>';
|
||||
$.each(data, function(key, val) {
|
||||
if (typeof(val) == 'string' && key[0] != '_') {
|
||||
out = out + '<dt>' + key + '<dd>' + val;
|
||||
} else if (typeof(val) == 'object' && key != "geometry" && val != null) {
|
||||
if (key == 'properties') {
|
||||
$.each(val, function(attr, value){
|
||||
out = out + '<dt>' + attr + '<dd>' + value;
|
||||
})
|
||||
} else {
|
||||
out = out + '<dt>' + key + '<dd>' + val.join(', ');
|
||||
}
|
||||
}
|
||||
});
|
||||
out = out + '</dl>';
|
||||
return out;
|
||||
}
|
||||
|
||||
function getBaseURL(url) {
|
||||
var baseURL = "";
|
||||
if ( inURL(url, '_design') ) {
|
||||
if (inURL(url, '_rewrite')) {
|
||||
var path = url.split("#")[0];
|
||||
if (path[path.length - 1] === "/") {
|
||||
baseURL = "";
|
||||
} else {
|
||||
baseURL = '_rewrite/';
|
||||
}
|
||||
} else {
|
||||
baseURL = '_rewrite/';
|
||||
}
|
||||
}
|
||||
return baseURL;
|
||||
}
|
||||
|
||||
var persist = {
|
||||
restore: function() {
|
||||
$('.persist').each(function(i, el) {
|
||||
var inputId = $(el).attr('id');
|
||||
if(localStorage.getItem(inputId)) $('#' + inputId).val(localStorage.getItem(inputId));
|
||||
})
|
||||
},
|
||||
save: function(id) {
|
||||
localStorage.setItem(id, $('#' + id).val());
|
||||
},
|
||||
clear: function() {
|
||||
$('.persist').each(function(i, el) {
|
||||
localStorage.removeItem($(el).attr('id'));
|
||||
})
|
||||
},
|
||||
init: function() {
|
||||
if (Modernizr.localstorage) {
|
||||
util.persist.restore();
|
||||
|
||||
$('.persist').keyup(function(e) {
|
||||
var inputId = $(e.target).attr('id');
|
||||
util.persist.save(inputId);
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// simple debounce adapted from underscore.js
|
||||
function delay(func, wait) {
|
||||
return function() {
|
||||
var context = this, args = arguments;
|
||||
var throttler = function() {
|
||||
delete app.timeout;
|
||||
func.apply(context, args);
|
||||
};
|
||||
if (!app.timeout) app.timeout = setTimeout(throttler, wait);
|
||||
};
|
||||
};
|
||||
|
||||
function resetForm(form) {
|
||||
$(':input', form)
|
||||
.not(':button, :submit, :reset, :hidden')
|
||||
.val('')
|
||||
.removeAttr('checked')
|
||||
.removeAttr('selected');
|
||||
}
|
||||
|
||||
return {
|
||||
inURL: inURL,
|
||||
render: render,
|
||||
formatMetadata:formatMetadata,
|
||||
getBaseURL:getBaseURL,
|
||||
resetForm: resetForm,
|
||||
delay: delay,
|
||||
persist: persist
|
||||
};
|
||||
}();
|
||||
Loading…
x
Reference in New Issue
Block a user