Skip to content

C
coopwire-hypothesis
Commit 957ad49c authored by Randall Leeds's avatar Randall Leeds
Browse files
Options

Overhaul the threading, sort, and view further 

Lots of changes to massively simplify things and make them much more
performant.

- The thread directive gets a few changes
  - Cleared up confusing tuple unpacking in favor of named properties
    in the render queue as per the suggestion of @aron
  - The replies and annotation are set at once. Since the replies in
    turn render lazily, this should be fast enough for all but an
    unwieldy number of threads. If we hit that wall, we'll have to do
    some filtering / pagination.
  - The directive is now triggered only on attributes and parses the
    attribute value to get the thread
- The threads are rendered from a single thread root rather than using
  a global list of annotations that must be watched for its threads to
  be extracted. This results in a huge performance gain because this
  thread container has a stable set of children.
  - When the first `annotationsLoaded` callback arrives, we set a new
    root from the result of asking the threading plugin to thread them
  - Lots of hackery during store reloads goes away because we just nuke
    the thread root and reload
- The application controller does not have to modify a root annotation
  set at all anymore
- Use of the root scope in the controllers goes away entirely
- The ongoing edit is now stored in the scope again so that it can be
  be pinned to the top of the thread list
- The editor view and controller go away completely because the top
  level edit is now pinned to the top of the list, removing the need
  to re-render annotations between editing and viewing
- The selected annotations are now a hash of annotation ids to true
  values if the annotation is selected, or null if the selection is
  empty
- An ng-show is used to show/hide the selected/unselected annotations,
  further reducing re-renders
- The view state is gone complete and now there is only sort
- The sort is not applied programmatically in the controller, but a
  simple watch on the name of the sort is used to set the predicate
  and reverse settings as scope properties that feed into an orderBy
  filter on the thread list, reducing the number of extra watches we
  have to do and further reducing the code
- The sort is no longer an animated dropdown, but sits at the top of
  the list always (I assume we can style this better, so have at it)
- Unnecessary helper and logging functions are removed from the
  annotator service because silence is golden
