Hawkin
/
arangodb
mirror of https://gitee.com/bigwinds/arangodb
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

Moved the selection box from navigation bar back to footer bar

This commit is contained in:
Michael Hackstein 2013-11-17 00:02:08 +01:00
parent 5b5ac93297
commit 045321b318
10 changed files with 65 additions and 140 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
js/apps/system/aardvark/frontend/css/dbSelectionView.css
View File

@ -1,12 +1,8 @@
span.selectDB {
top: 6px;
left: 210px;
position: absolute;
}
span.selectDB > select {
line-height: 20px;
height: 20px;
width: 150px;
padding: 0px;
margin: -3px 0px 2px 0px;
border-radius: 0px !important;
border: 1px solid;
}

6
js/apps/system/aardvark/frontend/js/routers/router.js
View File

@ -69,10 +69,6 @@
this.graphView = new window.GraphView({
collection: window.arangoCollectionsStore
});
this.dbSelectionView = new window.DBSelectionView({
collection: window.arangoDatabase,
current: window.currentDB
});
var self = this;
$(window).resize(function() {
@ -343,7 +339,7 @@
},
handleSelectDatabase: function () {
this.dbSelectionView.render($("#selectDB"));
this.footerView.handleSelectDatabase();
},
handleResize: function () {

4
js/apps/system/aardvark/frontend/js/templates/dbSelectionView.ejs
View File

@ -12,5 +12,9 @@ if (list.length > 1) {
%>
</select>
<%
} else {
%>
<%=current%>
<%
}
%>

2
js/apps/system/aardvark/frontend/js/templates/footerView.ejs
View File

@ -12,6 +12,6 @@
</div>
<div class="footer-right">
<p <%=margin?"style='margin-right:"+margin+"px'":""%>><% if(n) { %>Server: <%=n%> <%=v%>, Database: <%=db%><% } %></p>
<p <%=margin?"style='margin-right:"+margin+"px'":""%>><% if(n) { %>Server: <%=n%> <%=v%>, Database: <span id="dbSelect" class="selectDB"></span><% } %></p>
</div>
<div class="footer-invisible" id="databaseName"></div>

13
js/apps/system/aardvark/frontend/js/views/dbSelectionView.js
View File

@ -4,8 +4,6 @@
"use strict";
window.DBSelectionView = Backbone.View.extend({
el: "#dbSelect",
template: templateEngine.createTemplate("dbSelectionView.ejs"),
events: {
@ -16,9 +14,7 @@
var self = this;
this.current = opts.current;
this.collection.fetch({
success: function() {
self.render();
}
async: false
});
},
@ -28,13 +24,14 @@
window.location.replace(url);
},
render: function() {
$(this.el).html(this.template.render({
render: function(el) {
this.$el = el;
this.$el.html(this.template.render({
list: this.collection,
current: this.current.get("name")
}));
this.delegateEvents();
return $(this.el);
return this.el;
}
});
}());

17
js/apps/system/aardvark/frontend/js/views/footerView.js
View File

@ -11,6 +11,10 @@
initialize: function () {
//also server online check
var self = this;
this.dbSelectionView = new window.DBSelectionView({
collection: window.arangoDatabase,
current: window.currentDB
});
window.setInterval(function(){
self.getVersion();
}, 15000);
@ -90,6 +94,7 @@
},
renderVersion: function () {
var self = this;
if (this.system.hasOwnProperty('database') && this.system.hasOwnProperty('name')) {
$(this.el).html(this.template.render({
name: this.system.name,
@ -97,11 +102,7 @@
database: this.system.database,
margin: this.resizeMargin
}));
/*
var tag = 'Server: ' + this.system.name + ' ' + this.system.version +
', Database: ' + this.system.database;
$('.footer-right p').html(tag);
*/
this.dbSelectionView.render($("#dbSelect"));
}
},
@ -110,7 +111,12 @@
this.render();
},
handleSelectDatabase: function() {
this.dbSelectionView.render();
},
render: function () {
var self = this;
if (!this.system.version) {
this.getVersion();
}
@ -120,6 +126,7 @@
database: this.system.database,
margin: this.resizeMargin
}));
this.dbSelectionView.render($("#dbSelect"));
return this;
}

5
js/apps/system/aardvark/frontend/js/views/navigationView.js
View File

@ -18,9 +18,8 @@
},
handleResize: function (margin) {
$('.arango-logo').css('margin-left', margin - 17);
$("#dbSelect").css('margin-left', margin - 17);
$('.nav-collapse').css('margin-right', margin - 10);
$('.arango-logo').css('margin-left', margin - 41);
$('.nav-collapse').css('margin-right', margin + 7);
},

1
js/apps/system/aardvark/index.html
View File

@ -20,7 +20,6 @@
<div class="arango-nav navbar-inner">
<div class="container">
<a class="arango-logo brand navlogo" href="#"><img src="img/logo_arangob_white.gif"/></a>
<span id="dbSelect" class="selectDB"></span>
<div class="nav-collapse arangoNavSwitch" id="navigationBar">
</div>
</div>

12
js/apps/system/aardvark/test/specs/router/routerSpec.js
View File

