Skip to content

Commit

Permalink
Merge pull request #33 from tomaszrondio/master
Browse files Browse the repository at this point in the history 
fix: SWP-1167 content lists
  • Loading branch information
@takeit
takeit authored Jun 4, 2018
2 parents 7c68a8b + f0c4881 commit 15422bf
Show file tree
Hide file tree
Showing 4 changed files with 83 additions and 28 deletions.
38 changes: 34 additions & 4 deletions client/controllers/WebPublisherContentListsController.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -355,7 +355,6 @@ export function WebPublisherContentListsController($scope, publisher, modal, $ti
} else {
$scope.newList.updatedItems.splice($scope.newList.updatedItems.indexOf(updatedItem), 1);
}
console.log($scope.newList.updatedItems);
this._markDuplicates($scope.newList.items);
this.listChangeFlag = true;
};
Expand All @@ -366,7 +365,7 @@ export function WebPublisherContentListsController($scope, publisher, modal, $ti
* @param {Object} list - list of article items
* @param {Array} item - dropped items
* @param {Int} index - index of list where items were dropped
* @returns {Boolean}
* @returns {Object}
* @description Handles drop event
*/
onDrop(list, item, index) {
Expand All @@ -379,15 +378,43 @@ export function WebPublisherContentListsController($scope, publisher, modal, $ti
let selectedItemId = item.content ? item.content.id : item.id;
let itemAction = _.find(list.items,
item => (item.id === selectedItemId && !item.content) || (item.content && item.content.id === selectedItemId)) ? 'move' : 'add';
list.updatedItems.push({content_id: selectedItemId, action: itemAction});

list.updatedItems.push({content_id: selectedItemId, action: itemAction, position: index});

if (itemAction === 'add') {
$timeout(() => {
this.updatePositions(list);
}, 500);
}

return item;
};

/**
* @ngdoc method
* @name WebPublisherContentListsController#onMoved
* @param {Object} list - list object
* @param {Int} index - index of list where items were dropped
* @description Handles move event
*/
onMoved(list, index) {
list.items.splice(index, 1);
this.updatePositions(list);
};

/**
* @ngdoc method
* @name WebPublisherContentListsController#updatePositions
* @param {Object} list - list object
* @description updates position of articles in array of changes
*/
updatePositions(list) {
for (let i = 0; i < list.updatedItems.length; i++) {
let itemInList = _.find(list.items, {content: {id: list.updatedItems[i].content_id}}) ||
_.find(list.items, {id: list.updatedItems[i].content_id});

list.updatedItems[i].position = list.items.indexOf(itemInList);
}
return item;
};

/**
Expand Down Expand Up @@ -441,6 +468,9 @@ export function WebPublisherContentListsController($scope, publisher, modal, $ti
_queryArticles() {
this.tenantArticles.loading = true;
this.tenantArticles.params.limit = 20;
this.tenantArticles.params['sorting[updatedAt]'] = 'desc';
this.tenantArticles.params.status = 'published';

publisher.queryTenantArticles(this.tenantArticles.params).then((response) => {
response._embedded._items.forEach(el => {
el.type = 'tenant';
Expand Down
25 changes: 18 additions & 7 deletions client/directives/listArticles/list-articles-detail.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,16 +9,27 @@ <h4 translate>The list is empty</h4>

<ul ng-if="!loading && articles.length" class="flatList">
<li ng-repeat="article in articles">
<div class="listElement listElement--noLeftBorder">
<div class="listElement__icon">
<i ng-if="!article.featureMedia && !article.content.featureMedia" class="icon-text"></i>
<i ng-if="article.featureMedia || article.content.featureMedia" class="icon-photo"></i>

<div class="sd-list-item sd-shadow--z1" ng-class="{&quot;sd-list-item--activated&quot;:itemActive2}">
<div class="sd-list-item__border"></div>
<div class="sd-list-item__column" ng-if="article.duplicate" sd-tooltip="duplicate">
<i class="icon-warning-sign icon--red"></i>
</div>
<div class="sd-list-item__column sd-list-item__column--grow sd-list-item__column--no-border">
<div class="sd-list-item__row">
<span class="sd-overflow-ellipsis">{{ :: article.title || article.content.title}}</span>

</div>
<div class="sd-list-item__row">
<time class="noPadding">{{article.updatedAt || article.createdAt || article.content.updatedAt || article.content.createdAt | reldate}}</time>
<span class="sd-overflow-ellipsis sd-list-item--element-grow"></span>
<span class="label label--success label--hollow">{{article.route.name || article.content.route.name}}</span>
<span ng-if="article.sticky" class="pull-right state-label state-fetched" translate>pinned</span>
</div>
</div>
<div class="listElement__content">
{{ :: article.content.title}}
<div class="sd-list-item__action-menu">
<button class="pull-right" ng-if="article.sticky" ng-click="pinArticle(article)" title="{{:: 'Unpin' | translate }}"><i class="icon-pin"></i></button>
<button class="hidden pull-right" ng-if="!article.sticky" ng-click="pinArticle(article)" title="{{:: 'Pin' | translate }}"><i class="icon-pin"></i></button>
<span ng-if="article.sticky" class="pull-right state-label state-fetched" translate>pinned</span>
</div>
</div>
</li>
Expand Down
4 changes: 4 additions & 0 deletions client/styles/helperElements.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -64,6 +64,10 @@
margin: -2rem;
}

.noPadding {
padding: 0 !important;
}

.countLabel {
display: inline-block;
background-color: #90bccf;
Expand Down
44 changes: 27 additions & 17 deletions client/views/content-lists/content-list-manual.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -139,15 +139,21 @@ <h4 translate>The list is empty</h4>
dnd-type="article.type"
dnd-effect-allowed="move"
>
<div class="listElement listElement--noLeftBorder">
<div class="listElement__icon">
<i ng-if="!article.featureMedia && !article.content.featureMedia" class="icon-text"></i>
<i ng-if="article.featureMedia || article.content.featureMedia" class="icon-photo"></i>
<div class="sd-list-item sd-shadow--z1" ng-class="{&quot;sd-list-item--activated&quot;:itemActive2}">
<div class="sd-list-item__border"></div>
<div class="sd-list-item__column" ng-if="article.duplicate" sd-tooltip="duplicate">
<i class="icon-warning-sign icon--red"></i>
</div>
<div class="sd-list-item__column sd-list-item__column--grow sd-list-item__column--no-border">
<div class="sd-list-item__row">
<span class="sd-overflow-ellipsis">{{ :: article.title || article.content.title}}</span>

</div>
<div class="listElement__content">
{{ :: article.title}}
<div class="sd-list-item__row">
<time class="noPadding">{{article.updatedAt || article.createdAt || article.content.updatedAt || article.content.createdAt | reldate}}</time><span class="sd-overflow-ellipsis sd-list-item--element-grow"></span><span class="label label--success label--hollow">{{article.route.name || article.content.route.name}}</span>
</div>
</div>
</div>
</li>
</ul>
<div ng-if="webPublisherContentLists.tenantArticles.loading" class="topMargin">
Expand All @@ -171,30 +177,34 @@ <h4 translate>The list is empty</h4>
<p translate>Please update filter criteria to add articles to the list.</p>
</div>

<ul ng-if="!loading && newList.items.length" class="flatList"
<ul ng-if="!loading" class="sd-list-item-group sd-list-item-group--space-between-items" style="min-height: 50vh;"
dnd-list="newList.items"
dnd-drop="webPublisherContentLists.onDrop(newList, item, index)"
dnd-inserted="webPublisherContentLists._markDuplicates(newList.items)"
dnd-allowed-types="['tenant', 'list']"
>
<li ng-repeat="article in newList.items | filter:newList.filterQuery"
dnd-draggable="article"
dnd-moved="newList.items.splice($index, 1)"
dnd-moved="webPublisherContentLists.onMoved(newList, $index)"
dnd-type="article.type"
dnd-effect-allowed="move"
dnd-copied="alert('copy')"
>
<div class="listElement listElement--noLeftBorder" >
<div class="listElement__icon" ng-if="article.duplicate" sd-tooltip="duplicate">
<div class="sd-list-item sd-shadow--z1" ng-class="{&quot;sd-list-item--activated&quot;:itemActive2}">
<div class="sd-list-item__border"></div>
<div class="sd-list-item__column" ng-if="article.duplicate" sd-tooltip="duplicate">
<i class="icon-warning-sign icon--red"></i>
</div>
<div class="listElement__icon" ng-if="!article.duplicate">
<i ng-if="!article.featureMedia && !article.content.featureMedia" class="icon-text"></i>
<i ng-if="article.featureMedia || article.content.featureMedia" class="icon-photo"></i>
<div class="sd-list-item__column sd-list-item__column--grow sd-list-item__column--no-border">
<div class="sd-list-item__row">
<span class="sd-overflow-ellipsis">{{ :: article.title || article.content.title}}</span>

</div>
<div class="sd-list-item__row">
<time class="noPadding">{{article.updatedAt || article.createdAt || article.content.updatedAt || article.content.createdAt | reldate}}</time><span class="sd-overflow-ellipsis sd-list-item--element-grow"></span><span class="label label--success label--hollow">{{article.route.name || article.content.route.name}}</span>
</div>
</div>
<div class="listElement__content">
{{ :: article.title || article.content.title}}
<button class="hidden pull-right" ng-if="!article.sticky" ng-click="webPublisherContentLists.removeFromList($index)" title="{{:: 'Delete' | translate }}"><i class="icon-trash"></i></button>
<div class="sd-list-item__action-menu">
<button ng-if="!article.sticky" ng-click="webPublisherContentLists.removeFromList($index)" title="{{:: 'Delete' | translate }}"><i class="icon-trash"></i></button>
</div>
</div>
</li>
Expand Down

0 comments on commit 15422bf

Please sign in to comment.