Minz/quicknotes
1
0
Fork 0
mirror of https://github.com/JanGross/quicknotes.git synced 2025-11-30 23:37:16 +01:00
Code Issues Packages Projects Releases Wiki Activity

Move to precompiled handlebars templates.

Browse Source 
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
This commit is contained in:
Matias De lellis
2019-02-12 12:29:11 -03:00
parent d1d1f1a2f6
commit 6bac24030d
10 changed files with 105 additions and 97 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
.gitignore vendored Normal file
View File

@@ -0,0 +1,3 @@
build
js/templates.js
vendor

3
Makefile
View File

@@ -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)

2
appinfo/info.xml
View File

@@ -17,6 +17,6 @@
<screenshot small-thumbnail="https://user-images.githubusercontent.com/733715/38871311-dac5a80a-4226-11e8-961d-63b276380b6b.png">https://user-images.githubusercontent.com/733715/38871311-dac5a80a-4226-11e8-961d-63b276380b6b.png</screenshot>
<screenshot>https://user-images.githubusercontent.com/733715/38871255-b07a7d5a-4226-11e8-8403-650cbea50be0.png</screenshot>
<dependencies>
<nextcloud min-version="14" max-version="14" />
<nextcloud min-version="14" max-version="15"/>
</dependencies>
</info>

21
js/script.js
View File

@@ -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);

33
js/templates/navigation.handlebars Normal file
View File

