Skip to content

Commit

Permalink
[ADD] all options and extra fixes
Browse files Browse the repository at this point in the history
  • Loading branch information
gfcapalbo committed Sep 21, 2022
1 parent 0cee218 commit a4d10e7
Show file tree
Hide file tree
Showing 3 changed files with 116 additions and 41 deletions.
Original file line number Diff line number Diff line change
@@ -1,10 +1,14 @@
.md_preserved {
background-color: #90EE90;
color: Black;
font-size: 100%;
padding 2px;
}
.md_not_preserved {
background-color: #FFB6C1;
color: Black;
font-size: 100%;
padding 2px;
}
.o_field_text_markdown blockquote {
background: #f9f9f9;
Expand Down
112 changes: 83 additions & 29 deletions web_widget_html_markdown/static/src/js/web_widget_html_markdown.js
Original file line number Diff line number Diff line change
Expand Up @@ -33,19 +33,22 @@ odoo.define("web_widget_html_markdown.FieldHtmlMarkDown", function(require) {
init: function (parent, options) {
this._super.apply(this, arguments);
this.isSwitch = false;
var is_new = !this.res_id
this.options = _.extend({
default_markdown_on_new: true,
only_markdown_on_new : true,
default_markdown_on_new: (this.attrs.options['default_markdown_on_new'] && is_new) || 0,
only_markdown_on_new: (this.attrs.options['only_markdown_on_new'] && is_new) || 0,
}, options || {});
},
start: function() {
this._super();
this.markdownEditor=false;
var md_s = QWeb.render("web_widget_html_markdown.radio_info" , {});
var self = this;
if (this.options.default_markdown_on_new || this.options.only_markdown_on_new) {
this._createMarkdownEditorInstance()
}
var md_s = QWeb.render("web_widget_html_markdown.radio_info", {'widget': this})
this.$el.prepend(md_s);
this.$el.find('input').addClass('mk_html_switch');
this.$el.find('input').change([self], self._switch_markdown_html);
var self = this;
this.$el.find('input#markdown, input#html').change([self], self._switcher);
this.infoarea = this.$el.find('div#md_infoarea');
this.input_markdown = this.$el.find('input#markdown');
this.input_html = this.$el.find('input#html');
Expand Down Expand Up @@ -128,13 +131,15 @@ odoo.define("web_widget_html_markdown.FieldHtmlMarkDown", function(require) {
if (self._html_has_md_source_tag() ) {
$(self.infoarea).html('<i>Markdown Fully Preserved, you can return to markdown with no loss</i>')
$(self.infoarea).attr('class' ,'md_preserved');
// If there is a MD source tag and is
// a switch but of a first load, start in markdown mode.
if (self.isSwitch == false) {
// If there is a MD source tag and is
// a switch but of a first load, start in markdown mode.
self.sw_html_to_mk()
$(self.infoarea).html('<i>Edit started in Markdown, this field had markdown content preserved</i>')
self.input_markdown.prop('checked', true);
self.input_html.prop('checked', false);
if (!self.options.only_markdown_on_new) {
self.input_html.prop('checked', false);
}
}
} else {
// edit started with content, no tag.
Expand All @@ -145,8 +150,17 @@ odoo.define("web_widget_html_markdown.FieldHtmlMarkDown", function(require) {
self.input_markdown.hide();
self.markdown_label.hide();
} else {
$(self.infoarea).addClass('md_preserved');
$(self.infoarea).html('<i>Edit started in Html, If you start editing in HTML no markdown switching will be possible, if you need markdown, start editing markdown first. </i>')

if (self.options.only_markdown_on_new || self.options.default_markdown_on_new) {
self.sw_html_to_mk()
$(self.infoarea).addClass('md_preserved');
$(self.infoarea).html('<i>Edit started in Markdown, widget configured for exclusive markdown editing </i>')
self.input_markdown.prop('checked', true);
} else {
$(self.infoarea).addClass('md_preserved');
$(self.infoarea).html('<i>Edit started in Html, If you start editing in HTML no markdown switching will be possible, if you need markdown, start editing markdown first. </i>')
self.input_html.prop('checked', true);
}
}
}
});
Expand All @@ -169,12 +183,18 @@ odoo.define("web_widget_html_markdown.FieldHtmlMarkDown", function(require) {
this._super.apply(this, arguments);
},
_renderReadonly: function () {
var self = this;
this._super.apply(this, arguments)
var has_tag = this._html_has_md_source_tag()
var label = 'HTML';
if (has_tag) {
label = 'Markdown';
}
this.$el.prepend('<div class="badge badge-primary float-right">' + label + '</div>')
// parent returns nothing.
},
/*=========================MARKDOWN EDITOR ===============*/
_getMarkdownOptions: function () {
var self = this;
var markdownOpts = {
iconlibrary: "fa",
width: "o_field_html_markdown",
Expand All @@ -189,7 +209,6 @@ odoo.define("web_widget_html_markdown.FieldHtmlMarkDown", function(require) {
};
// Only can create attachments on non-virtual records
if (this.res_id) {
var self = this;
markdownOpts.dropZoneOptions = {
paramName: 'ufile',
url: '/web/binary/upload_attachment',
Expand All @@ -212,22 +231,49 @@ odoo.define("web_widget_html_markdown.FieldHtmlMarkDown", function(require) {
self._markdownDropZoneInit(this);
},
};
if (_t.database.multi_lang && this.field.translate) {
markdownOpts.additionalButtons = [
[{
name: 'oTranslate',
data: [{
name: 'cmdTranslate',
title: _t('Translate'),
icon: {glyph: 'glyphicon glyphicon-flag'},
callback: this._markdownTranslate,
}],
}],
];
}
}
return markdownOpts;
},
_markdownDropZoneInit: function(markdown) {
var self = this;
var caretPos = 0;
var $textarea = null;
markdown.on("drop", function(e) {
$textarea = $(e.target);
caretPos = $textarea.prop("selectionStart");
});
markdown.on("success", function(file, response) {
var text = $textarea.val();
var attachment_id = self._getAttachmentId(response);
if (attachment_id) {
var ftext =
text.substring(0, caretPos) +
"\n![" +
_t("description") +
"](/web/image/" +
attachment_id +
")\n" +
text.substring(caretPos);
$textarea.val(ftext);
} else {
self.do_warn(_t("Error"), _t("Can't create the attachment."));
}
});
markdown.on("error", function(file, error) {
console.warn(error);
});
},

_markdownDropZoneUploadSuccess: function() {
this.isDirty = true;
this._doDebouncedAction();
this.$markdown.$editor.find(".dz-error-mark:last").css("display", "none");
},

_markdownDropZoneUploadError: function() {
this.$markdown.$editor.find(".dz-success-mark:last").css("display", "none");
},

_createMarkdownEditorInstance: function () {
if (!this.markdownEditor) {
var markdownEditor ="<textarea id='comment-md' rows='12' cols='100'></textarea>"
Expand Down Expand Up @@ -284,7 +330,7 @@ odoo.define("web_widget_html_markdown.FieldHtmlMarkDown", function(require) {
* - current content is empty */
return ((this._get_md_tag()) || (this._html_is_empty()))
},
_switch_markdown_html: function(ev) {
_switcher: function(ev) {
self = ev.data[0]
if (ev.currentTarget.id == "markdown") {
var is_empty = self._html_is_empty();
Expand All @@ -300,14 +346,18 @@ odoo.define("web_widget_html_markdown.FieldHtmlMarkDown", function(require) {
}
},
sw_mk_to_html: function() {
self.isSwitch = true;
this.isSwitch = true;
var markdown_content = this.markdownEditor[0].value
var tag = this._generate_md_tag(markdown_content);
this.value = this._getHtmlValue(markdown_content) + tag
this.wysiwyg.setValue(this.value);
this.markdownEditor.parent().hide();
this.$is_markdown = false;
$(this.wysiwyg.el).parent().show();
this.input_markdown.prop('checked', false);
if (this.input_html) {
this.input_html.prop('checked', true);
}
},
sw_html_to_mk: function() {
// markdown editor has problems with "falsy" values
Expand All @@ -319,7 +369,11 @@ odoo.define("web_widget_html_markdown.FieldHtmlMarkDown", function(require) {
$(this.wysiwyg.el).parent().hide();
this.markdownEditor.parent().show();
this.$is_markdown = true;
this.markdownEditor.append(markdown_value)
this.markdownEditor.val(markdown_value)
this.input_markdown.prop('checked', true);
if (this.input_html) {
this.input_html.prop('checked', false);
}
},
_getMarkdownValue: function(value) {
// If we still have source tag we will return that.
Expand Down
41 changes: 29 additions & 12 deletions web_widget_html_markdown/static/src/xml/radio_info.xml
Original file line number Diff line number Diff line change
@@ -1,19 +1,36 @@
<?xml version="1.0" encoding="utf-8"?>
<templates id="template" xml:space="preserve">
<div t-name="web_widget_html_markdown.radio_info">
<div id="radio_container">
<input id="markdown"
type="radio"
name="mk_html_switcher"
value="markdown"/>
<label id="markdown_label" for="markdown">Markdown</label>
<input type="radio" id="html"
name="mk_html_switcher"
value="html"
checked="checked" />
<label id="html_label" for="html">HTML</label>
<div id="radio_container" class="o_field_radio o_field_widget o_required_modifier o_light_label" >
<div class="custom-control custom-radio o_radio_item" aria-atomic="true">
<input id="markdown"
type="radio"
name="_switcher"
value="markdown"
class="custom-control-input o_radio_input"
> </input>
<label id="markdown_label"
for="markdown"
class="custom-control-label o_form_label" >
Markdown
</label>
</div>
<div class="custom-control custom-radio o_radio_item" aria-atomic="true"
t-if="!widget.options.only_markdown_on_new" >
<input type="radio" id="html"
name="_switcher"
value="html"
class="custom-control-input o_radio_input"
t-if="!widget.options.only_markdown_on_new"
> </input>
<label id="html_label" for="html"
t-if="!widget.options.only_markdown_on_new"
class="custom-control-label o_form_label">
HTML
</label>
</div>
</div>
<div id="md_infoarea">
<div id="md_infoarea" class="badge badge-primary">
</div>
</div>
</templates>

0 comments on commit a4d10e7

Please sign in to comment.