Commit 5b7628d6 authored by Sean Hammond's avatar Sean Hammond

Simplify the group share links

parent bc75acd7
...@@ -4,22 +4,6 @@ var events = require('../events'); ...@@ -4,22 +4,6 @@ var events = require('../events');
// @ngInject // @ngInject
function GroupListController($scope, $window, groups) { function GroupListController($scope, $window, groups) {
$scope.expandedGroupId = undefined;
// show the share link for the specified group or clear it if
// null
$scope.toggleShareLink = function (groupId) {
if (!groupId || $scope.expandedGroupId === groupId) {
$scope.expandedGroupId = undefined;
} else {
$scope.expandedGroupId = groupId;
}
};
$scope.shouldShowShareLink = function (groupId) {
return $scope.expandedGroupId === groupId;
};
$scope.leaveGroup = function (groupId) { $scope.leaveGroup = function (groupId) {
var groupName = groups.get(groupId).name; var groupName = groups.get(groupId).name;
var message = 'Are you sure you want to leave the group "' + var message = 'Are you sure you want to leave the group "' +
...@@ -50,20 +34,6 @@ function groupList(groups, $window) { ...@@ -50,20 +34,6 @@ function groupList(groups, $window) {
$scope.createNewGroup = function() { $scope.createNewGroup = function() {
$window.open('/groups/new', '_blank'); $window.open('/groups/new', '_blank');
} }
$scope.$watch('expandedGroupId', function (activeGroupId) {
if (activeGroupId) {
// wait for the share link field to be revealed and then select
// the link's text
setTimeout(function() {
var shareLinkSelector = '.share-link-field[data-group-id="' +
activeGroupId + '"]';
var activeShareLinkField = elem[0].querySelector(shareLinkSelector);
activeShareLinkField.focus();
activeShareLinkField.select();
}, 0);
}
});
}, },
restrict: 'E', restrict: 'E',
scope: { scope: {
......
...@@ -21,26 +21,6 @@ describe('GroupListController', function () { ...@@ -21,26 +21,6 @@ describe('GroupListController', function () {
controller = new groupList.Controller($scope, fakeWindow, fakeGroups); controller = new groupList.Controller($scope, fakeWindow, fakeGroups);
}); });
it('toggles share links', function () {
$scope.toggleShareLink('group-a');
assert.equal($scope.expandedGroupId, 'group-a');
$scope.toggleShareLink('group-a');
assert.equal($scope.expandedGroupId, undefined);
$scope.toggleShareLink('group-b');
assert.equal($scope.expandedGroupId, 'group-b');
$scope.toggleShareLink('group-c');
assert.equal($scope.expandedGroupId, 'group-c');
});
it('shows share link for selected group', function () {
assert.equal($scope.shouldShowShareLink('group-a'), false);
$scope.toggleShareLink('group-a');
assert.equal($scope.shouldShowShareLink('group-a'), true);
$scope.toggleShareLink('group-b');
assert.equal($scope.shouldShowShareLink('group-a'), false);
assert.equal($scope.shouldShowShareLink('group-b'), true);
});
}); });
// returns true if a jQuery-like element has // returns true if a jQuery-like element has
...@@ -122,20 +102,9 @@ describe('groupList', function () { ...@@ -122,20 +102,9 @@ describe('groupList', function () {
var shareLinks = element.find('.share-link-container'); var shareLinks = element.find('.share-link-container');
assert.equal(shareLinks.length, 1); assert.equal(shareLinks.length, 1);
var linkField = element.find('.share-link-field'); var link = element.find('.share-link');
assert.equal(linkField.length, 1); assert.equal(link.length, 1);
assert.equal(linkField[0].value, GROUP_LINK); assert.equal(link[0].href, GROUP_LINK);
});
it('should toggle share link on click', function () {
var element = createGroupList();
var toggleLink = element.find('.share-link-toggle');
var expander = element.find('.share-link-expander');
assert.ok(isElementHidden(expander));
toggleLink.click();
assert.ok(!isElementHidden(expander));
toggleLink.click();
assert.ok(isElementHidden(expander));
}); });
function clickLeaveIcon(element, acceptPrompt) { function clickLeaveIcon(element, acceptPrompt) {
......
...@@ -114,9 +114,6 @@ $group-list-width: 270px; ...@@ -114,9 +114,6 @@ $group-list-width: 270px;
cursor: pointer; cursor: pointer;
&:hover { &:hover {
.share-link-toggle {
color: inherit;
}
.group-name-link { .group-name-link {
color: $brand-color; color: $brand-color;
} }
...@@ -143,7 +140,6 @@ $group-list-width: 270px; ...@@ -143,7 +140,6 @@ $group-list-width: 270px;
} }
.group-details { .group-details {
margin-right: 20px;
flex-grow: 1; flex-grow: 1;
flex-shrink: 1; flex-shrink: 1;
} }
......
...@@ -7,11 +7,11 @@ ...@@ -7,11 +7,11 @@
white-space: normal; white-space: normal;
} }
.share-link-toggle { .share-link {
color: $gray-light; color: $gray-light;
} }
.share-link-toggle:hover { .share-link:hover {
text-decoration: underline; text-decoration: underline;
color: $gray-dark; color: $gray-dark;
} }
......
...@@ -14,7 +14,6 @@ ...@@ -14,7 +14,6 @@
data-toggle="dropdown" data-toggle="dropdown"
role="button" role="button"
ng-switch on="groups.focused().public" ng-switch on="groups.focused().public"
ng-click="toggleShareLink(undefined)"
title="Change the selected group"> title="Change the selected group">
<i class="group-list-label__icon h-icon-public" ng-switch-when="true"></i><!-- nospace <i class="group-list-label__icon h-icon-public" ng-switch-when="true"></i><!-- nospace
!--><i class="group-list-label__icon h-icon-group" ng-switch-default></i> !--><i class="group-list-label__icon h-icon-group" ng-switch-default></i>
...@@ -42,22 +41,10 @@ ...@@ -42,22 +41,10 @@
</a> </a>
</div> </div>
<div class="share-link-container" ng-click="$event.stopPropagation()" ng-if="!group.public"> <div class="share-link-container" ng-click="$event.stopPropagation()" ng-if="!group.public">
<div> <a class="share-link" href="{{group.url}}" target="_blank">
<a class="share-link-toggle" View group activity and invite others
href=""
ng-click="toggleShareLink(group.id)"
title="Invite others to join this group">
Invite others to join this group
</a> </a>
</div> </div>
<div class="share-link-expander" ng-show="shouldShowShareLink(group.id)">
<input class="share-link-field" data-group-id="{{group.id}}" ng-value="group.url">
<p>
You can invite other people to join this group
by sending them this link
</p>
</div>
</div>
</div> </div>
<!-- the 'Leave group' icon !--> <!-- the 'Leave group' icon !-->
<div class="group-cancel-icon-container" ng-click="$event.stopPropagation()"> <div class="group-cancel-icon-container" ng-click="$event.stopPropagation()">
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment