knight/datahub
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'master' into gh-pages

Browse Source
This commit is contained in:
Rufus Pollock 2012-05-15 04:43:23 +01:00
commit b43d07d622
11 changed files with 74 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
_layouts/default.html
View File

@ -17,8 +17,8 @@
<!-- link rel="stylesheet" href="vendor/bootstrap/2.0.2/css/bootstrap-responsive.css" -->
<link href="css/pygments.css" rel="stylesheet" type="text/css" />
<link href="css/site.css" rel="stylesheet" type="text/css" />
<link href="css/site/pygments.css" rel="stylesheet" type="text/css" />
<link href="css/site/site.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div class="navbar navbar-fixed-top">

6
app/index.html
View File

@ -24,6 +24,7 @@
<!-- /Recline CSS components -->
<!-- Custom CSS for the Data Explorer Online App -->
<link rel="stylesheet" href="../css/site/site.css">
<link rel="stylesheet" href="style/demo.css">
<link rel="stylesheet" href="../vendor/bootstrap/2.0.2/css/bootstrap-responsive.css">
@ -65,10 +66,7 @@
<div class="navbar navbar-fixed-top">
<div class="navbar-inner">
<div class="container-fluid">
<a class="brand" href="../">Recline Data Explorer</a>
<ul class="nav">
<li><a href="../#docs">Documentation</a></li>
</ul>
<a class="brand" href="#">Recline Data Explorer</a>
<ul class="nav pull-right">
<li class="dropdown">
<a data-toggle="dropdown" class="dropdown-toggle">

4
app/style/demo.css
View File

@ -2,6 +2,10 @@ body {
padding-top: 60px;
}
.navbar .brand {
line-height: 32px;
}
/* we do not have a LH sidebar */
.container-fluid > .content {
margin-left: 0;

33
css/data-explorer.css
View File

@ -1,3 +1,8 @@
.recline-data-explorer .data-view-container {
display: block;
clear: both;
}
.recline-data-explorer .header .navigation,
.recline-data-explorer .header .navigation li,
.recline-data-explorer .header .pagination,
@ -25,6 +30,10 @@
display: inline;
}
/**********************************************************
* Query Editor
*********************************************************/
.header .recline-query-editor {
float: right;
height: 30px;
@ -64,10 +73,9 @@
vertical-align: top;
}
.recline-data-explorer .data-view-container {
display: block;
clear: both;
}
/**********************************************************
* Query Editor
*********************************************************/
.recline-filter-editor .filter-term .input-append a {
margin-left: -5px;
@ -88,3 +96,20 @@
display: inline-block;
}
.recline-data-explorer .alert-loader {
position: absolute;
width: 200px;
left: 50%;
margin-left: -100px;
z-index: 10000;
padding: 40px 0px 40px 0px;
margin-top: -10px;
text-align: center;
font-size: 16px;
font-weight: bold;
-webkit-border-radius: 0px;
-moz-border-radius: 0px;
border-radius: 0px;
border-top: none;
}

0
css/images/header-screen.png → css/site/images/header-screen.png
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 114 KiB

After

Width:  |  Height:  |  Size: 114 KiB

0
css/images/icons/white.png → css/site/images/icons/white.png
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.4 KiB

After

Width:  |  Height:  |  Size: 1.4 KiB

0
css/images/zigzags.png → css/site/images/zigzags.png
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.9 KiB

After

Width:  |  Height:  |  Size: 1.9 KiB

0
css/pygments.css → css/site/pygments.css
View File

32
css/site.css → css/site/site.css
View File

