홍길동 / onos

Go to a project
Toggle navigation Toggle navigation pinning
Bri Prebilic Cole
c4403328 1 parent 93da11f8

GUI -- Refactored ToolbarService to have only new toolbar functions. 

Change-Id: I0319335915f37d3a63b3ac734d8f8e00ebed20ae
Inline Side-by-side
Showing 3 changed files with 53 additions and 380 deletions
......@@ -33,7 +33,7 @@
}
function button(div, id, gid, cb, tooltip) {
if (!div || div.empty()) {
if (!div) {
$log.warn('Button cannot append to div');
return null;
}
......@@ -53,7 +53,7 @@
}
function toggle(div, id, gid, initState, cb, tooltip) {
if (!div || div.empty()) {
if (!div) {
$log.warn('Toggle cannot append to div');
return null;
}
......@@ -84,7 +84,7 @@
}
function radioSet(div, id, rset) {
if (!div || div.empty()) {
if (!div) {
$log.warn('Radio buttons cannot append to div');
return null;
}
......
......@@ -22,80 +22,16 @@
var $log, fs, ps, bns;
var toolBtnIds = {},
toolbarPanel,
toolbarDiv;
var ids = [],
tbarId,
tbarPanel,
tbarDiv;
tbarDiv,
tbarArrowDiv;
function init() {
toolBtnIds = {};
ids = [];
}
function addButton(btn) {
// pass in button object and pass separate the pieces in this function,
// to be passed to ButtonService
var btndiv = toolbarDiv.append('div').attr('class', 'btn');
// use ButtonService to create btn with other arguments and btndiv
}
function addToggle(tog) {
var togdiv = toolbarDiv.append('div').attr('class', 'tog');
// use ButtonService to create btn with other arguments and togdiv
}
function addRadio(rad) {
var raddiv = toolbarDiv.append('div').attr('class', 'rad');
// use ButtonService to create btn with other arguments and raddiv
}
function addSeparator() {
toolbarDiv.append('div')
.attr('class', 'sep')
.style({'width': '2px',
'border-width': '1px',
'border-style': 'solid'});
}
function makeButton(id, gid, cb) {
return {
t: 'btn',
id: id,
gid: gid,
cb: cb
};
}
function makeToggle(id, gid, cb) {
return {
t: 'tog',
id: id,
gid: gid,
cb: cb
};
}
function makeRadio(id, gid, cb) {
(id in toolBtnIds) ? toolBtnIds[id] += 1 : toolBtnIds[id] = 0;
return {
t: 'rad',
id: id + '-' + toolBtnIds[id],
rid: toolBtnIds[id] + '',
gid: gid,
cb: cb
};
}
function separator() {
return {
t: 'sep'
};
}
function validId(id, caller) {
if (fs.inArray(id, ids) !== -1) {
$log.warn(caller + ': ID already exists');
......@@ -104,39 +40,38 @@
return true;
}
function addButton1(id, gid, cb, tooltip) {
function addButton(id, gid, cb, tooltip) {
var btnId = tbarId + '-' + id;
if (!validId(btnId, 'addButton')) {
return null;
}
if (!validId(btnId, 'addButton')) { return null; }
ids.push(btnId);
return bns.button(tbarDiv, btnId, gid, cb, tooltip);
}
function addToggle1(id, gid, initState, cb, tooltip) {
function addToggle(id, gid, initState, cb, tooltip) {
var togId = tbarId + '-' + id;
if (!validId(togId, 'addToggle')) {
return null;
}
if (!validId(togId, 'addToggle')) { return null; }
ids.push(togId);
return bns.toggle(tbarDiv, togId, gid, initState, cb, tooltip);
}
function addRadioSet(id, rset) {
var radId = tbarId + '-' + id;
if (!validId(radId, 'addRadioSet')) {
return null;
}
if (!validId(radId, 'addRadioSet')) { return null; }
ids.push(radId);
return bns.radioSet(tbarDiv, radId, rset);
}
// TODO: finish this and remove unneeded code
function addSeparator1() {
function addSeparator() {
if (!tbarDiv) {
$log.warn('Separator cannot append to div');
return null;
}
tbarArrowDiv = tbarDiv.append('div')
.classed('sep', true)
.style('width', '2px');
}
function createToolbar1(id, settings) {
function createToolbar(id, settings) {
if (!id) {
$log.warn('createToolbar: no ID given');
return null;
......@@ -144,78 +79,23 @@
tbarId = 'tbar-' + id;
var opts = fs.isO(settings) || {}; // default settings should be put here
if (!validId(tbarId, 'createToolbar')) {
return null;
}
if (!validId(tbarId, 'createToolbar')) { return null; }
ids.push(tbarId);
tbarPanel = ps.createPanel(tbarId, opts);
tbarDiv = tbarPanel.classed('toolbar', true);
// TODO: change names of functions
return {
addButton1: addButton1,
addToggle1: addToggle1,
addButton: addButton,
addToggle: addToggle,
addRadioSet: addRadioSet,
addSeparator1: addSeparator1
addSeparator: addSeparator
}
}
// function currently not working
//function currently not working
function destroyToolbar(id) {
ps.destroyPanel(id);
}
function createToolbar(tbarId, tools) {
var api;
if (!tbarId) {
$log.warn('createToolbar: no ID given');
return null;
}
if (!tools || tools.constructor !== Array || !tools.length) {
$log.warn('createToolbar: no tools given');
return null;
}
for (var i = 0; i < tools.length; i += 1) {
if (tools[i].t === 'rad' || tools[i].t === 'sep') {
continue;
} else {
if (tools[i].id in toolBtnIds) {
$log.warn('createToolbar: item with id '
+ tools[i].id + ' already exists');
return null;
}
toolBtnIds[tools[i].id] = 1;
}
}
// need to pass in an object with settings for where the toolbar will go
toolbarPanel = ps.createPanel(tbarId, {});
toolbarPanel.classed('toolbar', true);
toolbarDiv = toolbarPanel.el();
tools.forEach(function (tool) {
switch (tool['t']) {
case 'btn': addButton(tool); break;
case 'tog': addToggle(tool); break;
case 'rad': addRadio(tool); break;
default: addSeparator(); break;
}
});
// api functions to be returned defined here
function size(arr) {
return arr.length;
}
api = {
size: size
};
return api;
//ps.destroyPanel(id);
}
angular.module('onosWidget')
......@@ -229,14 +109,8 @@
return {
init: init,
makeButton: makeButton,
makeToggle: makeToggle,
makeRadio: makeRadio,
separator: separator,
createToolbar: createToolbar,
createToolbar1: createToolbar1,
destroyToolbar: destroyToolbar
};
}]);
}());
......
......@@ -53,243 +53,31 @@ describe('factory: fw/widget/toolbar.js', function () {
it('should define api functions', function () {
expect(fs.areFunctions(tbs, [
'init', 'makeButton', 'makeToggle', 'makeRadio', 'separator',
'createToolbar', 'createToolbar1', 'destroyToolbar'
'init',
'createToolbar', 'destroyToolbar'
])).toBeTruthy();
});
function toolbarSelection() {
return d3Elem.selectAll('.toolbar');
}
it('should have no toolbars to start', function () {
expect(toolbarSelection().size()).toBe(0);
});
it('should log a warning if no ID is given', function () {
spyOn($log, 'warn');
var tbar = tbs.createToolbar();
expect(tbar).toBeNull();
expect($log.warn).toHaveBeenCalledWith('createToolbar: no ID given');
expect(toolbarSelection().size()).toBe(0);
});
it('should log a warning if no tools are given', function () {
spyOn($log, 'warn');
var tbar = tbs.createToolbar(true);
expect(tbar).toBeNull();
expect($log.warn).toHaveBeenCalledWith('createToolbar: no tools given');
expect(toolbarSelection().size()).toBe(0);
});
it('should log a warning if tools are not an array', function () {
spyOn($log, 'warn');
var tbar = tbs.createToolbar(true, {});
expect(tbar).toBeNull();
expect($log.warn).toHaveBeenCalledWith('createToolbar: no tools given');
expect(toolbarSelection().size()).toBe(0);
});
it('should log a warning if tools array is empty', function () {
spyOn($log, 'warn');
var tbar = tbs.createToolbar(true, []);
expect(tbar).toBeNull();
expect($log.warn).toHaveBeenCalledWith('createToolbar: no tools given');
expect(toolbarSelection().size()).toBe(0);
});
it("should verify makeButton's returned object", function () {
var button = tbs.makeButton('foo', 'glyph-bar', function () {});
expect(button.t).toBe('btn');
expect(button.id).toBe('foo');
expect(button.gid).toBe('glyph-bar');
expect(fs.isF(button.cb)).toBeTruthy();
});
it("should verify makeToggle's returned object", function () {
var toggle = tbs.makeToggle('foo', 'glyph-bar', function () {});
expect(toggle.t).toBe('tog');
expect(toggle.id).toBe('foo');
expect(toggle.gid).toBe('glyph-bar');
expect(fs.isF(toggle.cb)).toBeTruthy();
});
it("should verify makeRadio's returned object", function () {
var rFoo0 = tbs.makeRadio('foo', 'glyph-foo0', function () {});
var rFoo1 = tbs.makeRadio('foo', 'glyph-foo1', function () {});
var rFoo2 = tbs.makeRadio('foo', 'glyph-foo2', function () {});
var rBar0 = tbs.makeRadio('bar', 'glyph-bar0', function () {});
var rBar1 = tbs.makeRadio('bar', 'glyph-bar1', function () {});
var rFoo3 = tbs.makeRadio('foo', 'glyph-foo3', function () {});
expect(rFoo0.t).toBe('rad');
expect(rFoo0.id).toBe('foo-0');
expect(rFoo0.rid).toBe('0');
expect(rFoo0.gid).toBe('glyph-foo0');
expect(fs.isF(rFoo0.cb)).toBeTruthy();
expect(rFoo1.t).toBe('rad');
expect(rFoo1.id).toBe('foo-1');
expect(rFoo1.rid).toBe('1');
expect(rFoo1.gid).toBe('glyph-foo1');
expect(fs.isF(rFoo1.cb)).toBeTruthy();
expect(rFoo2.t).toBe('rad');
expect(rFoo2.id).toBe('foo-2');
expect(rFoo2.rid).toBe('2');
expect(rFoo2.gid).toBe('glyph-foo2');
expect(fs.isF(rFoo2.cb)).toBeTruthy();
expect(rFoo3.t).toBe('rad');
expect(rFoo3.id).toBe('foo-3');
expect(rFoo3.rid).toBe('3');
expect(rFoo3.gid).toBe('glyph-foo3');
expect(fs.isF(rFoo3.cb)).toBeTruthy();
expect(rBar0.t).toBe('rad');
expect(rBar0.id).toBe('bar-0');
expect(rBar0.rid).toBe('0');
expect(rBar0.gid).toBe('glyph-bar0');
expect(fs.isF(rBar0.cb)).toBeTruthy();
expect(rBar1.t).toBe('rad');
expect(rBar1.id).toBe('bar-1');
expect(rBar1.rid).toBe('1');
expect(rBar1.gid).toBe('glyph-bar1');
expect(fs.isF(rBar1.cb)).toBeTruthy();
});
it("should verify separator's returned object", function () {
var separator = tbs.separator();
expect(separator.t).toBe('sep');
});
it('should log a warning if btn id is already in use', function () {
var tools = [
tbs.makeButton('id0', 'glyph-id0', function () {}),
tbs.makeButton('id0', 'glyph-id0', function () {})
];
spyOn($log, 'warn');
var tbar = tbs.createToolbar('someId', tools);
expect(tbar).toBeNull();
expect($log.warn).toHaveBeenCalledWith('createToolbar: item with id ' +
'id0 already exists');
expect(toolbarSelection().size()).toBe(0);
});
it('should log a warning if tog id is already in use', function () {
var tools = [
tbs.makeToggle('id0', 'glyph-id0', function () {}),
tbs.makeToggle('id1', 'glyph-id1', function () {}),
tbs.makeToggle('id0', 'glyph-id0', function () {})
];
spyOn($log, 'warn');
var tbar = tbs.createToolbar('someId', tools);
expect(tbar).toBeNull();
expect($log.warn).toHaveBeenCalledWith('createToolbar: item with id ' +
'id0 already exists');
expect(toolbarSelection().size()).toBe(0);
});
it('should create a toolbar', function () {
// need to create a button so it does not throw errors
var tools = [
tbs.makeButton('btn0', 'glyph0', function () {})
];
spyOn($log, 'warn');
var tbar = tbs.createToolbar('test', tools);
expect($log.warn).not.toHaveBeenCalled();
expect(toolbarSelection().size()).toBe(1);
});
it('should test multiple separators in a row', function () {
var tools = [
tbs.separator(),
tbs.separator(),
tbs.separator()
];
spyOn($log, 'warn');
var tbar = tbs.createToolbar('test', tools);
expect($log.warn).not.toHaveBeenCalled();
expect(toolbarSelection().size()).toBe(1);
});
it('should create a button div', function () {
var tools = [
tbs.makeButton('btn0', 'glyph0', function () {})
];
spyOn($log, 'warn');
var tbar = tbs.createToolbar('test', tools);
expect($log.warn).not.toHaveBeenCalled();
expect(toolbarSelection().size()).toBe(1);
expect(d3Elem.select('.btn')).toBeTruthy();
});
it('should create a toggle div', function () {
var tools = [
tbs.makeToggle('tog0', 'glyph0', function () {})
];
spyOn($log, 'warn');
var tbar = tbs.createToolbar('test', tools);
expect($log.warn).not.toHaveBeenCalled();
expect(toolbarSelection().size()).toBe(1);
expect(d3Elem.select('.tog')).toBeTruthy();
});
it('should create a radio btn div', function () {
var tools = [
tbs.makeRadio('rad0', 'glyph0', function () {})
];
spyOn($log, 'warn');
var tbar = tbs.createToolbar('test', tools);
expect($log.warn).not.toHaveBeenCalled();
expect(toolbarSelection().size()).toBe(1);
expect(d3Elem.select('.rad')).toBeTruthy();
});
it('should create a separator div', function () {
var tools = [
tbs.separator()
];
tbs.createToolbar('test', tools);
var sepDiv = d3Elem.select('.sep');
expect(sepDiv).toBeTruthy();
expect(sepDiv.style('width')).toBe('2px');
expect(sepDiv.style('border-width')).toBe('1px');
expect(sepDiv.style('border-style')).toBe('solid');
});
// ==== new Toolbar Unit tests --------------------------------------------
it('should warn if createToolbar id is invalid', function () {
spyOn($log, 'warn');
expect(tbs.createToolbar1()).toBeNull();
expect(tbs.createToolbar()).toBeNull();
expect($log.warn).toHaveBeenCalledWith('createToolbar: no ID given');
expect(tbs.createToolbar1('test')).toBeTruthy();
expect(tbs.createToolbar1('test')).toBeNull();
expect(tbs.createToolbar('test')).toBeTruthy();
expect(tbs.createToolbar('test')).toBeNull();
expect($log.warn).toHaveBeenCalledWith('createToolbar: ID already exists');
});
it('should create an unpopulated toolbar', function () {
spyOn($log, 'warn');
expect(tbs.createToolbar1('test')).toBeTruthy();
expect(tbs.createToolbar('test')).toBeTruthy();
expect($log.warn).not.toHaveBeenCalled();
});
it('should create a button', function () {
spyOn($log, 'warn');
var toolbar = tbs.createToolbar1('test'),
btn = toolbar.addButton1('btn0', 'gid', function () {});
var toolbar = tbs.createToolbar('test'),
btn = toolbar.addButton('btn0', 'gid', function () {});
expect(btn).not.toBeNull();
expect(btn.id).toBe('tbar-test-btn0');
expect($log.warn).not.toHaveBeenCalled();
......@@ -297,9 +85,9 @@ describe('factory: fw/widget/toolbar.js', function () {
it('should not create a button with a duplicate id', function () {
spyOn($log, 'warn');
var toolbar = tbs.createToolbar1('test'),
btn = toolbar.addButton1('btn0', 'gid', function () {}),
btn1 = toolbar.addButton1('btn0', 'gid', function () {});
var toolbar = tbs.createToolbar('test'),
btn = toolbar.addButton('btn0', 'gid', function () {}),
btn1 = toolbar.addButton('btn0', 'gid', function () {});
expect(btn).not.toBeNull();
expect(btn.id).toBe('tbar-test-btn0');
expect($log.warn).toHaveBeenCalledWith('addButton: ID already exists');
......@@ -308,8 +96,8 @@ describe('factory: fw/widget/toolbar.js', function () {
it('should create a toggle', function () {
spyOn($log, 'warn');
var toolbar = tbs.createToolbar1('test'),
tog = toolbar.addButton1('tog0', 'gid', false, function () {});
var toolbar = tbs.createToolbar('test'),
tog = toolbar.addButton('tog0', 'gid', false, function () {});
expect(tog).not.toBeNull();
expect(tog.id).toBe('tbar-test-tog0');
expect($log.warn).not.toHaveBeenCalled();
......@@ -317,9 +105,9 @@ describe('factory: fw/widget/toolbar.js', function () {
it('should not create a toggle with a duplicate id', function () {
spyOn($log, 'warn');
var toolbar = tbs.createToolbar1('test'),
tog = toolbar.addToggle1('tog0', 'gid', false, function () {}),
tog1 = toolbar.addToggle1('tog0', 'gid', true, function () {});
var toolbar = tbs.createToolbar('test'),
tog = toolbar.addToggle('tog0', 'gid', false, function () {}),
tog1 = toolbar.addToggle('tog0', 'gid', true, function () {});
expect(tog).not.toBeNull();
expect(tog.id).toBe('tbar-test-tog0');
expect($log.warn).toHaveBeenCalledWith('addToggle: ID already exists');
......@@ -329,7 +117,7 @@ describe('factory: fw/widget/toolbar.js', function () {
it('should create a radio button set', function () {
spyOn($log, 'warn');
var toolbar = tbs.createToolbar1('test'),
var toolbar = tbs.createToolbar('test'),
rset = [
{ gid: 'crown', cb: function () {}, tooltip: 'nothing' },
{ gid: 'bird', cb: function () {}, tooltip: 'nothing' }
......@@ -341,6 +129,17 @@ describe('factory: fw/widget/toolbar.js', function () {
expect($log.warn).not.toHaveBeenCalled();
});
it('should create a separator div', function () {
spyOn($log, 'warn');
var toolbar = tbs.createToolbar('test'),
sep = toolbar.addSeparator();
expect(sep).not.toBeNull();
expect($log.warn).not.toHaveBeenCalled();
expect(d3Elem.select('.sep')).toBeTruthy();
expect(d3Elem.select('.sep').style('width')).toBe('2px');
});
//it('should not append to a destroyed toolbar', function () {
// spyOn($log, 'warn');
// var toolbar = tbs.createToolbar1('test');
......