@ -15,7 +15,6 @@
footerDummy,
documentDummy,
documentsDummy,
databaseDummy,
sessionDummy,
graphDummy,
logsDummy;
@ -32,7 +31,6 @@
};
documentDummy = {};
documentsDummy = {};
databaseDummy = {};
graphDummy = {
handleResize: function() {}
};
@ -48,7 +46,6 @@
spyOn(storeDummy, "fetch");
spyOn(window, "arangoCollections").andReturn(storeDummy);
spyOn(window, "ArangoSession").andReturn(sessionDummy);
spyOn(window, "ArangoDatabase").andReturn(databaseDummy);
spyOn(window, "arangoDocuments").andReturn(documentsDummy);
spyOn(window, "arangoDocument").andReturn(documentDummy);
spyOn(window, "CollectionsView");
@ -91,7 +88,7 @@
spyOn(window, "DBSelectionView");
});
describe("Initialisation", function() {
describe("initialisation", function() {
var r;
@ -135,13 +132,6 @@
});
});
it("should create the dbSelectionView", function() {
expect(window.DBSelectionView).toHaveBeenCalledWith({
collection: databaseDummy,
current: fakeDB
});
});
it("should fetch the collectionsStore", function() {
expect(storeDummy.fetch).toHaveBeenCalled();
});

135
js/apps/system/aardvark/test/specs/views/dbSelectionViewSpec.js
View File

@ -25,13 +25,16 @@
dbCollection.add({name: n});
});
fetched = false;
spyOn(dbCollection, "fetch").andCallFake(function(opt) {
fetched = true;
opt.success();
});
spyOn(dbCollection, "fetch");
div = document.createElement("div");
div.id = "dbSelect";
document.body.appendChild(div);
view = new DBSelectionView(
{
collection: dbCollection,
current: current
}
);
});
afterEach(function() {
@ -39,114 +42,48 @@
});
it("should display all databases ordered", function() {
runs(function() {
view = new DBSelectionView(
{
collection: dbCollection,
current: current
}
);
});
waitsFor(function() {
return fetched;
}, 1000);
runs(function() {
var select = $(div).children()[0],
childs;
expect(div.childElementCount).toEqual(1);
childs = $(select).children();
expect(childs.length).toEqual(3);
expect(childs[0].id).toEqual(list[0]);
expect(childs[1].id).toEqual(list[2]);
expect(childs[2].id).toEqual(list[1]);
});
view.render($(div));
var select = $(div).children()[0],
childs;
expect(div.childElementCount).toEqual(1);
childs = $(select).children();
expect(childs.length).toEqual(3);
expect(childs[0].id).toEqual(list[0]);
expect(childs[1].id).toEqual(list[2]);
expect(childs[2].id).toEqual(list[1]);
});
it("should select the current db", function() {
runs(function() {
view = new DBSelectionView(
{
collection: dbCollection,
current: current
}
);
});
waitsFor(function() {
return fetched;
}, 1000);
runs(function() {
expect($(div).find(":selected").attr("id")).toEqual(current.get("name"));
});
view.render($(div));
expect($(div).find(":selected").attr("id")).toEqual(current.get("name"));
});
it("should trigger fetch on collection", function() {
runs(function() {
view = new DBSelectionView(
{
collection: dbCollection,
current: current
}
);
});
waitsFor(function() {
return fetched;
}, 1000);
runs(function() {
expect(dbCollection.fetch).toHaveBeenCalled();
});
view.render($(div));
expect(dbCollection.fetch).toHaveBeenCalled();
});
it("should trigger a database switch on click", function() {
runs(function() {
view = new DBSelectionView(
{
collection: dbCollection,
current: current
}
);
});
waitsFor(function() {
return fetched;
}, 1000);
runs(function() {
spyOn(dbCollection, "createDatabaseURL").andReturn("switchURL");
spyOn(location, "replace");
$("#dbSelectionList").val("second").trigger("change");
expect(dbCollection.createDatabaseURL).toHaveBeenCalledWith("second");
expect(location.replace).toHaveBeenCalledWith("switchURL");
});
view.render($(div));
spyOn(dbCollection, "createDatabaseURL").andReturn("switchURL");
spyOn(location, "replace");
$("#dbSelectionList").val("second").trigger("change");
expect(dbCollection.createDatabaseURL).toHaveBeenCalledWith("second");
expect(location.replace).toHaveBeenCalledWith("switchURL");
});
it("should not render if the list has only one element", function() {
runs(function() {
var oneCollection = new window.ArangoDatabase();
oneCollection.add({name: current});
spyOn(oneCollection, "fetch").andCallFake(function(opts) {
fetched = true;
opts.success();
});
view = new DBSelectionView({
it("should not render the selection if the list has only one element", function() {
var oneCollection = new window.ArangoDatabase();
oneCollection.add({name: current});
spyOn(oneCollection, "fetch");
view = new DBSelectionView(
{
collection: oneCollection,
current: current
});
});
waitsFor(function() {
return fetched;
}, 1000);
runs(function() {
expect($(div).text().trim()).toEqual("");
});
}
);
view.render($(div));
expect($(div).text().trim()).toEqual("first");
});
});
}());