Moved board store to namespaced gl object

This commit is contained in:
Phil Hughes 2016-08-15 09:57:01 +01:00
parent abb55af272
commit aa05b5ed8b
15 changed files with 88 additions and 87 deletions

View file

@ -10,9 +10,7 @@
$(() => { $(() => {
const $boardApp = $('#board-app'); const $boardApp = $('#board-app');
if (!window.gl) { window.gl = window.gl || {};
window.gl = {};
}
if (gl.IssueBoardsApp) { if (gl.IssueBoardsApp) {
gl.IssueBoardsApp.$destroy(true); gl.IssueBoardsApp.$destroy(true);
@ -21,14 +19,14 @@ $(() => {
gl.IssueBoardsApp = new Vue({ gl.IssueBoardsApp = new Vue({
el: $boardApp.get(0), el: $boardApp.get(0),
data: { data: {
state: BoardsStore.state, state: gl.issueBoards.BoardsStore.state,
loading: true, loading: true,
endpoint: $boardApp.data('endpoint'), endpoint: $boardApp.data('endpoint'),
disabled: $boardApp.data('disabled'), disabled: $boardApp.data('disabled'),
issueLinkBase: $boardApp.data('issue-link-base') issueLinkBase: $boardApp.data('issue-link-base')
}, },
init () { init () {
BoardsStore.create(); gl.issueBoards.BoardsStore.create();
}, },
created () { created () {
this.loading = true; this.loading = true;
@ -40,14 +38,14 @@ $(() => {
.removeAttr('data-issue-link-base'); .removeAttr('data-issue-link-base');
}, },
ready () { ready () {
BoardsStore.disabled = this.disabled; gl.issueBoards.BoardsStore.disabled = this.disabled;
gl.boardService.all() gl.boardService.all()
.then((resp) => { .then((resp) => {
const boards = resp.json(); const boards = resp.json();
for (let i = 0, boardsLength = boards.length; i < boardsLength; i++) { for (let i = 0, boardsLength = boards.length; i < boardsLength; i++) {
const board = boards[i], const board = boards[i],
list = BoardsStore.addList(board); list = gl.issueBoards.BoardsStore.addList(board);
if (list.type === 'done') { if (list.type === 'done') {
list.position = Infinity; list.position = Infinity;
@ -56,7 +54,7 @@ $(() => {
} }
} }
BoardsStore.addBlankState(); gl.issueBoards.BoardsStore.addBlankState();
this.loading = false; this.loading = false;
}); });
} }

View file

@ -8,7 +8,7 @@
data () { data () {
return { return {
query: '', query: '',
filters: BoardsStore.state.filters filters: gl.issueBoards.BoardsStore.state.filters
}; };
}, },
watch: { watch: {
@ -53,7 +53,7 @@
draggable: '.is-draggable', draggable: '.is-draggable',
handle: '.js-board-handle', handle: '.js-board-handle',
onUpdate (e) { onUpdate (e) {
BoardsStore.moveList(e.oldIndex, e.newIndex); gl.issueBoards.BoardsStore.moveList(e.oldIndex, e.newIndex);
} }
}); });

View file

@ -12,12 +12,12 @@
}, },
methods: { methods: {
addDefaultLists () { addDefaultLists () {
BoardsStore.removeBlankState(); gl.issueBoards.BoardsStore.removeBlankState();
for (let i = 0, labelsLength = this.predefinedLabels.length; i < labelsLength; i++) { for (let i = 0, labelsLength = this.predefinedLabels.length; i < labelsLength; i++) {
const label = this.predefinedLabels[i]; const label = this.predefinedLabels[i];
BoardsStore.addList({ gl.issueBoards.BoardsStore.addList({
title: label.title, title: label.title,
position: i, position: i,
list_type: 'label', list_type: 'label',
@ -36,7 +36,7 @@
for (let i = 0, dataLength = data.length; i < dataLength; i++) { for (let i = 0, dataLength = data.length; i < dataLength; i++) {
const listObj = data[i], const listObj = data[i],
list = BoardsStore.findList('title', listObj.title); list = gl.issueBoards.BoardsStore.findList('title', listObj.title);
list.id = listObj.id; list.id = listObj.id;
list.label.id = listObj.label.id; list.label.id = listObj.label.id;
@ -45,7 +45,7 @@
}); });
}, },
clearBlankState () { clearBlankState () {
BoardsStore.removeBlankState(); gl.issueBoards.BoardsStore.removeBlankState();
} }
} }
}); });

View file

@ -9,19 +9,19 @@
methods: { methods: {
filterByLabel (label, e) { filterByLabel (label, e) {
let labelToggleText = label.title; let labelToggleText = label.title;
const labelIndex = BoardsStore.state.filters['label_name'].indexOf(label.title); const labelIndex = gl.issueBoards.BoardsStore.state.filters['label_name'].indexOf(label.title);
$(e.target).tooltip('hide'); $(e.target).tooltip('hide');
if (labelIndex === -1) { if (labelIndex === -1) {
BoardsStore.state.filters['label_name'].push(label.title); gl.issueBoards.BoardsStore.state.filters['label_name'].push(label.title);
$('.labels-filter').prepend(`<input type="hidden" name="label_name[]" value="${label.title}" />`); $('.labels-filter').prepend(`<input type="hidden" name="label_name[]" value="${label.title}" />`);
} else { } else {
BoardsStore.state.filters['label_name'].splice(labelIndex, 1); gl.issueBoards.BoardsStore.state.filters['label_name'].splice(labelIndex, 1);
labelToggleText = BoardsStore.state.filters['label_name'][0]; labelToggleText = gl.issueBoards.BoardsStore.state.filters['label_name'][0];
$(`.labels-filter input[name="label_name[]"][value="${label.title}"]`).remove(); $(`.labels-filter input[name="label_name[]"][value="${label.title}"]`).remove();
} }
const selectedLabels = BoardsStore.state.filters['label_name']; const selectedLabels = gl.issueBoards.BoardsStore.state.filters['label_name'];
if (selectedLabels.length === 0) { if (selectedLabels.length === 0) {
labelToggleText = 'Label'; labelToggleText = 'Label';
} else if (selectedLabels.length > 1) { } else if (selectedLabels.length > 1) {
@ -30,7 +30,7 @@
$('.labels-filter .dropdown-toggle-text').text(labelToggleText); $('.labels-filter .dropdown-toggle-text').text(labelToggleText);
BoardsStore.updateFiltersUrl(); gl.issueBoards.BoardsStore.updateFiltersUrl();
} }
} }
}); });

View file

@ -10,7 +10,7 @@
data () { data () {
return { return {
scrollOffset: 250, scrollOffset: 250,
filters: BoardsStore.state.filters filters: gl.issueBoards.BoardsStore.state.filters
}; };
}, },
watch: { watch: {
@ -57,7 +57,7 @@
// Remove the new dom element & let vue add the element // Remove the new dom element & let vue add the element
card.parentNode.removeChild(card); card.parentNode.removeChild(card);
BoardsStore.moveCardToList(fromListId, toListId, issueId); gl.issueBoards.BoardsStore.moveCardToList(fromListId, toListId, issueId);
} }
}); });

View file

@ -13,7 +13,7 @@ $(() => {
}); });
}, },
renderRow (label) { renderRow (label) {
const active = BoardsStore.findList('title', label.title), const active = gl.issueBoards.BoardsStore.findList('title', label.title),
$li = $('<li />',), $li = $('<li />',),
$a = $('<a />', { $a = $('<a />', {
class: (active ? `is-active js-board-list-${active.id}` : ''), class: (active ? `is-active js-board-list-${active.id}` : ''),
@ -35,10 +35,10 @@ $(() => {
clicked (label, $el, e) { clicked (label, $el, e) {
e.preventDefault(); e.preventDefault();
if (!BoardsStore.findList('title', label.title)) { if (!gl.issueBoards.BoardsStore.findList('title', label.title)) {
BoardsStore.new({ gl.issueBoards.BoardsStore.new({
title: label.title, title: label.title,
position: BoardsStore.state.lists.length - 1, position: gl.issueBoards.BoardsStore.state.lists.length - 1,
list_type: 'label', list_type: 'label',
label: { label: {
id: label.id, id: label.id,

View file

@ -52,7 +52,7 @@ class ListIssue {
} }
getLists () { getLists () {
return BoardsStore.state.lists.filter((list) => { return gl.issueBoards.BoardsStore.state.lists.filter((list) => {
return list.findIssue(this.id); return list.findIssue(this.id);
}); });
} }

View file

@ -4,7 +4,7 @@ class List {
this.position = obj.position; this.position = obj.position;
this.title = obj.title; this.title = obj.title;
this.type = obj.list_type; this.type = obj.list_type;
this.filters = BoardsStore.state.filters; this.filters = gl.issueBoards.BoardsStore.state.filters;
this.page = 1; this.page = 1;
this.loading = true; this.loading = true;
this.loadingMore = false; this.loadingMore = false;
@ -34,10 +34,10 @@ class List {
destroy () { destroy () {
if (this.type !== 'blank') { if (this.type !== 'blank') {
BoardsStore.state.lists = BoardsStore.state.lists.filter((list) => { gl.issueBoards.BoardsStore.state.lists = gl.issueBoards.BoardsStore.state.lists.filter((list) => {
return list.id !== this.id; return list.id !== this.id;
}); });
BoardsStore.updateNewListDropdown(this.id); gl.issueBoards.BoardsStore.updateNewListDropdown(this.id);
gl.boardService.destroyList(this.id); gl.boardService.destroyList(this.id);
} }

View file

@ -1,5 +1,8 @@
((w) => { (() => {
w.BoardsStore = { window.gl = window.gl || {};
window.gl.issueBoards = window.gl.issueBoards || {};
gl.issueBoards.BoardsStore = {
disabled: false, disabled: false,
state: {}, state: {},
create () { create () {
@ -126,4 +129,4 @@
history.pushState(null, null, `?${$.param(this.state.filters)}`); history.pushState(null, null, `?${$.param(this.state.filters)}`);
} }
}; };
}(window)); })();

View file

@ -246,18 +246,18 @@
isMRIndex = page === 'projects:merge_requests:index'; isMRIndex = page === 'projects:merge_requests:index';
if (page === 'projects:boards:show') { if (page === 'projects:boards:show') {
if (label.isAny) { if (label.isAny) {
BoardsStore.state.filters['label_name'] = []; gl.issueBoards.BoardsStore.state.filters['label_name'] = [];
} else if (label.title) { } else if (label.title) {
BoardsStore.state.filters['label_name'].push(label.title); gl.issueBoards.BoardsStore.state.filters['label_name'].push(label.title);
} else { } else {
var filters = BoardsStore.state.filters['label_name']; var filters = gl.issueBoards.BoardsStore.state.filters['label_name'];
filters = filters.filter(function (label) { filters = filters.filter(function (label) {
return label !== $el.text().trim(); return label !== $el.text().trim();
}); });
BoardsStore.state.filters['label_name'] = filters; gl.issueBoards.BoardsStore.state.filters['label_name'] = filters;
} }
BoardsStore.updateFiltersUrl(); gl.issueBoards.BoardsStore.updateFiltersUrl();
e.preventDefault(); e.preventDefault();
return; return;
} else if ($dropdown.hasClass('js-filter-submit') && (isIssueIndex || isMRIndex)) { } else if ($dropdown.hasClass('js-filter-submit') && (isIssueIndex || isMRIndex)) {

View file

@ -103,8 +103,8 @@
return; return;
} }
if (page === 'projects:boards:show') { if (page === 'projects:boards:show') {
BoardsStore.state.filters[$dropdown.data('field-name')] = selected.name; gl.issueBoards.BoardsStore.state.filters[$dropdown.data('field-name')] = selected.name;
BoardsStore.updateFiltersUrl(); gl.issueBoards.BoardsStore.updateFiltersUrl();
e.preventDefault(); e.preventDefault();
} else if ($dropdown.hasClass('js-filter-submit') && (isIssueIndex || isMRIndex)) { } else if ($dropdown.hasClass('js-filter-submit') && (isIssueIndex || isMRIndex)) {
if (selected.name != null) { if (selected.name != null) {

View file

@ -151,8 +151,8 @@
} }
if (page === 'projects:boards:show') { if (page === 'projects:boards:show') {
selectedId = user.id; selectedId = user.id;
BoardsStore.state.filters[$dropdown.data('field-name')] = user.id; gl.issueBoards.BoardsStore.state.filters[$dropdown.data('field-name')] = user.id;
BoardsStore.updateFiltersUrl(); gl.issueBoards.BoardsStore.updateFiltersUrl();
e.preventDefault(); e.preventDefault();
} else if ($dropdown.hasClass('js-filter-submit') && (isIssueIndex || isMRIndex)) { } else if ($dropdown.hasClass('js-filter-submit') && (isIssueIndex || isMRIndex)) {
selectedId = user.id; selectedId = user.id;

View file

@ -15,54 +15,54 @@
(() => { (() => {
beforeEach(() => { beforeEach(() => {
gl.boardService = new BoardService('/test/issue-boards/board'); gl.boardService = new BoardService('/test/issue-boards/board');
BoardsStore.create(); gl.issueBoards.BoardsStore.create();
$.cookie('issue_board_welcome_hidden', 'false'); $.cookie('issue_board_welcome_hidden', 'false');
}); });
describe('Store', () => { describe('Store', () => {
it('starts with a blank state', () => { it('starts with a blank state', () => {
expect(BoardsStore.state.lists.length).toBe(0); expect(gl.issueBoards.BoardsStore.state.lists.length).toBe(0);
}); });
describe('lists', () => { describe('lists', () => {
it('creates new list without persisting to DB', () => { it('creates new list without persisting to DB', () => {
BoardsStore.addList(listObj); gl.issueBoards.BoardsStore.addList(listObj);
expect(BoardsStore.state.lists.length).toBe(1); expect(gl.issueBoards.BoardsStore.state.lists.length).toBe(1);
}); });
it('finds list by ID', () => { it('finds list by ID', () => {
BoardsStore.addList(listObj); gl.issueBoards.BoardsStore.addList(listObj);
const list = BoardsStore.findList('id', 1); const list = gl.issueBoards.BoardsStore.findList('id', 1);
expect(list.id).toBe(1); expect(list.id).toBe(1);
}); });
it('finds list by type', () => { it('finds list by type', () => {
BoardsStore.addList(listObj); gl.issueBoards.BoardsStore.addList(listObj);
const list = BoardsStore.findList('type', 'label'); const list = gl.issueBoards.BoardsStore.findList('type', 'label');
expect(list).toBeDefined(); expect(list).toBeDefined();
}); });
it('finds list limited by type', () => { it('finds list limited by type', () => {
BoardsStore.addList({ gl.issueBoards.BoardsStore.addList({
id: 1, id: 1,
position: 0, position: 0,
title: 'Test', title: 'Test',
list_type: 'backlog' list_type: 'backlog'
}); });
const list = BoardsStore.findList('id', 1, 'backlog'); const list = gl.issueBoards.BoardsStore.findList('id', 1, 'backlog');
expect(list).toBeDefined(); expect(list).toBeDefined();
}); });
it('gets issue when new list added', (done) => { it('gets issue when new list added', (done) => {
BoardsStore.addList(listObj); gl.issueBoards.BoardsStore.addList(listObj);
const list = BoardsStore.findList('id', 1); const list = gl.issueBoards.BoardsStore.findList('id', 1);
expect(BoardsStore.state.lists.length).toBe(1); expect(gl.issueBoards.BoardsStore.state.lists.length).toBe(1);
setTimeout(() => { setTimeout(() => {
expect(list.issues.length).toBe(1); expect(list.issues.length).toBe(1);
@ -72,7 +72,7 @@
}); });
it('persists new list', (done) => { it('persists new list', (done) => {
BoardsStore.new({ gl.issueBoards.BoardsStore.new({
title: 'Test', title: 'Test',
type: 'label', type: 'label',
label: { label: {
@ -82,10 +82,10 @@
description: 'testing;' description: 'testing;'
} }
}); });
expect(BoardsStore.state.lists.length).toBe(1); expect(gl.issueBoards.BoardsStore.state.lists.length).toBe(1);
setTimeout(() => { setTimeout(() => {
const list = BoardsStore.findList('id', 1); const list = gl.issueBoards.BoardsStore.findList('id', 1);
expect(list).toBeDefined(); expect(list).toBeDefined();
expect(list.id).toBe(1); expect(list.id).toBe(1);
expect(list.position).toBe(0); expect(list.position).toBe(0);
@ -94,68 +94,68 @@
}); });
it('check for blank state adding', () => { it('check for blank state adding', () => {
expect(BoardsStore.shouldAddBlankState()).toBe(true); expect(gl.issueBoards.BoardsStore.shouldAddBlankState()).toBe(true);
}); });
it('check for blank state not adding', () => { it('check for blank state not adding', () => {
BoardsStore.addList(listObj); gl.issueBoards.BoardsStore.addList(listObj);
expect(BoardsStore.shouldAddBlankState()).toBe(false); expect(gl.issueBoards.BoardsStore.shouldAddBlankState()).toBe(false);
}); });
it('check for blank state adding when backlog & done list exist', () => { it('check for blank state adding when backlog & done list exist', () => {
BoardsStore.addList({ gl.issueBoards.BoardsStore.addList({
list_type: 'backlog' list_type: 'backlog'
}); });
BoardsStore.addList({ gl.issueBoards.BoardsStore.addList({
list_type: 'done' list_type: 'done'
}); });
expect(BoardsStore.shouldAddBlankState()).toBe(true); expect(gl.issueBoards.BoardsStore.shouldAddBlankState()).toBe(true);
}); });
it('adds the blank state', () => { it('adds the blank state', () => {
BoardsStore.addBlankState(); gl.issueBoards.BoardsStore.addBlankState();
const list = BoardsStore.findList('type', 'blank', 'blank'); const list = gl.issueBoards.BoardsStore.findList('type', 'blank', 'blank');
expect(list).toBeDefined(); expect(list).toBeDefined();
}); });
it('removes list from state', () => { it('removes list from state', () => {
BoardsStore.addList(listObj); gl.issueBoards.BoardsStore.addList(listObj);
expect(BoardsStore.state.lists.length).toBe(1); expect(gl.issueBoards.BoardsStore.state.lists.length).toBe(1);
BoardsStore.removeList(1); gl.issueBoards.BoardsStore.removeList(1);
expect(BoardsStore.state.lists.length).toBe(0); expect(gl.issueBoards.BoardsStore.state.lists.length).toBe(0);
}); });
it('moves the position of lists', () => { it('moves the position of lists', () => {
BoardsStore.addList(listObj); gl.issueBoards.BoardsStore.addList(listObj);
BoardsStore.addList(listObjDuplicate); gl.issueBoards.BoardsStore.addList(listObjDuplicate);
expect(BoardsStore.state.lists.length).toBe(2); expect(gl.issueBoards.BoardsStore.state.lists.length).toBe(2);
BoardsStore.moveList(0, 1); gl.issueBoards.BoardsStore.moveList(0, 1);
const list = BoardsStore.findList('id', 1); const list = gl.issueBoards.BoardsStore.findList('id', 1);
expect(list.position).toBe(1); expect(list.position).toBe(1);
}); });
it('moves an issue from one list to another', (done) => { it('moves an issue from one list to another', (done) => {
BoardsStore.addList(listObj); gl.issueBoards.BoardsStore.addList(listObj);
BoardsStore.addList(listObjDuplicate); gl.issueBoards.BoardsStore.addList(listObjDuplicate);
expect(BoardsStore.state.lists.length).toBe(2); expect(gl.issueBoards.BoardsStore.state.lists.length).toBe(2);
const list = BoardsStore.findList('id', 1), const list = gl.issueBoards.BoardsStore.findList('id', 1),
listTwo = BoardsStore.findList('id', 2); listTwo = gl.issueBoards.BoardsStore.findList('id', 2);
setTimeout(() => { setTimeout(() => {
expect(list.issues.length).toBe(1); expect(list.issues.length).toBe(1);
expect(listTwo.issues.length).toBe(1); expect(listTwo.issues.length).toBe(1);
BoardsStore.moveCardToList(1, 2, 1); gl.issueBoards.BoardsStore.moveCardToList(1, 2, 1);
expect(list.issues.length).toBe(0); expect(list.issues.length).toBe(0);
expect(listTwo.issues.length).toBe(1); expect(listTwo.issues.length).toBe(1);

View file

@ -17,7 +17,7 @@ describe('Issue model', () => {
beforeEach(() => { beforeEach(() => {
gl.boardService = new BoardService('/test/issue-boards/board'); gl.boardService = new BoardService('/test/issue-boards/board');
BoardsStore.create(); gl.issueBoards.BoardsStore.create();
issue = new ListIssue({ issue = new ListIssue({
title: 'Testing', title: 'Testing',

View file

@ -17,7 +17,7 @@ describe('List model', () => {
beforeEach(() => { beforeEach(() => {
gl.boardService = new BoardService('/test/issue-boards/board'); gl.boardService = new BoardService('/test/issue-boards/board');
BoardsStore.create(); gl.issueBoards.BoardsStore.create();
list = new List(listObj); list = new List(listObj);
}); });
@ -49,13 +49,13 @@ describe('List model', () => {
}); });
it('destroys the list', (done) => { it('destroys the list', (done) => {
BoardsStore.addList(listObj); gl.issueBoards.BoardsStore.addList(listObj);
list = BoardsStore.findList('id', 1); list = gl.issueBoards.BoardsStore.findList('id', 1);
expect(BoardsStore.state.lists.length).toBe(1); expect(gl.issueBoards.BoardsStore.state.lists.length).toBe(1);
list.destroy(); list.destroy();
setTimeout(() => { setTimeout(() => {
expect(BoardsStore.state.lists.length).toBe(0); expect(gl.issueBoards.BoardsStore.state.lists.length).toBe(0);
done(); done();
}, 0); }, 0);
}); });