diff --git a/static/js/annotation.js b/static/js/annotation.js index 64d42de..aeda34a 100644 --- a/static/js/annotation.js +++ b/static/js/annotation.js @@ -15,7 +15,6 @@ oml.ui.annotation = function(annotation, $iframe) { note.editable = !note.user return note }) : [] - console.log(annotation.notes) var $notes = Ox.ArrayEditable({ editing: true, items: notes, @@ -25,17 +24,7 @@ oml.ui.annotation = function(annotation, $iframe) { margin: '2px', minHeight: '12px' }).bindEvent({ - doubleclick: function(data) { - if (!$notes.options('items').length) { - $notes.addItem(0, { - id: 'A', - value: '', - editable: true - }).options({ - selected: 'A' - }).editItem() - } - }, + doubleclick: addNote, submit: function(data) { var note = Ox.getObjectById(annotation.notes, data.id) if (note) { @@ -67,9 +56,24 @@ oml.ui.annotation = function(annotation, $iframe) { } }).append($quote).append($notes); + + function addNote() { + if (!$notes.options('items').length) { + that.select() + $notes.addItem(0, { + id: 'A', + value: '', + editable: true + }).options({ + selected: 'A' + }).editItem() + } + } + + that.annotate = function() { - var item = { - id: 'note', value: '', editable: true + if (oml.user.ui.showAnnotations) { + addNote() } } that.deselect = function() { @@ -77,6 +81,9 @@ oml.ui.annotation = function(annotation, $iframe) { that.loseFocus() } that.select = function () { + $iframe.postMessage('selectAnnotation', { + id: annotation.id + }) let selected = document.querySelector('.OMLAnnotation.selected') selected && selected.classList.remove('selected') that.addClass('selected') diff --git a/static/js/viewer.js b/static/js/viewer.js index 98a3598..d0a4e70 100644 --- a/static/js/viewer.js +++ b/static/js/viewer.js @@ -95,7 +95,6 @@ oml.ui.viewer = function() { height: '100%', border: 0 }).onMessage(function(data, event) { - console.log('got', event, data) if (event == 'addAnnotation') { console.log('adding', data.id) saveAnnotations(data); @@ -107,11 +106,12 @@ oml.ui.viewer = function() { removeAnnotation(data.id) } else if (event == 'selectAnnotation') { var $annotation = oml.$ui.annotationFolder.find('#a-' + data.id) - $annotation.select() + $annotation && $annotation.select() } else if (event == 'deselectAnnotation') { - var $annotation = oml.$ui.annotationFolder.find('#a-' + data.id) - $annotation.deselect() + var $annotation = oml.$ui.annotationFolder.find('#a-' + data.id)[0] + $annotation && $annotation.deselect() } else { + console.log('got', event, data) that.triggerEvent(event, data); } diff --git a/static/reader/epub.js b/static/reader/epub.js index 1372628..12f2483 100644 --- a/static/reader/epub.js +++ b/static/reader/epub.js @@ -49,6 +49,18 @@ function deselectAnnotation(id) { }) } + +function deselectAllAnnotations() { + var ids = [] + document.querySelectorAll('.epubjs-hl.selected').forEach(function(g) { + g.classList.remove('selected') + if (!Ox.contains(ids, id)) { + ids.push(id) + Ox.$parent.postMessage('deselectAnnotation', {id: id}) + } + }) +} + function removeAnnotation(id) { var a = annotations.filter(function(a) { return a.id == id })[0] if (a) { @@ -83,6 +95,7 @@ function onHighlightClicked(e) { other.classList.remove('selected') }) e.target.classList.add('selected') + Ox.$parent.postMessage('selectAnnotation', {id: e.target.dataset.id}) } } @@ -106,8 +119,12 @@ document.onreadystatechange = function () { removeAnnotation(a.dataset.id) }) } - if (event.key == 'n') { + if (event.key == 'n' || event.keyCode == 13) { + var selected = document.querySelector('.epubjs-hl.selected') if (currentSelection) { + if (selected) { + deselectAllAnnotations() + } /* var range = currentSelection.contents.window.getSelection().getRangeAt(0) console.log( @@ -124,6 +141,9 @@ document.onreadystatechange = function () { other.classList.remove('selected') }) currentSelection = null + } else if (selected) { + console.log('editNote?', selected.dataset.id) + } } if (event.keyCode == 61 && event.shiftKey) { diff --git a/static/reader/pdf.js b/static/reader/pdf.js index 44ae07b..d0cd52f 100644 --- a/static/reader/pdf.js +++ b/static/reader/pdf.js @@ -44,12 +44,18 @@ window.addEventListener('keydown', function(event) { if (selected) { removeAnnotation(selected.dataset.id) } - } else if (event.key == 'n') { + } else if (event.key == 'n' || event.keyCode == 13) { + var selected = document.querySelector('.oml-annotation.selected') if (!window.getSelection().isCollapsed) { + if (selected) { + deselectAllAnnotations() + } var annot = getHighlight() renderAnnotation(annot) addAnnotation(annot) window.getSelection().removeAllRanges(); + } else if (selected) { + console.log('editNote?', selected.dataset.id) } event.stopPropagation() event.preventDefault() @@ -139,6 +145,7 @@ function selectAnnotation(id) { g.style.backgroundColor = 'blue' }) } + function deselectAnnotation(id) { document.querySelectorAll('.oml-annotation.a' + id).forEach(function(g) { g.classList.remove('selected') @@ -146,6 +153,20 @@ function deselectAnnotation(id) { }) } +function deselectAllAnnotations() { + var ids = [] + document.querySelectorAll('.oml-annotation.selected').forEach(function(g) { + g.classList.remove('selected') + g.style.backgroundColor = 'yellow' + var id = $(g).parents('.oml-annotation').data('id') + console.log('deselect', g, id) + if (!Ox.contains(ids, id)) { + ids.push(id) + Ox.$parent.postMessage('deselectAnnotation', {id: id}) + } + }) +} + function removeAnnotation(id) { document.querySelectorAll('.oml-annotation.a' + id).forEach(function(a) { a.remove()