ahtlon/deck
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

Merge pull request #358 from nextcloud/add-tooltips

Browse Source 
Add tooltips and support for contacts menu at avatars
This commit is contained in:
Julius Härtl
2017-12-17 17:44:35 +01:00
committed by GitHub
parent eb0810de27 183c2665eb
commit 415e5b5a1a
7 changed files with 31 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
css/style.scss
View File

@@ -57,7 +57,9 @@ input.input-inline {
border-radius: 0;
}
#app img {
box-sizing: content-box;
}
#searchbox {
display: flex !important;
@@ -713,7 +715,7 @@ input.input-inline {
.assigned-user {
position: relative;
.avatardiv {
.avatardiv-container {
margin-right: 5px;
}
.icon-delete {
@@ -937,7 +939,7 @@ input.input-inline {
#assigned-users {
display: flex;
.avatardiv {
.avatardiv-container {
margin: 6px;
}
}
@@ -1004,6 +1006,10 @@ input.input-inline {
}
}
.avatardiv-container {
position: relative;
}
#board-detail-labels {
ul li {
input {

5
js/app/Run.js
View File

@@ -74,4 +74,9 @@ app.run(function ($document, $rootScope, $transitions, BoardService) {
}
}
});
// Select all elements with data-toggle="tooltips" in the document
$('body').tooltip({
selector: '[data-toggle="tooltip"]'
});
});

11
js/directive/avatar.js
View File

@@ -26,11 +26,12 @@ app.directive('avatar', function() {
restrict: 'A',
scope: true,
link: function(scope, element, attr){
attr.$observe('displayname', function(value){
if(value!==undefined) {
$(element).avatar(value, 32);
}
});
var value = attr.user;
$(element).wrap('<div class="avatardiv-container"></div>');
if(attr.contactsmenu && oc_current_user !== value) {
$(element).contactsMenu(value, 0, $(element).parent());
}
$(element).avatar(value, 32, false, false, false, attr.displayname);
}
};
});

2
templates/part.board.mainView.php
View File

@@ -82,7 +82,7 @@
</span>
<div class="card-assigned-users">
<div class="assigned-user" ng-repeat="user in c.assignedUsers | limitTo: 3">
<div class="avatardiv" avatar ng-attr-displayname="{{ user.participant.uid }}"></div>
<div class="avatardiv" avatar ng-attr-user="{{ user.participant.uid }}" ng-attr-displayname="{{ user.participant.displayname }}" data-toggle="tooltip" data-placement="bottom" title="{{ user.participant.displayname }}"></div>
</div>
</div>
<div class="app-popover-menu-utils" ng-if="!boardservice.isArchived()">

6
templates/part.board.sidebarView.php
View File

@@ -25,7 +25,7 @@
<span><i class="icon icon-{{aclTypeString($item)}}"></i> {{ $item.participant.displayname }}</span>
</ui-select-match>
<ui-select-choices refresh="searchForUser($select.search)" refresh-delay="0" repeat="sharee in boardservice.sharees">
<div class="avatardiv" avatar displayname="{{ sharee.participant.uid }}" ng-if="sharee.type==OC.Share.SHARE_TYPE_USER"></div>
<div class="avatardiv" avatar data-user="{{ sharee.participant.uid }}" data-displayname="{{ sharee.participant.displayname }}" ng-if="sharee.type==OC.Share.SHARE_TYPE_USER"></div>
<div class="avatardiv" ng-if="sharee.type==OC.Share.SHARE_TYPE_GROUP"><i class="icon icon-{{aclTypeString(sharee)}}" title="<?php p($l->t('Access for')); ?> {{aclTypeString(sharee)}}"></i></div>
<span class="has-tooltip username">
{{ sharee.participant.displayname }}
@@ -39,14 +39,14 @@
<ul id="shareWithList" class="shareWithList">
<li>
<span class="icon-loading-small" style="display:none;"></span>
<div class="avatardiv" avatar ng-attr-displayname="{{ boardservice.getCurrent().owner.uid }}" ng-if="boardservice.id"></div>
<div class="avatardiv" avatar data-user="{{ boardservice.getCurrent().owner.uid }}" data-displayname="{{ boardservice.getCurrent().owner.displayname }}" ng-if="boardservice.id"></div>
<span class="has-tooltip username">
{{ boardservice.getCurrent().owner.displayname }}
</span>
</li>
<li ng-repeat="acl in boardservice.getCurrent().acl track by $index">
<span class="icon-loading-small" style="display:none;" title="<?php p($l->t('Loading')); ?>"></span>
<div class="avatardiv" avatar displayname="{{ acl.participant.uid }}" ng-if="acl.type==OC.Share.SHARE_TYPE_USER"></div>
<div class="avatardiv" avatar data-contactsmenu="true" data-user="{{ acl.participant.uid }}" data-displayname="{{ acl.participant.displayname }}" ng-if="acl.type==OC.Share.SHARE_TYPE_USER"></div>
<div class="avatardiv" ng-if="acl.type==OC.Share.SHARE_TYPE_GROUP"><i class="icon icon-{{aclTypeString(acl)}}" title="<?php p($l->t('Access for')); ?> {{aclTypeString(acl)}}"></i></div>
<span class="has-tooltip username">

4
templates/part.boardlist.php
View File

@@ -41,8 +41,8 @@
</td>
<td>
<div id="assigned-users">
<div class="avatardiv" avatar displayname="{{ b.owner.uid }}" title="{{ b.owner.displayname }}"></div>
<div class="avatardiv" avatar displayname="{{ acl.participant.uid }}" title="{{ acl.participant.uid }}" ng-repeat="acl in b.acl | limitTo: 7"></div>
<div class="avatardiv" avatar data-user="{{ b.owner.uid }}" data-displayname="{{ b.owner.displayname }}" data-toggle="tooltip" title="{{ b.owner.displayname }}"></div>
<div class="avatardiv" avatar data-contactsmenu="true" data-user="{{ acl.participant.uid }}" data-displayname="{{ acl.participant.displayname }}" data-toggle="tooltip" title="{{ acl.participant.displayname }}" ng-repeat="acl in b.acl | limitTo: 7"></div>
</div>
</td>
<td>

9
templates/part.card.php
View File

@@ -62,12 +62,13 @@
<span><i class="icon icon-{{$item.type}}"></i> {{ $item.participant.displayname }}</span>
</ui-select-match>
<ui-select-choices repeat="user in boardservice.getCurrent().users | filter: $select.search | withoutAssignedUsers: cardservice.getCurrent().assignedUsers track by user.uid">
<div class="avatardiv" avatar ng-attr-displayname="{{ user.uid }}" ng-if="boardservice.id"></div><span>{{ user.displayname }}</span>
<div class="avatardiv" avatar ng-attr-user="{{ user.uid }}" ng-attr-displayname="{{ user.displayname }}" ng-if="boardservice.id"></div><span>{{ user.displayname }}</span>
</ui-select-choices>
</ui-select>
<div class="card-details-assign-users-list">
<div class="assigned-user" ng-repeat="user in cardservice.getCurrent().assignedUsers">
<div class="avatardiv" avatar ng-attr-displayname="{{ user.participant.uid }}"></div>
<div class="assigned-user" ng-repeat="user in cardservice.getCurrent().assignedUsers"
data-toggle="tooltip" data-placement="bottom" title="{{ user.participant.displayname }}">
<div class="avatardiv" avatar data-contactsmenu="true" ng-attr-user="{{ user.participant.uid }}" ng-attr-displayname="{{ user.participant.uid }}"></div>
<div class="icon icon-delete" ng-click="removeAssignedUser(user)"></div>
</div>
</div>
@@ -88,7 +89,7 @@
<h4>
<div>
<?php p($l->t('Description')); ?>
<a href="https://github.com/nextcloud/deck/wiki/Markdown-Help" target="_blank" class="icon icon-help" title="<?php p($l->t('Formatting help')); ?>"><span class="hidden-visually"><?php p($l->t('Formatting help')); ?></span></a>
<a href="https://github.com/nextcloud/deck/wiki/Markdown-Help" target="_blank" class="icon icon-help" data-toggle="tooltip" data-placement="right" title="<?php p($l->t('Formatting help')); ?>"><span class="hidden-visually"><?php p($l->t('Formatting help')); ?></span></a>
</div>
</h4>
<span class="save-indicator saved"><?php p($l->t('Saved')); ?></span>