parent dc477032
Expand all Show whitespace changes
Inline Side-by-side
Showing with 85 additions and 320 deletions
h/static/scripts/app.coffee
View file @ 957ad49c
......@@ -38,9 +38,6 @@ configure = [
$routeProvider.when '/a/:id',
controller: 'AnnotationViewerController'
templateUrl: 'viewer.html'
$routeProvider.when '/editor',
controller: 'EditorController'
templateUrl: 'editor.html'
$routeProvider.when '/viewer',
controller: 'ViewerController'
templateUrl: 'viewer.html'
......
h/static/scripts/controllers.coffee
View file @ 957ad49c
This diff is collapsed.
h/static/scripts/directives.coffee
View file @ 957ad49c
......@@ -175,7 +175,7 @@ tabReveal = ['$parse', ($parse) ->
]
thread = ['$$rAF', '$filter', '$window', ($$rAF, $filter, $window) ->
thread = ['$$rAF', '$parse', '$window', ($$rAF, $parse, $window) ->
# Helper -- true if selection ends inside the target and is non-empty
ignoreClick = (event) ->
sel = $window.getSelection()
......@@ -193,9 +193,9 @@ thread = ['$$rAF', '$filter', '$window', ($$rAF, $filter, $window) ->
renderFrame = $$rAF ->
renderFrame = null
[scope, data] = renderQueue.shift()
while renderQueue[0]?[0] is scope
angular.extend data, renderQueue.shift()[1]
{scope, data} = renderQueue.shift()
while renderQueue[0]?.scope is scope
angular.extend data, renderQueue.shift().data
angular.extend scope, data
scope.$digest()
......@@ -204,6 +204,7 @@ thread = ['$$rAF', '$filter', '$window', ($$rAF, $filter, $window) ->
link: (scope, elem, attr, ctrl) ->
childrenEditing = {}
threadWatch = $parse(attr.thread)
scope.annotation = null
scope.replies = null
......@@ -214,7 +215,7 @@ thread = ['$$rAF', '$filter', '$window', ($$rAF, $filter, $window) ->
scope.collapsed = !scope.collapsed
scope.$on 'destroy', ->
renderQueue = ([s, _] for [s, _] in renderQueue is s isnt scope)
renderQueue = (item for item in renderQueue if item.scope isnt scope)
scope.$on 'toggleEditing', (event) ->
{$id, editing} = event.targetScope
......@@ -227,19 +228,15 @@ thread = ['$$rAF', '$filter', '$window', ($$rAF, $filter, $window) ->
else
delete childrenEditing[$id]
scope.$watch 'thread', (thread) ->
scope.$watchCollection threadWatch, (thread) ->
return unless thread
annotation = thread.message
renderQueue.push [scope, {annotation}]
replies = thread.children
data = {annotation, replies}
renderQueue.push {scope, data}
render()
scope.$watchCollection 'thread.children', (children) ->
return unless children
replies = $filter('orderBy')(children, 'message.updated', true)
renderQueue.push [scope, {replies}]
render()
restrict: 'C'
scope: true
]
......
h/static/scripts/directives/annotation.coffee
View file @ 957ad49c
......@@ -61,8 +61,12 @@ class Annotation
annotation = $scope.model
# Forbid saving comments without a body (text or tags)
if annotator.isComment(annotation) and not annotation.text and
not annotation.tags?.length
unless (
annotation.references?.length or
annotation.target?.length or
annotation.tags?.length or
annotation.text
)
$window.alert "You can not add a comment without adding some text, or at least a tag."
return
......@@ -146,12 +150,8 @@ class Annotation
$scope.$watch 'model.id', (id) ->
if id?
$scope.thread = annotator.threading.getContainer(id)
# Check if this is a brand new annotation
if drafts.contains $scope.model
$scope.editing = true
$scope.thread = $scope.model.thread
$scope.editing = drafts.contains $scope.model
link = documentHelpers.absoluteURI("/a/#{$scope.model.id}")
$scope.shared_link = link
......
h/static/scripts/services.coffee
View file @ 957ad49c
......@@ -159,11 +159,6 @@ class Hypothesis extends Annotator
for action, roles of annotation.permissions
unless userId in roles then roles.push userId
# Remove annotations from the view when they are deleted
this.subscribe 'annotationDeleted', (a) =>
scope = @element.scope()
scope.annotations = scope.annotations.filter (b) -> b isnt a
_setupXDM: (options) ->
$rootScope = @element.injector().get '$rootScope'
......@@ -257,53 +252,37 @@ class Hypothesis extends Annotator
_setupDocumentAccessStrategies: -> this
_scan: -> this
# (Optionally) put some HTML formatting around a quote
getHtmlQuote: (quote) -> quote
# Just some debug output
loadAnnotations: (annotations) ->
console.log "Loaded", annotations.length, "annotations."
super
# Do nothing in the app frame, let the host handle it.
setupAnnotation: (annotation) ->
annotation.highlights = []
annotation
toggleViewerSelection: (annotations=[]) =>
annotations = annotations.filter (a) -> a?
scope = @element.scope()
# XOR this list to the current selection
list = scope.annotations = scope.annotations.slice()
selected = scope.selectedAnnotations or {}
for a in annotations
index = list.indexOf a
if index isnt -1
list.splice index, 1
if selected[a.id]
delete selected[a.id]
else
selected[a.id] = true
if Object.keys(selected).length
scope.selectedAnnotations = selected
else
list.push a
# View and sort the selection
scope.applyView "Selection"
scope.applySort scope.viewState.sort
scope.selectedAnnotations = null
this
updateViewer: (annotations=[]) =>
annotations = annotations.filter (a) -> a?
scope = @element.scope()
commentFilter = angular.bind(this, this.isComment)
comments = (scope.$root.annotations or []).filter(commentFilter)
scope.annotations = annotations
scope.applySort scope.viewState.sort
scope.annotations = [scope.annotations..., comments...]
# TODO: re-implement
this
showViewer: (annotations=[]) =>
location = @element.injector().get('$location')
location.path('/viewer').replace()
scope = @element.scope()
scope.annotations = annotations
scope.applyView 'Selection'
scope.applySort scope.viewState.sort
selected = {}
for a in annotations
selected[a.id] = true
scope.selectedAnnotations = selected
this.show()
this
addEmphasis: (annotations=[]) =>
annotations = annotations.filter (a) -> a? # Filter out null annotations
......@@ -323,31 +302,9 @@ class Hypothesis extends Annotator
method: 'adderClick'
showEditor: (annotation) =>
@element.injector().get('drafts').add(annotation)
@element.scope().ongoingEdit = annotation
this.show()
@element.injector().invoke [
'$location', '$rootScope', 'drafts', 'identity',
($location, $rootScope, drafts, identity) =>
@ongoing_edit = annotation
unless this.plugins.Auth? and this.plugins.Auth.haveValidToken()
$rootScope.$apply ->
identity.request()
for p in @providers
p.channel.notify method: 'onEditorHide'
return
# Set the path
search =
id: annotation.id
action: 'create'
$location.path('/editor').search(search)
# Store the draft
drafts.add annotation
# Digest the change
$rootScope.$digest()
]
this
show: =>
......@@ -469,16 +426,6 @@ class Hypothesis extends Annotator
method: 'setVisibleHighlights'
params: state
# Is this annotation a comment?
isComment: (annotation) ->
# No targets and no references means that this is a comment
not (annotation.references?.length or annotation.target?.length)
# Is this annotation a reply?
isReply: (annotation) ->
# The presence of references means that this is a reply
annotation.references?.length
# Discard all drafts, deleting unsaved annotations from the annotator
discardDrafts: ->
return @element.injector().get('drafts').discard()
......
h/static/scripts/streamsearch.coffee
View file @ 957ad49c
......@@ -26,13 +26,7 @@ class StreamSearch
terms = searchfilter.generateFacetedFilter $scope.search.query
queryparser.populateFilter streamfilter, terms
$scope.updater?.then (sock) ->
filter = streamfilter.getFilter()
sock.send(JSON.stringify({filter}))
annotator.plugins.Store?.annotations = []
$rootScope.applyView 'Document' # Non-sensical but works for now
$rootScope.applySort 'Newest'
$scope.sort.name = 'Newest'
angular.module('h.streamsearch', imports, configure)
......
h/static/styles/common.scss
View file @ 957ad49c
......@@ -354,44 +354,3 @@ html {
box-shadow:3px 3px 4px #999999;
}
}
// View and Sort tabs ////////////////////
.viewsort {
@include single-transition(top, .25s);
@include transition-timing-function(cubic-bezier(0, 1, .55, 1));
width: 100%;
text-align: center;
position: fixed;
top: 29px;
right: 0;
z-index: 4;
&.ng-hide {
@include transition-timing-function(cubic-bezier(1, .55, 0, 1));
top: 0;
display:block!important;
overflow: hidden;
}
}
.viewsort > .dropdown {
@include smallshadow(0);
border-bottom-right-radius: 24px 72px;
border-bottom-left-radius: 24px 72px;
font-family: $sans-font-family;
font-weight: 300;
background: $white;
border: solid 1px $gray-lighter;
padding: 0 10px;
margin: 0 3px;
display: inline-block;
.dropdown-menu {
margin-top: 0;
&:before, &:after {
display: none;
}
}
}
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