aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorMario <mario@mariovavti.com>2021-10-12 11:27:36 +0000
committerMario <mario@mariovavti.com>2021-10-12 11:27:36 +0000
commit96c334e7303f15c7402c96531574a438f4ff8ad0 (patch)
treed4955850b640d0973389697ea4851e1b55963525
parent3e503ec3a35e4226a566c1986bf570afc7c8a53f (diff)
downloadvolse-hubzilla-96c334e7303f15c7402c96531574a438f4ff8ad0.tar.gz
volse-hubzilla-96c334e7303f15c7402c96531574a438f4ff8ad0.tar.bz2
volse-hubzilla-96c334e7303f15c7402c96531574a438f4ff8ad0.zip
bbcode for notes app
-rw-r--r--Zotlabs/Module/Notes.php11
-rw-r--r--Zotlabs/Widget/Notes.php1
-rw-r--r--view/css/conversation.css2
-rw-r--r--view/css/widgets.css18
-rw-r--r--view/tpl/notes.tpl103
5 files changed, 120 insertions, 15 deletions
diff --git a/Zotlabs/Module/Notes.php b/Zotlabs/Module/Notes.php
index 6e8e03f20..57b8f30db 100644
--- a/Zotlabs/Module/Notes.php
+++ b/Zotlabs/Module/Notes.php
@@ -19,7 +19,12 @@ class Notes extends Controller {
if(! Apps::system_app_installed(local_channel(), 'Notes'))
return EMPTY_STR;
- $ret = array('success' => true);
+ $ret = [
+ 'success' => false,
+ 'html' => ''
+ ];
+
+
if(array_key_exists('note_text',$_REQUEST)) {
$body = escape_tags($_REQUEST['note_text']);
@@ -33,6 +38,10 @@ class Notes extends Controller {
set_pconfig(local_channel(),'notes','text.bak',$old_text);
}
set_pconfig(local_channel(),'notes','text',$body);
+
+ $ret['html'] = bbcode($body);
+ $ret['success'] = true;
+
}
// push updates to channel clones
diff --git a/Zotlabs/Widget/Notes.php b/Zotlabs/Widget/Notes.php
index 05c1a0292..66c90ef7d 100644
--- a/Zotlabs/Widget/Notes.php
+++ b/Zotlabs/Widget/Notes.php
@@ -20,6 +20,7 @@ class Notes {
$o = replace_macros($tpl, array(
'$banner' => t('Notes'),
'$text' => $text,
+ '$html' => bbcode($text),
'$save' => t('Save'),
'$app' => ((isset($arr['app'])) ? true : false),
'$hidden' => ((isset($arr['hidden'])) ? true : false)
diff --git a/view/css/conversation.css b/view/css/conversation.css
index dbb930fc7..88081c2c6 100644
--- a/view/css/conversation.css
+++ b/view/css/conversation.css
@@ -313,7 +313,7 @@ code {
}
code.inline-code {
- padding: 0px 4px;
+ padding: 0.2em;
display: inline;
}
diff --git a/view/css/widgets.css b/view/css/widgets.css
index a67c10ed2..b78725919 100644
--- a/view/css/widgets.css
+++ b/view/css/widgets.css
@@ -41,13 +41,23 @@ li:hover .widget-nav-pills-icons {
/* notes */
#note-text {
- border: 1px solid rgba(0,0,0,.125);
- padding: 5px;
+ padding: 7px 10px;
width: 100%;
resize: vertical;
min-height: 250px;
- overflow: auto;
- outline: none;
+ overflow-y: auto;
+ overflow-x: hidden;
+}
+
+#note-text-html {
+ padding: 7px 10px;
+ height: 250px;
+ width: 100%;
+ resize: vertical;
+ min-height: 250px;
+ overflow-y: auto;
+ overflow-x: hidden;
+
}
/* saved searches */
diff --git a/view/tpl/notes.tpl b/view/tpl/notes.tpl
index 0ae0604ef..22a249fd9 100644
--- a/view/tpl/notes.tpl
+++ b/view/tpl/notes.tpl
@@ -1,37 +1,122 @@
{{if $app}}
<div id="personal-notes" class="generic-content-wrapper{{if $hidden}} d-none{{/if}}">
- <div class="section-title-wrapper">
+ <div class="section-title-wrapper clearfix">
+ <div class="float-end rounded border border-secondary p-1 text-muted small note-mode" title="Double click into note for edit mode">Read mode</div>
<h2>{{$banner}}</h2>
</div>
- <div class="section-content-wrapper">
+ <div class="section-content-wrapper-np">
{{else}}
<div id="personal-notes" class="widget{{if $hidden}} d-none{{/if}}">
- <h3>{{$banner}}</h3>
+ <div class="float-end rounded border border-secondary mb-1 ps-1 pe-1 text-muted small note-mode" title="Double click note for edit mode">Read mode</div>
+ <h3 class="float-start">{{$banner}}</h3>
{{/if}}
- <textarea name="note_text" id="note-text" class="{{if $app}}form-control border-0{{/if}}">{{$text}}</textarea>
+ <textarea name="note_text" id="note-text" class="form-control{{if $app}} border-0{{else}} p-1{{/if}}" style="display: none;">{{$text}}</textarea>
+ <div id="note-text-html" class="{{if !$app}}border rounded p-1{{/if}}">{{$html}}</div>
<script>
var noteSaveTimer = null;
var noteText = $('#note-text');
+ var noteTextHTML = $('#note-text-html');
+ var noteMode = $('.note-mode');
+ var noteEditing = false;
+
+ noteText.bbco_autocomplete('bbcode');
$(document).on('focusout',"#note-text",function(e){
if(noteSaveTimer)
clearTimeout(noteSaveTimer);
+
+ noteEditing = false;
notePostFinal();
noteSaveTimer = null;
+ setNoteMode(noteMode, 'saving');
});
- $(document).on('focusin',"#note-text",function(e){
- noteSaveTimer = setTimeout(noteSaveChanges,10000);
+ $(document).on('dblclick',"#note-text-html",function(e){
+ noteEditing = 1;
+ noteText.show().focusin();
+ noteText.height(noteTextHTML.outerHeight());
+ noteText.scrollTop(noteTextHTML.scrollTop());
+ noteTextHTML.hide();
+ setNoteMode(noteMode, 'edit');
+
+ $(document).one('click', function(e) {
+ if (e.target.id !== 'note-text') {
+ noteTextHTML.show();
+ noteTextHTML.height(noteText.outerHeight());
+ noteTextHTML.scrollTop(noteText.scrollTop());
+ noteText.hide();
+ setNoteMode(noteMode, 'read');
+ }
+ });
+
+ $(document).one('click', '#note-text', function(e){
+ noteEditing = 2;
+ setNoteMode(noteMode, 'editing');
+ noteSaveTimer = setTimeout(noteSaveChanges,10000);
+ });
+
});
+
+
function notePostFinal() {
- $.post('notes/sync', { 'note_text' : $('#note-text').val() });
+ $.post(
+ 'notes/sync',
+ {
+ 'note_text' : noteText.val()
+ },
+ function (data) {
+ noteTextHTML.html(data.html);
+ noteTextHTML.show();
+ noteTextHTML.height(noteText.outerHeight());
+ noteTextHTML.scrollTop(noteText.scrollTop());
+ noteText.hide();
+ setNoteMode(noteMode, 'saved');
+ }
+ );
}
function noteSaveChanges() {
- $.post('notes', { 'note_text' : $('#note-text').val() });
- noteSaveTimer = setTimeout(noteSaveChanges,10000);
+ $.post('notes', { 'note_text' : noteText.val() });
+ noteSaveTimer = setTimeout(noteSaveChanges, 10000);
}
+
+ function setNoteMode (obj, mode) {
+ switch(mode) {
+ case 'edit':
+ obj.removeClass('border-secondary border-success text-muted text-success')
+ obj.addClass('border-danger text-danger')
+ obj.html('Edit mode');
+ break;
+ case 'editing':
+ obj.removeClass('border-secondary border-success text-muted text-success')
+ obj.addClass('border-danger text-danger')
+ obj.html('Editing...');
+ break;
+ case 'saving':
+ obj.removeClass('border-secondary border-danger text-muted text-danger')
+ obj.addClass('border-success text-success')
+ obj.html('Saving...');
+ break;
+ case 'saved':
+ obj.removeClass('border-secondary border-danger text-muted text-danger')
+ obj.addClass('border-success text-success')
+ obj.html('Saved');
+ setTimeout(function () {
+ if(noteEditing) {
+ setNoteMode(noteMode, noteEditing === 1 ? 'edit' : 'editing');
+ }
+ else {
+ setNoteMode(noteMode, 'read');
+ }
+ }, 3000);
+ break;
+ case 'read':
+ default:
+ obj.removeClass('border-success border-danger text-success text-danger').addClass('border-secondary text-muted').html('Read mode');
+ }
+ }
+
</script>
{{if $app}}
</div>