mirror of
https://github.com/JanGross/quicknotes.git
synced 2025-11-30 23:37:16 +01:00
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
This commit is contained in:
3
.gitignore
vendored
Normal file
3
.gitignore
vendored
Normal file
@@ -0,0 +1,3 @@
|
|||||||
|
build
|
||||||
|
js/templates.js
|
||||||
|
vendor
|
||||||
3
Makefile
3
Makefile
@@ -72,6 +72,9 @@ depsmin:
|
|||||||
wget https://github.com/varun-raj/medium-editor-autolist/raw/master/dist/autolist.min.js
|
wget https://github.com/varun-raj/medium-editor-autolist/raw/master/dist/autolist.min.js
|
||||||
mv autolist.min.js vendor/autolist.js
|
mv autolist.min.js vendor/autolist.js
|
||||||
|
|
||||||
|
js-templates:
|
||||||
|
handlebars js/templates -f js/templates.js
|
||||||
|
|
||||||
clean:
|
clean:
|
||||||
rm -rf $(build_dir)
|
rm -rf $(build_dir)
|
||||||
|
|
||||||
|
|||||||
@@ -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 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>
|
<screenshot>https://user-images.githubusercontent.com/733715/38871255-b07a7d5a-4226-11e8-8403-650cbea50be0.png</screenshot>
|
||||||
<dependencies>
|
<dependencies>
|
||||||
<nextcloud min-version="14" max-version="14" />
|
<nextcloud min-version="14" max-version="15"/>
|
||||||
</dependencies>
|
</dependencies>
|
||||||
</info>
|
</info>
|
||||||
|
|||||||
21
js/script.js
21
js/script.js
@@ -290,10 +290,12 @@ View.prototype = {
|
|||||||
return digits[1] + '#' + rgb.toString(16).toUpperCase();
|
return digits[1] + '#' + rgb.toString(16).toUpperCase();
|
||||||
},
|
},
|
||||||
renderContent: function () {
|
renderContent: function () {
|
||||||
var source = $('#content-tpl').html();
|
var html = Handlebars.templates['notes']({
|
||||||
var template = Handlebars.compile(source);
|
notes: this._notes.getAll(),
|
||||||
var html = template({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);
|
$('#div-content').html(html);
|
||||||
|
|
||||||
// Init masonty grid to notes.
|
// Init masonty grid to notes.
|
||||||
@@ -510,9 +512,14 @@ View.prototype = {
|
|||||||
});
|
});
|
||||||
},
|
},
|
||||||
renderNavigation: function () {
|
renderNavigation: function () {
|
||||||
var source = $('#navigation-tpl').html();
|
var html = Handlebars.templates['navigation']({
|
||||||
var template = Handlebars.compile(source);
|
colors: this._notes.getColors(),
|
||||||
var html = template({colors: this._notes.getColors(), notes: this._notes.getAll()});
|
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);
|
$('#app-navigation ul').html(html);
|
||||||
|
|
||||||
|
|||||||
33
js/templates/navigation.handlebars
Normal file
33
js/templates/navigation.handlebars
Normal 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>
|
||||||
@@ -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 id="modal-note-div" class="hide-modal-note modal-note-background">
|
||||||
<div class="modal-content">
|
<div class="modal-content">
|
||||||
<div class="quicknote note-active" style="background-color: #F7EB96" data-id="-1">
|
<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='share-button'><?php p($l->t('Share'));?></button>
|
||||||
-->
|
-->
|
||||||
<button id='cancel-button'><?php p($l->t('Cancel')); ?></button>
|
<button id='cancel-button'>
|
||||||
<button id='save-button'><?php p($l->t('Save')); ?></button>
|
{{ cancelTxt }}
|
||||||
|
</button>
|
||||||
|
<button id='save-button'>
|
||||||
|
{{ saveTxt }}
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
<div style="clear: both;"></div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div style="clear: both;"></div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
{{else}}
|
||||||
|
<div class="emptycontent">
|
||||||
|
<div class="icon-folder"></div>
|
||||||
|
{{ emptyMsg }}
|
||||||
|
</div>
|
||||||
|
{{/if}}
|
||||||
@@ -1,5 +1,6 @@
|
|||||||
<?php
|
<?php
|
||||||
vendor_script('quicknotes', 'handlebars');
|
vendor_script('quicknotes', 'handlebars');
|
||||||
|
script('quicknotes', 'templates');
|
||||||
vendor_script('quicknotes', 'isotope.pkgd');
|
vendor_script('quicknotes', 'isotope.pkgd');
|
||||||
vendor_script('quicknotes', 'medium-editor');
|
vendor_script('quicknotes', 'medium-editor');
|
||||||
vendor_style('quicknotes', 'medium-editor');
|
vendor_style('quicknotes', 'medium-editor');
|
||||||
|
|||||||
@@ -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>
|
<div id="div-content"></div>
|
||||||
|
|||||||
@@ -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>
|
<ul class="with-icon"></ul>
|
||||||
@@ -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>
|
|
||||||
Reference in New Issue
Block a user