diff --git a/app/directives/external-account/external-link-data.directive.jade b/app/directives/external-account/external-link-data.directive.jade index 9aee448ce..3ab291ef6 100644 --- a/app/directives/external-account/external-link-data.directive.jade +++ b/app/directives/external-account/external-link-data.directive.jade @@ -1,5 +1,5 @@ .external-link-list - div.external-link-tile(ng-repeat="account in linkedAccountsData", ng-class="{'external-link-tile--editable' : editable}") + .external-link-tile(ng-repeat="account in linkedAccountsData", ng-class="{'external-link-tile--editable' : editable, 'external-link-tile--pending' : account.status === 'PENDING' || account.data.status === 'PENDING'}", ng-click="openLink(account)") .top .ext-link-tile_edit-header(ng-show="editable && account.provider === 'weblink'") .ext-link-tile_edit-header_delete(ng-click="confirmDeletion(account)", ng-class="{'ext-link-tile_edit-header_delete--disabled': account.deletingAccount || account.status === 'PENDING'}") @@ -106,4 +106,4 @@ p.link-title(data-ellipsis, ng-bind="account.title", ng-hide="account.status === 'PENDING'") p.link-title(ng-show="account.status === 'PENDING'") Loading data. This will take a few minutes. - a.link-url(ng-href="{{account.URL | urlProtocol}}", ng-bind="account.URL") + a.link-url(ng-href="{{account.URL | urlProtocol}}", ng-bind="account.URL", target="_blank",prevent-event-propagation) diff --git a/app/directives/external-account/external-links-data.directive.js b/app/directives/external-account/external-links-data.directive.js index e03b3006e..ac4744f9f 100644 --- a/app/directives/external-account/external-links-data.directive.js +++ b/app/directives/external-account/external-links-data.directive.js @@ -18,12 +18,27 @@ editable: '=', userHandle: '@' }, - controller: ['$log', '$scope', 'ExternalWebLinksService', 'toaster', 'ngDialog', - function($log, $scope, ExternalWebLinksService, toaster, ngDialog) { + controller: ['$log', '$scope', '$window', '$filter', 'ExternalWebLinksService', 'toaster', 'ngDialog', + function($log, $scope, $window, $filter, ExternalWebLinksService, toaster, ngDialog) { $log = $log.getInstance("ExternalLinksDataCtrl"); $scope.deletionDialog = null; + $scope.openLink = function(account) { + var url = null; + if (account) { + if (account.data && account.data.profileURL && account.data.status !== 'PENDING') { + url = account.data.profileURL; + } + if (account.URL && account.status !== 'PENDING') { + url = account.URL; + } + } + if (url) { + $window.open($filter('urlProtocol')(url), '_blank'); + } + } + $scope.confirmDeletion = function(account) { $scope.deletionDialog = ngDialog.open({ className: 'ngdialog-theme-default tc-dialog', diff --git a/app/directives/preventEventPropagation.directive.js b/app/directives/preventEventPropagation.directive.js new file mode 100644 index 000000000..2978e972b --- /dev/null +++ b/app/directives/preventEventPropagation.directive.js @@ -0,0 +1,15 @@ +(function() { + 'use strict'; + + angular.module('tcUIComponents').directive('preventEventPropagation', preventEventPropagation); + + preventEventPropagation.$inject = ['$timeout', '$parse']; + + function preventEventPropagation($timeout, $parse) { + return function(scope, element, attr) { + element.bind('click', function(evt) { + evt.stopPropagation(); + }); + }; + } +})(); diff --git a/app/index.jade b/app/index.jade index 3bf24f775..52b4087a3 100644 --- a/app/index.jade +++ b/app/index.jade @@ -205,6 +205,7 @@ html script(src="directives/on-file-change.directive.js") script(src="directives/onoffswitch/onoffswitch.directive.js") script(src="directives/page-state-header/page-state-header.directive.js") + script(src="directives/preventEventPropagation.directive.js") script(src="directives/profile-widget/profile-widget.directive.js") script(src="directives/responsive-carousel/responsive-carousel.directive.js") script(src="directives/skill-tile/skill-tile.directive.js") diff --git a/assets/css/directives/external-link-data.scss b/assets/css/directives/external-link-data.scss index aa8f3423b..24cc9a471 100644 --- a/assets/css/directives/external-link-data.scss +++ b/assets/css/directives/external-link-data.scss @@ -313,5 +313,11 @@ external-accounts { .external-link-tile--editable { // height: 285px; } + + .external-link-tile--pending { + &:hover { + cursor: default; + } + } } }