@@ -0,0 +1,33 @@
<div id="new-note-fixed">
<div>
<button type="button" id="new-note" class="icon-add">{{newNoteTxt}}</button>
</div>
</div>
<li id="all-notes">
<a href="#" class="icon-home svg">
{{allNotesTxt}}
</a>
</li>
<li id="colors-folder" class="collapsible open">
<button class="collapse"></button>
<a href="#" class="icon-search svg">{{colorsTxt}}</a>
<ul>
<li style="display: flex; justify-content: center;">
<button class="circle-toolbar icon-checkmark any-color"></button>
{{#each colors}}
<button class="circle-toolbar" style="background-color: {{color}} "></button>
{{/each}}
</li>
</ul>
</li>
<li id="notes-folder" class="collapsible open">
<button class="collapse"></button>
<a href="#" class="icon-folder svg">{{notesTxt}}</a>
<ul>
{{#each notes}}
<li class="note with-menu {{#if active}}active{{/if}}" data-id="{{ id }}">
<a href="#">{{{ title }}}</a>
</li>
{{/each}}
</ul>
</li>

51
templates/part.note-modal-editable.php → js/templates/notes.handlebars
View File

@@ -1,3 +1,38 @@
{{#if notes}}
<div class="notes-grid">
{{#each notes}}
<div class="note-grid-item">
<div class="quicknote noselect {{#if active}}note-active{{/if}} {{#if isshared}}shared{{/if}} {{#if sharedwith}}shareowner{{/if}}" style="background-color: {{color}}" data-id="{{ id }}" data-timestamp="{{ timestamp }}" >
{{#if isshared}}
<div>
<div class='icon-share shared-title' title="Shared by {{ userid }}"></div>
<div class='note-title'>
{{{ title }}}
</div>
</div>
<div id='content' class='note-content'>
{{{ content }}}
</div>
{{else}}
<div>
<div class="icon-delete hide-delete-icon icon-delete-note" title="Delete"></div>
<!--
{{#if sharedwith}}
<div class='icon-share shared-title-owner' title="Shared with {{ sharedwith }}"></div>
{{/if}}
-->
<div class='note-title'>
{{{ title }}}
</div>
</div>
<div class='note-content'>
{{{ content }}}
</div>
{{/if}}
</div>
</div>
{{/each}}
</div>
<div id="modal-note-div" class="hide-modal-note modal-note-background">
<div class="modal-content">
<div class="quicknote note-active" style="background-color: #F7EB96" data-id="-1">
@@ -25,11 +60,23 @@
<!--
<button id='share-button'><?php p($l->t('Share'));?></button>
-->
<button id='cancel-button'><?php p($l->t('Cancel')); ?></button>
<button id='save-button'><?php p($l->t('Save')); ?></button>
<button id='cancel-button'>
{{ cancelTxt }}
</button>
<button id='save-button'>
{{ saveTxt }}
</button>
</div>
<div style="clear: both;"></div>
</div>
</div>
</div>
</div>
</div>
</div>
{{else}}
<div class="emptycontent">
<div class="icon-folder"></div>
{{ emptyMsg }}
</div>
{{/if}}

1
templates/main.php
View File

@@ -1,5 +1,6 @@
<?php
vendor_script('quicknotes', 'handlebars');
script('quicknotes', 'templates');
vendor_script('quicknotes', 'isotope.pkgd');
vendor_script('quicknotes', 'medium-editor');
vendor_style('quicknotes', 'medium-editor');

15
templates/part.content.php
View File

@@ -1,16 +1 @@
<script id="content-tpl" type="text/x-handlebars-template">
{{#if notes}}
<div class="notes-grid">
{{#each notes}}
<?php print_unescaped($this->inc('part.note')); ?>
{{/each}}
</div>
<?php print_unescaped($this->inc('part.note-modal-editable')); ?>
{{else}}
<div class="emptycontent">
<div class="icon-folder"></div>
<?php p($l->t('Nothing here. Take your quick notes.')); ?>
</div>
{{/if}}
</script>
<div id="div-content"></div>

49
templates/part.navigation.php
View File

@@ -1,50 +1 @@
<!-- translation strings -->
<div style="display:none" id="new-note-string"><?php p($l->t('New note')); ?></div>
<script id="navigation-tpl" type="text/x-handlebars-template">
<div id="new-note-fixed">
<div><button type="button" id="new-note" class="icon-add"><?php p($l->t('New note'));?></button></div>
</div>
<li id="all-notes"><a href="#" class="icon-home svg"><?php p($l->t('All notes')); ?></a></li>
<!--
<li id="shared-with-you"><a href="#" class="icon-share svg"><?php p($l->t('Shared with you')); ?></a></li>
<li id="shared-by-you"><a href="#" class="icon-share svg"><?php p($l->t('Shared with others')); ?></a></li>
-->
<li id="colors-folder" class="collapsible open">
<button class="collapse"></button>
<a href="#" class="icon-search svg"><?php p($l->t('Colors')); ?></a>
<ul>
<li style="display: flex; justify-content: center;">
<button class="circle-toolbar icon-checkmark any-color"></button>
{{#each colors}}
<button class="circle-toolbar" style="background-color: {{color}} "></button>
{{/each}}
</li>
</ul>
</li>
<li id="notes-folder" class="collapsible open">
<button class="collapse"></button>
<a href="#" class="icon-folder svg"><?php p($l->t('Notes')); ?></a>
<ul>
{{#each notes}}
<li class="note with-menu {{#if active}}active{{/if}}" data-id="{{ id }}">
<a href="#">{{{ title }}}</a>
<!--
<div class="app-navigation-entry-utils">
<ul>
<li class="app-navigation-entry-utils-menu-button svg"><button></button></li>
</ul>
</div>
<div class="app-navigation-entry-menu">
<ul>
<li><button class="delete icon-delete svg" title="delete"></button></li>
</ul>
</div>
-->
</li>
{{/each}}
</ul>
</li>
</script>
<ul class="with-icon"></ul>

22
templates/part.note.php
View File

@@ -1,22 +0,0 @@
<div class="note-grid-item">
<div class="quicknote noselect {{#if active}}note-active{{/if}} {{#if isshared}}shared{{/if}} {{#if sharedwith}}shareowner{{/if}}" style="background-color: {{color}}" data-id="{{ id }}" data-timestamp="{{ timestamp }}" >
{{#if isshared}}
<div>
<div class='icon-share shared-title' title="Shared by {{ userid }}"></div>
<div class='note-title'>{{{ title }}}</div>
</div>
<div id='content' class='note-content'>{{{ content }}}</div>
{{else}}
<div>
<div class="icon-delete hide-delete-icon icon-delete-note" title="Delete"></div>
<!--
{{#if sharedwith}}
<div class='icon-share shared-title-owner' title="Shared with {{ sharedwith }}"></div>
{{/if}}
-->
<div class='note-title'>{{{ title }}}</div>
</div>
<div class='note-content'>{{{ content }}}</div>
{{/if}}
</div>
</div>