Skip to content

C
coopwire-hypothesis
Commit 11abab35 authored by Robert Knight's avatar Robert Knight Committed by GitHub
Browse files
Options

Merge pull request #287 from hypothesis/use-ng-components 

Convert element directives to components
parents dc979501 fff61fda
Hide whitespace changes
Inline Side-by-side
Showing with 412 additions and 493 deletions
src/sidebar/app.js
View file @ 11abab35
......@@ -135,38 +135,41 @@ module.exports = angular.module('h', [
// The root component for the application
.directive('hypothesisApp', require('./directive/app'))
// UI components and helpers
.directive('annotation', require('./directive/annotation').directive)
.directive('annotationShareDialog', require('./directive/annotation-share-dialog'))
.directive('annotationThread', require('./directive/annotation-thread'))
.directive('dropdownMenuBtn', require('./directive/dropdown-menu-btn'))
// UI components
.component('annotation', require('./directive/annotation').component)
.component('annotationShareDialog', require('./directive/annotation-share-dialog'))
.component('annotationThread', require('./directive/annotation-thread'))
.component('dropdownMenuBtn', require('./directive/dropdown-menu-btn'))
.component('helpLink', require('./directive/help-link'))
.component('helpPanel', require('./directive/help-panel'))
.component('loggedoutMessage', require('./directive/loggedout-message'))
.component('loginControl', require('./directive/login-control'))
.component('loginForm', require('./directive/login-form').component)
.component('publishAnnotationBtn', require('./directive/publish-annotation-btn'))
.component('searchInput', require('./directive/search-input'))
.component('searchStatusBar', require('./directive/search-status-bar'))
.component('selectionTabs', require('./directive/selection-tabs'))
.component('sidebarTutorial', require('./directive/sidebar-tutorial').component)
.component('shareDialog', require('./directive/share-dialog'))
.component('sortDropdown', require('./directive/sort-dropdown'))
.component('svgIcon', require('./directive/svg-icon'))
.component('tagEditor', require('./directive/tag-editor'))
.component('threadList', require('./directive/thread-list'))
.component('timestamp', require('./directive/timestamp'))
// These should use `component()` but will require some changes.
.directive('groupList', require('./directive/group-list').directive)
.directive('markdown', require('./directive/markdown'))
.directive('topBar', require('./directive/top-bar'))
.directive('excerpt', require('./directive/excerpt').directive)
.directive('formInput', require('./directive/form-input'))
.directive('formValidate', require('./directive/form-validate'))
.directive('groupList', require('./directive/group-list').directive)
.directive('helpLink', require('./directive/help-link'))
.directive('helpPanel', require('./directive/help-panel'))
.directive('hAutofocus', require('./directive/h-autofocus'))
.directive('hOnTouch', require('./directive/h-on-touch'))
.directive('hTooltip', require('./directive/h-tooltip'))
.directive('loggedoutMessage', require('./directive/loggedout-message'))
.directive('loginControl', require('./directive/login-control'))
.directive('loginForm', require('./directive/login-form').directive)
.directive('markdown', require('./directive/markdown'))
.directive('publishAnnotationBtn', require('./directive/publish-annotation-btn'))
.directive('searchStatusBar', require('./directive/search-status-bar'))
.directive('shareDialog', require('./directive/share-dialog'))
.directive('sidebarTutorial', require('./directive/sidebar-tutorial').directive)
.directive('searchInput', require('./directive/search-input'))
.directive('selectionTabs', require('./directive/selection-tabs'))
.directive('sortDropdown', require('./directive/sort-dropdown'))
.directive('spinner', require('./directive/spinner'))
.directive('statusButton', require('./directive/status-button'))
.directive('svgIcon', require('./directive/svg-icon'))
.directive('tagEditor', require('./directive/tag-editor'))
.directive('threadList', require('./directive/thread-list'))
.directive('timestamp', require('./directive/timestamp'))
.directive('topBar', require('./directive/top-bar'))
.directive('windowScroll', require('./directive/window-scroll'))
.service('analytics', require('./analytics'))
......
src/sidebar/directive/annotation-share-dialog.js
View file @ 11abab35
......@@ -4,73 +4,69 @@ var angular = require('angular');
var scopeTimeout = require('../util/scope-timeout');
module.exports = function () {
return {
bindToController: true,
controllerAs: 'vm',
restrict: 'E',
template: require('../templates/annotation_share_dialog.html'),
// @ngInject
controller: function ($scope, $element) {
var shareLinkInput = $element.find('input')[0];
module.exports = {
controllerAs: 'vm',
template: require('../templates/annotation_share_dialog.html'),
// @ngInject
controller: function ($scope, $element) {
var shareLinkInput = $element.find('input')[0];
$scope.$watch('vm.isOpen', function (isOpen) {
if (isOpen) {
// Focus the input and select it once the dialog has become visible
scopeTimeout($scope, function () {
shareLinkInput.focus();
shareLinkInput.select();
});
$scope.$watch('vm.isOpen', function (isOpen) {
if (isOpen) {
// Focus the input and select it once the dialog has become visible
scopeTimeout($scope, function () {
shareLinkInput.focus();
shareLinkInput.select();
});
var hideListener = function (event) {
$scope.$apply(function () {
if (!$element[0].contains(event.target)) {
document.removeEventListener('click', hideListener);
this.onClose();
}
}.bind(this));
}.bind(this);
var hideListener = function (event) {
$scope.$apply(function () {
if (!$element[0].contains(event.target)) {
document.removeEventListener('click', hideListener);
this.onClose();
}
}.bind(this));
}.bind(this);
// Stop listening for clicks outside the dialog once it is closed.
// The setTimeout() here is to ignore the initial click that opens
// the dialog.
scopeTimeout($scope, function () {
document.addEventListener('click', hideListener);
}, 0);
}
}.bind(this));
// Stop listening for clicks outside the dialog once it is closed.
// The setTimeout() here is to ignore the initial click that opens
// the dialog.
scopeTimeout($scope, function () {
document.addEventListener('click', hideListener);
}, 0);
}
}.bind(this));
this.copyToClipboard = function (event) {
var $container = angular.element(event.currentTarget).parent();
var shareLinkInput = $container.find('input')[0];
this.copyToClipboard = function (event) {
var $container = angular.element(event.currentTarget).parent();
var shareLinkInput = $container.find('input')[0];
try {
shareLinkInput.select();
try {
shareLinkInput.select();
// In some browsers, execCommand() returns false if it fails,
// in others, it may throw an exception instead.
if (!document.execCommand('copy')) {
throw new Error('Copying link failed');
}
this.copyToClipboardMessage = 'Link copied to clipboard!';
} catch (ex) {
this.copyToClipboardMessage = 'Select and copy to share.';
} finally {
setTimeout(function () {
this.copyToClipboardMessage = null;
$scope.$digest();
}.bind(this),
1000);
// In some browsers, execCommand() returns false if it fails,
// in others, it may throw an exception instead.
if (!document.execCommand('copy')) {
throw new Error('Copying link failed');
}
}.bind(this);
},
scope: {
group: '<',
uri: '<',
isPrivate: '<',
isOpen: '<',
onClose: '&',
},
};
this.copyToClipboardMessage = 'Link copied to clipboard!';
} catch (ex) {
this.copyToClipboardMessage = 'Select and copy to share.';
} finally {
setTimeout(function () {
this.copyToClipboardMessage = null;
$scope.$digest();
}.bind(this),
1000);
}
}.bind(this);
},
bindings: {
group: '<',
uri: '<',
isPrivate: '<',
isOpen: '<',
onClose: '&',
},
};
src/sidebar/directive/annotation-thread.js
View file @ 11abab35
......@@ -97,28 +97,24 @@ function AnnotationThreadController() {
/**
* Renders a thread of annotations.
*/
module.exports = function () {
return {
restrict: 'E',
bindToController: true,
controllerAs: 'vm',
controller: AnnotationThreadController,
scope: {
/** The annotation thread to render. */
thread: '<',
/**
* Specify whether document information should be shown
* on annotation cards.
*/
showDocumentInfo: '<',
/** Called when the user clicks on the expand/collapse replies toggle. */
onChangeCollapsed: '&',
/**
* Called when the user clicks the button to show this thread or
* one of its replies.
*/
onForceVisible: '&',
},
template: require('../templates/annotation_thread.html'),
};
module.exports = {
controllerAs: 'vm',
controller: AnnotationThreadController,
bindings: {
/** The annotation thread to render. */
thread: '<',
/**
* Specify whether document information should be shown
* on annotation cards.
*/
showDocumentInfo: '<',
/** Called when the user clicks on the expand/collapse replies toggle. */
onChangeCollapsed: '&',
/**
* Called when the user clicks the button to show this thread or
* one of its replies.
*/
onForceVisible: '&',
},
template: require('../templates/annotation_thread.html'),
};
src/sidebar/directive/annotation.js
View file @ 11abab35
......@@ -556,23 +556,18 @@ function AnnotationController(
init();
}
// @ngInject
function annotation() {
return {
restrict: 'E',
bindToController: true,
controller: AnnotationController,
controllerAs: 'vm',
scope: {
annotation: '<',
showDocumentInfo: '<',
onReplyCountClick: '&',
replyCount: '<',
isCollapsed: '<',
},
template: require('../templates/annotation.html'),
};
}
var component = {
controller: AnnotationController,
controllerAs: 'vm',
bindings: {
annotation: '<',
showDocumentInfo: '<',
onReplyCountClick: '&',
replyCount: '<',
isCollapsed: '<',
},
template: require('../templates/annotation.html'),
};
module.exports = {
// These private helper functions aren't meant to be part of the public
......@@ -583,6 +578,6 @@ module.exports = {
updateModel: updateModel,
// These are meant to be the public API of this module.
directive: annotation,
component: component,
Controller: AnnotationController,
};
src/sidebar/directive/dropdown-menu-btn.js
View file @ 11abab35
'use strict';
// @ngInject
function DropdownMenuBtnController($scope, $timeout) {
this.onClick = function () {
$scope.onClick();
};
function DropdownMenuBtnController($timeout) {
var self = this;
this.toggleDropdown = function($event) {
$event.stopPropagation();
$timeout(function () {
$scope.onToggleDropdown();
self.onToggleDropdown();
}, 0);
};
}
module.exports = function () {
return {
controller: DropdownMenuBtnController,
controllerAs: 'vm',
restrict: 'E',
scope: {
isDisabled: '<',
label: '<',
dropdownMenuLabel: '@',
onClick: '&',
onToggleDropdown: '&',
},
template: require('../templates/dropdown_menu_btn.html'),
};
module.exports = {
controller: DropdownMenuBtnController,
controllerAs: 'vm',
bindings: {
isDisabled: '<',
label: '<',
dropdownMenuLabel: '@',
onClick: '&',
onToggleDropdown: '&',
},
template: require('../templates/dropdown_menu_btn.html'),
};
src/sidebar/directive/help-link.js
View file @ 11abab35
'use strict';
module.exports = function () {
return {
bindToController: true,
controllerAs: 'vm',
restrict: 'E',
template: require('../templates/help_link.html'),
controller: function () {},
scope: {
version: '<',
userAgent: '<',
url: '<',
documentFingerprint: '<',
auth: '<',
dateTime: '<',
},
};
module.exports = {
controllerAs: 'vm',
template: require('../templates/help_link.html'),
controller: function () {},
scope: {
version: '<',
userAgent: '<',
url: '<',
documentFingerprint: '<',
auth: '<',
dateTime: '<',
},
};
src/sidebar/directive/help-panel.js
View file @ 11abab35
......@@ -6,35 +6,31 @@
* @description Displays product version and environment info
*/
// @ngInject
module.exports = function () {
return {
bindToController: true,
controllerAs: 'vm',
// @ngInject
controller: function ($scope, $window, annotationUI, serviceUrl) {
this.userAgent = $window.navigator.userAgent;
this.version = '__VERSION__'; // replaced by versionify
this.dateTime = new Date();
this.serviceUrl = serviceUrl;
module.exports = {
controllerAs: 'vm',
// @ngInject
controller: function ($scope, $window, annotationUI, serviceUrl) {
this.userAgent = $window.navigator.userAgent;
this.version = '__VERSION__'; // replaced by versionify
this.dateTime = new Date();
this.serviceUrl = serviceUrl;
$scope.$watch(
function () {
return annotationUI.frames();
},
function (frames) {
if (frames.length === 0) {
return;
}
this.url = frames[0].uri;
this.documentFingerprint = frames[0].documentFingerprint;
}.bind(this)
);
},
restrict: 'E',
template: require('../templates/help_panel.html'),
scope: {
auth: '<',
onClose: '&',
},
};
$scope.$watch(
function () {
return annotationUI.frames();
},
function (frames) {
if (frames.length === 0) {
return;
}
this.url = frames[0].uri;
this.documentFingerprint = frames[0].documentFingerprint;
}.bind(this)
);
},
template: require('../templates/help_panel.html'),
bindings: {
auth: '<',
onClose: '&',
},
};
src/sidebar/directive/loggedout-message.js
View file @ 11abab35
'use strict';
module.exports = function () {
return {
bindToController: true,
controllerAs: 'vm',
//@ngInject
controller: function (serviceUrl) {
this.serviceUrl = serviceUrl;
},
restrict: 'E',
scope: {
/**
* Called when the user clicks on the "Log in" text.
*/
onLogin: '&',
},
template: require('../templates/loggedout_message.html'),
};
module.exports = {
controllerAs: 'vm',
//@ngInject
controller: function (serviceUrl) {
this.serviceUrl = serviceUrl;
},
bindings: {
/**
* Called when the user clicks on the "Log in" text.
*/
onLogin: '&',
},
template: require('../templates/loggedout_message.html'),
};
src/sidebar/directive/login-control.js
View file @ 11abab35
......@@ -2,42 +2,38 @@
var persona = require('../filter/persona');
module.exports = function () {
return {
bindToController: true,
controllerAs: 'vm',
//@ngInject
controller: function (serviceUrl, settings) {
this.serviceUrl = serviceUrl;
this.isThirdPartyUser = function() {
return persona.isThirdPartyUser(this.auth.userid, settings.authDomain);
};
},
restrict: 'E',
scope: {
/**
* An object representing the current authentication status.
*/
auth: '<',
/**
* Called when the user clicks on the "About this version" text.
*/
onShowHelpPanel: '&',
/**
* Called when the user clicks on the "Log in" text.
*/
onLogin: '&',
/**
* Called when the user clicks on the "Log out" text.
*/
onLogout: '&',
/**
* Whether or not to use the new design for the control.
*
* FIXME: should be removed when the old design is deprecated.
*/
newStyle: '<',
},
template: require('../templates/login_control.html'),
};
module.exports = {
controllerAs: 'vm',
//@ngInject
controller: function (serviceUrl, settings) {
this.serviceUrl = serviceUrl;
this.isThirdPartyUser = function() {
return persona.isThirdPartyUser(this.auth.userid, settings.authDomain);
};
},
bindings: {
/**
* An object representing the current authentication status.
*/
auth: '<',
/**
* Called when the user clicks on the "About this version" text.
*/
onShowHelpPanel: '&',
/**
* Called when the user clicks on the "Log in" text.
*/
onLogin: '&',
/**
* Called when the user clicks on the "Log out" text.
*/
onLogout: '&',
/**
* Whether or not to use the new design for the control.
*
* FIXME: should be removed when the old design is deprecated.
*/
newStyle: '<',
},
template: require('../templates/login_control.html'),
};
src/sidebar/directive/login-form.js
View file @ 11abab35
......@@ -93,18 +93,16 @@ function Controller($scope, $timeout, flash, session, formRespond, serviceUrl) {
});
}
module.exports = {
directive: function () {
return {
bindToController: true,
controller: Controller,
controllerAs: 'vm',
restrict: 'E',
scope: {
onClose: '&',
},
template: require('../templates/login_form.html'),
};
var component = {
controller: Controller,
controllerAs: 'vm',
bindings: {
onClose: '&',
},
template: require('../templates/login_form.html'),
};
module.exports = {
component: component,
Controller: Controller,
};
src/sidebar/directive/publish-annotation-btn.js
View file @ 11abab35
'use strict';
/**
* @ngdoc directive
* @name publishAnnotationBtn
* @description Displays a combined privacy/selection post button to post
* a new annotation
*/
// @ngInject
module.exports = function () {
return {
bindToController: true,
controller: function () {
this.showDropdown = false;
this.privateLabel = 'Only Me';
module.exports = {
controller: function () {
this.showDropdown = false;
this.privateLabel = 'Only Me';
this.publishDestination = function () {
return this.isShared ? this.group.name : this.privateLabel;
};
this.publishDestination = function () {
return this.isShared ? this.group.name : this.privateLabel;
};
this.groupType = function () {
return this.group.public ? 'public' : 'group';
};
this.groupType = function () {
return this.group.public ? 'public' : 'group';
};
this.setPrivacy = function (level) {
this.onSetPrivacy({level: level});
};
},
controllerAs: 'vm',
restrict: 'E',
scope: {
group: '<',
canPost: '<',
isShared: '<',
onCancel: '&',
onSave: '&',
onSetPrivacy: '&',
},
template: require('../templates/publish_annotation_btn.html'),
};
this.setPrivacy = function (level) {
this.onSetPrivacy({level: level});
};
},
controllerAs: 'vm',
bindings: {
group: '<',
canPost: '<',
isShared: '<',
onCancel: '&',
onSave: '&',
onSetPrivacy: '&',
},
template: require('../templates/publish_annotation_btn.html'),
};
src/sidebar/directive/search-input.js
View file @ 11abab35
......@@ -32,22 +32,17 @@ function SearchInputController($element, $http, $scope) {
};
}
// @ngInject
module.exports = function () {
return {
bindToController: true,
controller: SearchInputController,
controllerAs: 'vm',
restrict: 'E',
scope: {
// Specifies whether the search input field should always be expanded,
// regardless of whether the it is focused or has an active query.
//
// If false, it is only expanded when focused or when 'query' is non-empty
alwaysExpanded: '<',
query: '<',
onSearch: '&',
},
template: require('../templates/search_input.html'),
};
module.exports = {
controller: SearchInputController,
controllerAs: 'vm',
bindings: {
// Specifies whether the search input field should always be expanded,
// regardless of whether the it is focused or has an active query.
//
// If false, it is only expanded when focused or when 'query' is non-empty
alwaysExpanded: '<',
query: '<',
onSearch: '&',
},
template: require('../templates/search_input.html'),
};
src/sidebar/directive/search-status-bar.js
View file @ 11abab35
......@@ -2,27 +2,22 @@
var uiConstants = require('../ui-constants');
// @ngInject
module.exports = function () {
return {
bindToController: true,
controllerAs: 'vm',
controller: function () {
this.TAB_ANNOTATIONS = uiConstants.TAB_ANNOTATIONS;
this.TAB_NOTES = uiConstants.TAB_NOTES;
this.TAB_ORPHANS = uiConstants.TAB_ORPHANS;
},
restrict: 'E',
scope: {
filterActive: '<',
filterMatchCount: '<',
onClearSelection: '&',
searchQuery: '<',
selectedTab: '<',
selectionCount: '<',
totalAnnotations: '<',
totalNotes: '<',
},
template: require('../templates/search_status_bar.html'),
};
module.exports = {
controllerAs: 'vm',
controller: function () {
this.TAB_ANNOTATIONS = uiConstants.TAB_ANNOTATIONS;
this.TAB_NOTES = uiConstants.TAB_NOTES;
this.TAB_ORPHANS = uiConstants.TAB_ORPHANS;
},
bindings: {
filterActive: '<',
filterMatchCount: '<',
onClearSelection: '&',
searchQuery: '<',
selectedTab: '<',
selectionCount: '<',
totalAnnotations: '<',
totalNotes: '<',
},
template: require('../templates/search_status_bar.html'),
};
src/sidebar/directive/selection-tabs.js
View file @ 11abab35
......@@ -2,45 +2,41 @@
var uiConstants = require('../ui-constants');
module.exports = function () {
return {
bindToController: true,
controllerAs: 'vm',
//@ngInject
controller: function ($element, annotationUI, features) {
this.TAB_ANNOTATIONS = uiConstants.TAB_ANNOTATIONS;
this.TAB_NOTES = uiConstants.TAB_NOTES;
this.TAB_ORPHANS = uiConstants.TAB_ORPHANS;
module.exports = {
controllerAs: 'vm',
//@ngInject
controller: function ($element, annotationUI, features) {
this.TAB_ANNOTATIONS = uiConstants.TAB_ANNOTATIONS;
this.TAB_NOTES = uiConstants.TAB_NOTES;
this.TAB_ORPHANS = uiConstants.TAB_ORPHANS;
this.selectTab = function (type) {
annotationUI.clearSelectedAnnotations();
annotationUI.selectTab(type);
};
this.selectTab = function (type) {
annotationUI.clearSelectedAnnotations();
annotationUI.selectTab(type);
};
this.orphansTabFlagEnabled = function () {
return features.flagEnabled('orphans_tab');
};
this.orphansTabFlagEnabled = function () {
return features.flagEnabled('orphans_tab');
};
this.showAnnotationsUnavailableMessage = function () {
return this.selectedTab === this.TAB_ANNOTATIONS &&
this.totalAnnotations === 0 &&
!this.isWaitingToAnchorAnnotations;
};
this.showAnnotationsUnavailableMessage = function () {
return this.selectedTab === this.TAB_ANNOTATIONS &&
this.totalAnnotations === 0 &&
!this.isWaitingToAnchorAnnotations;
};
this.showNotesUnavailableMessage = function () {
return this.selectedTab === this.TAB_NOTES &&
this.totalNotes === 0;
};
},
restrict: 'E',
scope: {
isLoading: '<',
isWaitingToAnchorAnnotations: '<',
selectedTab: '<',
totalAnnotations: '<',
totalNotes: '<',
totalOrphans: '<',
},
template: require('../templates/selection_tabs.html'),
};
this.showNotesUnavailableMessage = function () {
return this.selectedTab === this.TAB_NOTES &&
this.totalNotes === 0;
};
},
bindings: {
isLoading: '<',
isWaitingToAnchorAnnotations: '<',
selectedTab: '<',
totalAnnotations: '<',
totalNotes: '<',
totalOrphans: '<',
},
template: require('../templates/selection_tabs.html'),
};
src/sidebar/directive/share-dialog.js
View file @ 11abab35
......@@ -28,15 +28,11 @@ function ShareDialogController($scope, $element, annotationUI) {
updateViaLink);
}
module.exports = function () {
return {
restrict: 'E',
bindToController: true,
controller: ShareDialogController,
controllerAs: 'vm',
scope: {
onClose: '&',
},
template: require('../templates/share_dialog.html'),
};
module.exports = {
controller: ShareDialogController,
controllerAs: 'vm',
bindings: {
onClose: '&',
},
template: require('../templates/share_dialog.html'),
};
src/sidebar/directive/sidebar-tutorial.js
View file @ 11abab35
......@@ -17,21 +17,16 @@ function SidebarTutorialController(session) {
}
/**
* @ngdoc directive
* @name sidebarTutorial
* @description Displays a short tutorial in the sidebar.
*/
// @ngInject
module.exports = {
directive: function () {
return {
bindToController: true,
controller: SidebarTutorialController,
controllerAs: 'vm',
restrict: 'E',
scope: {},
template: require('../templates/sidebar_tutorial.html'),
};
component: {
controller: SidebarTutorialController,
controllerAs: 'vm',
bindings: {},
template: require('../templates/sidebar_tutorial.html'),
},
Controller: SidebarTutorialController,
};
src/sidebar/directive/sort-dropdown.js
View file @ 11abab35
'use strict';
module.exports = function () {
return {
controller: function () {},
restrict: 'E',
scope: {
/** The name of the currently selected sort key. */
sortKey: '<',
/** A list of possible keys that the user can opt to sort by. */
sortKeysAvailable: '<',
/** Called when the user changes the sort key. */
onChangeSortKey: '&',
},
template: require('../templates/sort_dropdown.html'),
};
module.exports = {
controllerAs: 'vm',
controller: function () {},
bindings: {
/** The name of the currently selected sort key. */
sortKey: '<',
/** A list of possible keys that the user can opt to sort by. */
sortKeysAvailable: '<',
/** Called when the user changes the sort key. */
onChangeSortKey: '&',
},
template: require('../templates/sort_dropdown.html'),
};
src/sidebar/directive/svg-icon.js
View file @ 11abab35
......@@ -21,15 +21,11 @@ function SvgIconController($element) {
$element[0].innerHTML = icons[this.name];
}
module.exports = function () {
return {
bindToController: true,
controllerAs: 'vm',
restrict: 'E',
controller: SvgIconController,
scope: {
/** The name of the icon to load. */
name: '<',
},
};
module.exports = {
controllerAs: 'vm',
controller: SvgIconController,
bindings: {
/** The name of the icon to load. */
name: '<',
},
};
src/sidebar/directive/tag-editor.js
View file @ 11abab35
......@@ -22,16 +22,12 @@ function TagEditorController(tags) {
};
}
module.exports = function () {
return {
bindToController: true,
controller: TagEditorController,
controllerAs: 'vm',
restrict: 'E',
scope: {
tags: '<',
onEditTags: '&',
},
template: require('../templates/tag_editor.html'),
};
module.exports = {
controller: TagEditorController,
controllerAs: 'vm',
bindings: {
tags: '<',
onEditTags: '&',
},
template: require('../templates/tag_editor.html'),
};
src/sidebar/directive/test/annotation-share-dialog-test.js
View file @ 11abab35
......@@ -13,7 +13,7 @@ describe('annotationShareDialog', function () {
before(function () {
angular.module('app', [])
.directive('annotationShareDialog',
.component('annotationShareDialog',
require('../annotation-share-dialog'))
.value('urlEncodeFilter', function (val) { return val; });
});
......
src/sidebar/directive/test/annotation-test.js
View file @ 11abab35
......@@ -20,7 +20,7 @@ var fakeDocumentMeta = {
/**
* Returns the annotation directive with helpers stubbed out.
*/
function annotationDirective() {
function annotationComponent() {
var noop = function () { return ''; };
var annotation = proxyquire('../annotation', {
......@@ -35,7 +35,7 @@ function annotationDirective() {
},
});
return annotation.directive;
return annotation.component;
}
describe('annotation', function() {
......@@ -116,7 +116,7 @@ describe('annotation', function() {
before(function() {
angular.module('h', [])
.directive('annotation', annotationDirective());
.component('annotation', annotationComponent());
});
beforeEach(angular.mock.module('h'));
......
src/sidebar/directive/test/annotation-thread-test.js
View file @ 11abab35
......@@ -25,7 +25,7 @@ function PageObject(element) {
describe('annotationThread', function () {
before(function () {
angular.module('app', [])
.directive('annotationThread', annotationThread);
.component('annotationThread', annotationThread);
});
beforeEach(function () {
......
src/sidebar/directive/test/login-control-test.js
View file @ 11abab35
......@@ -28,7 +28,7 @@ function PageObject(element) {
describe('loginControl', function () {
before(function () {
angular.module('app', [])
.directive('loginControl', require('../login-control'));
.component('loginControl', require('../login-control'));
});
beforeEach(function () {
......
src/sidebar/directive/test/publish-annotation-btn-test.js
View file @ 11abab35
......@@ -17,8 +17,8 @@ var fakeLocalStorage = {
describe('publishAnnotationBtn', function () {
before(function () {
angular.module('app', [])
.directive('dropdownMenuBtn', require('../dropdown-menu-btn'))
.directive('publishAnnotationBtn', require('../publish-annotation-btn'))
.component('dropdownMenuBtn', require('../dropdown-menu-btn'))
.component('publishAnnotationBtn', require('../publish-annotation-btn'))
.factory('localStorage', function () {
return fakeLocalStorage;
});
......
src/sidebar/directive/test/search-input-test.js
View file @ 11abab35
......@@ -9,7 +9,7 @@ describe('searchInput', function () {
before(function () {
angular.module('app', [])
.directive('searchInput', require('../search-input'));
.component('searchInput', require('../search-input'));
});
beforeEach(function () {
......
src/sidebar/directive/test/search-status-bar-test.js
View file @ 11abab35
......@@ -7,7 +7,7 @@ var util = require('./util');
describe('searchStatusBar', function () {
before(function () {
angular.module('app', [])
.directive('searchStatusBar', require('../search-status-bar'));
.component('searchStatusBar', require('../search-status-bar'));
});
beforeEach(function () {
......
src/sidebar/directive/test/selection-tabs-test.js
View file @ 11abab35
......@@ -7,7 +7,7 @@ var util = require('./util');
describe('selectionTabs', function () {
before(function () {
angular.module('app', [])
.directive('selectionTabs', require('../selection-tabs'));
.component('selectionTabs', require('../selection-tabs'));
});
beforeEach(function () {
......
src/sidebar/directive/test/share-dialog-test.js
View file @ 11abab35
......@@ -11,7 +11,7 @@ describe('shareDialog', function () {
fakeAnnotationUI = { frames: sinon.stub().returns([]) };
angular.module('h', [])
.directive('shareDialog', require('../share-dialog'))
.component('shareDialog', require('../share-dialog'))
.value('annotationUI', fakeAnnotationUI)
.value('urlEncodeFilter', function (val) { return val; });
angular.mock.module('h');
......
src/sidebar/directive/test/sort-dropdown-test.js
View file @ 11abab35
......@@ -7,7 +7,7 @@ var util = require('./util');
describe('sortDropdown', function () {
before(function () {
angular.module('app', [])
.directive('sortDropdown', require('../sort-dropdown'));
.component('sortDropdown', require('../sort-dropdown'));
});
beforeEach(function () {
......
src/sidebar/directive/test/svg-icon-test.js
View file @ 11abab35
......@@ -7,7 +7,7 @@ var util = require('./util');
describe('svgIcon', function () {
before(function () {
angular.module('app', [])
.directive('svgIcon', require('../svg-icon'));
.component('svgIcon', require('../svg-icon'));
});
beforeEach(function () {
......
src/sidebar/directive/test/tag-editor-test.js
View file @ 11abab35
......@@ -9,7 +9,7 @@ describe('tagEditor', function () {
before(function () {
angular.module('app',[])
.directive('tagEditor', require('../tag-editor'));
.component('tagEditor', require('../tag-editor'));
});
beforeEach(function () {
......
src/sidebar/directive/test/thread-list-test.js
View file @ 11abab35
......@@ -84,7 +84,7 @@ describe('threadList', function () {
before(function () {
angular.module('app', [])
.directive('threadList', threadList);
.component('threadList', threadList);
});
beforeEach(function () {
......
src/sidebar/directive/test/timestamp-test.js
View file @ 11abab35
......@@ -11,7 +11,7 @@ describe('timestamp', function () {
before(function () {
angular.module('app',[])
.directive('timestamp', require('../timestamp'));
.component('timestamp', require('../timestamp'));
});
beforeEach(function () {
......
src/sidebar/directive/thread-list.js
View file @ 11abab35
......@@ -126,31 +126,27 @@ function ThreadListController($scope, VirtualThreadList) {
};
}
module.exports = function () {
return {
bindToController: true,
controller: ThreadListController,
controllerAs: 'vm',
restrict: 'E',
scope: {
/** The root thread to be displayed by the thread list. */
thread: '<',
showDocumentInfo: '<',
/**
* Called when the user clicks a link to show an annotation that does not
* match the current filter.
*/
onForceVisible: '&',
/** Called when the user focuses an annotation by hovering it. */
onFocus: '&',
/** Called when a user selects an annotation. */
onSelect: '&',
/** Called when a user toggles the expansion state of an annotation thread. */
onChangeCollapsed: '&',
/** Called to clear the current selection. */
onClearSelection: '&',
},
template: require('../templates/thread_list.html'),
};
module.exports = {
controller: ThreadListController,
controllerAs: 'vm',
bindings: {
/** The root thread to be displayed by the thread list. */
thread: '<',
showDocumentInfo: '<',
/**
* Called when the user clicks a link to show an annotation that does not
* match the current filter.
*/
onForceVisible: '&',
/** Called when the user focuses an annotation by hovering it. */
onFocus: '&',
/** Called when a user selects an annotation. */
onSelect: '&',
/** Called when a user toggles the expansion state of an annotation thread. */
onChangeCollapsed: '&',
/** Called to clear the current selection. */
onClearSelection: '&',
},
template: require('../templates/thread_list.html'),
};
src/sidebar/directive/timestamp.js
View file @ 11abab35
......@@ -42,19 +42,15 @@ function TimestampController($scope, time) {
};
}
module.exports = function () {
return {
bindToController: true,
controller: TimestampController,
controllerAs: 'vm',
restrict: 'E',
scope: {
className: '<',
href: '<',
timestamp: '<',
},
template: ['<a class="{{vm.className}}" target="_blank" ng-title="vm.absoluteTimestamp"',
' href="{{vm.href}}"',
'>{{vm.relativeTimestamp}}</a>'].join(''),
};
module.exports = {
controller: TimestampController,
controllerAs: 'vm',
bindings: {
className: '<',
href: '<',
timestamp: '<',
},
template: ['<a class="{{vm.className}}" target="_blank" ng-title="vm.absoluteTimestamp"',
' href="{{vm.href}}"',
'>{{vm.relativeTimestamp}}</a>'].join(''),
};
src/sidebar/templates/dropdown_menu_btn.html
View file @ 11abab35
<div class="dropdown-menu-btn">
<button
class="dropdown-menu-btn__btn"
ng-bind="label"
ng-bind="vm.label"
ng-click="vm.onClick($event)"
ng-disabled="isDisabled">
ng-disabled="vm.isDisabled">
</button>
<button
class="dropdown-menu-btn__dropdown-arrow"
title="{{dropdownMenuLabel}}"
title="{{vm.dropdownMenuLabel}}"
ng-click="vm.toggleDropdown($event)">
<div class="dropdown-menu-btn__dropdown-arrow-separator"></div>
<div class="dropdown-menu-btn__dropdown-arrow-indicator">
......
src/sidebar/templates/sort_dropdown.html
View file @ 11abab35
......@@ -3,16 +3,16 @@
type="button"
class="top-bar__btn"
dropdown-toggle
title="Sort by {{sortKey}}">
title="Sort by {{vm.sortKey}}">
<i class="h-icon-sort"></i>
</button>
<div class="dropdown-menu__top-arrow"></div>
<ul class="dropdown-menu pull-right" role="menu">
<li class="dropdown-menu__row"
ng-repeat="key in sortKeysAvailable"
ng-click="onChangeSortKey({sortKey: key})"
ng-repeat="key in vm.sortKeysAvailable"
ng-click="vm.onChangeSortKey({sortKey: key})"
><span class="dropdown-menu-radio"
ng-class="{'is-selected' : sortKey === key}"
ng-class="{'is-selected' : vm.sortKey === key}"
></span><a class="dropdown-menu__link" href="">{{key}}</a></li>
</ul>
</span>
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