@ -41,7 +41,7 @@ a.dotted:hover {
text-decoration:none;
}
.btn-info {
.btn-explorer {
background: #545454; /* Old browsers */
background: -moz-linear-gradient(top, #545454 0%, #454545 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#545454), color-stop(100%,#454545)); /* Chrome,Safari4+ */
@ -60,17 +60,17 @@ a.dotted:hover {
color:#FFF;
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
}
.btn-info:hover,
.btn-info:active,
.btn-info.active,
.btn-info.disabled,
.btn-info[disabled] {
.btn-explorer:hover,
.btn-explorer:active,
.btn-explorer.active,
.btn-explorer.disabled,
.btn-explorer[disabled] {
background-color: #454545;
background-image:none;
color:#FFF;
}
.btn-info:active,
.btn-info.active {
.btn-explorer:active,
.btn-explorer.active {
background-color: #454545 \9;
background-image:none;
color:#FFF;
@ -84,7 +84,7 @@ a.dotted:hover {
margin-right:10px;
}
.btn-primary {
.btn-library {
background: #c7231d; /* Old browsers */
background: -moz-linear-gradient(top, #c7231d 0%, #bc130e 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#c7231d), color-stop(100%,#bc130e)); /* Chrome,Safari4+ */
@ -97,16 +97,16 @@ a.dotted:hover {
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
filter: progid:dximagetransform.microsoft.gradient(enabled=false);
}
.btn-primary:hover,
.btn-primary:active,
.btn-primary.active,
.btn-primary.disabled,
.btn-primary[disabled] {
.btn-library:hover,
.btn-library:active,
.btn-library.active,
.btn-library.disabled,
.btn-library[disabled] {
background-color: #bc130e;
background-image:none;
}
.btn-primary:active,
.btn-primary.active {
.btn-library:active,
.btn-library.active {
background-color: #bc130e \9;
}

4
index.html
View File

@ -18,8 +18,8 @@ title: Home
&mdash; All built with <a href="http://backbonejs.org/" class="dotted">Backbone</a>
</div>
<div class="inner">
<a class="btn btn-large btn-info showtitle" href="app/" title="the data explorer"><i class="icon-graph icon-white icon-large"></i>Use the Explorer</a>
<a class="btn btn-large btn-primary showtitle" href="library.html" title="the data library"><i class="icon-arrow-down icon-white icon-large"></i>Use the Library</a>
<a class="btn btn-large btn-explorer showtitle" href="app/" title="the data explorer"><i class="icon-graph icon-white icon-large"></i>Use the Explorer</a>
<a class="btn btn-large btn-library showtitle" href="library.html" title="the data library"><i class="icon-arrow-down icon-white icon-large"></i>Use the Library</a>
</div>
</div>
</div>

31
src/view.js
View File

@ -222,12 +222,11 @@ my.DataExplorer = Backbone.View.extend({
}
this.model.bind('query:start', function() {
self.notify({message: 'Loading data', loader: true});
self.notify({loader: true, persist: true});
});
this.model.bind('query:done', function() {
self.clearNotifications();
self.el.find('.doc-count').text(self.model.docCount || 'Unknown');
self.notify({message: 'Data loaded', category: 'success'});
});
this.model.bind('query:fail', function(error) {
self.clearNotifications();
@ -392,19 +391,25 @@ my.DataExplorer = Backbone.View.extend({
// * loader: if true show loading spinner
notify: function(flash) {
var tmplData = _.extend({
message: '',
category: 'warning'
message: 'Loading',
category: 'warning',
loader: false
},
flash
);
var _template = ' \
<div class="alert alert-{{category}} fade in" data-alert="alert"><a class="close" data-dismiss="alert" href="#">×</a> \
{{message}} \
{{#loader}} \
if (tmplData.loader) {
var _template = ' \
<div class="alert alert-info alert-loader"> \
{{message}} \
<span class="notification-loader">&nbsp;</span> \
{{/loader}} \
</div>';
var _templated = $.mustache(_template, tmplData);
</div>';
} else {
var _template = ' \
<div class="alert alert-{{category}} fade in" data-alert="alert"><a class="close" data-dismiss="alert" href="#">×</a> \
{{message}} \
</div>';
}
var _templated = $($.mustache(_template, tmplData));
_templated = $(_templated).appendTo($('.recline-data-explorer .alert-messages'));
if (!flash.persist) {
setTimeout(function() {
@ -420,7 +425,9 @@ my.DataExplorer = Backbone.View.extend({
// Clear all existing notifications
clearNotifications: function() {
var $notifications = $('.recline-data-explorer .alert-messages .alert');
$notifications.remove();
$notifications.fadeOut(1500, function() {
$(this).remove();
});
}
});