paragraph module (#116)

* paragraph refactored

* improved after review
This commit is contained in:
khaydarov 2017-01-26 00:54:02 +03:00 committed by Peter Savchenko
parent dae94e11e3
commit 326767a202
2 changed files with 52 additions and 38 deletions

View file

@ -6,7 +6,8 @@
padding: 0.7em 0 !important; padding: 0.7em 0 !important;
line-height: 1.7em; line-height: 1.7em;
} }
.ce-paragraph:empty::before{ .ce-paragraph:empty::before,
.ce-paragraph p:empty::before{
content : attr(data-placeholder); content : attr(data-placeholder);
color: #818BA1; color: #818BA1;
opacity: .7; opacity: .7;

View file

@ -1,16 +1,19 @@
/** /**
* Paragraph Plugin * Paragraph Plugin
* Creates P tag and adds content to this tag * Creates DIV tag and adds content to this tag
*/ */
var paragraph = (function(paragraph) { var paragraph = (function(paragraph) {
/** /**
* @private
*
* Make initial header block * Make initial header block
* @param {object} JSON with block data * @param {object} JSON with block data
* @return {Element} element to append * @return {Element} element to append
*/ */
paragraph.make = function (data) {
var make_ = function (data) {
/** Create Empty DIV */ /** Create Empty DIV */
var tag = codex.draw.node('DIV', ['ce-paragraph'], {}); var tag = codex.draw.node('DIV', ['ce-paragraph'], {});
@ -21,11 +24,6 @@ var paragraph = (function(paragraph) {
tag.contentEditable = true; tag.contentEditable = true;
/**
* if plugin need to add placeholder
* tag.setAttribute('data-placeholder', 'placehoder');
*/
/** /**
* @uses Paste tool callback. * @uses Paste tool callback.
* Function analyzes pasted data * Function analyzes pasted data
@ -39,52 +37,67 @@ var paragraph = (function(paragraph) {
}; };
/** /**
* Method to render HTML block from JSON * @private
*
* Handles input data for save
* @param data
*/ */
paragraph.render = function (data) { var prepareDataForSave_ = function(data) {
return this.make(data);
}; };
/** /**
* @public
*
* Plugins should have prepare method
* @param config
*/
paragraph.prepare = function(config) {
};
/*
* @public
*
* Method to render HTML block from JSON
*/
paragraph.render = function (data) {
return make_(data);
};
/**
* @public
*
* Check output data for validity.
* Should be defined by developer
*/
paragraph.validate = function(output) {
if (output.text == '')
return;
return output;
};
/**
* @public
*
* Method to extract JSON data from HTML block * Method to extract JSON data from HTML block
*/ */
paragraph.save = function (blockContent){ paragraph.save = function (blockContent){
var data = { var data = {
text : null, "text": blockContent.innerHTML,
format: "html", "format": "html",
introText: '<<same>>' "introText": '<<same>>'
}; };
data.text = blockContent.innerHTML;
return data; return data;
}; };
/**
* Validate data.
* Define which objects are important and which are not
*
* @param data
*
* @return [Boolean]
*/
paragraph.validate = function(data) {
/**
* Do not allow:
* - Empty text
*/
if (data.text.trim() == '')
return;
return true;
};
return paragraph; return paragraph;
})({}); })({});