From 6bac24030d6860888400e2380592637c52ea1ec6 Mon Sep 17 00:00:00 2001 From: Matias De lellis Date: Tue, 12 Feb 2019 12:29:11 -0300 Subject: [PATCH 1/7] Move to precompiled handlebars templates. In Nextcloud 15 the default Content Security Policy disallows unsafe eval expressions, so Handlebars templates can no longer be compiled at runtime. Fix issue #18 --- .gitignore | 3 ++ Makefile | 3 ++ appinfo/info.xml | 2 +- js/script.js | 21 +++++--- js/templates/navigation.handlebars | 33 ++++++++++++ .../templates/notes.handlebars | 53 +++++++++++++++++-- templates/main.php | 1 + templates/part.content.php | 15 ------ templates/part.navigation.php | 49 ----------------- templates/part.note.php | 22 -------- 10 files changed, 105 insertions(+), 97 deletions(-) create mode 100644 .gitignore create mode 100644 js/templates/navigation.handlebars rename templates/part.note-modal-editable.php => js/templates/notes.handlebars (53%) delete mode 100644 templates/part.note.php diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..804a1a6 --- /dev/null +++ b/.gitignore @@ -0,0 +1,3 @@ +build +js/templates.js +vendor \ No newline at end of file diff --git a/Makefile b/Makefile index 3db1d2c..4769878 100644 --- a/Makefile +++ b/Makefile @@ -72,6 +72,9 @@ depsmin: wget https://github.com/varun-raj/medium-editor-autolist/raw/master/dist/autolist.min.js mv autolist.min.js vendor/autolist.js +js-templates: + handlebars js/templates -f js/templates.js + clean: rm -rf $(build_dir) diff --git a/appinfo/info.xml b/appinfo/info.xml index 44365d6..71d855d 100644 --- a/appinfo/info.xml +++ b/appinfo/info.xml @@ -17,6 +17,6 @@ https://user-images.githubusercontent.com/733715/38871311-dac5a80a-4226-11e8-961d-63b276380b6b.png https://user-images.githubusercontent.com/733715/38871255-b07a7d5a-4226-11e8-8403-650cbea50be0.png - + diff --git a/js/script.js b/js/script.js index 219a5c4..ba6bfaa 100644 --- a/js/script.js +++ b/js/script.js @@ -290,10 +290,12 @@ View.prototype = { return digits[1] + '#' + rgb.toString(16).toUpperCase(); }, renderContent: function () { - var source = $('#content-tpl').html(); - var template = Handlebars.compile(source); - var html = template({notes: this._notes.getAll()}); - + var html = Handlebars.templates['notes']({ + notes: this._notes.getAll(), + cancelTxt: t('quicknotes', 'Cancel'), + saveTxt: t('quicknotes', 'Save'), + emptyTxt: t('quicknotes', 'Nothing here. Take your quick notes.'), + }); $('#div-content').html(html); // Init masonty grid to notes. @@ -510,9 +512,14 @@ View.prototype = { }); }, renderNavigation: function () { - var source = $('#navigation-tpl').html(); - var template = Handlebars.compile(source); - var html = template({colors: this._notes.getColors(), notes: this._notes.getAll()}); + var html = Handlebars.templates['navigation']({ + colors: this._notes.getColors(), + notes: this._notes.getAll(), + newNoteTxt: t('quicknotes', 'New note'), + allNotesTxt: t('quicknotes', 'All notes'), + colorsTxt: t('quicknotes', 'Colors'), + notesTxt: t('quicknotes', 'Notes'), + }); $('#app-navigation ul').html(html); diff --git a/js/templates/navigation.handlebars b/js/templates/navigation.handlebars new file mode 100644 index 0000000..e358d66 --- /dev/null +++ b/js/templates/navigation.handlebars @@ -0,0 +1,33 @@ +
+
+ +
+
+
  • + + {{allNotesTxt}} + +
    • +
  • + + {{colorsTxt}} + +
    • +
  • + + {{notesTxt}} + +
    • diff --git a/templates/part.note-modal-editable.php b/js/templates/notes.handlebars similarity index 53% rename from templates/part.note-modal-editable.php rename to js/templates/notes.handlebars index 9d51dff..0fe1d20 100644 --- a/templates/part.note-modal-editable.php +++ b/js/templates/notes.handlebars @@ -1,3 +1,38 @@ +{{#if notes}} +
    + {{#each notes}} +
    +
    + {{#if isshared}} +
    +
    +
    + {{{ title }}} +
    +
    +
    + {{{ content }}} +
    + {{else}} +
    +
    + +
    + {{{ title }}} +
    +
    +
    + {{{ content }}} +
    + {{/if}} +
    +
    + {{/each}} +
    -
    +{{else}} +
    +
    + {{ emptyMsg }} +
    +{{/if}} diff --git a/templates/main.php b/templates/main.php index 7c35751..8a9780b 100644 --- a/templates/main.php +++ b/templates/main.php @@ -1,5 +1,6 @@ - {{#if notes}} -
    - {{#each notes}} - inc('part.note')); ?> - {{/each}} -
    - inc('part.note-modal-editable')); ?> - {{else}} -
    -
    - t('Nothing here. Take your quick notes.')); ?> -
    - {{/if}} -
    diff --git a/templates/part.navigation.php b/templates/part.navigation.php index 7034eb1..3052017 100644 --- a/templates/part.navigation.php +++ b/templates/part.navigation.php @@ -1,50 +1 @@ - - - - - \ No newline at end of file diff --git a/templates/part.note.php b/templates/part.note.php deleted file mode 100644 index bae5767..0000000 --- a/templates/part.note.php +++ /dev/null @@ -1,22 +0,0 @@ -
    -
    - {{#if isshared}} -
    -
    -
    {{{ title }}}
    -
    -
    {{{ content }}}
    - {{else}} -
    -
    - -
    {{{ title }}}
    -
    -
    {{{ content }}}
    - {{/if}} -
    -
    From ffda338e2927d47a73be6494238d98eea87ec598 Mon Sep 17 00:00:00 2001 From: Matias De lellis Date: Tue, 12 Feb 2019 14:12:09 -0300 Subject: [PATCH 2/7] Fix title on new notes.. --- js/script.js | 6 +----- 1 file changed, 1 insertion(+), 5 deletions(-) diff --git a/js/script.js b/js/script.js index ba6bfaa..bbb72bc 100644 --- a/js/script.js +++ b/js/script.js @@ -13,10 +13,6 @@ $(document).ready(function () { -var translations = { - newNote: $('#new-note-string').text() -}; - // this notes object holds all our notes var Notes = function (baseUrl) { this._baseUrl = baseUrl; @@ -551,7 +547,7 @@ View.prototype = { var self = this; $('#new-note').click(function () { var note = { - title: translations.newNote, + title: t('quicknotes', 'New note'), content: '', color: '#F7EB96' }; From a69071d00a3c675cfdb4cff74fa65943a59f5c80 Mon Sep 17 00:00:00 2001 From: Matias De lellis Date: Tue, 12 Feb 2019 14:53:46 -0300 Subject: [PATCH 3/7] Use handlebars templates to add insert new notes. --- js/script.js | 23 +++++++++++------------ js/templates/note-item.handlebars | 30 ++++++++++++++++++++++++++++++ 2 files changed, 41 insertions(+), 12 deletions(-) create mode 100644 js/templates/note-item.handlebars diff --git a/js/script.js b/js/script.js index bbb72bc..471c571 100644 --- a/js/script.js +++ b/js/script.js @@ -551,22 +551,21 @@ View.prototype = { content: '', color: '#F7EB96' }; - self._notes.create(note).done(function() { if (self._notes.length() > 1) { note = self._notes.getActive(); - var $notehtml = $("
    " + - "
    " + - "
    " + - "
    " + - "
    " + note.title + "
    " + - "
    " + - "
    " + note.content + "
    " + - "
    " + - "
    "); - $(".notes-grid").prepend( $notehtml ) + var $notehtml = $(Handlebars.templates['note-item']({ + color: note.color, + id: note.id, + title: note.title, + content: note.content, + timestamp: note.timestamp, + })); + + $(".notes-grid").prepend($notehtml) + .isotope('prepended', $notehtml) .isotope({ filter: '*'}) - .isotope( 'prepended', $notehtml); + .isotope('layout'); self._notes.unsetActive(); self.renderNavigation(); } else { diff --git a/js/templates/note-item.handlebars b/js/templates/note-item.handlebars new file mode 100644 index 0000000..4d775fc --- /dev/null +++ b/js/templates/note-item.handlebars @@ -0,0 +1,30 @@ +
    +
    + {{#if isshared}} +
    +
    +
    + {{{ title }}} +
    +
    +
    + {{{ content }}} +
    + {{else}} +
    +
    + +
    + {{{ title }}} +
    +
    +
    + {{{ content }}} +
    + {{/if}} +
    +
    \ No newline at end of file From 2245c7f00fa6a25ed1edf99886b0b31d07c72c6a Mon Sep 17 00:00:00 2001 From: Matias De lellis Date: Tue, 12 Feb 2019 15:08:03 -0300 Subject: [PATCH 4/7] WII.. Finally add a confirmation before deleting a note. --- js/script.js | 53 ++++++++++++++++++++++++++++++++++------------------ 1 file changed, 35 insertions(+), 18 deletions(-) diff --git a/js/script.js b/js/script.js index 471c571..e624050 100644 --- a/js/script.js +++ b/js/script.js @@ -359,18 +359,27 @@ View.prototype = { event.stopPropagation(); self._notes.load(id); - self._notes.removeActive().done(function () { - if (self._notes.length() > 0) { - $(".notes-grid").isotope('remove', note.parent()) - .isotope('layout'); - self.showAll(); - self.renderNavigation(); - } else { - self.render(); - } - }).fail(function () { - alert('Could not delete note, not found'); - }); + OC.dialogs.confirm( + t('quicknotes', 'Are you sure you want to delete the note?'), + t('quicknotes', 'Delete note'), + function(result) { + if (result) { + self._notes.removeActive().done(function () { + if (self._notes.length() > 0) { + $(".notes-grid").isotope('remove', note.parent()) + .isotope('layout'); + self.showAll(); + self.renderNavigation(); + } else { + self.render(); + } + }).fail(function () { + alert('Could not delete note, not found'); + }); + } + }, + true + ); }); /* @@ -595,12 +604,20 @@ View.prototype = { $('#app-navigation .note .delete').click(function () { var entry = $(this).closest('.note'); entry.find('.app-navigation-entry-menu').removeClass('open'); - - self._notes.removeActive().done(function () { - self.render(); - }).fail(function () { - alert('Could not delete note, not found'); - }); + OC.dialogs.confirm( + t('quicknotes', 'Are you sure you want to delete the note?'), + t('quicknotes', 'Delete note'), + function(result) { + if (result) { + self._notes.removeActive().done(function () { + self.render(); + }).fail(function () { + alert('Could not delete note, not found'); + }); + } + }, + true + ); }); // show a note From 607f1a1a33d50ff759725c8786e575c3a91500db Mon Sep 17 00:00:00 2001 From: Matias De lellis Date: Tue, 12 Feb 2019 15:55:28 -0300 Subject: [PATCH 5/7] Fix search on NC >= 14. Issue #17 --- js/script.js | 39 ++++++++++++++------------------------- 1 file changed, 14 insertions(+), 25 deletions(-) diff --git a/js/script.js b/js/script.js index e624050..df9c200 100644 --- a/js/script.js +++ b/js/script.js @@ -658,41 +658,30 @@ View.prototype = { } }; -var timeoutID = null; -function filter (query) { - window.clearTimeout(timeoutID); - timeoutID = window.setTimeout(function() { - if (query) { - query = query.toLowerCase(); - $('.notes-grid').isotope({ filter: function() { +function search (query) { + if (query) { + query = query.toLowerCase(); + $('.notes-grid').isotope({ + filter: function() { var title = $(this).find(".note-title").html().toLowerCase(); if (title.search(query) >= 0) return true; + var content = $(this).find(".note-content").html().toLowerCase(); if (content.search(query) >= 0) return true; - return false; - }}); - } else { - $('.notes-grid').isotope({ filter: '*'}); - } - }, 500); -}; -var SearchProxy = { - attach: function(search) { - search.setFilter('quicknotes', this.filterProxy); - }, - filterProxy: function(query) { - filter(query); - }, - setFilter: function(newFilter) { - filter = newFilter; + return false; + } + }); + } else { + $('.notes-grid').isotope({ filter: '*'}); } }; -SearchProxy.setFilter(filter); -OC.Plugins.register('OCA.Search', SearchProxy); +new OCA.Search(search, function() { + search(''); +}); var notes = new Notes(OC.generateUrl('/apps/quicknotes/notes')); var view = new View(notes); From 1bc8b452228feca307f78ca48f3105d7a919317f Mon Sep 17 00:00:00 2001 From: Matias De lellis Date: Tue, 12 Feb 2019 20:59:09 -0300 Subject: [PATCH 6/7] Show an spinner while loading notes. Misc fixes.. --- js/script.js | 72 +++++++++++++++++------------------ js/templates/notes.handlebars | 16 ++++++-- 2 files changed, 47 insertions(+), 41 deletions(-) diff --git a/js/script.js b/js/script.js index df9c200..70ff52e 100644 --- a/js/script.js +++ b/js/script.js @@ -5,7 +5,7 @@ * later. See the COPYING file. * * @author Matias De lellis - * @copyright Matias De lellis 2016-2018 + * @copyright Matias De lellis 2016-2019 */ (function (OC, window, $, undefined) { @@ -18,6 +18,7 @@ var Notes = function (baseUrl) { this._baseUrl = baseUrl; this._notes = []; this._activeNote = undefined; + this._loaded = false; }; Notes.prototype = { @@ -115,12 +116,16 @@ Notes.prototype = { $.get(this._baseUrl).done(function (notes) { self._activeNote = undefined; self._notes = notes.reverse(); + self._loaded = true; deferred.resolve(); }).fail(function () { deferred.reject(); }); return deferred.promise(); }, + isLoaded: function () { + return this._loaded; + }, updateActive: function (title, content, color) { var note = this.getActive(); note.title = title; @@ -286,11 +291,18 @@ View.prototype = { return digits[1] + '#' + rgb.toString(16).toUpperCase(); }, renderContent: function () { + // Remove all event handlers to prevent double events. + $("#app-content").off(); + var html = Handlebars.templates['notes']({ + loaded: this._notes.isLoaded(), notes: this._notes.getAll(), cancelTxt: t('quicknotes', 'Cancel'), saveTxt: t('quicknotes', 'Save'), - emptyTxt: t('quicknotes', 'Nothing here. Take your quick notes.'), + loadingMsg: t('quicknotes', 'Looking for your notes'), + loadingIcon: OC.imagePath('core', 'loading.gif'), + emptyMsg: t('quicknotes', 'Nothing here. Take your first quick notes'), + emptyIcon: OC.imagePath('quicknotes', 'app'), }); $('#div-content').html(html); @@ -321,7 +333,7 @@ View.prototype = { // Open notes when clicking them. $("#app-content").on("click", ".quicknote", function (event) { - event.stopPropagation(); // Not work so need fix on next binding.. + event.stopPropagation(); if($(this).hasClass('shared')) return; //shares don't allow editing var modalnote = $("#modal-note-editable .quicknote"); @@ -334,12 +346,8 @@ View.prototype = { }); // Cancel when click outside the modal. - $(".modal-note-background").click(function (event) { - /* stopPropagation() not work with .on() binings. */ - if (!$(event.target).is(".modal-note-background")) { - event.stopPropagation(); - return; - } + $('#app-content').on('click', '.modal-note-background', function (event) { + event.stopPropagation(); self.cancelEdit(); }); @@ -353,11 +361,11 @@ View.prototype = { // Remove note icon var self = this; $('#app-content').on("click", ".icon-delete-note", function (event) { + event.stopPropagation(); + var note = $(this).parent().parent(); var id = parseInt(note.data('id'), 10); - event.stopPropagation(); - self._notes.load(id); OC.dialogs.confirm( t('quicknotes', 'Are you sure you want to delete the note?'), @@ -475,7 +483,8 @@ View.prototype = { // handle cancel editing notes. $('#modal-note-div #cancel-button').click(function (event) { - self.cancelEdit(); + event.stopPropagation(); + self.cancelEdit(); }); // Handle save note @@ -594,32 +603,6 @@ View.prototype = { $(this).toggleClass("open"); }); - // show app menu - $('#app-navigation .app-navigation-entry-utils-menu-button').click(function () { - var entry = $(this).closest('.note'); - entry.find('.app-navigation-entry-menu').toggleClass('open'); - }); - - // delete a note - $('#app-navigation .note .delete').click(function () { - var entry = $(this).closest('.note'); - entry.find('.app-navigation-entry-menu').removeClass('open'); - OC.dialogs.confirm( - t('quicknotes', 'Are you sure you want to delete the note?'), - t('quicknotes', 'Delete note'), - function(result) { - if (result) { - self._notes.removeActive().done(function () { - self.render(); - }).fail(function () { - alert('Could not delete note, not found'); - }); - } - }, - true - ); - }); - // show a note $('#app-navigation .note > a').click(function (event) { event.stopPropagation(); @@ -683,8 +666,21 @@ new OCA.Search(search, function() { search(''); }); + +/* + * Create modules + */ var notes = new Notes(OC.generateUrl('/apps/quicknotes/notes')); var view = new View(notes); + +/* + * Render loading view + */ +view.renderContent(); + +/* + * Loading notes and render view. + */ notes.loadAll().done(function () { view.render(); }).fail(function () { diff --git a/js/templates/notes.handlebars b/js/templates/notes.handlebars index 0fe1d20..4111642 100644 --- a/js/templates/notes.handlebars +++ b/js/templates/notes.handlebars @@ -74,9 +74,19 @@ +{{else if loaded}} +
    +
    +

    + {{ emptyMsg }} +

    +
    {{else}}
    -
    - {{ emptyMsg }} -
    +
    +

    + {{loadingMsg}} +

    + + {{/if}} From 0b28bc4d138b1c4c1d32fb940cf8ecc07606f9a0 Mon Sep 17 00:00:00 2001 From: Matias De lellis Date: Tue, 12 Feb 2019 21:09:54 -0300 Subject: [PATCH 7/7] Don't collapse color menu when click on empty area --- js/script.js | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/js/script.js b/js/script.js index 70ff52e..326a164 100644 --- a/js/script.js +++ b/js/script.js @@ -599,6 +599,10 @@ View.prototype = { $(this).toggleClass("open"); }); + $('#colors-folder > ul').click(function (event) { + event.stopPropagation(); + }); + $('#notes-folder').click(function () { $(this).toggleClass("open"); });