Cdentinger has submitted this change and it was merged.
Change subject: Add new boards, add widgets to any board
......................................................................
Add new boards, add widgets to any board
Library now adds widgets to the last board displayed (and indicates
which board you're adding to).
Library 'Add' buttons are in the correct state for the current board.
TODO: deletion
Bug: T120673
Change-Id: I21d892d01c439cb53f8e230c3ebce602227c3425
---
M src/components/app-content/app-content.html
M src/components/app-content/app-content.js
M src/components/nav-bar/nav-bar.html
M src/components/nav-bar/nav-bar.js
M src/css/style.css
5 files changed, 71 insertions(+), 27 deletions(-)
Approvals:
Cdentinger: Looks good to me, approved
jenkins-bot: Verified
diff --git a/src/components/app-content/app-content.html
b/src/components/app-content/app-content.html
index 12def48..653c70a 100644
--- a/src/components/app-content/app-content.html
+++ b/src/components/app-content/app-content.html
@@ -25,13 +25,14 @@
<div class="container-fluid" data-bind='if: loggedIn()'>
<div class="row">
<h1>Widget Template Library</h1>
+ <h4>Adding widgets to: <span
data-bind="text:displayedBoard().displayName" ></span></h4>
<ul class="widgetLibrary" data-bind="foreach:
widgetTemplates">
<li>
<img data-bind="attr: {src:
previewPath}">
<h3 data-bind="text: displayName"></h3>
<p class="widgetDesc" data-bind="text:
description"></p>
- <button class="btn btn-block btn-col
btn-primary addToBoardBtn" data-bind="attr: { id: 'add-widget-'+id }, click:
$parent.addWidgetToBoard">Add to my board</button>
- <button class="hide btn btn-block
btn-col btn-success addToBoardBtn" data-bind="attr: { id: 'saved-widget-'+id
}"><i class="fa fa-check-circle-o"></i> Added.</button>
+ <button class="btn btn-block btn-col
btn-primary addToBoardBtn" data-bind="visible: !onBoard(), attr: { id:
'add-widget-'+id }, click: $parent.addWidgetToBoard">Add to my board</button>
+ <button class="btn btn-block btn-col
btn-success addToBoardBtn" data-bind="visible: onBoard(), attr: { id:
'saved-widget-'+id }"><i class="fa fa-check-circle-o"></i> Added.</button>
</li>
</ul>
</div>
diff --git a/src/components/app-content/app-content.js
b/src/components/app-content/app-content.js
index bfdae60..7958fdb 100644
--- a/src/components/app-content/app-content.js
+++ b/src/components/app-content/app-content.js
@@ -16,6 +16,15 @@
self.welcome = ko.observable('');
self.widgetTemplates = ko.observableArray();
self.widgetInstances = ko.observableArray();
+ self.currentBoardWidgets= ko.computed( function() {
+ var widgets = [];
+ if ( self.displayedBoard() ) {
+ $.each( self.displayedBoard().widgets,
function( idx, widget ) {
+ widgets[widget.widgetId] = true;
+ } );
+ }
+ return widgets;
+ } );
$.get( '/user/info', function( userInfo ) {
if ( userInfo && !userInfo.error ) {
@@ -40,28 +49,23 @@
contentType: 'application/json;
charset=UTF-8',
data: JSON.stringify( {
widgetId: event.id,
- displayName: 'My ' + event.displayName,
- isShared: false
+ displayName: 'My ' +
event.displayName,
+ isShared: false
} ),
success: function( data ) {
$.ajax( {
method: 'POST',
- url: '/board/' +
self.userdata().defaultBoard + '/widgets',
- contentType: 'application/json;
charset=UTF-8',
- data: JSON.stringify( {
- instanceId: data.id
- } ),
- success: function( stuff ) {
- //change the look of
the add widget button
- $( '#add-widget-' +
event.id ).hide();
- $( '#saved-widget-' +
event.id ).removeClass( 'hide' );
- //refresh the displayed
board
- if ( parseInt(
self.displayedBoard().id, 10 ) === self.userdata().defaultBoard ) {
- $.get( 'board/'
+ self.userdata().defaultBoard, function( moredata ){
+ url: '/board/' +
self.displayedBoard().id + '/widgets',
+ contentType:
'application/json; charset=UTF-8',
+ data: JSON.stringify( {
+ instanceId:
data.id
+ } ),
+ success: function(
stuff ) {
+ //refresh the
displayed board
+ $.get( 'board/'
+ self.displayedBoard().id, function( moredata ){
self.displayedBoard( moredata );
});
}
- }
} );
}
} );
@@ -95,20 +99,19 @@
self.displayedBoard( bdata );
});
}
-
};
- self.getWidgetTemplates = function(){
- $.get( '/widget', function( widgetTemplates ){
+ $.get( '/widget', function( widgetTemplates ){
- var wt = $.map(widgetTemplates,
function(n){
- return n;
- });
-
- self.widgetTemplates(wt);
+ var wt = $.map(widgetTemplates, function(n){
+ n.onBoard = ko.computed( function() {
+ return (
self.currentBoardWidgets()[n.id] );
+ } );
+ return n;
});
- };
- self.getWidgetTemplates();
+
+ self.widgetTemplates(wt);
+ });
self.getUsersWidgetInstances = function(){
$.get('/widget-instance', function(
widgetInstances ){
diff --git a/src/components/nav-bar/nav-bar.html
b/src/components/nav-bar/nav-bar.html
index 6e2a1c1..a0485f8 100644
--- a/src/components/nav-bar/nav-bar.html
+++ b/src/components/nav-bar/nav-bar.html
@@ -41,6 +41,11 @@
<ul data-bind="foreach:
userBoards">
<li data-bind="attr:
{id: $data['id']}, click: $parents[1].setDisplayPage, text: displayName"></li>
</ul>
+ <div id="newBoard">
+ <input type="text"
data-bind="value: newBoardName" placeholder="New board name"/>
+ <button
class="addBoard" data-bind="click: addBoard" >Add board</button>
+ <span class="error"
data-bind="text: boardError"></span>
+ </div>
</div>
<div class="mainNavButton" id="Library"
data-bind="click: $parent.setDisplayPage"><i class="fa fa-plug"></i><span
id="LibraryLink"> Library</span>
diff --git a/src/components/nav-bar/nav-bar.js
b/src/components/nav-bar/nav-bar.js
index d3d1e82..e673877 100644
--- a/src/components/nav-bar/nav-bar.js
+++ b/src/components/nav-bar/nav-bar.js
@@ -10,6 +10,8 @@
self.welcome = params.welcome;
self.userBoards = params.userBoards;
self.displayPage = ko.observable('filler');
+ self.newBoardName = ko.observable('');
+ self.boardError = ko.observable('');
self.hideNav = function(){
//make the nav menu fold out of view.
@@ -46,6 +48,35 @@
});
};
+ self.addBoard = function() {
+ var board, name = self.newBoardName();
+ self.boardError('');
+ if ( name === '' ) {
+ self.boardError( 'Enter new board name'
);
+ return;
+ }
+ board = {
+ displayName: name,
+ description: '',
+ isShared: false,
+ widgets: []
+ };
+ $.ajax( {
+ method: 'POST',
+ url: '/board',
+ contentType: 'application/json;
charset=UTF-8',
+ data: JSON.stringify( board ),
+ success: function( returned ) {
+ if ( returned.error ) {
+ self.boardError(
returned.error );
+ return;
+ }
+ board.id = returned.id;
+ self.userBoards.push( board );
+ self.newBoardName( '' );
+ }
+ });
+ };
}
return { viewModel: NavBarViewModel, template: template };
diff --git a/src/css/style.css b/src/css/style.css
index aa08299..81d6bcd 100644
--- a/src/css/style.css
+++ b/src/css/style.css
@@ -651,4 +651,8 @@
z-index: 1000;
padding: 4px 10px;
border-radius: 10px;
+}
+
+#newBoard {
+ text-align: right;
}
\ No newline at end of file
--
To view, visit https://gerrit.wikimedia.org/r/257079
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: merged
Gerrit-Change-Id: I21d892d01c439cb53f8e230c3ebce602227c3425
Gerrit-PatchSet: 2
Gerrit-Project: wikimedia/fundraising/dash
Gerrit-Branch: master
Gerrit-Owner: Ejegg <[email protected]>
Gerrit-Reviewer: Awight <[email protected]>
Gerrit-Reviewer: Cdentinger <[email protected]>
Gerrit-Reviewer: jenkins-bot <>
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
