initial commit
This commit is contained in:
@@ -0,0 +1,92 @@
|
||||
{
|
||||
"name": "froala-wysiwyg-editor",
|
||||
"description": "A beautiful jQuery WYSIWYG HTML rich text editor. High performance and modern design make it easy to use for developers and loved by users.",
|
||||
"homepage": "https://www.froala.com/wysiwyg-editor",
|
||||
"license": "https://www.froala.com/wysiwyg-editor/pricing",
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git://github.com/froala/wysiwyg-editor.git"
|
||||
},
|
||||
"keywords": [
|
||||
"froala",
|
||||
"froala-editor",
|
||||
"froala-wysiwyg",
|
||||
"html",
|
||||
"text",
|
||||
"editor",
|
||||
"wysiwyg",
|
||||
"jquery-plugin",
|
||||
"rich editor",
|
||||
"rich text editor",
|
||||
"rte",
|
||||
"javascript",
|
||||
"jquery"
|
||||
],
|
||||
"moduleType": "globals",
|
||||
"main": [
|
||||
"css/froala_editor.min.css",
|
||||
"css/froala_editor.pkgd.min.css",
|
||||
"css/froala_style.min.css",
|
||||
"css/plugins/char_counter.min.css",
|
||||
"css/plugins/code_view.min.css",
|
||||
"css/plugins/colors.min.css",
|
||||
"css/plugins/draggable.min.css",
|
||||
"css/plugins/emoticons.min.css",
|
||||
"css/plugins/file.min.css",
|
||||
"css/plugins/fullscreen.min.css",
|
||||
"css/plugins/help.min.css",
|
||||
"css/plugins/image_manager.min.css",
|
||||
"css/plugins/image.min.css",
|
||||
"css/plugins/line_breaker.min.css",
|
||||
"css/plugins/quick_insert.min.css",
|
||||
"css/plugins/special_characters.min.css",
|
||||
"css/plugins/table.min.css",
|
||||
"css/plugins/video.min.css",
|
||||
"css/third_party/embedly.min.css",
|
||||
"css/third_party/spell_checker.min.css",
|
||||
"js/froala_editor.min.js",
|
||||
"js/froala_editor.pkgd.min.js",
|
||||
"js/plugins/align.min.js",
|
||||
"js/plugins/char_counter.min.js",
|
||||
"js/plugins/code_beautifier.min.js",
|
||||
"js/plugins/code_view.min.js",
|
||||
"js/plugins/colors.min.js",
|
||||
"js/plugins/draggable.min.js",
|
||||
"js/plugins/emoticons.min.js",
|
||||
"js/plugins/entities.min.js",
|
||||
"js/plugins/file.min.js",
|
||||
"js/plugins/font_family.min.js",
|
||||
"js/plugins/font_size.min.js",
|
||||
"js/plugins/fullscreen.min.js",
|
||||
"js/plugins/help.min.js",
|
||||
"js/plugins/image.min.js",
|
||||
"js/plugins/image_manager.min.js",
|
||||
"js/plugins/inline_style.min.js",
|
||||
"js/plugins/line_breaker.min.js",
|
||||
"js/plugins/link.min.js",
|
||||
"js/plugins/lists.min.js",
|
||||
"js/plugins/paragraph_format.min.js",
|
||||
"js/plugins/paragraph_style.min.js",
|
||||
"js/plugins/print.min.js",
|
||||
"js/plugins/quick_insert.min.js",
|
||||
"js/plugins/quote.min.js",
|
||||
"js/plugins/save.min.js",
|
||||
"js/plugins/special_characters.min.js",
|
||||
"js/plugins/table.min.js",
|
||||
"js/plugins/url.min.js",
|
||||
"js/plugins/video.min.js",
|
||||
"js/plugins/word_paste.min.js",
|
||||
"js/third_party/embedly.min.js",
|
||||
"js/third_party/image_aviary.min.js",
|
||||
"js/third_party/spell_checker.min.js"
|
||||
],
|
||||
"ignore": [
|
||||
"html",
|
||||
"img",
|
||||
"package.json"
|
||||
],
|
||||
"dependencies": {
|
||||
"jquery": ">=1.11.0",
|
||||
"font-awesome": ">=4.4.0"
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,31 @@
|
||||
{
|
||||
"name": "froala/wysiwyg-editor",
|
||||
"description": "A beautiful jQuery WYSIWYG HTML rich text editor. High performance and modern design make it easy to use for developers and loved by users.",
|
||||
"type": "component",
|
||||
"homepage": "https://www.froala.com/wysiwyg-editor",
|
||||
"license": "proprietary",
|
||||
"support": {
|
||||
"issues": "https://www.froala.com/wysiwyg-editor/contact"
|
||||
},
|
||||
"keywords": [
|
||||
"froala",
|
||||
"froala-editor",
|
||||
"froala-wysiwyg",
|
||||
"html",
|
||||
"text",
|
||||
"editor",
|
||||
"wysiwyg",
|
||||
"jquery-plugin",
|
||||
"rich editor",
|
||||
"rich text editor",
|
||||
"rte",
|
||||
"javascript",
|
||||
"jquery"
|
||||
],
|
||||
"authors": [
|
||||
{
|
||||
"name": "Froala Labs",
|
||||
"email": "support@froala.com"
|
||||
}
|
||||
]
|
||||
}
|
||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
@@ -0,0 +1,405 @@
|
||||
/*!
|
||||
* froala_editor v2.7.3 (https://www.froala.com/wysiwyg-editor)
|
||||
* License https://froala.com/wysiwyg-editor/terms/
|
||||
* Copyright 2014-2017 Froala Labs
|
||||
*/
|
||||
|
||||
.clearfix::after {
|
||||
clear: both;
|
||||
display: block;
|
||||
content: "";
|
||||
height: 0;
|
||||
}
|
||||
.hide-by-clipping {
|
||||
position: absolute;
|
||||
width: 1px;
|
||||
height: 1px;
|
||||
padding: 0;
|
||||
margin: -1px;
|
||||
overflow: hidden;
|
||||
clip: rect(0, 0, 0, 0);
|
||||
border: 0;
|
||||
}
|
||||
img.fr-rounded,
|
||||
.fr-img-caption.fr-rounded img {
|
||||
border-radius: 10px;
|
||||
-moz-border-radius: 10px;
|
||||
-webkit-border-radius: 10px;
|
||||
-moz-background-clip: padding;
|
||||
-webkit-background-clip: padding-box;
|
||||
background-clip: padding-box;
|
||||
}
|
||||
img.fr-bordered,
|
||||
.fr-img-caption.fr-bordered img {
|
||||
border: solid 5px #CCC;
|
||||
}
|
||||
img.fr-bordered {
|
||||
-webkit-box-sizing: content-box;
|
||||
-moz-box-sizing: content-box;
|
||||
box-sizing: content-box;
|
||||
}
|
||||
.fr-img-caption.fr-bordered img {
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
img.fr-shadow,
|
||||
.fr-img-caption.fr-shadow img {
|
||||
-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
|
||||
-moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
|
||||
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
|
||||
}
|
||||
.fr-view span[style~="color:"] a {
|
||||
color: inherit;
|
||||
}
|
||||
.fr-view strong {
|
||||
font-weight: 700;
|
||||
}
|
||||
.fr-view table {
|
||||
border: none;
|
||||
border-collapse: collapse;
|
||||
empty-cells: show;
|
||||
max-width: 100%;
|
||||
}
|
||||
.fr-view table.fr-dashed-borders td,
|
||||
.fr-view table.fr-dashed-borders th {
|
||||
border-style: dashed;
|
||||
}
|
||||
.fr-view table.fr-alternate-rows tbody tr:nth-child(2n) {
|
||||
background: #f5f5f5;
|
||||
}
|
||||
.fr-view table td,
|
||||
.fr-view table th {
|
||||
border: 1px solid #dddddd;
|
||||
}
|
||||
.fr-view table td:empty,
|
||||
.fr-view table th:empty {
|
||||
height: 20px;
|
||||
}
|
||||
.fr-view table td.fr-highlighted,
|
||||
.fr-view table th.fr-highlighted {
|
||||
border: 1px double red;
|
||||
}
|
||||
.fr-view table td.fr-thick,
|
||||
.fr-view table th.fr-thick {
|
||||
border-width: 2px;
|
||||
}
|
||||
.fr-view table th {
|
||||
background: #e6e6e6;
|
||||
}
|
||||
.fr-view hr {
|
||||
clear: both;
|
||||
user-select: none;
|
||||
-o-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-khtml-user-select: none;
|
||||
-webkit-user-select: none;
|
||||
-ms-user-select: none;
|
||||
page-break-after: always;
|
||||
}
|
||||
.fr-view .fr-file {
|
||||
position: relative;
|
||||
}
|
||||
.fr-view .fr-file::after {
|
||||
position: relative;
|
||||
content: "\1F4CE";
|
||||
font-weight: normal;
|
||||
}
|
||||
.fr-view pre {
|
||||
white-space: pre-wrap;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
.fr-view[dir="rtl"] blockquote {
|
||||
border-left: none;
|
||||
border-right: solid 2px #5e35b1;
|
||||
margin-right: 0;
|
||||
padding-right: 5px;
|
||||
padding-left: 0px;
|
||||
}
|
||||
.fr-view[dir="rtl"] blockquote blockquote {
|
||||
border-color: #00bcd4;
|
||||
}
|
||||
.fr-view[dir="rtl"] blockquote blockquote blockquote {
|
||||
border-color: #43a047;
|
||||
}
|
||||
.fr-view blockquote {
|
||||
border-left: solid 2px #5e35b1;
|
||||
margin-left: 0;
|
||||
padding-left: 5px;
|
||||
color: #5e35b1;
|
||||
}
|
||||
.fr-view blockquote blockquote {
|
||||
border-color: #00bcd4;
|
||||
color: #00bcd4;
|
||||
}
|
||||
.fr-view blockquote blockquote blockquote {
|
||||
border-color: #43a047;
|
||||
color: #43a047;
|
||||
}
|
||||
.fr-view span.fr-emoticon {
|
||||
font-weight: normal;
|
||||
font-family: "Apple Color Emoji", "Segoe UI Emoji", "NotoColorEmoji", "Segoe UI Symbol", "Android Emoji", "EmojiSymbols";
|
||||
display: inline;
|
||||
line-height: 0;
|
||||
}
|
||||
.fr-view span.fr-emoticon.fr-emoticon-img {
|
||||
background-repeat: no-repeat !important;
|
||||
font-size: inherit;
|
||||
height: 1em;
|
||||
width: 1em;
|
||||
min-height: 20px;
|
||||
min-width: 20px;
|
||||
display: inline-block;
|
||||
margin: -0.1em 0.1em 0.1em;
|
||||
line-height: 1;
|
||||
vertical-align: middle;
|
||||
}
|
||||
.fr-view .fr-text-gray {
|
||||
color: #AAA !important;
|
||||
}
|
||||
.fr-view .fr-text-bordered {
|
||||
border-top: solid 1px #222;
|
||||
border-bottom: solid 1px #222;
|
||||
padding: 10px 0;
|
||||
}
|
||||
.fr-view .fr-text-spaced {
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
.fr-view .fr-text-uppercase {
|
||||
text-transform: uppercase;
|
||||
}
|
||||
.fr-view img {
|
||||
position: relative;
|
||||
max-width: 100%;
|
||||
}
|
||||
.fr-view img.fr-dib {
|
||||
margin: 5px auto;
|
||||
display: block;
|
||||
float: none;
|
||||
vertical-align: top;
|
||||
}
|
||||
.fr-view img.fr-dib.fr-fil {
|
||||
margin-left: 0;
|
||||
text-align: left;
|
||||
}
|
||||
.fr-view img.fr-dib.fr-fir {
|
||||
margin-right: 0;
|
||||
text-align: right;
|
||||
}
|
||||
.fr-view img.fr-dii {
|
||||
display: inline-block;
|
||||
float: none;
|
||||
vertical-align: bottom;
|
||||
margin-left: 5px;
|
||||
margin-right: 5px;
|
||||
max-width: calc(100% - (2 * 5px));
|
||||
}
|
||||
.fr-view img.fr-dii.fr-fil {
|
||||
float: left;
|
||||
margin: 5px 5px 5px 0;
|
||||
max-width: calc(100% - 5px);
|
||||
}
|
||||
.fr-view img.fr-dii.fr-fir {
|
||||
float: right;
|
||||
margin: 5px 0 5px 5px;
|
||||
max-width: calc(100% - 5px);
|
||||
}
|
||||
.fr-view span.fr-img-caption {
|
||||
position: relative;
|
||||
max-width: 100%;
|
||||
}
|
||||
.fr-view span.fr-img-caption.fr-dib {
|
||||
margin: 5px auto;
|
||||
display: block;
|
||||
float: none;
|
||||
vertical-align: top;
|
||||
}
|
||||
.fr-view span.fr-img-caption.fr-dib.fr-fil {
|
||||
margin-left: 0;
|
||||
text-align: left;
|
||||
}
|
||||
.fr-view span.fr-img-caption.fr-dib.fr-fir {
|
||||
margin-right: 0;
|
||||
text-align: right;
|
||||
}
|
||||
.fr-view span.fr-img-caption.fr-dii {
|
||||
display: inline-block;
|
||||
float: none;
|
||||
vertical-align: bottom;
|
||||
margin-left: 5px;
|
||||
margin-right: 5px;
|
||||
max-width: calc(100% - (2 * 5px));
|
||||
}
|
||||
.fr-view span.fr-img-caption.fr-dii.fr-fil {
|
||||
float: left;
|
||||
margin: 5px 5px 5px 0;
|
||||
max-width: calc(100% - 5px);
|
||||
}
|
||||
.fr-view span.fr-img-caption.fr-dii.fr-fir {
|
||||
float: right;
|
||||
margin: 5px 0 5px 5px;
|
||||
max-width: calc(100% - 5px);
|
||||
}
|
||||
.fr-view .fr-video {
|
||||
text-align: center;
|
||||
position: relative;
|
||||
}
|
||||
.fr-view .fr-video > * {
|
||||
-webkit-box-sizing: content-box;
|
||||
-moz-box-sizing: content-box;
|
||||
box-sizing: content-box;
|
||||
max-width: 100%;
|
||||
border: none;
|
||||
}
|
||||
.fr-view .fr-video.fr-dvb {
|
||||
display: block;
|
||||
clear: both;
|
||||
}
|
||||
.fr-view .fr-video.fr-dvb.fr-fvl {
|
||||
text-align: left;
|
||||
}
|
||||
.fr-view .fr-video.fr-dvb.fr-fvr {
|
||||
text-align: right;
|
||||
}
|
||||
.fr-view .fr-video.fr-dvi {
|
||||
display: inline-block;
|
||||
}
|
||||
.fr-view .fr-video.fr-dvi.fr-fvl {
|
||||
float: left;
|
||||
}
|
||||
.fr-view .fr-video.fr-dvi.fr-fvr {
|
||||
float: right;
|
||||
}
|
||||
.fr-view a.fr-strong {
|
||||
font-weight: 700;
|
||||
}
|
||||
.fr-view a.fr-green {
|
||||
color: green;
|
||||
}
|
||||
.fr-view .fr-img-caption {
|
||||
text-align: center;
|
||||
}
|
||||
.fr-view .fr-img-caption .fr-img-wrap {
|
||||
padding: 0px;
|
||||
display: inline-block;
|
||||
margin: auto;
|
||||
text-align: center;
|
||||
}
|
||||
.fr-view .fr-img-caption .fr-img-wrap img {
|
||||
display: block;
|
||||
margin: auto;
|
||||
}
|
||||
.fr-view .fr-img-caption .fr-img-wrap > span {
|
||||
margin: auto;
|
||||
display: inline-block;
|
||||
padding: 5px 5px 10px;
|
||||
font-size: 14px;
|
||||
font-weight: initial;
|
||||
max-width: 100%;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
-webkit-opacity: 0.9;
|
||||
-moz-opacity: 0.9;
|
||||
opacity: 0.9;
|
||||
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
|
||||
}
|
||||
.fr-view button.fr-rounded,
|
||||
.fr-view input.fr-rounded,
|
||||
.fr-view textarea.fr-rounded {
|
||||
border-radius: 10px;
|
||||
-moz-border-radius: 10px;
|
||||
-webkit-border-radius: 10px;
|
||||
-moz-background-clip: padding;
|
||||
-webkit-background-clip: padding-box;
|
||||
background-clip: padding-box;
|
||||
}
|
||||
.fr-view button.fr-large,
|
||||
.fr-view input.fr-large,
|
||||
.fr-view textarea.fr-large {
|
||||
font-size: 24px;
|
||||
}
|
||||
/**
|
||||
* Image style.
|
||||
*/
|
||||
a.fr-view.fr-strong {
|
||||
font-weight: 700;
|
||||
}
|
||||
a.fr-view.fr-green {
|
||||
color: green;
|
||||
}
|
||||
/**
|
||||
* Link style.
|
||||
*/
|
||||
img.fr-view {
|
||||
position: relative;
|
||||
max-width: 100%;
|
||||
}
|
||||
img.fr-view.fr-dib {
|
||||
margin: 5px auto;
|
||||
display: block;
|
||||
float: none;
|
||||
vertical-align: top;
|
||||
}
|
||||
img.fr-view.fr-dib.fr-fil {
|
||||
margin-left: 0;
|
||||
text-align: left;
|
||||
}
|
||||
img.fr-view.fr-dib.fr-fir {
|
||||
margin-right: 0;
|
||||
text-align: right;
|
||||
}
|
||||
img.fr-view.fr-dii {
|
||||
display: inline-block;
|
||||
float: none;
|
||||
vertical-align: bottom;
|
||||
margin-left: 5px;
|
||||
margin-right: 5px;
|
||||
max-width: calc(100% - (2 * 5px));
|
||||
}
|
||||
img.fr-view.fr-dii.fr-fil {
|
||||
float: left;
|
||||
margin: 5px 5px 5px 0;
|
||||
max-width: calc(100% - 5px);
|
||||
}
|
||||
img.fr-view.fr-dii.fr-fir {
|
||||
float: right;
|
||||
margin: 5px 0 5px 5px;
|
||||
max-width: calc(100% - 5px);
|
||||
}
|
||||
span.fr-img-caption.fr-view {
|
||||
position: relative;
|
||||
max-width: 100%;
|
||||
}
|
||||
span.fr-img-caption.fr-view.fr-dib {
|
||||
margin: 5px auto;
|
||||
display: block;
|
||||
float: none;
|
||||
vertical-align: top;
|
||||
}
|
||||
span.fr-img-caption.fr-view.fr-dib.fr-fil {
|
||||
margin-left: 0;
|
||||
text-align: left;
|
||||
}
|
||||
span.fr-img-caption.fr-view.fr-dib.fr-fir {
|
||||
margin-right: 0;
|
||||
text-align: right;
|
||||
}
|
||||
span.fr-img-caption.fr-view.fr-dii {
|
||||
display: inline-block;
|
||||
float: none;
|
||||
vertical-align: bottom;
|
||||
margin-left: 5px;
|
||||
margin-right: 5px;
|
||||
max-width: calc(100% - (2 * 5px));
|
||||
}
|
||||
span.fr-img-caption.fr-view.fr-dii.fr-fil {
|
||||
float: left;
|
||||
margin: 5px 5px 5px 0;
|
||||
max-width: calc(100% - 5px);
|
||||
}
|
||||
span.fr-img-caption.fr-view.fr-dii.fr-fir {
|
||||
float: right;
|
||||
margin: 5px 0 5px 5px;
|
||||
max-width: calc(100% - 5px);
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
@@ -0,0 +1,57 @@
|
||||
/*!
|
||||
* froala_editor v2.7.3 (https://www.froala.com/wysiwyg-editor)
|
||||
* License https://froala.com/wysiwyg-editor/terms/
|
||||
* Copyright 2014-2017 Froala Labs
|
||||
*/
|
||||
|
||||
.clearfix::after {
|
||||
clear: both;
|
||||
display: block;
|
||||
content: "";
|
||||
height: 0;
|
||||
}
|
||||
.hide-by-clipping {
|
||||
position: absolute;
|
||||
width: 1px;
|
||||
height: 1px;
|
||||
padding: 0;
|
||||
margin: -1px;
|
||||
overflow: hidden;
|
||||
clip: rect(0, 0, 0, 0);
|
||||
border: 0;
|
||||
}
|
||||
.fr-box .fr-counter {
|
||||
position: absolute;
|
||||
bottom: 0px;
|
||||
padding: 5px;
|
||||
right: 0px;
|
||||
color: #cccccc;
|
||||
content: attr(data-chars);
|
||||
font-size: 15px;
|
||||
font-family: "Times New Roman", Georgia, Serif;
|
||||
z-index: 1;
|
||||
background: #ffffff;
|
||||
border-top: solid 1px #ebebeb;
|
||||
border-left: solid 1px #ebebeb;
|
||||
border-radius: 2px 0 0 0;
|
||||
-moz-border-radius: 2px 0 0 0;
|
||||
-webkit-border-radius: 2px 0 0 0;
|
||||
-moz-background-clip: padding;
|
||||
-webkit-background-clip: padding-box;
|
||||
background-clip: padding-box;
|
||||
}
|
||||
.fr-box.fr-rtl .fr-counter {
|
||||
left: 0px;
|
||||
right: auto;
|
||||
border-left: none;
|
||||
border-right: solid 1px #ebebeb;
|
||||
border-radius: 0 2px 0 0;
|
||||
-moz-border-radius: 0 2px 0 0;
|
||||
-webkit-border-radius: 0 2px 0 0;
|
||||
-moz-background-clip: padding;
|
||||
-webkit-background-clip: padding-box;
|
||||
background-clip: padding-box;
|
||||
}
|
||||
.fr-box.fr-code-view .fr-counter {
|
||||
display: none;
|
||||
}
|
||||
@@ -0,0 +1,7 @@
|
||||
/*!
|
||||
* froala_editor v2.7.3 (https://www.froala.com/wysiwyg-editor)
|
||||
* License https://froala.com/wysiwyg-editor/terms/
|
||||
* Copyright 2014-2017 Froala Labs
|
||||
*/
|
||||
|
||||
.clearfix::after{clear:both;display:block;content:"";height:0}.hide-by-clipping{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.fr-box .fr-counter{position:absolute;bottom:0;padding:5px;right:0;color:#ccc;content:attr(data-chars);font-size:15px;font-family:"Times New Roman",Georgia,Serif;z-index:1;background:#fff;border-top:solid 1px #ebebeb;border-left:solid 1px #ebebeb;border-radius:2px 0 0;-moz-border-radius:2px 0 0;-webkit-border-radius:2px 0 0;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box}.fr-box.fr-rtl .fr-counter{left:0;right:auto;border-left:0;border-right:solid 1px #ebebeb;border-radius:0 2px 0 0;-moz-border-radius:0 2px 0 0;-webkit-border-radius:0 2px 0 0;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box}.fr-box.fr-code-view .fr-counter{display:none}
|
||||
@@ -0,0 +1,112 @@
|
||||
/*!
|
||||
* froala_editor v2.7.3 (https://www.froala.com/wysiwyg-editor)
|
||||
* License https://froala.com/wysiwyg-editor/terms/
|
||||
* Copyright 2014-2017 Froala Labs
|
||||
*/
|
||||
|
||||
.clearfix::after {
|
||||
clear: both;
|
||||
display: block;
|
||||
content: "";
|
||||
height: 0;
|
||||
}
|
||||
.hide-by-clipping {
|
||||
position: absolute;
|
||||
width: 1px;
|
||||
height: 1px;
|
||||
padding: 0;
|
||||
margin: -1px;
|
||||
overflow: hidden;
|
||||
clip: rect(0, 0, 0, 0);
|
||||
border: 0;
|
||||
}
|
||||
textarea.fr-code {
|
||||
display: none;
|
||||
width: 100%;
|
||||
resize: none;
|
||||
-moz-resize: none;
|
||||
-webkit-resize: none;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
border: none;
|
||||
padding: 10px;
|
||||
margin: 0px;
|
||||
font-family: "Courier New", monospace;
|
||||
font-size: 14px;
|
||||
background: #ffffff;
|
||||
color: #000000;
|
||||
outline: none;
|
||||
}
|
||||
.fr-box.fr-rtl textarea.fr-code {
|
||||
direction: rtl;
|
||||
}
|
||||
.fr-box .CodeMirror {
|
||||
display: none;
|
||||
}
|
||||
.fr-box.fr-code-view textarea.fr-code {
|
||||
display: block;
|
||||
}
|
||||
.fr-box.fr-code-view.fr-inline {
|
||||
-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
|
||||
-moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
|
||||
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
|
||||
}
|
||||
.fr-box.fr-code-view .fr-element,
|
||||
.fr-box.fr-code-view .fr-placeholder,
|
||||
.fr-box.fr-code-view .fr-iframe {
|
||||
display: none;
|
||||
}
|
||||
.fr-box.fr-code-view .CodeMirror {
|
||||
display: block;
|
||||
}
|
||||
.fr-box.fr-inline.fr-code-view .fr-command.fr-btn.html-switch {
|
||||
display: block;
|
||||
}
|
||||
.fr-box.fr-inline .fr-command.fr-btn.html-switch {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
|
||||
-moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
|
||||
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
|
||||
display: none;
|
||||
background: #ffffff;
|
||||
color: #222222;
|
||||
-moz-outline: 0;
|
||||
outline: 0;
|
||||
border: 0;
|
||||
line-height: 1;
|
||||
cursor: pointer;
|
||||
text-align: left;
|
||||
padding: 12px 12px;
|
||||
-webkit-transition: background 0.2s ease 0s;
|
||||
-moz-transition: background 0.2s ease 0s;
|
||||
-ms-transition: background 0.2s ease 0s;
|
||||
-o-transition: background 0.2s ease 0s;
|
||||
border-radius: 0;
|
||||
-moz-border-radius: 0;
|
||||
-webkit-border-radius: 0;
|
||||
-moz-background-clip: padding;
|
||||
-webkit-background-clip: padding-box;
|
||||
background-clip: padding-box;
|
||||
z-index: 2;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
text-decoration: none;
|
||||
user-select: none;
|
||||
-o-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-khtml-user-select: none;
|
||||
-webkit-user-select: none;
|
||||
-ms-user-select: none;
|
||||
}
|
||||
.fr-box.fr-inline .fr-command.fr-btn.html-switch i {
|
||||
font-size: 14px;
|
||||
width: 14px;
|
||||
text-align: center;
|
||||
}
|
||||
.fr-box.fr-inline .fr-command.fr-btn.html-switch.fr-desktop:hover {
|
||||
background: #ebebeb;
|
||||
}
|
||||
@@ -0,0 +1,7 @@
|
||||
/*!
|
||||
* froala_editor v2.7.3 (https://www.froala.com/wysiwyg-editor)
|
||||
* License https://froala.com/wysiwyg-editor/terms/
|
||||
* Copyright 2014-2017 Froala Labs
|
||||
*/
|
||||
|
||||
.clearfix::after{clear:both;display:block;content:"";height:0}.hide-by-clipping{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}textarea.fr-code{display:none;width:100%;resize:none;-moz-resize:none;-webkit-resize:none;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;border:0;padding:10px;margin:0;font-family:"Courier New",monospace;font-size:14px;background:#fff;color:#000;outline:0}.fr-box.fr-rtl textarea.fr-code{direction:rtl}.fr-box .CodeMirror{display:none}.fr-box.fr-code-view textarea.fr-code{display:block}.fr-box.fr-code-view.fr-inline{-webkit-box-shadow:0 1px 3px rgba(0,0,0,.12),0 1px 1px 1px rgba(0,0,0,.16);-moz-box-shadow:0 1px 3px rgba(0,0,0,.12),0 1px 1px 1px rgba(0,0,0,.16);box-shadow:0 1px 3px rgba(0,0,0,.12),0 1px 1px 1px rgba(0,0,0,.16)}.fr-box.fr-code-view .fr-element,.fr-box.fr-code-view .fr-placeholder,.fr-box.fr-code-view .fr-iframe{display:none}.fr-box.fr-code-view .CodeMirror{display:block}.fr-box.fr-inline.fr-code-view .fr-command.fr-btn.html-switch{display:block}.fr-box.fr-inline .fr-command.fr-btn.html-switch{position:absolute;top:0;right:0;-webkit-box-shadow:0 1px 3px rgba(0,0,0,.12),0 1px 1px 1px rgba(0,0,0,.16);-moz-box-shadow:0 1px 3px rgba(0,0,0,.12),0 1px 1px 1px rgba(0,0,0,.16);box-shadow:0 1px 3px rgba(0,0,0,.12),0 1px 1px 1px rgba(0,0,0,.16);display:none;background:#fff;color:#222;-moz-outline:0;outline:0;border:0;line-height:1;cursor:pointer;text-align:left;padding:12px;-webkit-transition:background .2s ease 0s;-moz-transition:background .2s ease 0s;-ms-transition:background .2s ease 0s;-o-transition:background .2s ease 0s;border-radius:0;-moz-border-radius:0;-webkit-border-radius:0;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box;z-index:2;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;text-decoration:none;user-select:none;-o-user-select:none;-moz-user-select:none;-khtml-user-select:none;-webkit-user-select:none;-ms-user-select:none}.fr-box.fr-inline .fr-command.fr-btn.html-switch i{font-size:14px;width:14px;text-align:center}.fr-box.fr-inline .fr-command.fr-btn.html-switch.fr-desktop:hover{background:#ebebeb}
|
||||
@@ -0,0 +1,154 @@
|
||||
/*!
|
||||
* froala_editor v2.7.3 (https://www.froala.com/wysiwyg-editor)
|
||||
* License https://froala.com/wysiwyg-editor/terms/
|
||||
* Copyright 2014-2017 Froala Labs
|
||||
*/
|
||||
|
||||
.clearfix::after {
|
||||
clear: both;
|
||||
display: block;
|
||||
content: "";
|
||||
height: 0;
|
||||
}
|
||||
.hide-by-clipping {
|
||||
position: absolute;
|
||||
width: 1px;
|
||||
height: 1px;
|
||||
padding: 0;
|
||||
margin: -1px;
|
||||
overflow: hidden;
|
||||
clip: rect(0, 0, 0, 0);
|
||||
border: 0;
|
||||
}
|
||||
.fr-popup .fr-colors-tabs {
|
||||
-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
|
||||
-moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
|
||||
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
|
||||
margin-bottom: 5px;
|
||||
line-height: 16px;
|
||||
margin-left: -2px;
|
||||
margin-right: -2px;
|
||||
}
|
||||
.fr-popup .fr-colors-tabs .fr-colors-tab {
|
||||
display: inline-block;
|
||||
width: 50%;
|
||||
cursor: pointer;
|
||||
text-align: center;
|
||||
color: #222222;
|
||||
font-size: 13px;
|
||||
padding: 8px 0;
|
||||
position: relative;
|
||||
}
|
||||
.fr-popup .fr-colors-tabs .fr-colors-tab:hover,
|
||||
.fr-popup .fr-colors-tabs .fr-colors-tab:focus {
|
||||
color: #1e88e5;
|
||||
}
|
||||
.fr-popup .fr-colors-tabs .fr-colors-tab[data-param1="background"]::after {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 2px;
|
||||
background: #1e88e5;
|
||||
content: '';
|
||||
-webkit-transition: transform 0.2s ease 0s;
|
||||
-moz-transition: transform 0.2s ease 0s;
|
||||
-ms-transition: transform 0.2s ease 0s;
|
||||
-o-transition: transform 0.2s ease 0s;
|
||||
}
|
||||
.fr-popup .fr-colors-tabs .fr-colors-tab.fr-selected-tab {
|
||||
color: #1e88e5;
|
||||
}
|
||||
.fr-popup .fr-colors-tabs .fr-colors-tab.fr-selected-tab[data-param1="text"] ~ [data-param1="background"]::after {
|
||||
-webkit-transform: translate3d(-100%, 0, 0);
|
||||
-moz-transform: translate3d(-100%, 0, 0);
|
||||
-ms-transform: translate3d(-100%, 0, 0);
|
||||
-o-transform: translate3d(-100%, 0, 0);
|
||||
}
|
||||
.fr-popup .fr-color-hex-layer {
|
||||
width: 100%;
|
||||
margin: 0px;
|
||||
padding: 10px;
|
||||
}
|
||||
.fr-popup .fr-color-hex-layer .fr-input-line {
|
||||
float: left;
|
||||
width: calc(100% - 50px);
|
||||
padding: 8px 0 0;
|
||||
}
|
||||
.fr-popup .fr-color-hex-layer .fr-action-buttons {
|
||||
float: right;
|
||||
width: 50px;
|
||||
}
|
||||
.fr-popup .fr-color-hex-layer .fr-action-buttons button {
|
||||
background-color: #1e88e5;
|
||||
color: #FFF;
|
||||
border-radius: 2px;
|
||||
-moz-border-radius: 2px;
|
||||
-webkit-border-radius: 2px;
|
||||
-moz-background-clip: padding;
|
||||
-webkit-background-clip: padding-box;
|
||||
background-clip: padding-box;
|
||||
font-size: 13px;
|
||||
height: 32px;
|
||||
}
|
||||
.fr-popup .fr-color-hex-layer .fr-action-buttons button:hover {
|
||||
background-color: #166dba;
|
||||
color: #FFF;
|
||||
}
|
||||
.fr-popup .fr-separator + .fr-colors-tabs {
|
||||
-webkit-box-shadow: none;
|
||||
-moz-box-shadow: none;
|
||||
box-shadow: none;
|
||||
margin-left: 2px;
|
||||
margin-right: 2px;
|
||||
}
|
||||
.fr-popup .fr-color-set {
|
||||
line-height: 0;
|
||||
display: none;
|
||||
}
|
||||
.fr-popup .fr-color-set.fr-selected-set {
|
||||
display: block;
|
||||
}
|
||||
.fr-popup .fr-color-set > span {
|
||||
display: inline-block;
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
.fr-popup .fr-color-set > span > i {
|
||||
text-align: center;
|
||||
line-height: 32px;
|
||||
height: 32px;
|
||||
width: 32px;
|
||||
font-size: 13px;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
cursor: default;
|
||||
left: 0;
|
||||
}
|
||||
.fr-popup .fr-color-set > span .fr-selected-color {
|
||||
color: #ffffff;
|
||||
font-family: FontAwesome;
|
||||
font-size: 13px;
|
||||
font-weight: 400;
|
||||
line-height: 32px;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
left: 0;
|
||||
text-align: center;
|
||||
cursor: default;
|
||||
}
|
||||
.fr-popup .fr-color-set > span:hover,
|
||||
.fr-popup .fr-color-set > span:focus {
|
||||
outline: 1px solid #222222;
|
||||
z-index: 2;
|
||||
}
|
||||
.fr-rtl .fr-popup .fr-colors-tabs .fr-colors-tab.fr-selected-tab[data-param1="text"] ~ [data-param1="background"]::after {
|
||||
-webkit-transform: translate3d(100%, 0, 0);
|
||||
-moz-transform: translate3d(100%, 0, 0);
|
||||
-ms-transform: translate3d(100%, 0, 0);
|
||||
-o-transform: translate3d(100%, 0, 0);
|
||||
}
|
||||
@@ -0,0 +1,7 @@
|
||||
/*!
|
||||
* froala_editor v2.7.3 (https://www.froala.com/wysiwyg-editor)
|
||||
* License https://froala.com/wysiwyg-editor/terms/
|
||||
* Copyright 2014-2017 Froala Labs
|
||||
*/
|
||||
|
||||
.clearfix::after{clear:both;display:block;content:"";height:0}.hide-by-clipping{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.fr-popup .fr-colors-tabs{-webkit-box-shadow:0 1px 3px rgba(0,0,0,.12),0 1px 1px 1px rgba(0,0,0,.16);-moz-box-shadow:0 1px 3px rgba(0,0,0,.12),0 1px 1px 1px rgba(0,0,0,.16);box-shadow:0 1px 3px rgba(0,0,0,.12),0 1px 1px 1px rgba(0,0,0,.16);margin-bottom:5px;line-height:16px;margin-left:-2px;margin-right:-2px}.fr-popup .fr-colors-tabs .fr-colors-tab{display:inline-block;width:50%;cursor:pointer;text-align:center;color:#222;font-size:13px;padding:8px 0;position:relative}.fr-popup .fr-colors-tabs .fr-colors-tab:hover,.fr-popup .fr-colors-tabs .fr-colors-tab:focus{color:#1e88e5}.fr-popup .fr-colors-tabs .fr-colors-tab[data-param1=background]::after{position:absolute;bottom:0;left:0;width:100%;height:2px;background:#1e88e5;content:'';-webkit-transition:transform .2s ease 0s;-moz-transition:transform .2s ease 0s;-ms-transition:transform .2s ease 0s;-o-transition:transform .2s ease 0s}.fr-popup .fr-colors-tabs .fr-colors-tab.fr-selected-tab{color:#1e88e5}.fr-popup .fr-colors-tabs .fr-colors-tab.fr-selected-tab[data-param1=text]~[data-param1=background]::after{-webkit-transform:translate3d(-100%,0,0);-moz-transform:translate3d(-100%,0,0);-ms-transform:translate3d(-100%,0,0);-o-transform:translate3d(-100%,0,0)}.fr-popup .fr-color-hex-layer{width:100%;margin:0;padding:10px}.fr-popup .fr-color-hex-layer .fr-input-line{float:left;width:calc(100% - 50px);padding:8px 0 0}.fr-popup .fr-color-hex-layer .fr-action-buttons{float:right;width:50px}.fr-popup .fr-color-hex-layer .fr-action-buttons button{background-color:#1e88e5;color:#FFF;border-radius:2px;-moz-border-radius:2px;-webkit-border-radius:2px;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box;font-size:13px;height:32px}.fr-popup .fr-color-hex-layer .fr-action-buttons button:hover{background-color:#166dba;color:#FFF}.fr-popup .fr-separator+.fr-colors-tabs{-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;margin-left:2px;margin-right:2px}.fr-popup .fr-color-set{line-height:0;display:none}.fr-popup .fr-color-set.fr-selected-set{display:block}.fr-popup .fr-color-set>span{display:inline-block;width:32px;height:32px;position:relative;z-index:1}.fr-popup .fr-color-set>span>i{text-align:center;line-height:32px;height:32px;width:32px;font-size:13px;position:absolute;bottom:0;cursor:default;left:0}.fr-popup .fr-color-set>span .fr-selected-color{color:#fff;font-family:FontAwesome;font-size:13px;font-weight:400;line-height:32px;position:absolute;top:0;bottom:0;right:0;left:0;text-align:center;cursor:default}.fr-popup .fr-color-set>span:hover,.fr-popup .fr-color-set>span:focus{outline:1px solid #222;z-index:2}.fr-rtl .fr-popup .fr-colors-tabs .fr-colors-tab.fr-selected-tab[data-param1=text]~[data-param1=background]::after{-webkit-transform:translate3d(100%,0,0);-moz-transform:translate3d(100%,0,0);-ms-transform:translate3d(100%,0,0);-o-transform:translate3d(100%,0,0)}
|
||||
@@ -0,0 +1,43 @@
|
||||
/*!
|
||||
* froala_editor v2.7.3 (https://www.froala.com/wysiwyg-editor)
|
||||
* License https://froala.com/wysiwyg-editor/terms/
|
||||
* Copyright 2014-2017 Froala Labs
|
||||
*/
|
||||
|
||||
.clearfix::after {
|
||||
clear: both;
|
||||
display: block;
|
||||
content: "";
|
||||
height: 0;
|
||||
}
|
||||
.hide-by-clipping {
|
||||
position: absolute;
|
||||
width: 1px;
|
||||
height: 1px;
|
||||
padding: 0;
|
||||
margin: -1px;
|
||||
overflow: hidden;
|
||||
clip: rect(0, 0, 0, 0);
|
||||
border: 0;
|
||||
}
|
||||
.fr-drag-helper {
|
||||
background: #1e88e5;
|
||||
height: 2px;
|
||||
margin-top: -1px;
|
||||
-webkit-opacity: 0.2;
|
||||
-moz-opacity: 0.2;
|
||||
opacity: 0.2;
|
||||
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
|
||||
position: absolute;
|
||||
z-index: 2147483640;
|
||||
display: none;
|
||||
}
|
||||
.fr-drag-helper.fr-visible {
|
||||
display: block;
|
||||
}
|
||||
.fr-dragging {
|
||||
-webkit-opacity: 0.4;
|
||||
-moz-opacity: 0.4;
|
||||
opacity: 0.4;
|
||||
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
|
||||
}
|
||||
@@ -0,0 +1,7 @@
|
||||
/*!
|
||||
* froala_editor v2.7.3 (https://www.froala.com/wysiwyg-editor)
|
||||
* License https://froala.com/wysiwyg-editor/terms/
|
||||
* Copyright 2014-2017 Froala Labs
|
||||
*/
|
||||
|
||||
.clearfix::after{clear:both;display:block;content:"";height:0}.hide-by-clipping{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.fr-drag-helper{background:#1e88e5;height:2px;margin-top:-1px;-webkit-opacity:.2;-moz-opacity:.2;opacity:.2;-ms-filter:"alpha(Opacity=0)";position:absolute;z-index:2147483640;display:none}.fr-drag-helper.fr-visible{display:block}.fr-dragging{-webkit-opacity:.4;-moz-opacity:.4;opacity:.4;-ms-filter:"alpha(Opacity=0)"}
|
||||
@@ -0,0 +1,42 @@
|
||||
/*!
|
||||
* froala_editor v2.7.3 (https://www.froala.com/wysiwyg-editor)
|
||||
* License https://froala.com/wysiwyg-editor/terms/
|
||||
* Copyright 2014-2017 Froala Labs
|
||||
*/
|
||||
|
||||
.clearfix::after {
|
||||
clear: both;
|
||||
display: block;
|
||||
content: "";
|
||||
height: 0;
|
||||
}
|
||||
.hide-by-clipping {
|
||||
position: absolute;
|
||||
width: 1px;
|
||||
height: 1px;
|
||||
padding: 0;
|
||||
margin: -1px;
|
||||
overflow: hidden;
|
||||
clip: rect(0, 0, 0, 0);
|
||||
border: 0;
|
||||
}
|
||||
.fr-popup .fr-emoticon {
|
||||
display: inline-block;
|
||||
font-size: 20px;
|
||||
width: 20px;
|
||||
padding: 5px;
|
||||
line-height: 1;
|
||||
cursor: default;
|
||||
font-weight: normal;
|
||||
font-family: "Apple Color Emoji", "Segoe UI Emoji", "NotoColorEmoji", "Segoe UI Symbol", "Android Emoji", "EmojiSymbols";
|
||||
-webkit-box-sizing: content-box;
|
||||
-moz-box-sizing: content-box;
|
||||
box-sizing: content-box;
|
||||
}
|
||||
.fr-popup .fr-emoticon img {
|
||||
height: 20px;
|
||||
}
|
||||
.fr-popup .fr-link:focus {
|
||||
outline: 0;
|
||||
background: #ebebeb;
|
||||
}
|
||||
@@ -0,0 +1,7 @@
|
||||
/*!
|
||||
* froala_editor v2.7.3 (https://www.froala.com/wysiwyg-editor)
|
||||
* License https://froala.com/wysiwyg-editor/terms/
|
||||
* Copyright 2014-2017 Froala Labs
|
||||
*/
|
||||
|
||||
.clearfix::after{clear:both;display:block;content:"";height:0}.hide-by-clipping{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.fr-popup .fr-emoticon{display:inline-block;font-size:20px;width:20px;padding:5px;line-height:1;cursor:default;font-weight:400;font-family:"Apple Color Emoji","Segoe UI Emoji",NotoColorEmoji,"Segoe UI Symbol","Android Emoji",EmojiSymbols;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box}.fr-popup .fr-emoticon img{height:20px}.fr-popup .fr-link:focus{outline:0;background:#ebebeb}
|
||||
@@ -0,0 +1,146 @@
|
||||
/*!
|
||||
* froala_editor v2.7.3 (https://www.froala.com/wysiwyg-editor)
|
||||
* License https://froala.com/wysiwyg-editor/terms/
|
||||
* Copyright 2014-2017 Froala Labs
|
||||
*/
|
||||
|
||||
.clearfix::after {
|
||||
clear: both;
|
||||
display: block;
|
||||
content: "";
|
||||
height: 0;
|
||||
}
|
||||
.hide-by-clipping {
|
||||
position: absolute;
|
||||
width: 1px;
|
||||
height: 1px;
|
||||
padding: 0;
|
||||
margin: -1px;
|
||||
overflow: hidden;
|
||||
clip: rect(0, 0, 0, 0);
|
||||
border: 0;
|
||||
}
|
||||
.fr-popup .fr-file-upload-layer {
|
||||
border: dashed 2px #bdbdbd;
|
||||
padding: 25px 0;
|
||||
position: relative;
|
||||
font-size: 14px;
|
||||
letter-spacing: 1px;
|
||||
line-height: 140%;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
text-align: center;
|
||||
}
|
||||
.fr-popup .fr-file-upload-layer:hover {
|
||||
background: #ebebeb;
|
||||
}
|
||||
.fr-popup .fr-file-upload-layer.fr-drop {
|
||||
background: #ebebeb;
|
||||
border-color: #1e88e5;
|
||||
}
|
||||
.fr-popup .fr-file-upload-layer .fr-form {
|
||||
-webkit-opacity: 0;
|
||||
-moz-opacity: 0;
|
||||
opacity: 0;
|
||||
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 2147483640;
|
||||
overflow: hidden;
|
||||
margin: 0 !important;
|
||||
padding: 0 !important;
|
||||
width: 100% !important;
|
||||
}
|
||||
.fr-popup .fr-file-upload-layer .fr-form input {
|
||||
cursor: pointer;
|
||||
position: absolute;
|
||||
right: 0px;
|
||||
top: 0px;
|
||||
bottom: 0px;
|
||||
width: 500%;
|
||||
height: 100%;
|
||||
margin: 0px;
|
||||
font-size: 400px;
|
||||
}
|
||||
.fr-popup .fr-file-progress-bar-layer {
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.fr-popup .fr-file-progress-bar-layer > h3 {
|
||||
font-size: 16px;
|
||||
margin: 10px 0;
|
||||
font-weight: normal;
|
||||
}
|
||||
.fr-popup .fr-file-progress-bar-layer > div.fr-action-buttons {
|
||||
display: none;
|
||||
}
|
||||
.fr-popup .fr-file-progress-bar-layer > div.fr-loader {
|
||||
background: #bcdbf7;
|
||||
height: 10px;
|
||||
width: 100%;
|
||||
margin-top: 20px;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
}
|
||||
.fr-popup .fr-file-progress-bar-layer > div.fr-loader span {
|
||||
display: block;
|
||||
height: 100%;
|
||||
width: 0%;
|
||||
background: #1e88e5;
|
||||
-webkit-transition: width 0.2s ease 0s;
|
||||
-moz-transition: width 0.2s ease 0s;
|
||||
-ms-transition: width 0.2s ease 0s;
|
||||
-o-transition: width 0.2s ease 0s;
|
||||
}
|
||||
.fr-popup .fr-file-progress-bar-layer > div.fr-loader.fr-indeterminate span {
|
||||
width: 30% !important;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
-webkit-animation: loading 2s linear infinite;
|
||||
-moz-animation: loading 2s linear infinite;
|
||||
-o-animation: loading 2s linear infinite;
|
||||
animation: loading 2s linear infinite;
|
||||
}
|
||||
.fr-popup .fr-file-progress-bar-layer.fr-error > div.fr-loader {
|
||||
display: none;
|
||||
}
|
||||
.fr-popup .fr-file-progress-bar-layer.fr-error > div.fr-action-buttons {
|
||||
display: block;
|
||||
}
|
||||
@keyframes loading {
|
||||
from {
|
||||
left: -25%;
|
||||
}
|
||||
to {
|
||||
left: 100%;
|
||||
}
|
||||
}
|
||||
@-webkit-keyframes loading {
|
||||
from {
|
||||
left: -25%;
|
||||
}
|
||||
to {
|
||||
left: 100%;
|
||||
}
|
||||
}
|
||||
@-moz-keyframes loading {
|
||||
from {
|
||||
left: -25%;
|
||||
}
|
||||
to {
|
||||
left: 100%;
|
||||
}
|
||||
}
|
||||
@-o-keyframes loading {
|
||||
from {
|
||||
left: -25%;
|
||||
}
|
||||
to {
|
||||
left: 100%;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,7 @@
|
||||
/*!
|
||||
* froala_editor v2.7.3 (https://www.froala.com/wysiwyg-editor)
|
||||
* License https://froala.com/wysiwyg-editor/terms/
|
||||
* Copyright 2014-2017 Froala Labs
|
||||
*/
|
||||
|
||||
.clearfix::after{clear:both;display:block;content:"";height:0}.hide-by-clipping{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.fr-popup .fr-file-upload-layer{border:dashed 2px #bdbdbd;padding:25px 0;position:relative;font-size:14px;letter-spacing:1px;line-height:140%;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;text-align:center}.fr-popup .fr-file-upload-layer:hover{background:#ebebeb}.fr-popup .fr-file-upload-layer.fr-drop{background:#ebebeb;border-color:#1e88e5}.fr-popup .fr-file-upload-layer .fr-form{-webkit-opacity:0;-moz-opacity:0;opacity:0;-ms-filter:"alpha(Opacity=0)";position:absolute;top:0;bottom:0;left:0;right:0;z-index:2147483640;overflow:hidden;margin:0!important;padding:0!important;width:100%!important}.fr-popup .fr-file-upload-layer .fr-form input{cursor:pointer;position:absolute;right:0;top:0;bottom:0;width:500%;height:100%;margin:0;font-size:400px}.fr-popup .fr-file-progress-bar-layer{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.fr-popup .fr-file-progress-bar-layer>h3{font-size:16px;margin:10px 0;font-weight:400}.fr-popup .fr-file-progress-bar-layer>div.fr-action-buttons{display:none}.fr-popup .fr-file-progress-bar-layer>div.fr-loader{background:#bcdbf7;height:10px;width:100%;margin-top:20px;overflow:hidden;position:relative}.fr-popup .fr-file-progress-bar-layer>div.fr-loader span{display:block;height:100%;width:0;background:#1e88e5;-webkit-transition:width .2s ease 0s;-moz-transition:width .2s ease 0s;-ms-transition:width .2s ease 0s;-o-transition:width .2s ease 0s}.fr-popup .fr-file-progress-bar-layer>div.fr-loader.fr-indeterminate span{width:30%!important;position:absolute;top:0;-webkit-animation:loading 2s linear infinite;-moz-animation:loading 2s linear infinite;-o-animation:loading 2s linear infinite;animation:loading 2s linear infinite}.fr-popup .fr-file-progress-bar-layer.fr-error>div.fr-loader{display:none}.fr-popup .fr-file-progress-bar-layer.fr-error>div.fr-action-buttons{display:block}@keyframes loading{from{left:-25%}to{left:100%}}@-webkit-keyframes loading{from{left:-25%}to{left:100%}}@-moz-keyframes loading{from{left:-25%}to{left:100%}}@-o-keyframes loading{from{left:-25%}to{left:100%}}
|
||||
@@ -0,0 +1,28 @@
|
||||
/*!
|
||||
* froala_editor v2.7.3 (https://www.froala.com/wysiwyg-editor)
|
||||
* License https://froala.com/wysiwyg-editor/terms/
|
||||
* Copyright 2014-2017 Froala Labs
|
||||
*/
|
||||
|
||||
body.fr-fullscreen {
|
||||
overflow: hidden;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
position: fixed;
|
||||
}
|
||||
.fr-box.fr-fullscreen {
|
||||
margin: 0 !important;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
z-index: 2147483630 !important;
|
||||
width: auto !important;
|
||||
}
|
||||
.fr-box.fr-fullscreen .fr-toolbar.fr-top {
|
||||
top: 0 !important;
|
||||
}
|
||||
.fr-box.fr-fullscreen .fr-toolbar.fr-bottom {
|
||||
bottom: 0 !important;
|
||||
}
|
||||
@@ -0,0 +1,7 @@
|
||||
/*!
|
||||
* froala_editor v2.7.3 (https://www.froala.com/wysiwyg-editor)
|
||||
* License https://froala.com/wysiwyg-editor/terms/
|
||||
* Copyright 2014-2017 Froala Labs
|
||||
*/
|
||||
|
||||
body.fr-fullscreen{overflow:hidden;height:100%;width:100%;position:fixed}.fr-box.fr-fullscreen{margin:0!important;position:fixed;top:0;left:0;bottom:0;right:0;z-index:2147483630!important;width:auto!important}.fr-box.fr-fullscreen .fr-toolbar.fr-top{top:0!important}.fr-box.fr-fullscreen .fr-toolbar.fr-bottom{bottom:0!important}
|
||||
@@ -0,0 +1,52 @@
|
||||
/*!
|
||||
* froala_editor v2.7.3 (https://www.froala.com/wysiwyg-editor)
|
||||
* License https://froala.com/wysiwyg-editor/terms/
|
||||
* Copyright 2014-2017 Froala Labs
|
||||
*/
|
||||
|
||||
.clearfix::after {
|
||||
clear: both;
|
||||
display: block;
|
||||
content: "";
|
||||
height: 0;
|
||||
}
|
||||
.hide-by-clipping {
|
||||
position: absolute;
|
||||
width: 1px;
|
||||
height: 1px;
|
||||
padding: 0;
|
||||
margin: -1px;
|
||||
overflow: hidden;
|
||||
clip: rect(0, 0, 0, 0);
|
||||
border: 0;
|
||||
}
|
||||
.fr-modal .fr-modal-wrapper .fr-modal-body .fr-help-modal {
|
||||
text-align: left;
|
||||
padding: 20px 20px 10px;
|
||||
}
|
||||
.fr-modal .fr-modal-wrapper .fr-modal-body .fr-help-modal table {
|
||||
border-collapse: collapse;
|
||||
font-size: 14px;
|
||||
line-height: 1.5;
|
||||
width: 100%;
|
||||
}
|
||||
.fr-modal .fr-modal-wrapper .fr-modal-body .fr-help-modal table + table {
|
||||
margin-top: 20px;
|
||||
}
|
||||
.fr-modal .fr-modal-wrapper .fr-modal-body .fr-help-modal table tr {
|
||||
border: 0;
|
||||
}
|
||||
.fr-modal .fr-modal-wrapper .fr-modal-body .fr-help-modal table th,
|
||||
.fr-modal .fr-modal-wrapper .fr-modal-body .fr-help-modal table td {
|
||||
padding: 6px 0 4px;
|
||||
}
|
||||
.fr-modal .fr-modal-wrapper .fr-modal-body .fr-help-modal table tbody tr {
|
||||
border-bottom: solid 1px #ebebeb;
|
||||
}
|
||||
.fr-modal .fr-modal-wrapper .fr-modal-body .fr-help-modal table tbody td:first-child {
|
||||
width: 60%;
|
||||
color: #646464;
|
||||
}
|
||||
.fr-modal .fr-modal-wrapper .fr-modal-body .fr-help-modal table tbody td:nth-child(n+2) {
|
||||
letter-spacing: 0.5px;
|
||||
}
|
||||
@@ -0,0 +1,7 @@
|
||||
/*!
|
||||
* froala_editor v2.7.3 (https://www.froala.com/wysiwyg-editor)
|
||||
* License https://froala.com/wysiwyg-editor/terms/
|
||||
* Copyright 2014-2017 Froala Labs
|
||||
*/
|
||||
|
||||
.clearfix::after{clear:both;display:block;content:"";height:0}.hide-by-clipping{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.fr-modal .fr-modal-wrapper .fr-modal-body .fr-help-modal{text-align:left;padding:20px 20px 10px}.fr-modal .fr-modal-wrapper .fr-modal-body .fr-help-modal table{border-collapse:collapse;font-size:14px;line-height:1.5;width:100%}.fr-modal .fr-modal-wrapper .fr-modal-body .fr-help-modal table+table{margin-top:20px}.fr-modal .fr-modal-wrapper .fr-modal-body .fr-help-modal table tr{border:0}.fr-modal .fr-modal-wrapper .fr-modal-body .fr-help-modal table th,.fr-modal .fr-modal-wrapper .fr-modal-body .fr-help-modal table td{padding:6px 0 4px}.fr-modal .fr-modal-wrapper .fr-modal-body .fr-help-modal table tbody tr{border-bottom:solid 1px #ebebeb}.fr-modal .fr-modal-wrapper .fr-modal-body .fr-help-modal table tbody td:first-child{width:60%;color:#646464}.fr-modal .fr-modal-wrapper .fr-modal-body .fr-help-modal table tbody td:nth-child(n+2){letter-spacing:.5px}
|
||||
@@ -0,0 +1,244 @@
|
||||
/*!
|
||||
* froala_editor v2.7.3 (https://www.froala.com/wysiwyg-editor)
|
||||
* License https://froala.com/wysiwyg-editor/terms/
|
||||
* Copyright 2014-2017 Froala Labs
|
||||
*/
|
||||
|
||||
.clearfix::after {
|
||||
clear: both;
|
||||
display: block;
|
||||
content: "";
|
||||
height: 0;
|
||||
}
|
||||
.hide-by-clipping {
|
||||
position: absolute;
|
||||
width: 1px;
|
||||
height: 1px;
|
||||
padding: 0;
|
||||
margin: -1px;
|
||||
overflow: hidden;
|
||||
clip: rect(0, 0, 0, 0);
|
||||
border: 0;
|
||||
}
|
||||
.fr-element img {
|
||||
cursor: pointer;
|
||||
}
|
||||
.fr-image-resizer {
|
||||
position: absolute;
|
||||
border: solid 1px #1e88e5;
|
||||
display: none;
|
||||
user-select: none;
|
||||
-o-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-khtml-user-select: none;
|
||||
-webkit-user-select: none;
|
||||
-ms-user-select: none;
|
||||
-webkit-box-sizing: content-box;
|
||||
-moz-box-sizing: content-box;
|
||||
box-sizing: content-box;
|
||||
}
|
||||
.fr-image-resizer.fr-active {
|
||||
display: block;
|
||||
}
|
||||
.fr-image-resizer .fr-handler {
|
||||
display: block;
|
||||
position: absolute;
|
||||
background: #1e88e5;
|
||||
border: solid 1px #ffffff;
|
||||
z-index: 4;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.fr-image-resizer .fr-handler.fr-hnw {
|
||||
cursor: nw-resize;
|
||||
}
|
||||
.fr-image-resizer .fr-handler.fr-hne {
|
||||
cursor: ne-resize;
|
||||
}
|
||||
.fr-image-resizer .fr-handler.fr-hsw {
|
||||
cursor: sw-resize;
|
||||
}
|
||||
.fr-image-resizer .fr-handler.fr-hse {
|
||||
cursor: se-resize;
|
||||
}
|
||||
.fr-image-resizer .fr-handler {
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
}
|
||||
.fr-image-resizer .fr-handler.fr-hnw {
|
||||
left: -6px;
|
||||
top: -6px;
|
||||
}
|
||||
.fr-image-resizer .fr-handler.fr-hne {
|
||||
right: -6px;
|
||||
top: -6px;
|
||||
}
|
||||
.fr-image-resizer .fr-handler.fr-hsw {
|
||||
left: -6px;
|
||||
bottom: -6px;
|
||||
}
|
||||
.fr-image-resizer .fr-handler.fr-hse {
|
||||
right: -6px;
|
||||
bottom: -6px;
|
||||
}
|
||||
@media (min-width: 1200px) {
|
||||
.fr-image-resizer .fr-handler {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
}
|
||||
.fr-image-resizer .fr-handler.fr-hnw {
|
||||
left: -5px;
|
||||
top: -5px;
|
||||
}
|
||||
.fr-image-resizer .fr-handler.fr-hne {
|
||||
right: -5px;
|
||||
top: -5px;
|
||||
}
|
||||
.fr-image-resizer .fr-handler.fr-hsw {
|
||||
left: -5px;
|
||||
bottom: -5px;
|
||||
}
|
||||
.fr-image-resizer .fr-handler.fr-hse {
|
||||
right: -5px;
|
||||
bottom: -5px;
|
||||
}
|
||||
}
|
||||
.fr-image-overlay {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
z-index: 2147483640;
|
||||
display: none;
|
||||
}
|
||||
.fr-popup .fr-image-upload-layer {
|
||||
border: dashed 2px #bdbdbd;
|
||||
padding: 25px 0;
|
||||
position: relative;
|
||||
font-size: 14px;
|
||||
letter-spacing: 1px;
|
||||
line-height: 140%;
|
||||
text-align: center;
|
||||
}
|
||||
.fr-popup .fr-image-upload-layer:hover {
|
||||
background: #ebebeb;
|
||||
}
|
||||
.fr-popup .fr-image-upload-layer.fr-drop {
|
||||
background: #ebebeb;
|
||||
border-color: #1e88e5;
|
||||
}
|
||||
.fr-popup .fr-image-upload-layer .fr-form {
|
||||
-webkit-opacity: 0;
|
||||
-moz-opacity: 0;
|
||||
opacity: 0;
|
||||
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 2147483640;
|
||||
overflow: hidden;
|
||||
margin: 0 !important;
|
||||
padding: 0 !important;
|
||||
width: 100% !important;
|
||||
}
|
||||
.fr-popup .fr-image-upload-layer .fr-form input {
|
||||
cursor: pointer;
|
||||
position: absolute;
|
||||
right: 0px;
|
||||
top: 0px;
|
||||
bottom: 0px;
|
||||
width: 500%;
|
||||
height: 100%;
|
||||
margin: 0px;
|
||||
font-size: 400px;
|
||||
}
|
||||
.fr-popup .fr-image-progress-bar-layer > h3 {
|
||||
font-size: 16px;
|
||||
margin: 10px 0;
|
||||
font-weight: normal;
|
||||
}
|
||||
.fr-popup .fr-image-progress-bar-layer > div.fr-action-buttons {
|
||||
display: none;
|
||||
}
|
||||
.fr-popup .fr-image-progress-bar-layer > div.fr-loader {
|
||||
background: #bcdbf7;
|
||||
height: 10px;
|
||||
width: 100%;
|
||||
margin-top: 20px;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
}
|
||||
.fr-popup .fr-image-progress-bar-layer > div.fr-loader span {
|
||||
display: block;
|
||||
height: 100%;
|
||||
width: 0%;
|
||||
background: #1e88e5;
|
||||
-webkit-transition: width 0.2s ease 0s;
|
||||
-moz-transition: width 0.2s ease 0s;
|
||||
-ms-transition: width 0.2s ease 0s;
|
||||
-o-transition: width 0.2s ease 0s;
|
||||
}
|
||||
.fr-popup .fr-image-progress-bar-layer > div.fr-loader.fr-indeterminate span {
|
||||
width: 30% !important;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
-webkit-animation: loading 2s linear infinite;
|
||||
-moz-animation: loading 2s linear infinite;
|
||||
-o-animation: loading 2s linear infinite;
|
||||
animation: loading 2s linear infinite;
|
||||
}
|
||||
.fr-popup .fr-image-progress-bar-layer.fr-error > div.fr-loader {
|
||||
display: none;
|
||||
}
|
||||
.fr-popup .fr-image-progress-bar-layer.fr-error > div.fr-action-buttons {
|
||||
display: block;
|
||||
}
|
||||
.fr-image-size-layer .fr-image-group .fr-input-line {
|
||||
width: calc(50% - 5px);
|
||||
display: inline-block;
|
||||
}
|
||||
.fr-image-size-layer .fr-image-group .fr-input-line + .fr-input-line {
|
||||
margin-left: 10px;
|
||||
}
|
||||
.fr-uploading {
|
||||
-webkit-opacity: 0.4;
|
||||
-moz-opacity: 0.4;
|
||||
opacity: 0.4;
|
||||
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
|
||||
}
|
||||
@keyframes loading {
|
||||
from {
|
||||
left: -25%;
|
||||
}
|
||||
to {
|
||||
left: 100%;
|
||||
}
|
||||
}
|
||||
@-webkit-keyframes loading {
|
||||
from {
|
||||
left: -25%;
|
||||
}
|
||||
to {
|
||||
left: 100%;
|
||||
}
|
||||
}
|
||||
@-moz-keyframes loading {
|
||||
from {
|
||||
left: -25%;
|
||||
}
|
||||
to {
|
||||
left: 100%;
|
||||
}
|
||||
}
|
||||
@-o-keyframes loading {
|
||||
from {
|
||||
left: -25%;
|
||||
}
|
||||
to {
|
||||
left: 100%;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,7 @@
|
||||
/*!
|
||||
* froala_editor v2.7.3 (https://www.froala.com/wysiwyg-editor)
|
||||
* License https://froala.com/wysiwyg-editor/terms/
|
||||
* Copyright 2014-2017 Froala Labs
|
||||
*/
|
||||
|
||||
.clearfix::after{clear:both;display:block;content:"";height:0}.hide-by-clipping{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.fr-element img{cursor:pointer}.fr-image-resizer{position:absolute;border:solid 1px #1e88e5;display:none;user-select:none;-o-user-select:none;-moz-user-select:none;-khtml-user-select:none;-webkit-user-select:none;-ms-user-select:none;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box}.fr-image-resizer.fr-active{display:block}.fr-image-resizer .fr-handler{display:block;position:absolute;background:#1e88e5;border:solid 1px #fff;z-index:4;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.fr-image-resizer .fr-handler.fr-hnw{cursor:nw-resize}.fr-image-resizer .fr-handler.fr-hne{cursor:ne-resize}.fr-image-resizer .fr-handler.fr-hsw{cursor:sw-resize}.fr-image-resizer .fr-handler.fr-hse{cursor:se-resize}.fr-image-resizer .fr-handler{width:12px;height:12px}.fr-image-resizer .fr-handler.fr-hnw{left:-6px;top:-6px}.fr-image-resizer .fr-handler.fr-hne{right:-6px;top:-6px}.fr-image-resizer .fr-handler.fr-hsw{left:-6px;bottom:-6px}.fr-image-resizer .fr-handler.fr-hse{right:-6px;bottom:-6px}@media (min-width:1200px){.fr-image-resizer .fr-handler{width:10px;height:10px}.fr-image-resizer .fr-handler.fr-hnw{left:-5px;top:-5px}.fr-image-resizer .fr-handler.fr-hne{right:-5px;top:-5px}.fr-image-resizer .fr-handler.fr-hsw{left:-5px;bottom:-5px}.fr-image-resizer .fr-handler.fr-hse{right:-5px;bottom:-5px}}.fr-image-overlay{position:fixed;top:0;left:0;bottom:0;right:0;z-index:2147483640;display:none}.fr-popup .fr-image-upload-layer{border:dashed 2px #bdbdbd;padding:25px 0;position:relative;font-size:14px;letter-spacing:1px;line-height:140%;text-align:center}.fr-popup .fr-image-upload-layer:hover{background:#ebebeb}.fr-popup .fr-image-upload-layer.fr-drop{background:#ebebeb;border-color:#1e88e5}.fr-popup .fr-image-upload-layer .fr-form{-webkit-opacity:0;-moz-opacity:0;opacity:0;-ms-filter:"alpha(Opacity=0)";position:absolute;top:0;bottom:0;left:0;right:0;z-index:2147483640;overflow:hidden;margin:0!important;padding:0!important;width:100%!important}.fr-popup .fr-image-upload-layer .fr-form input{cursor:pointer;position:absolute;right:0;top:0;bottom:0;width:500%;height:100%;margin:0;font-size:400px}.fr-popup .fr-image-progress-bar-layer>h3{font-size:16px;margin:10px 0;font-weight:400}.fr-popup .fr-image-progress-bar-layer>div.fr-action-buttons{display:none}.fr-popup .fr-image-progress-bar-layer>div.fr-loader{background:#bcdbf7;height:10px;width:100%;margin-top:20px;overflow:hidden;position:relative}.fr-popup .fr-image-progress-bar-layer>div.fr-loader span{display:block;height:100%;width:0;background:#1e88e5;-webkit-transition:width .2s ease 0s;-moz-transition:width .2s ease 0s;-ms-transition:width .2s ease 0s;-o-transition:width .2s ease 0s}.fr-popup .fr-image-progress-bar-layer>div.fr-loader.fr-indeterminate span{width:30%!important;position:absolute;top:0;-webkit-animation:loading 2s linear infinite;-moz-animation:loading 2s linear infinite;-o-animation:loading 2s linear infinite;animation:loading 2s linear infinite}.fr-popup .fr-image-progress-bar-layer.fr-error>div.fr-loader{display:none}.fr-popup .fr-image-progress-bar-layer.fr-error>div.fr-action-buttons{display:block}.fr-image-size-layer .fr-image-group .fr-input-line{width:calc(50% - 5px);display:inline-block}.fr-image-size-layer .fr-image-group .fr-input-line+.fr-input-line{margin-left:10px}.fr-uploading{-webkit-opacity:.4;-moz-opacity:.4;opacity:.4;-ms-filter:"alpha(Opacity=0)"}@keyframes loading{from{left:-25%}to{left:100%}}@-webkit-keyframes loading{from{left:-25%}to{left:100%}}@-moz-keyframes loading{from{left:-25%}to{left:100%}}@-o-keyframes loading{from{left:-25%}to{left:100%}}
|
||||
@@ -0,0 +1,265 @@
|
||||
/*!
|
||||
* froala_editor v2.7.3 (https://www.froala.com/wysiwyg-editor)
|
||||
* License https://froala.com/wysiwyg-editor/terms/
|
||||
* Copyright 2014-2017 Froala Labs
|
||||
*/
|
||||
|
||||
.clearfix::after {
|
||||
clear: both;
|
||||
display: block;
|
||||
content: "";
|
||||
height: 0;
|
||||
}
|
||||
.hide-by-clipping {
|
||||
position: absolute;
|
||||
width: 1px;
|
||||
height: 1px;
|
||||
padding: 0;
|
||||
margin: -1px;
|
||||
overflow: hidden;
|
||||
clip: rect(0, 0, 0, 0);
|
||||
border: 0;
|
||||
}
|
||||
.fr-modal-head .fr-modal-head-line::after {
|
||||
clear: both;
|
||||
display: block;
|
||||
content: "";
|
||||
height: 0;
|
||||
}
|
||||
.fr-modal-head .fr-modal-head-line i.fr-modal-more {
|
||||
float: left;
|
||||
opacity: 1;
|
||||
-webkit-transition: padding 0.2s ease 0s, width 0.2s ease 0s, opacity 0.2s ease 0s;
|
||||
-moz-transition: padding 0.2s ease 0s, width 0.2s ease 0s, opacity 0.2s ease 0s;
|
||||
-ms-transition: padding 0.2s ease 0s, width 0.2s ease 0s, opacity 0.2s ease 0s;
|
||||
-o-transition: padding 0.2s ease 0s, width 0.2s ease 0s, opacity 0.2s ease 0s;
|
||||
}
|
||||
.fr-modal-head .fr-modal-head-line i.fr-modal-more.fr-not-available {
|
||||
opacity: 0;
|
||||
width: 0;
|
||||
padding: 12px 0;
|
||||
}
|
||||
.fr-modal-head .fr-modal-tags {
|
||||
display: none;
|
||||
text-align: left;
|
||||
}
|
||||
.fr-modal-head .fr-modal-tags a {
|
||||
display: inline-block;
|
||||
opacity: 0;
|
||||
padding: 6px 8px;
|
||||
margin: 8px 0 8px 8px;
|
||||
text-decoration: none;
|
||||
border-radius: 2px;
|
||||
-moz-border-radius: 2px;
|
||||
-webkit-border-radius: 2px;
|
||||
-moz-background-clip: padding;
|
||||
-webkit-background-clip: padding-box;
|
||||
background-clip: padding-box;
|
||||
color: #1e88e5;
|
||||
-webkit-transition: opacity 0.2s ease 0s, background 0.2s ease 0s;
|
||||
-moz-transition: opacity 0.2s ease 0s, background 0.2s ease 0s;
|
||||
-ms-transition: opacity 0.2s ease 0s, background 0.2s ease 0s;
|
||||
-o-transition: opacity 0.2s ease 0s, background 0.2s ease 0s;
|
||||
cursor: pointer;
|
||||
}
|
||||
.fr-modal-head .fr-modal-tags a:focus {
|
||||
outline: none;
|
||||
}
|
||||
.fr-modal-head .fr-modal-tags a.fr-selected-tag {
|
||||
background: #d6d6d6;
|
||||
}
|
||||
div.fr-modal-body .fr-preloader {
|
||||
display: block;
|
||||
margin: 50px auto;
|
||||
}
|
||||
div.fr-modal-body div.fr-image-list {
|
||||
text-align: center;
|
||||
margin: 0 10px;
|
||||
padding: 0;
|
||||
}
|
||||
div.fr-modal-body div.fr-image-list::after {
|
||||
clear: both;
|
||||
display: block;
|
||||
content: "";
|
||||
height: 0;
|
||||
}
|
||||
div.fr-modal-body div.fr-image-list .fr-list-column {
|
||||
float: left;
|
||||
width: calc((100% - 10px) / 2);
|
||||
}
|
||||
@media (min-width: 768px) and (max-width: 1199px) {
|
||||
div.fr-modal-body div.fr-image-list .fr-list-column {
|
||||
width: calc((100% - 20px) / 3);
|
||||
}
|
||||
}
|
||||
@media (min-width: 1200px) {
|
||||
div.fr-modal-body div.fr-image-list .fr-list-column {
|
||||
width: calc((100% - 30px) / 4);
|
||||
}
|
||||
}
|
||||
div.fr-modal-body div.fr-image-list .fr-list-column + .fr-list-column {
|
||||
margin-left: 10px;
|
||||
}
|
||||
div.fr-modal-body div.fr-image-list div.fr-image-container {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
display: block;
|
||||
-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
|
||||
-moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
|
||||
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
|
||||
border-radius: 2px;
|
||||
-moz-border-radius: 2px;
|
||||
-webkit-border-radius: 2px;
|
||||
-moz-background-clip: padding;
|
||||
-webkit-background-clip: padding-box;
|
||||
background-clip: padding-box;
|
||||
overflow: hidden;
|
||||
}
|
||||
div.fr-modal-body div.fr-image-list div.fr-image-container:first-child {
|
||||
margin-top: 10px;
|
||||
}
|
||||
div.fr-modal-body div.fr-image-list div.fr-image-container + div {
|
||||
margin-top: 10px;
|
||||
}
|
||||
div.fr-modal-body div.fr-image-list div.fr-image-container.fr-image-deleting::after {
|
||||
position: absolute;
|
||||
-webkit-opacity: 0.5;
|
||||
-moz-opacity: 0.5;
|
||||
opacity: 0.5;
|
||||
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
|
||||
-webkit-transition: opacity 0.2s ease 0s;
|
||||
-moz-transition: opacity 0.2s ease 0s;
|
||||
-ms-transition: opacity 0.2s ease 0s;
|
||||
-o-transition: opacity 0.2s ease 0s;
|
||||
background: #000000;
|
||||
content: "";
|
||||
top: 0;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
z-index: 2;
|
||||
}
|
||||
div.fr-modal-body div.fr-image-list div.fr-image-container.fr-image-deleting::before {
|
||||
content: attr(data-deleting);
|
||||
color: #ffffff;
|
||||
top: 0;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
margin: auto;
|
||||
position: absolute;
|
||||
z-index: 3;
|
||||
font-size: 15px;
|
||||
height: 20px;
|
||||
}
|
||||
div.fr-modal-body div.fr-image-list div.fr-image-container.fr-empty {
|
||||
height: 95px;
|
||||
background: #cccccc;
|
||||
z-index: 1;
|
||||
}
|
||||
div.fr-modal-body div.fr-image-list div.fr-image-container.fr-empty::after {
|
||||
position: absolute;
|
||||
margin: auto;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
content: attr(data-loading);
|
||||
display: inline-block;
|
||||
height: 20px;
|
||||
}
|
||||
div.fr-modal-body div.fr-image-list div.fr-image-container img {
|
||||
width: 100%;
|
||||
vertical-align: middle;
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
-webkit-opacity: 1;
|
||||
-moz-opacity: 1;
|
||||
opacity: 1;
|
||||
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
|
||||
-webkit-transition: opacity 0.2s ease 0s, filter 0.2s ease 0s;
|
||||
-moz-transition: opacity 0.2s ease 0s, filter 0.2s ease 0s;
|
||||
-ms-transition: opacity 0.2s ease 0s, filter 0.2s ease 0s;
|
||||
-o-transition: opacity 0.2s ease 0s, filter 0.2s ease 0s;
|
||||
-webkit-transform: translateZ(0);
|
||||
-moz-transform: translateZ(0);
|
||||
-ms-transform: translateZ(0);
|
||||
-o-transform: translateZ(0);
|
||||
}
|
||||
div.fr-modal-body div.fr-image-list div.fr-image-container.fr-mobile-selected img {
|
||||
-webkit-opacity: 0.75;
|
||||
-moz-opacity: 0.75;
|
||||
opacity: 0.75;
|
||||
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
|
||||
}
|
||||
div.fr-modal-body div.fr-image-list div.fr-image-container.fr-mobile-selected .fr-delete-img,
|
||||
div.fr-modal-body div.fr-image-list div.fr-image-container.fr-mobile-selected .fr-insert-img {
|
||||
display: inline-block;
|
||||
}
|
||||
div.fr-modal-body div.fr-image-list div.fr-image-container .fr-delete-img,
|
||||
div.fr-modal-body div.fr-image-list div.fr-image-container .fr-insert-img {
|
||||
display: none;
|
||||
top: 50%;
|
||||
border-radius: 100%;
|
||||
-moz-border-radius: 100%;
|
||||
-webkit-border-radius: 100%;
|
||||
-moz-background-clip: padding;
|
||||
-webkit-background-clip: padding-box;
|
||||
background-clip: padding-box;
|
||||
-webkit-transition: background 0.2s ease 0s, color 0.2s ease 0s;
|
||||
-moz-transition: background 0.2s ease 0s, color 0.2s ease 0s;
|
||||
-ms-transition: background 0.2s ease 0s, color 0.2s ease 0s;
|
||||
-o-transition: background 0.2s ease 0s, color 0.2s ease 0s;
|
||||
-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
|
||||
-moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
|
||||
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
|
||||
position: absolute;
|
||||
cursor: pointer;
|
||||
margin: 0;
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
line-height: 36px;
|
||||
text-decoration: none;
|
||||
z-index: 3;
|
||||
}
|
||||
div.fr-modal-body div.fr-image-list div.fr-image-container .fr-delete-img {
|
||||
background: #b8312f;
|
||||
color: #ffffff;
|
||||
left: 50%;
|
||||
-webkit-transform: translateY(-50%) translateX(25%);
|
||||
-moz-transform: translateY(-50%) translateX(25%);
|
||||
-ms-transform: translateY(-50%) translateX(25%);
|
||||
-o-transform: translateY(-50%) translateX(25%);
|
||||
}
|
||||
div.fr-modal-body div.fr-image-list div.fr-image-container .fr-insert-img {
|
||||
background: #ffffff;
|
||||
color: #1e88e5;
|
||||
left: 50%;
|
||||
-webkit-transform: translateY(-50%) translateX(-125%);
|
||||
-moz-transform: translateY(-50%) translateX(-125%);
|
||||
-ms-transform: translateY(-50%) translateX(-125%);
|
||||
-o-transform: translateY(-50%) translateX(-125%);
|
||||
}
|
||||
.fr-desktop .fr-modal-wrapper .fr-modal-head .fr-modal-tags a:hover {
|
||||
background: #ebebeb;
|
||||
}
|
||||
.fr-desktop .fr-modal-wrapper .fr-modal-head .fr-modal-tags a.fr-selected-tag {
|
||||
background: #d6d6d6;
|
||||
}
|
||||
.fr-desktop .fr-modal-wrapper div.fr-modal-body div.fr-image-list div.fr-image-container:hover img {
|
||||
-webkit-opacity: 0.75;
|
||||
-moz-opacity: 0.75;
|
||||
opacity: 0.75;
|
||||
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
|
||||
}
|
||||
.fr-desktop .fr-modal-wrapper div.fr-modal-body div.fr-image-list div.fr-image-container:hover .fr-delete-img,
|
||||
.fr-desktop .fr-modal-wrapper div.fr-modal-body div.fr-image-list div.fr-image-container:hover .fr-insert-img {
|
||||
display: inline-block;
|
||||
}
|
||||
.fr-desktop .fr-modal-wrapper div.fr-modal-body div.fr-image-list div.fr-image-container .fr-delete-img:hover {
|
||||
background: #bf4644;
|
||||
color: #ffffff;
|
||||
}
|
||||
.fr-desktop .fr-modal-wrapper div.fr-modal-body div.fr-image-list div.fr-image-container .fr-insert-img:hover {
|
||||
background: #ebebeb;
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
@@ -0,0 +1,37 @@
|
||||
/*!
|
||||
* froala_editor v2.7.3 (https://www.froala.com/wysiwyg-editor)
|
||||
* License https://froala.com/wysiwyg-editor/terms/
|
||||
* Copyright 2014-2017 Froala Labs
|
||||
*/
|
||||
|
||||
.clearfix::after {
|
||||
clear: both;
|
||||
display: block;
|
||||
content: "";
|
||||
height: 0;
|
||||
}
|
||||
.hide-by-clipping {
|
||||
position: absolute;
|
||||
width: 1px;
|
||||
height: 1px;
|
||||
padding: 0;
|
||||
margin: -1px;
|
||||
overflow: hidden;
|
||||
clip: rect(0, 0, 0, 0);
|
||||
border: 0;
|
||||
}
|
||||
.fr-line-breaker {
|
||||
cursor: text;
|
||||
border-top: 1px solid #1e88e5;
|
||||
position: fixed;
|
||||
z-index: 2;
|
||||
display: none;
|
||||
}
|
||||
.fr-line-breaker.fr-visible {
|
||||
display: block;
|
||||
}
|
||||
.fr-line-breaker a.fr-floating-btn {
|
||||
position: absolute;
|
||||
left: calc(50% - (32px / 2));
|
||||
top: -16px;
|
||||
}
|
||||
@@ -0,0 +1,7 @@
|
||||
/*!
|
||||
* froala_editor v2.7.3 (https://www.froala.com/wysiwyg-editor)
|
||||
* License https://froala.com/wysiwyg-editor/terms/
|
||||
* Copyright 2014-2017 Froala Labs
|
||||
*/
|
||||
|
||||
.clearfix::after{clear:both;display:block;content:"";height:0}.hide-by-clipping{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.fr-line-breaker{cursor:text;border-top:1px solid #1e88e5;position:fixed;z-index:2;display:none}.fr-line-breaker.fr-visible{display:block}.fr-line-breaker a.fr-floating-btn{position:absolute;left:calc(50% - (32px / 2));top:-16px}
|
||||
@@ -0,0 +1,70 @@
|
||||
/*!
|
||||
* froala_editor v2.7.3 (https://www.froala.com/wysiwyg-editor)
|
||||
* License https://froala.com/wysiwyg-editor/terms/
|
||||
* Copyright 2014-2017 Froala Labs
|
||||
*/
|
||||
|
||||
.clearfix::after {
|
||||
clear: both;
|
||||
display: block;
|
||||
content: "";
|
||||
height: 0;
|
||||
}
|
||||
.hide-by-clipping {
|
||||
position: absolute;
|
||||
width: 1px;
|
||||
height: 1px;
|
||||
padding: 0;
|
||||
margin: -1px;
|
||||
overflow: hidden;
|
||||
clip: rect(0, 0, 0, 0);
|
||||
border: 0;
|
||||
}
|
||||
.fr-quick-insert {
|
||||
position: absolute;
|
||||
z-index: 2147483639;
|
||||
white-space: nowrap;
|
||||
padding-right: 5px;
|
||||
margin-left: -5px;
|
||||
-webkit-box-sizing: content-box;
|
||||
-moz-box-sizing: content-box;
|
||||
box-sizing: content-box;
|
||||
}
|
||||
.fr-quick-insert.fr-on a.fr-floating-btn svg {
|
||||
-webkit-transform: rotate(135deg);
|
||||
-moz-transform: rotate(135deg);
|
||||
-ms-transform: rotate(135deg);
|
||||
-o-transform: rotate(135deg);
|
||||
}
|
||||
.fr-quick-insert.fr-hidden {
|
||||
display: none;
|
||||
}
|
||||
.fr-qi-helper {
|
||||
position: absolute;
|
||||
z-index: 3;
|
||||
padding-left: 16px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.fr-qi-helper a.fr-btn.fr-floating-btn {
|
||||
text-align: center;
|
||||
display: inline-block;
|
||||
color: #222222;
|
||||
-webkit-opacity: 0;
|
||||
-moz-opacity: 0;
|
||||
opacity: 0;
|
||||
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
|
||||
-webkit-transform: scale(0);
|
||||
-moz-transform: scale(0);
|
||||
-ms-transform: scale(0);
|
||||
-o-transform: scale(0);
|
||||
}
|
||||
.fr-qi-helper a.fr-btn.fr-floating-btn.fr-size-1 {
|
||||
-webkit-opacity: 1;
|
||||
-moz-opacity: 1;
|
||||
opacity: 1;
|
||||
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
|
||||
-webkit-transform: scale(1);
|
||||
-moz-transform: scale(1);
|
||||
-ms-transform: scale(1);
|
||||
-o-transform: scale(1);
|
||||
}
|
||||
@@ -0,0 +1,7 @@
|
||||
/*!
|
||||
* froala_editor v2.7.3 (https://www.froala.com/wysiwyg-editor)
|
||||
* License https://froala.com/wysiwyg-editor/terms/
|
||||
* Copyright 2014-2017 Froala Labs
|
||||
*/
|
||||
|
||||
.clearfix::after{clear:both;display:block;content:"";height:0}.hide-by-clipping{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.fr-quick-insert{position:absolute;z-index:2147483639;white-space:nowrap;padding-right:5px;margin-left:-5px;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box}.fr-quick-insert.fr-on a.fr-floating-btn svg{-webkit-transform:rotate(135deg);-moz-transform:rotate(135deg);-ms-transform:rotate(135deg);-o-transform:rotate(135deg)}.fr-quick-insert.fr-hidden{display:none}.fr-qi-helper{position:absolute;z-index:3;padding-left:16px;white-space:nowrap}.fr-qi-helper a.fr-btn.fr-floating-btn{text-align:center;display:inline-block;color:#222;-webkit-opacity:0;-moz-opacity:0;opacity:0;-ms-filter:"alpha(Opacity=0)";-webkit-transform:scale(0);-moz-transform:scale(0);-ms-transform:scale(0);-o-transform:scale(0)}.fr-qi-helper a.fr-btn.fr-floating-btn.fr-size-1{-webkit-opacity:1;-moz-opacity:1;opacity:1;-ms-filter:"alpha(Opacity=0)";-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1)}
|
||||
@@ -0,0 +1,51 @@
|
||||
/*!
|
||||
* froala_editor v2.7.3 (https://www.froala.com/wysiwyg-editor)
|
||||
* License https://froala.com/wysiwyg-editor/terms/
|
||||
* Copyright 2014-2017 Froala Labs
|
||||
*/
|
||||
|
||||
.clearfix::after {
|
||||
clear: both;
|
||||
display: block;
|
||||
content: "";
|
||||
height: 0;
|
||||
}
|
||||
.hide-by-clipping {
|
||||
position: absolute;
|
||||
width: 1px;
|
||||
height: 1px;
|
||||
padding: 0;
|
||||
margin: -1px;
|
||||
overflow: hidden;
|
||||
clip: rect(0, 0, 0, 0);
|
||||
border: 0;
|
||||
}
|
||||
.fr-modal .fr-modal-wrapper .fr-modal-body .fr-special-characters-modal {
|
||||
text-align: left;
|
||||
padding: 20px 20px 10px;
|
||||
}
|
||||
.fr-modal .fr-modal-wrapper .fr-modal-body .fr-special-characters-modal .fr-special-characters-list {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.fr-modal .fr-modal-wrapper .fr-modal-body .fr-special-characters-modal .fr-special-characters-title {
|
||||
font-weight: bold;
|
||||
font-size: 14px;
|
||||
padding: 6px 0 4px;
|
||||
margin: 0 0 5px;
|
||||
}
|
||||
.fr-modal .fr-modal-wrapper .fr-modal-body .fr-special-characters-modal .fr-special-character {
|
||||
display: inline-block;
|
||||
font-size: 16px;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
padding: 5px;
|
||||
line-height: 20px;
|
||||
cursor: default;
|
||||
font-weight: normal;
|
||||
-webkit-box-sizing: content-box;
|
||||
-moz-box-sizing: content-box;
|
||||
box-sizing: content-box;
|
||||
text-align: center;
|
||||
border: 1px solid #cccccc;
|
||||
margin: -1px 0 0 -1px;
|
||||
}
|
||||
@@ -0,0 +1,7 @@
|
||||
/*!
|
||||
* froala_editor v2.7.3 (https://www.froala.com/wysiwyg-editor)
|
||||
* License https://froala.com/wysiwyg-editor/terms/
|
||||
* Copyright 2014-2017 Froala Labs
|
||||
*/
|
||||
|
||||
.clearfix::after{clear:both;display:block;content:"";height:0}.hide-by-clipping{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.fr-modal .fr-modal-wrapper .fr-modal-body .fr-special-characters-modal{text-align:left;padding:20px 20px 10px}.fr-modal .fr-modal-wrapper .fr-modal-body .fr-special-characters-modal .fr-special-characters-list{margin-bottom:20px}.fr-modal .fr-modal-wrapper .fr-modal-body .fr-special-characters-modal .fr-special-characters-title{font-weight:700;font-size:14px;padding:6px 0 4px;margin:0 0 5px}.fr-modal .fr-modal-wrapper .fr-modal-body .fr-special-characters-modal .fr-special-character{display:inline-block;font-size:16px;width:20px;height:20px;padding:5px;line-height:20px;cursor:default;font-weight:400;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;text-align:center;border:1px solid #ccc;margin:-1px 0 0 -1px}
|
||||
@@ -0,0 +1,181 @@
|
||||
/*!
|
||||
* froala_editor v2.7.3 (https://www.froala.com/wysiwyg-editor)
|
||||
* License https://froala.com/wysiwyg-editor/terms/
|
||||
* Copyright 2014-2017 Froala Labs
|
||||
*/
|
||||
|
||||
.clearfix::after {
|
||||
clear: both;
|
||||
display: block;
|
||||
content: "";
|
||||
height: 0;
|
||||
}
|
||||
.hide-by-clipping {
|
||||
position: absolute;
|
||||
width: 1px;
|
||||
height: 1px;
|
||||
padding: 0;
|
||||
margin: -1px;
|
||||
overflow: hidden;
|
||||
clip: rect(0, 0, 0, 0);
|
||||
border: 0;
|
||||
}
|
||||
.fr-element table td.fr-selected-cell,
|
||||
.fr-element table th.fr-selected-cell {
|
||||
border: 1px double #1e88e5;
|
||||
}
|
||||
.fr-element table tr {
|
||||
user-select: none;
|
||||
-o-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-khtml-user-select: none;
|
||||
-webkit-user-select: none;
|
||||
-ms-user-select: none;
|
||||
}
|
||||
.fr-element table td,
|
||||
.fr-element table th {
|
||||
user-select: text;
|
||||
-o-user-select: text;
|
||||
-moz-user-select: text;
|
||||
-khtml-user-select: text;
|
||||
-webkit-user-select: text;
|
||||
-ms-user-select: text;
|
||||
}
|
||||
.fr-element .fr-no-selection table td,
|
||||
.fr-element .fr-no-selection table th {
|
||||
user-select: none;
|
||||
-o-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-khtml-user-select: none;
|
||||
-webkit-user-select: none;
|
||||
-ms-user-select: none;
|
||||
}
|
||||
.fr-table-resizer {
|
||||
cursor: col-resize;
|
||||
position: fixed;
|
||||
z-index: 3;
|
||||
display: none;
|
||||
}
|
||||
.fr-table-resizer.fr-moving {
|
||||
z-index: 2;
|
||||
}
|
||||
.fr-table-resizer div {
|
||||
-webkit-opacity: 0;
|
||||
-moz-opacity: 0;
|
||||
opacity: 0;
|
||||
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
|
||||
border-right: 1px solid #1e88e5;
|
||||
}
|
||||
.fr-no-selection {
|
||||
user-select: none;
|
||||
-o-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-khtml-user-select: none;
|
||||
-webkit-user-select: none;
|
||||
-ms-user-select: none;
|
||||
}
|
||||
.fr-popup .fr-table-colors-hex-layer {
|
||||
width: 100%;
|
||||
margin: 0px;
|
||||
padding: 10px;
|
||||
}
|
||||
.fr-popup .fr-table-colors-hex-layer .fr-input-line {
|
||||
float: left;
|
||||
width: calc(100% - 50px);
|
||||
padding: 8px 0 0;
|
||||
}
|
||||
.fr-popup .fr-table-colors-hex-layer .fr-action-buttons {
|
||||
float: right;
|
||||
width: 50px;
|
||||
}
|
||||
.fr-popup .fr-table-colors-hex-layer .fr-action-buttons button {
|
||||
background-color: #1e88e5;
|
||||
color: #FFF;
|
||||
border-radius: 2px;
|
||||
-moz-border-radius: 2px;
|
||||
-webkit-border-radius: 2px;
|
||||
-moz-background-clip: padding;
|
||||
-webkit-background-clip: padding-box;
|
||||
background-clip: padding-box;
|
||||
font-size: 13px;
|
||||
height: 32px;
|
||||
}
|
||||
.fr-popup .fr-table-colors-hex-layer .fr-action-buttons button:hover {
|
||||
background-color: #166dba;
|
||||
color: #FFF;
|
||||
}
|
||||
.fr-popup .fr-table-size .fr-table-size-info {
|
||||
text-align: center;
|
||||
font-size: 14px;
|
||||
padding: 8px;
|
||||
}
|
||||
.fr-popup .fr-table-size .fr-select-table-size {
|
||||
line-height: 0;
|
||||
padding: 0 5px 5px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.fr-popup .fr-table-size .fr-select-table-size > span {
|
||||
display: inline-block;
|
||||
padding: 0px 4px 4px 0;
|
||||
background: transparent;
|
||||
}
|
||||
.fr-popup .fr-table-size .fr-select-table-size > span > span {
|
||||
display: inline-block;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
border: 1px solid #dddddd;
|
||||
}
|
||||
.fr-popup .fr-table-size .fr-select-table-size > span.hover {
|
||||
background: transparent;
|
||||
}
|
||||
.fr-popup .fr-table-size .fr-select-table-size > span.hover > span {
|
||||
background: rgba(30, 136, 229, 0.3);
|
||||
border: solid 1px #1e88e5;
|
||||
}
|
||||
.fr-popup .fr-table-size .fr-select-table-size .new-line::after {
|
||||
clear: both;
|
||||
display: block;
|
||||
content: "";
|
||||
height: 0;
|
||||
}
|
||||
.fr-popup.fr-above .fr-table-size .fr-select-table-size > span {
|
||||
display: inline-block !important;
|
||||
}
|
||||
.fr-popup .fr-table-colors-buttons {
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
.fr-popup .fr-table-colors {
|
||||
line-height: 0;
|
||||
display: block;
|
||||
}
|
||||
.fr-popup .fr-table-colors > span {
|
||||
display: inline-block;
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
.fr-popup .fr-table-colors > span > i {
|
||||
text-align: center;
|
||||
line-height: 32px;
|
||||
height: 32px;
|
||||
width: 32px;
|
||||
font-size: 13px;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
cursor: default;
|
||||
left: 0;
|
||||
}
|
||||
.fr-popup .fr-table-colors > span:focus {
|
||||
outline: 1px solid #222222;
|
||||
z-index: 2;
|
||||
}
|
||||
.fr-popup.fr-desktop .fr-table-size .fr-select-table-size > span > span {
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
}
|
||||
.fr-insert-helper {
|
||||
position: fixed;
|
||||
z-index: 9999;
|
||||
white-space: nowrap;
|
||||
}
|
||||
@@ -0,0 +1,7 @@
|
||||
/*!
|
||||
* froala_editor v2.7.3 (https://www.froala.com/wysiwyg-editor)
|
||||
* License https://froala.com/wysiwyg-editor/terms/
|
||||
* Copyright 2014-2017 Froala Labs
|
||||
*/
|
||||
|
||||
.clearfix::after{clear:both;display:block;content:"";height:0}.hide-by-clipping{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.fr-element table td.fr-selected-cell,.fr-element table th.fr-selected-cell{border:1px double #1e88e5}.fr-element table tr{user-select:none;-o-user-select:none;-moz-user-select:none;-khtml-user-select:none;-webkit-user-select:none;-ms-user-select:none}.fr-element table td,.fr-element table th{user-select:text;-o-user-select:text;-moz-user-select:text;-khtml-user-select:text;-webkit-user-select:text;-ms-user-select:text}.fr-element .fr-no-selection table td,.fr-element .fr-no-selection table th{user-select:none;-o-user-select:none;-moz-user-select:none;-khtml-user-select:none;-webkit-user-select:none;-ms-user-select:none}.fr-table-resizer{cursor:col-resize;position:fixed;z-index:3;display:none}.fr-table-resizer.fr-moving{z-index:2}.fr-table-resizer div{-webkit-opacity:0;-moz-opacity:0;opacity:0;-ms-filter:"alpha(Opacity=0)";border-right:1px solid #1e88e5}.fr-no-selection{user-select:none;-o-user-select:none;-moz-user-select:none;-khtml-user-select:none;-webkit-user-select:none;-ms-user-select:none}.fr-popup .fr-table-colors-hex-layer{width:100%;margin:0;padding:10px}.fr-popup .fr-table-colors-hex-layer .fr-input-line{float:left;width:calc(100% - 50px);padding:8px 0 0}.fr-popup .fr-table-colors-hex-layer .fr-action-buttons{float:right;width:50px}.fr-popup .fr-table-colors-hex-layer .fr-action-buttons button{background-color:#1e88e5;color:#FFF;border-radius:2px;-moz-border-radius:2px;-webkit-border-radius:2px;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box;font-size:13px;height:32px}.fr-popup .fr-table-colors-hex-layer .fr-action-buttons button:hover{background-color:#166dba;color:#FFF}.fr-popup .fr-table-size .fr-table-size-info{text-align:center;font-size:14px;padding:8px}.fr-popup .fr-table-size .fr-select-table-size{line-height:0;padding:0 5px 5px;white-space:nowrap}.fr-popup .fr-table-size .fr-select-table-size>span{display:inline-block;padding:0 4px 4px 0;background:0 0}.fr-popup .fr-table-size .fr-select-table-size>span>span{display:inline-block;width:18px;height:18px;border:1px solid #ddd}.fr-popup .fr-table-size .fr-select-table-size>span.hover{background:0 0}.fr-popup .fr-table-size .fr-select-table-size>span.hover>span{background:rgba(30,136,229,.3);border:solid 1px #1e88e5}.fr-popup .fr-table-size .fr-select-table-size .new-line::after{clear:both;display:block;content:"";height:0}.fr-popup.fr-above .fr-table-size .fr-select-table-size>span{display:inline-block!important}.fr-popup .fr-table-colors-buttons{margin-bottom:5px}.fr-popup .fr-table-colors{line-height:0;display:block}.fr-popup .fr-table-colors>span{display:inline-block;width:32px;height:32px;position:relative;z-index:1}.fr-popup .fr-table-colors>span>i{text-align:center;line-height:32px;height:32px;width:32px;font-size:13px;position:absolute;bottom:0;cursor:default;left:0}.fr-popup .fr-table-colors>span:focus{outline:1px solid #222;z-index:2}.fr-popup.fr-desktop .fr-table-size .fr-select-table-size>span>span{width:12px;height:12px}.fr-insert-helper{position:fixed;z-index:9999;white-space:nowrap}
|
||||
@@ -0,0 +1,231 @@
|
||||
/*!
|
||||
* froala_editor v2.7.3 (https://www.froala.com/wysiwyg-editor)
|
||||
* License https://froala.com/wysiwyg-editor/terms/
|
||||
* Copyright 2014-2017 Froala Labs
|
||||
*/
|
||||
|
||||
.clearfix::after {
|
||||
clear: both;
|
||||
display: block;
|
||||
content: "";
|
||||
height: 0;
|
||||
}
|
||||
.hide-by-clipping {
|
||||
position: absolute;
|
||||
width: 1px;
|
||||
height: 1px;
|
||||
padding: 0;
|
||||
margin: -1px;
|
||||
overflow: hidden;
|
||||
clip: rect(0, 0, 0, 0);
|
||||
border: 0;
|
||||
}
|
||||
.fr-element .fr-video {
|
||||
user-select: none;
|
||||
-o-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-khtml-user-select: none;
|
||||
-webkit-user-select: none;
|
||||
-ms-user-select: none;
|
||||
}
|
||||
.fr-element .fr-video::after {
|
||||
position: absolute;
|
||||
content: '';
|
||||
z-index: 1;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
cursor: pointer;
|
||||
display: block;
|
||||
background: rgba(0, 0, 0, 0);
|
||||
}
|
||||
.fr-element .fr-video.fr-active > * {
|
||||
z-index: 2;
|
||||
position: relative;
|
||||
}
|
||||
.fr-element .fr-video > * {
|
||||
-webkit-box-sizing: content-box;
|
||||
-moz-box-sizing: content-box;
|
||||
box-sizing: content-box;
|
||||
max-width: 100%;
|
||||
border: none;
|
||||
}
|
||||
.fr-box .fr-video-resizer {
|
||||
position: absolute;
|
||||
border: solid 1px #1e88e5;
|
||||
display: none;
|
||||
user-select: none;
|
||||
-o-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-khtml-user-select: none;
|
||||
-webkit-user-select: none;
|
||||
-ms-user-select: none;
|
||||
}
|
||||
.fr-box .fr-video-resizer.fr-active {
|
||||
display: block;
|
||||
}
|
||||
.fr-box .fr-video-resizer .fr-handler {
|
||||
display: block;
|
||||
position: absolute;
|
||||
background: #1e88e5;
|
||||
border: solid 1px #ffffff;
|
||||
z-index: 4;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.fr-box .fr-video-resizer .fr-handler.fr-hnw {
|
||||
cursor: nw-resize;
|
||||
}
|
||||
.fr-box .fr-video-resizer .fr-handler.fr-hne {
|
||||
cursor: ne-resize;
|
||||
}
|
||||
.fr-box .fr-video-resizer .fr-handler.fr-hsw {
|
||||
cursor: sw-resize;
|
||||
}
|
||||
.fr-box .fr-video-resizer .fr-handler.fr-hse {
|
||||
cursor: se-resize;
|
||||
}
|
||||
.fr-box .fr-video-resizer .fr-handler {
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
}
|
||||
.fr-box .fr-video-resizer .fr-handler.fr-hnw {
|
||||
left: -6px;
|
||||
top: -6px;
|
||||
}
|
||||
.fr-box .fr-video-resizer .fr-handler.fr-hne {
|
||||
right: -6px;
|
||||
top: -6px;
|
||||
}
|
||||
.fr-box .fr-video-resizer .fr-handler.fr-hsw {
|
||||
left: -6px;
|
||||
bottom: -6px;
|
||||
}
|
||||
.fr-box .fr-video-resizer .fr-handler.fr-hse {
|
||||
right: -6px;
|
||||
bottom: -6px;
|
||||
}
|
||||
@media (min-width: 1200px) {
|
||||
.fr-box .fr-video-resizer .fr-handler {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
}
|
||||
.fr-box .fr-video-resizer .fr-handler.fr-hnw {
|
||||
left: -5px;
|
||||
top: -5px;
|
||||
}
|
||||
.fr-box .fr-video-resizer .fr-handler.fr-hne {
|
||||
right: -5px;
|
||||
top: -5px;
|
||||
}
|
||||
.fr-box .fr-video-resizer .fr-handler.fr-hsw {
|
||||
left: -5px;
|
||||
bottom: -5px;
|
||||
}
|
||||
.fr-box .fr-video-resizer .fr-handler.fr-hse {
|
||||
right: -5px;
|
||||
bottom: -5px;
|
||||
}
|
||||
}
|
||||
.fr-popup .fr-video-size-layer .fr-video-group .fr-input-line {
|
||||
width: calc(50% - 5px);
|
||||
display: inline-block;
|
||||
}
|
||||
.fr-popup .fr-video-size-layer .fr-video-group .fr-input-line + .fr-input-line {
|
||||
margin-left: 10px;
|
||||
}
|
||||
.fr-popup .fr-video-upload-layer {
|
||||
border: dashed 2px #bdbdbd;
|
||||
padding: 25px 0;
|
||||
position: relative;
|
||||
font-size: 14px;
|
||||
letter-spacing: 1px;
|
||||
line-height: 140%;
|
||||
text-align: center;
|
||||
}
|
||||
.fr-popup .fr-video-upload-layer:hover {
|
||||
background: #ebebeb;
|
||||
}
|
||||
.fr-popup .fr-video-upload-layer.fr-drop {
|
||||
background: #ebebeb;
|
||||
border-color: #1e88e5;
|
||||
}
|
||||
.fr-popup .fr-video-upload-layer .fr-form {
|
||||
-webkit-opacity: 0;
|
||||
-moz-opacity: 0;
|
||||
opacity: 0;
|
||||
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 2147483640;
|
||||
overflow: hidden;
|
||||
margin: 0 !important;
|
||||
padding: 0 !important;
|
||||
width: 100% !important;
|
||||
}
|
||||
.fr-popup .fr-video-upload-layer .fr-form input {
|
||||
cursor: pointer;
|
||||
position: absolute;
|
||||
right: 0px;
|
||||
top: 0px;
|
||||
bottom: 0px;
|
||||
width: 500%;
|
||||
height: 100%;
|
||||
margin: 0px;
|
||||
font-size: 400px;
|
||||
}
|
||||
.fr-popup .fr-video-progress-bar-layer > h3 {
|
||||
font-size: 16px;
|
||||
margin: 10px 0;
|
||||
font-weight: normal;
|
||||
}
|
||||
.fr-popup .fr-video-progress-bar-layer > div.fr-action-buttons {
|
||||
display: none;
|
||||
}
|
||||
.fr-popup .fr-video-progress-bar-layer > div.fr-loader {
|
||||
background: #bcdbf7;
|
||||
height: 10px;
|
||||
width: 100%;
|
||||
margin-top: 20px;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
}
|
||||
.fr-popup .fr-video-progress-bar-layer > div.fr-loader span {
|
||||
display: block;
|
||||
height: 100%;
|
||||
width: 0%;
|
||||
background: #1e88e5;
|
||||
-webkit-transition: width 0.2s ease 0s;
|
||||
-moz-transition: width 0.2s ease 0s;
|
||||
-ms-transition: width 0.2s ease 0s;
|
||||
-o-transition: width 0.2s ease 0s;
|
||||
}
|
||||
.fr-popup .fr-video-progress-bar-layer > div.fr-loader.fr-indeterminate span {
|
||||
width: 30% !important;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
-webkit-animation: loading 2s linear infinite;
|
||||
-moz-animation: loading 2s linear infinite;
|
||||
-o-animation: loading 2s linear infinite;
|
||||
animation: loading 2s linear infinite;
|
||||
}
|
||||
.fr-popup .fr-video-progress-bar-layer.fr-error > div.fr-loader {
|
||||
display: none;
|
||||
}
|
||||
.fr-popup .fr-video-progress-bar-layer.fr-error > div.fr-action-buttons {
|
||||
display: block;
|
||||
}
|
||||
.fr-video-overlay {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
z-index: 2147483640;
|
||||
display: none;
|
||||
}
|
||||
@@ -0,0 +1,7 @@
|
||||
/*!
|
||||
* froala_editor v2.7.3 (https://www.froala.com/wysiwyg-editor)
|
||||
* License https://froala.com/wysiwyg-editor/terms/
|
||||
* Copyright 2014-2017 Froala Labs
|
||||
*/
|
||||
|
||||
.clearfix::after{clear:both;display:block;content:"";height:0}.hide-by-clipping{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.fr-element .fr-video{user-select:none;-o-user-select:none;-moz-user-select:none;-khtml-user-select:none;-webkit-user-select:none;-ms-user-select:none}.fr-element .fr-video::after{position:absolute;content:'';z-index:1;top:0;left:0;right:0;bottom:0;cursor:pointer;display:block;background:rgba(0,0,0,0)}.fr-element .fr-video.fr-active>*{z-index:2;position:relative}.fr-element .fr-video>*{-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;max-width:100%;border:0}.fr-box .fr-video-resizer{position:absolute;border:solid 1px #1e88e5;display:none;user-select:none;-o-user-select:none;-moz-user-select:none;-khtml-user-select:none;-webkit-user-select:none;-ms-user-select:none}.fr-box .fr-video-resizer.fr-active{display:block}.fr-box .fr-video-resizer .fr-handler{display:block;position:absolute;background:#1e88e5;border:solid 1px #fff;z-index:4;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.fr-box .fr-video-resizer .fr-handler.fr-hnw{cursor:nw-resize}.fr-box .fr-video-resizer .fr-handler.fr-hne{cursor:ne-resize}.fr-box .fr-video-resizer .fr-handler.fr-hsw{cursor:sw-resize}.fr-box .fr-video-resizer .fr-handler.fr-hse{cursor:se-resize}.fr-box .fr-video-resizer .fr-handler{width:12px;height:12px}.fr-box .fr-video-resizer .fr-handler.fr-hnw{left:-6px;top:-6px}.fr-box .fr-video-resizer .fr-handler.fr-hne{right:-6px;top:-6px}.fr-box .fr-video-resizer .fr-handler.fr-hsw{left:-6px;bottom:-6px}.fr-box .fr-video-resizer .fr-handler.fr-hse{right:-6px;bottom:-6px}@media (min-width:1200px){.fr-box .fr-video-resizer .fr-handler{width:10px;height:10px}.fr-box .fr-video-resizer .fr-handler.fr-hnw{left:-5px;top:-5px}.fr-box .fr-video-resizer .fr-handler.fr-hne{right:-5px;top:-5px}.fr-box .fr-video-resizer .fr-handler.fr-hsw{left:-5px;bottom:-5px}.fr-box .fr-video-resizer .fr-handler.fr-hse{right:-5px;bottom:-5px}}.fr-popup .fr-video-size-layer .fr-video-group .fr-input-line{width:calc(50% - 5px);display:inline-block}.fr-popup .fr-video-size-layer .fr-video-group .fr-input-line+.fr-input-line{margin-left:10px}.fr-popup .fr-video-upload-layer{border:dashed 2px #bdbdbd;padding:25px 0;position:relative;font-size:14px;letter-spacing:1px;line-height:140%;text-align:center}.fr-popup .fr-video-upload-layer:hover{background:#ebebeb}.fr-popup .fr-video-upload-layer.fr-drop{background:#ebebeb;border-color:#1e88e5}.fr-popup .fr-video-upload-layer .fr-form{-webkit-opacity:0;-moz-opacity:0;opacity:0;-ms-filter:"alpha(Opacity=0)";position:absolute;top:0;bottom:0;left:0;right:0;z-index:2147483640;overflow:hidden;margin:0!important;padding:0!important;width:100%!important}.fr-popup .fr-video-upload-layer .fr-form input{cursor:pointer;position:absolute;right:0;top:0;bottom:0;width:500%;height:100%;margin:0;font-size:400px}.fr-popup .fr-video-progress-bar-layer>h3{font-size:16px;margin:10px 0;font-weight:400}.fr-popup .fr-video-progress-bar-layer>div.fr-action-buttons{display:none}.fr-popup .fr-video-progress-bar-layer>div.fr-loader{background:#bcdbf7;height:10px;width:100%;margin-top:20px;overflow:hidden;position:relative}.fr-popup .fr-video-progress-bar-layer>div.fr-loader span{display:block;height:100%;width:0;background:#1e88e5;-webkit-transition:width .2s ease 0s;-moz-transition:width .2s ease 0s;-ms-transition:width .2s ease 0s;-o-transition:width .2s ease 0s}.fr-popup .fr-video-progress-bar-layer>div.fr-loader.fr-indeterminate span{width:30%!important;position:absolute;top:0;-webkit-animation:loading 2s linear infinite;-moz-animation:loading 2s linear infinite;-o-animation:loading 2s linear infinite;animation:loading 2s linear infinite}.fr-popup .fr-video-progress-bar-layer.fr-error>div.fr-loader{display:none}.fr-popup .fr-video-progress-bar-layer.fr-error>div.fr-action-buttons{display:block}.fr-video-overlay{position:fixed;top:0;left:0;bottom:0;right:0;z-index:2147483640;display:none}
|
||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
@@ -0,0 +1,64 @@
|
||||
/*!
|
||||
* froala_editor v2.7.3 (https://www.froala.com/wysiwyg-editor)
|
||||
* License https://froala.com/wysiwyg-editor/terms/
|
||||
* Copyright 2014-2017 Froala Labs
|
||||
*/
|
||||
|
||||
.clearfix::after {
|
||||
clear: both;
|
||||
display: block;
|
||||
content: "";
|
||||
height: 0;
|
||||
}
|
||||
.hide-by-clipping {
|
||||
position: absolute;
|
||||
width: 1px;
|
||||
height: 1px;
|
||||
padding: 0;
|
||||
margin: -1px;
|
||||
overflow: hidden;
|
||||
clip: rect(0, 0, 0, 0);
|
||||
border: 0;
|
||||
}
|
||||
.fr-element .fr-embedly {
|
||||
user-select: none;
|
||||
-o-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-khtml-user-select: none;
|
||||
-webkit-user-select: none;
|
||||
-ms-user-select: none;
|
||||
position: relative;
|
||||
}
|
||||
.fr-element .fr-embedly::after {
|
||||
position: absolute;
|
||||
content: '';
|
||||
z-index: 1;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
cursor: pointer;
|
||||
display: block;
|
||||
background: rgba(0, 0, 0, 0);
|
||||
}
|
||||
.fr-element .fr-embedly > * {
|
||||
-webkit-box-sizing: content-box;
|
||||
-moz-box-sizing: content-box;
|
||||
box-sizing: content-box;
|
||||
max-width: 100%;
|
||||
border: none;
|
||||
}
|
||||
.fr-box .fr-embedly-resizer {
|
||||
position: absolute;
|
||||
border: solid 1px #1e88e5;
|
||||
display: none;
|
||||
user-select: none;
|
||||
-o-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-khtml-user-select: none;
|
||||
-webkit-user-select: none;
|
||||
-ms-user-select: none;
|
||||
}
|
||||
.fr-box .fr-embedly-resizer.fr-active {
|
||||
display: block;
|
||||
}
|
||||
@@ -0,0 +1,7 @@
|
||||
/*!
|
||||
* froala_editor v2.7.3 (https://www.froala.com/wysiwyg-editor)
|
||||
* License https://froala.com/wysiwyg-editor/terms/
|
||||
* Copyright 2014-2017 Froala Labs
|
||||
*/
|
||||
|
||||
.clearfix::after{clear:both;display:block;content:"";height:0}.hide-by-clipping{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.fr-element .fr-embedly{user-select:none;-o-user-select:none;-moz-user-select:none;-khtml-user-select:none;-webkit-user-select:none;-ms-user-select:none;position:relative}.fr-element .fr-embedly::after{position:absolute;content:'';z-index:1;top:0;left:0;right:0;bottom:0;cursor:pointer;display:block;background:rgba(0,0,0,0)}.fr-element .fr-embedly>*{-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;max-width:100%;border:0}.fr-box .fr-embedly-resizer{position:absolute;border:solid 1px #1e88e5;display:none;user-select:none;-o-user-select:none;-moz-user-select:none;-khtml-user-select:none;-webkit-user-select:none;-ms-user-select:none}.fr-box .fr-embedly-resizer.fr-active{display:block}
|
||||
@@ -0,0 +1,72 @@
|
||||
/*!
|
||||
* froala_editor v2.7.3 (https://www.froala.com/wysiwyg-editor)
|
||||
* License https://froala.com/wysiwyg-editor/terms/
|
||||
* Copyright 2014-2017 Froala Labs
|
||||
*/
|
||||
|
||||
.clearfix::after {
|
||||
clear: both;
|
||||
display: block;
|
||||
content: "";
|
||||
height: 0;
|
||||
}
|
||||
.hide-by-clipping {
|
||||
position: absolute;
|
||||
width: 1px;
|
||||
height: 1px;
|
||||
padding: 0;
|
||||
margin: -1px;
|
||||
overflow: hidden;
|
||||
clip: rect(0, 0, 0, 0);
|
||||
border: 0;
|
||||
}
|
||||
.examples-variante > a {
|
||||
font-size: 14px;
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
}
|
||||
.sc-cm-holder > .sc-cm {
|
||||
border-top: 5px solid #222222 !important;
|
||||
padding: 0px !important;
|
||||
line-height: 200% !important;
|
||||
-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
|
||||
-moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
|
||||
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
|
||||
}
|
||||
.sc-cm .sc-cm__item.examples-variante.sc-cm__item_active > a > i {
|
||||
display: none !important;
|
||||
}
|
||||
.sc-cm .sc-cm__item.examples-variante > a > i {
|
||||
display: none !important;
|
||||
}
|
||||
.sc-cm__item_dropdown .i-icon {
|
||||
display: none !important;
|
||||
}
|
||||
.sc-cm__item_dropdown .i-icon::before {
|
||||
display: none !important;
|
||||
}
|
||||
.sc-cm::before {
|
||||
display: none !important;
|
||||
}
|
||||
div.sc-cm-holder.sc-cm_show > ul > li.sc-cm__item.sc-cm__item_dropdown.sc-cm__item_arrow > div > ul {
|
||||
border-style: none !important;
|
||||
padding: 0px !important;
|
||||
}
|
||||
.sc-cm__item_dropdown:hover > a,
|
||||
.sc-cm a:hover {
|
||||
background-color: #ebebeb !important;
|
||||
}
|
||||
.sc-cm__item_active > a,
|
||||
.sc-cm__item_active > a:hover,
|
||||
.sc-cm a:active,
|
||||
.sc-cm a:focus {
|
||||
background-color: #d6d6d6 !important;
|
||||
}
|
||||
.sc-cm__item > a {
|
||||
line-height: 200% !important;
|
||||
}
|
||||
.sc-cm-holder > .sc-cm:before {
|
||||
background-color: #ebebeb !important;
|
||||
}
|
||||
.sc-cm-holder {
|
||||
display: none;
|
||||
}
|
||||
@@ -0,0 +1,7 @@
|
||||
/*!
|
||||
* froala_editor v2.7.3 (https://www.froala.com/wysiwyg-editor)
|
||||
* License https://froala.com/wysiwyg-editor/terms/
|
||||
* Copyright 2014-2017 Froala Labs
|
||||
*/
|
||||
|
||||
.clearfix::after{clear:both;display:block;content:"";height:0}.hide-by-clipping{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.examples-variante>a{font-size:14px;font-family:Arial,Helvetica,sans-serif}.sc-cm-holder>.sc-cm{border-top:5px solid #222!important;padding:0!important;line-height:200%!important;-webkit-box-shadow:0 1px 3px rgba(0,0,0,.12),0 1px 1px 1px rgba(0,0,0,.16);-moz-box-shadow:0 1px 3px rgba(0,0,0,.12),0 1px 1px 1px rgba(0,0,0,.16);box-shadow:0 1px 3px rgba(0,0,0,.12),0 1px 1px 1px rgba(0,0,0,.16)}.sc-cm .sc-cm__item.examples-variante.sc-cm__item_active>a>i{display:none!important}.sc-cm .sc-cm__item.examples-variante>a>i{display:none!important}.sc-cm__item_dropdown .i-icon{display:none!important}.sc-cm__item_dropdown .i-icon::before{display:none!important}.sc-cm::before{display:none!important}div.sc-cm-holder.sc-cm_show>ul>li.sc-cm__item.sc-cm__item_dropdown.sc-cm__item_arrow>div>ul{border-style:none!important;padding:0!important}.sc-cm__item_dropdown:hover>a,.sc-cm a:hover{background-color:#ebebeb!important}.sc-cm__item_active>a,.sc-cm__item_active>a:hover,.sc-cm a:active,.sc-cm a:focus{background-color:#d6d6d6!important}.sc-cm__item>a{line-height:200%!important}.sc-cm-holder>.sc-cm:before{background-color:#ebebeb!important}.sc-cm-holder{display:none}
|
||||
@@ -0,0 +1,111 @@
|
||||
/**
|
||||
* knockout binding for Froala Editor
|
||||
*/
|
||||
|
||||
(function() { 'use strict';
|
||||
|
||||
// locals
|
||||
var unwrap = ko.utils.unwrapObservable;
|
||||
|
||||
|
||||
/**
|
||||
* initiate froala editor, listen to its changes
|
||||
* and updates the underlying observable model
|
||||
*
|
||||
* @param {element} element
|
||||
* @param {object} value
|
||||
* @param {object} bindings
|
||||
* @api public
|
||||
*/
|
||||
|
||||
function init( element, value, bindings ) {
|
||||
var $el = $( element );
|
||||
var model = value();
|
||||
var allBindings = unwrap( bindings() );
|
||||
var options = ko.toJS( allBindings.froalaOptions );
|
||||
|
||||
// initialize the editor
|
||||
$el.froalaEditor( options || {} );
|
||||
|
||||
// provide froala editor instance for flexibility
|
||||
if( allBindings.froalaInstance && ko.isWriteableObservable( allBindings.froalaInstance ) ) {
|
||||
allBindings.froalaInstance( $el.data( 'froala.editor' ) );
|
||||
}
|
||||
|
||||
// update underlying model whenever editor content changed
|
||||
var processUpdateEvent = function (e, editor) {
|
||||
if (ko.isWriteableObservable(model)) {
|
||||
var editorValue = editor.html.get();
|
||||
var current = model();
|
||||
if (current !== editorValue) {
|
||||
model(editorValue);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
$el.on('froalaEditor.contentChanged', processUpdateEvent);
|
||||
$el.on('froalaEditor.paste.after', processUpdateEvent);
|
||||
|
||||
// cleanup editor, when dom node is removed
|
||||
ko.utils.domNodeDisposal.addDisposeCallback( element, destroy( element ) );
|
||||
|
||||
// do not handle child nodes
|
||||
return { controlsDescendantBindings: true };
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* update froala editor whenever underlying observable model
|
||||
* is updated
|
||||
*
|
||||
* @param {element} element
|
||||
* @param {object} value
|
||||
* @api public
|
||||
*/
|
||||
|
||||
function update( element, value ) {
|
||||
var $el = $( element );
|
||||
var modelValue = unwrap( value() );
|
||||
var editorInstance = $el.data( 'froala.editor' );
|
||||
|
||||
if( editorInstance == null ) {
|
||||
return;
|
||||
}
|
||||
|
||||
var editorValue = editorInstance.html.get();
|
||||
|
||||
// avoid any un-necessary updates
|
||||
if( editorValue !== modelValue && (typeof modelValue === 'string' || modelValue === null)) {
|
||||
editorInstance.html.set( modelValue );
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* destroy froala editor instance
|
||||
*
|
||||
* @param {dom} element
|
||||
* @return {function} handler
|
||||
* @api private
|
||||
*/
|
||||
|
||||
function destroy( element ) {
|
||||
var $el = $( element );
|
||||
return function() {
|
||||
if( $el.data( 'froala.editor' ) ) {
|
||||
$el.froalaEditor( 'destroy' );
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* expose `froala` binding handler methods
|
||||
*/
|
||||
|
||||
ko.bindingHandlers.froala = {
|
||||
init: init,
|
||||
update: update
|
||||
}
|
||||
|
||||
})();
|
||||
@@ -0,0 +1,137 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0"/>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
|
||||
<link rel="stylesheet" href="../../css/froala_editor.css">
|
||||
<link rel="stylesheet" href="../../css/froala_style.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/code_view.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/colors.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/emoticons.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image_manager.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/line_breaker.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/table.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/char_counter.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/video.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/fullscreen.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/file.css">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.css">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/at.js/1.4.0/css/jquery.atwho.min.css">
|
||||
|
||||
<style>
|
||||
body {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
div#editor {
|
||||
width: 81%;
|
||||
margin: auto;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.atwho-view-ul {
|
||||
text-align: left;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="editor">
|
||||
<div id='edit' style="margin-top: 30px;">
|
||||
<h1>At.js integration</h1>
|
||||
|
||||
<p>Froala WYSIWYG Editor can easily be integrated with the amazing <a href="http://ichord.github.io/At.js/" target="_blank" rel="nofollow">At.js library</a>. Type an @ to display the autocomplete list.</p>
|
||||
|
||||
<img class="fr-fir fr-dii" src="../../img/photo1.jpg" alt="Old Clock" width="300"/>Lorem <strong>ipsum</strong> dolor sit amet, consectetur <strong>adipiscing <em>elit.</em> Donec</strong> facilisis diam in odio iaculis blandit. Nunc eu mauris sit amet purus <strong>viverra</strong><em> gravida</em> ut a dui.<br/>
|
||||
<ul><li>Vivamus nec rutrum augue, pharetra faucibus purus. Maecenas non orci sagittis, vehicula lorem et, dignissim nunc.</li> <li>Suspendisse suscipit, diam non varius facilisis, enim libero tincidunt magna, sit amet iaculis eros libero sit amet eros. Vestibulum a rhoncus felis.<ol><li>Nam lacus nulla, consequat ac lacus sit amet, accumsan pellentesque risus. Aenean viverra mi at urna mattis fermentum.</li> <li>Curabitur porta metus in tortor elementum, in semper nulla ullamcorper. Vestibulum mattis tempor tortor quis gravida. In rhoncus risus nibh. Nullam condimentum dapibus massa vel fringilla. Sed hendrerit sed est quis facilisis. Ut sit amet nibh sem. Pellentesque imperdiet mollis libero.</li></ol></li></ul>
|
||||
|
||||
<table style="width: 100%;">
|
||||
<tr>
|
||||
<td style="width: 25%;"></td>
|
||||
<td style="width: 25%;"></td>
|
||||
<td style="width: 25%;"></td>
|
||||
<td style="width: 25%;"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="width: 25%;"></td>
|
||||
<td style="width: 25%;"></td>
|
||||
<td style="width: 25%;"></td>
|
||||
<td style="width: 25%;"></td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
<a href="http://google.com" title="Aenean sed hendrerit">Aenean sed hendrerit</a> velit. Nullam eu mi dolor. Maecenas et erat risus. Nulla ac auctor diam, non aliquet ante. Fusce ullamcorper, ipsum id tempor lacinia, sem tellus malesuada libero, quis ornare sem massa in orci. Sed dictum dictum tristique. Proin eros turpis, ultricies eu sapien eget, ornare rutrum ipsum. Pellentesque eros nisl, ornare nec ipsum sed, aliquet sollicitudin erat. Nulla tincidunt porta <strong>vehicula.</strong><br/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/mode/xml/xml.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/at.js/1.5.4/js/jquery.atwho.min.js"></script>
|
||||
|
||||
<script type="text/javascript" src="../../js/froala_editor.min.js" ></script>
|
||||
|
||||
<script type="text/javascript" src="../../js/plugins/align.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_beautifier.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_view.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/colors.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/draggable.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/emoticons.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/font_size.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/font_family.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/file.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image_manager.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/line_breaker.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/link.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/lists.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/paragraph_format.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/paragraph_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/video.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/table.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/url.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/entities.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/char_counter.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/inline_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/save.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/fullscreen.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/quote.min.js"></script>
|
||||
|
||||
<script>
|
||||
$(function(){
|
||||
var datasource = ["Jacob", "Isabella", "Ethan", "Emma", "Michael", "Olivia" ];
|
||||
|
||||
var names = $.map(datasource, function (value, i) {
|
||||
return {
|
||||
'id': i, 'name': value, 'email': value + "@email.com"
|
||||
};
|
||||
});
|
||||
|
||||
var config = {
|
||||
at: "@",
|
||||
data: names,
|
||||
displayTpl: '<li>${name} <small>${email}</small></li>',
|
||||
limit: 200
|
||||
}
|
||||
|
||||
$('#edit')
|
||||
.on('froalaEditor.initialized', function (e, editor) {
|
||||
editor.$el
|
||||
.atwho(config)
|
||||
.on('inserted.atwho', function () {
|
||||
editor.$el.find('.atwho-inserted').removeAttr('contenteditable');
|
||||
})
|
||||
|
||||
editor.events.on('keydown', function (e) {
|
||||
if (e.which == $.FroalaEditor.KEYCODE.ENTER && editor.$el.atwho('isSelecting')) {
|
||||
return false;
|
||||
}
|
||||
}, true);
|
||||
})
|
||||
.froalaEditor()
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,94 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0"/>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
|
||||
<link rel="stylesheet" href="../../../css/froala_editor.css">
|
||||
<link rel="stylesheet" href="../../../css/froala_style.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/colors.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/emoticons.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/image_manager.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/image.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/line_breaker.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/table.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/char_counter.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/video.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/fullscreen.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/file.css">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/at.js/1.4.0/css/jquery.atwho.min.css">
|
||||
|
||||
<!-- Code Mirror CSS file. -->
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.css">
|
||||
|
||||
<!-- Include the plugin CSS file. -->
|
||||
<link rel="stylesheet" href="../../../css/plugins/code_view.css">
|
||||
|
||||
<style>
|
||||
body {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
div#editor {
|
||||
width: 81%;
|
||||
margin: auto;
|
||||
text-align: left;
|
||||
}
|
||||
div#froala-details {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="editor">
|
||||
<div id="edit" style="margin-top: 30px;">
|
||||
<h1>Aviary integration</h1>
|
||||
|
||||
<img class="fr-fir fr-dii" src="../../../img/photo1.jpg" alt="Old Clock" width="300"/>
|
||||
|
||||
<p>Click on the image then apply rich image editing using the advanced edit button. This will launch the aviary image editor plugin.</p>
|
||||
<p>To integrate the plugin an api key it will be needed but it's easily obtained from</p>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div id="froala-details">
|
||||
<h3>Use Aviary plugin instructions.</h3>
|
||||
<p>To integrate the Aviary plugin on your own domain/website there are 3 simple steps to follow.</p>
|
||||
<p>1. Go to <a href="https://creativesdk.adobe.com/docs/web/#/index.html">Adobe Creative</a> and register for a new account or sign if you already have one.</p>
|
||||
<p>2. Follow the steps to <a href="https://creativesdk.zendesk.com/hc/en-us/articles/216369343-Why-and-how-to-register-my-app-"> register your new app</a>, this will generate an api key that will be used later on.</p>
|
||||
<p>3. You should have your api key by now, so what's left to do is to initialize the Froala Editor and use your own api key.
|
||||
To do this you should pass <code> aviaryKey: 'your api key'</code> to the Froala Editor on init.</p>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/mode/xml/xml.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/at.js/1.4.0/js/jquery.atwho.min.js"></script>
|
||||
|
||||
<script type="text/javascript" src="../../../js/froala_editor.min.js" ></script>
|
||||
|
||||
<script type="text/javascript" src="../../../js/plugins/align.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/code_beautifier.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/code_view.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/font_size.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/font_family.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/image.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/image_manager.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/link.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/lists.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/paragraph_format.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/url.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/entities.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/save.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/third_party/image_aviary.min.js"></script>
|
||||
|
||||
<script>
|
||||
$(function(){
|
||||
$('#edit').froalaEditor({
|
||||
})
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,106 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0"/>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
|
||||
<link rel="stylesheet" href="../../../css/froala_editor.css">
|
||||
<link rel="stylesheet" href="../../../css/froala_style.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/code_view.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/colors.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/emoticons.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/image_manager.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/image.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/line_breaker.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/table.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/char_counter.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/video.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/fullscreen.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/file.css">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.css">
|
||||
|
||||
<!-- Latest compiled and minified CSS -->
|
||||
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
|
||||
|
||||
<!-- Optional theme -->
|
||||
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css">
|
||||
|
||||
<style>
|
||||
body {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
div#editor {
|
||||
width: 81%;
|
||||
margin: auto;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.fr-inner:not(.row) {
|
||||
border: solid 1px #CCC;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="editor">
|
||||
<textarea id='edit'><div style="margin: 0 15px;">
|
||||
<div class="row fr-inner">
|
||||
<div class="col-xs-12 col-md-8 fr-inner">.col-xs-12 .col-md-8</div>
|
||||
<div class="col-xs-6 col-md-4 fr-inner">.col-xs-6 .col-md-4</div>
|
||||
</div>
|
||||
<div class="row fr-inner">
|
||||
<div class="col-xs-6 col-md-4 fr-inner">.col-xs-6 .col-md-4</div>
|
||||
<div class="col-xs-6 col-md-4 fr-inner">.col-xs-6 .col-md-4</div>
|
||||
<div class="col-xs-6 col-md-4 fr-inner">.col-xs-6 .col-md-4</div>
|
||||
</div>
|
||||
<div class="row fr-inner">
|
||||
<div class="col-xs-6 fr-inner">.col-xs-6</div>
|
||||
<div class="col-xs-6 fr-inner">.col-xs-6</div>
|
||||
</div>
|
||||
</div></textarea>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/mode/xml/xml.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/froala_editor.min.js" ></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/align.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/code_beautifier.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/code_view.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/colors.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/draggable.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/emoticons.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/font_size.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/font_family.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/image.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/file.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/image_manager.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/line_breaker.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/link.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/lists.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/paragraph_format.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/paragraph_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/video.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/table.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/url.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/entities.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/char_counter.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/inline_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/save.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/fullscreen.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/quote.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/languages/ro.js"></script>
|
||||
|
||||
<!-- Latest compiled and minified JavaScript -->
|
||||
<script type="text/javascript" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
|
||||
|
||||
<script>
|
||||
$(function(){
|
||||
$('#edit').froalaEditor({
|
||||
enter: $.FroalaEditor.ENTER_BR
|
||||
})
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,100 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0"/>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
|
||||
<link rel="stylesheet" href="../../../css/froala_editor.css">
|
||||
<link rel="stylesheet" href="../../../css/froala_style.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/code_view.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/colors.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/emoticons.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/image_manager.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/image.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/line_breaker.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/table.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/char_counter.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/video.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/fullscreen.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/file.css">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.css">
|
||||
|
||||
<!-- Latest compiled and minified CSS -->
|
||||
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
|
||||
|
||||
<!-- Optional theme -->
|
||||
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css">
|
||||
|
||||
<style>
|
||||
body {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
div#editor {
|
||||
width: 81%;
|
||||
margin: auto;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.fr-inner:not(.row) {
|
||||
border: solid 1px #CCC;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="editor">
|
||||
<textarea id='edit'>
|
||||
<ul class="list-group">
|
||||
<li class="list-group-item">Cras justo odio</li>
|
||||
<li class="list-group-item">Dapibus ac facilisis in</li>
|
||||
<li class="list-group-item">Morbi leo risus</li>
|
||||
<li class="list-group-item">Porta ac consectetur ac</li>
|
||||
<li class="list-group-item">Vestibulum at eros</li>
|
||||
</ul>
|
||||
</textarea>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/mode/xml/xml.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/froala_editor.min.js" ></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/align.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/code_beautifier.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/code_view.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/colors.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/draggable.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/emoticons.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/font_size.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/font_family.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/image.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/file.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/image_manager.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/line_breaker.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/link.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/lists.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/paragraph_format.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/paragraph_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/video.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/table.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/url.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/entities.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/char_counter.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/inline_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/save.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/fullscreen.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/quote.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/languages/ro.js"></script>
|
||||
|
||||
<!-- Latest compiled and minified JavaScript -->
|
||||
<script type="text/javascript" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
|
||||
|
||||
<script>
|
||||
$(function(){
|
||||
$('#edit').froalaEditor({
|
||||
enter: $.FroalaEditor.ENTER_BR
|
||||
})
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,138 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0"/>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
|
||||
<link rel="stylesheet" href="../../../css/froala_editor.css">
|
||||
<link rel="stylesheet" href="../../../css/froala_style.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/code_view.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/colors.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/emoticons.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/image_manager.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/image.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/line_breaker.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/table.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/char_counter.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/video.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/fullscreen.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/file.css">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.css">
|
||||
|
||||
<!-- Latest compiled and minified CSS -->
|
||||
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
|
||||
|
||||
<!-- Optional theme -->
|
||||
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css">
|
||||
|
||||
<style>
|
||||
html, body {
|
||||
text-align: center;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
div#editor {
|
||||
width: 81%;
|
||||
margin: auto;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.modal-body {
|
||||
height: 500px;
|
||||
}
|
||||
|
||||
.modal-dialog {
|
||||
transform : none !important;
|
||||
-webkit-transform : none !important;
|
||||
-moz-transform : none !important;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="editor">
|
||||
<!-- Button trigger modal -->
|
||||
<button type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">
|
||||
Launch demo modal
|
||||
</button>
|
||||
|
||||
<!-- Modal -->
|
||||
<div class="modal fade" id="myModal" tabindex="-1" aria-labelledby="myModalLabel">
|
||||
<div class="modal-dialog" role="document">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
|
||||
<h4 class="modal-title" id="myModalLabel">Froala WYSIWYG HTML Editor</h4>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<div id='edit'>
|
||||
<h1>Click and edit</h1>
|
||||
|
||||
<img class="fr-fir fr-dii" src="../../../img/photo1.jpg" alt="Old Clock" width="300"/>Lorem <strong>ipsum</strong> dolor sit amet, consectetur <strong>adipiscing <em>elit.</em> Donec</strong> facilisis diam in odio iaculis blandit. Nunc eu mauris sit amet purus <strong>viverra</strong><em> gravida</em> ut a dui.<br/>
|
||||
<ul><li>Vivamus nec rutrum augue, pharetra faucibus purus. Maecenas non orci sagittis, vehicula lorem et, dignissim nunc.</li> <li>Suspendisse suscipit, diam non varius facilisis, enim libero tincidunt magna, sit amet iaculis eros libero sit amet eros. Vestibulum a rhoncus felis.<ol><li>Nam lacus nulla, consequat ac lacus sit amet, accumsan pellentesque risus. Aenean viverra mi at urna mattis fermentum.</li> <li>Curabitur porta metus in tortor elementum, in semper nulla ullamcorper. Vestibulum mattis tempor tortor quis gravida. In rhoncus risus nibh. Nullam condimentum dapibus massa vel fringilla. Sed hendrerit sed est quis facilisis. Ut sit amet nibh sem. Pellentesque imperdiet mollis libero.</li></ol></li></ul>
|
||||
|
||||
<table style="width: 100%;">
|
||||
<tr><td>asdasd</td><td>asdasdasd</td></tr>
|
||||
</table>
|
||||
|
||||
Sed dictum dictum tristique. Proin eros turpis, ultricies eu sapien eget, ornare rutrum ipsum. Pellentesque eros nisl, ornare nec ipsum sed, aliquet sollicitudin erat. Nulla tincidunt porta <strong>vehicula.</strong><br/>
|
||||
|
||||
<a href="http://google.com" title="Aenean sed hendrerit">Aenean sed hendrerit</a> velit. Nullam eu mi dolor. Maecenas et erat risus. Nulla ac auctor diam, non aliquet ante. Fusce ullamcorper, ipsum id tempor lacinia, sem tellus malesuada libero, quis ornare sem massa in orci. Sed dictum dictum tristique. Proin eros turpis, ultricies eu sapien eget, ornare rutrum ipsum. Pellentesque eros nisl, ornare nec ipsum sed, aliquet sollicitudin erat. Nulla tincidunt porta <strong>vehicula.</strong><br/>
|
||||
|
||||
<i>Nullam laoreet</i> imperdiet orci ac euismod. Curabitur vel lectus nisi. Phasellus accumsan aliquet augue, eu rutrum tellus iaculis in. Nunc viverra ultrices mollis. Curabitur malesuada nunc massa, ut imperdiet arcu lobortis sed. Cras ac arcu mauris. Maecenas id lectus nisl. Donec consectetur scelerisque quam at ultricies. Nam quis magna iaculis, condimentum metus ut, elementum metus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vivamus id tempus nisi.<br/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
|
||||
<button type="button" class="btn btn-primary">Save changes</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/mode/xml/xml.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/froala_editor.min.js" ></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/align.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/code_beautifier.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/code_view.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/colors.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/draggable.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/emoticons.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/font_size.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/font_family.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/image.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/file.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/image_manager.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/line_breaker.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/link.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/lists.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/paragraph_format.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/paragraph_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/video.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/table.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/url.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/entities.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/char_counter.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/inline_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/save.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/fullscreen.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/quote.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/languages/ro.js"></script>
|
||||
|
||||
<!-- Latest compiled and minified JavaScript -->
|
||||
<script type="text/javascript" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
|
||||
|
||||
<script>
|
||||
$(function(){
|
||||
$('#edit').froalaEditor({
|
||||
enter: $.FroalaEditor.ENTER_P,
|
||||
height: 350,
|
||||
zIndex: 8000
|
||||
})
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,85 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0"/>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
|
||||
<link rel="stylesheet" href="../../css/froala_editor.css">
|
||||
<link rel="stylesheet" href="../../css/froala_style.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/colors.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/emoticons.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image_manager.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/line_breaker.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/table.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/char_counter.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/video.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/fullscreen.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/file.css">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/at.js/1.4.0/css/jquery.atwho.min.css">
|
||||
|
||||
<!-- Code Mirror CSS file. -->
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.css">
|
||||
|
||||
<!-- Include the plugin CSS file. -->
|
||||
<link rel="stylesheet" href="../../css/plugins/code_view.css">
|
||||
|
||||
<style>
|
||||
body {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
div#editor {
|
||||
width: 81%;
|
||||
margin: auto;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.atwho-view-ul {
|
||||
text-align: left;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="editor">
|
||||
|
||||
<div id="edit" style="margin-top: 30px;">
|
||||
<h1>Code Mirror</h1>
|
||||
|
||||
<img class="fr-fir fr-dii" src="../../img/photo1.jpg" alt="Old Clock" width="300"/>Click the Code View button to see the editor content's HTML.
|
||||
|
||||
<p>The code_view.min.js plugin can be used as is or you can use also use it together with Code Mirror. All there is to be done is to include the corresponding Code Mirror CSS and JS files.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/mode/xml/xml.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/at.js/1.4.0/js/jquery.atwho.min.js"></script>
|
||||
|
||||
<script type="text/javascript" src="../../js/froala_editor.min.js" ></script>
|
||||
|
||||
<script type="text/javascript" src="../../js/plugins/align.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_beautifier.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_view.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/font_size.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/font_family.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image_manager.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/link.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/lists.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/paragraph_format.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/url.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/entities.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/save.min.js"></script>
|
||||
|
||||
<script>
|
||||
$(function(){
|
||||
$('#edit').froalaEditor({
|
||||
toolbarButtons: ['bold', 'italic', 'underline', 'fontSize', 'fontFamily', '|', 'paragraphFormat', 'align', 'formatOL', 'formatUL', 'indent', 'outdent', '|', 'insertLink', 'insertImage', 'undo', 'redo', 'html']
|
||||
})
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,97 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0"/>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
|
||||
<link rel="stylesheet" href="../../../css/froala_editor.css">
|
||||
<link rel="stylesheet" href="../../../css/froala_style.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/code_view.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/colors.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/emoticons.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/image_manager.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/image.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/line_breaker.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/table.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/char_counter.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/video.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/fullscreen.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/file.css">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.css">
|
||||
<link rel="stylesheet" href="http://code.jquery.com/mobile/git/jquery.mobile-git.css">
|
||||
|
||||
<style>
|
||||
body {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
div#editor {
|
||||
width: 81%;
|
||||
margin: auto;
|
||||
text-align: left;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div data-role="page">
|
||||
|
||||
<div data-role="header">
|
||||
<h1>Page Title</h1>
|
||||
</div><!-- /header -->
|
||||
|
||||
<div role="main" class="ui-content">
|
||||
<textarea name="edit" id="edit">Click here to edit</textarea>
|
||||
</div><!-- /content -->
|
||||
|
||||
<div data-role="footer">
|
||||
<h4>Page Footer</h4>
|
||||
</div><!-- /footer -->
|
||||
</div><!-- /page -->
|
||||
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="http://demos.jquerymobile.com/1.4.5/js/jquery.mobile-1.4.5.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/mode/xml/xml.min.js"></script>
|
||||
|
||||
<script type="text/javascript" src="../../../js/froala_editor.min.js" ></script>
|
||||
|
||||
<script type="text/javascript" src="../../../js/plugins/align.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/code_beautifier.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/code_view.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/colors.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/draggable.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/emoticons.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/font_size.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/font_family.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/image.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/file.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/image_manager.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/line_breaker.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/link.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/lists.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/paragraph_format.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/paragraph_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/video.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/table.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/url.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/entities.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/char_counter.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/inline_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/save.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/fullscreen.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/quote.min.js"></script>
|
||||
|
||||
<script type="text/javascript" src="../../../js/languages/ro.js"></script>
|
||||
|
||||
<script>
|
||||
$(document).on('pageinit', function () {
|
||||
$('#edit').froalaEditor({
|
||||
enter: $.FroalaEditor.ENTER_P,
|
||||
toolbarInline: true,
|
||||
toolbarButtons: ['bold', 'italic', 'underline']
|
||||
})
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,156 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0"/>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
|
||||
<link rel="stylesheet" href="../../../css/froala_editor.css">
|
||||
<link rel="stylesheet" href="../../../css/froala_style.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/code_view.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/colors.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/emoticons.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/image_manager.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/image.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/line_breaker.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/table.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/char_counter.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/video.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/fullscreen.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/file.css">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.css">
|
||||
<link rel="stylesheet" href="https://code.jquery.com/ui/1.11.0/themes/smoothness/jquery-ui.css">
|
||||
|
||||
<style>
|
||||
body {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
div#editor {
|
||||
width: 81%;
|
||||
margin: auto;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.ui-dialog, .ui-dialog-content {
|
||||
overflow: visible !important;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="editor">
|
||||
<div id="dialog" title="Basic dialog">
|
||||
<div id='edit'>
|
||||
<h1>Click and edit</h1>
|
||||
|
||||
<img class="fr-fir fr-dii" src="../../../img/photo1.jpg" alt="Old Clock" width="300"/>Lorem <strong>ipsum</strong> dolor sit amet, consectetur <strong>adipiscing <em>elit.</em> Donec</strong> facilisis diam in odio iaculis blandit. Nunc eu mauris sit amet purus <strong>viverra</strong><em> gravida</em> ut a dui.<br/>
|
||||
<ul><li>Vivamus nec rutrum augue, pharetra faucibus purus. Maecenas non orci sagittis, vehicula lorem et, dignissim nunc.</li> <li>Suspendisse suscipit, diam non varius facilisis, enim libero tincidunt magna, sit amet iaculis eros libero sit amet eros. Vestibulum a rhoncus felis.<ol><li>Nam lacus nulla, consequat ac lacus sit amet, accumsan pellentesque risus. Aenean viverra mi at urna mattis fermentum.</li> <li>Curabitur porta metus in tortor elementum, in semper nulla ullamcorper. Vestibulum mattis tempor tortor quis gravida. In rhoncus risus nibh. Nullam condimentum dapibus massa vel fringilla. Sed hendrerit sed est quis facilisis. Ut sit amet nibh sem. Pellentesque imperdiet mollis libero.</li></ol></li></ul>
|
||||
|
||||
<table style="width: 100%;">
|
||||
<tr><td style="width: 40%;">asdasd</td><td style="width: 60%;">asdasdasd</td></tr>
|
||||
</table>
|
||||
|
||||
Sed dictum dictum tristique. Proin eros turpis, ultricies eu sapien eget, ornare rutrum ipsum. Pellentesque eros nisl, ornare nec ipsum sed, aliquet sollicitudin erat. Nulla tincidunt porta <strong>vehicula.</strong><br/>
|
||||
|
||||
<a href="http://google.com" title="Aenean sed hendrerit">Aenean sed hendrerit</a> velit. Nullam eu mi dolor. Maecenas et erat risus. Nulla ac auctor diam, non aliquet ante. Fusce ullamcorper, ipsum id tempor lacinia, sem tellus malesuada libero, quis ornare sem massa in orci. Sed dictum dictum tristique. Proin eros turpis, ultricies eu sapien eget, ornare rutrum ipsum. Pellentesque eros nisl, ornare nec ipsum sed, aliquet sollicitudin erat. Nulla tincidunt porta <strong>vehicula.</strong><br/>
|
||||
|
||||
<i>Nullam laoreet</i> imperdiet orci ac euismod. Curabitur vel lectus nisi. Phasellus accumsan aliquet augue, eu rutrum tellus iaculis in. Nunc viverra ultrices mollis. Curabitur malesuada nunc massa, ut imperdiet arcu lobortis sed. Cras ac arcu mauris. Maecenas id lectus nisl. Donec consectetur scelerisque quam at ultricies. Nam quis magna iaculis, condimentum metus ut, elementum metus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vivamus id tempus nisi.<br/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam pretium efficitur lectus, porttitor ornare dolor luctus eu. Vivamus auctor nunc non vestibulum tempor. Integer tristique massa sit amet mi auctor euismod. In finibus nec purus et volutpat. Nullam consectetur est id lorem posuere, quis blandit eros dignissim. Curabitur fringilla iaculis est sed porttitor. Duis in nisi felis.
|
||||
|
||||
Suspendisse ex sem, eleifend vitae felis eu, finibus malesuada odio. Duis eget risus in sem facilisis venenatis eget nec turpis. Aliquam ac sapien dictum, tempor libero sed, feugiat odio. Mauris bibendum nisi justo, eu pulvinar neque tempor ac. Vivamus suscipit in elit interdum euismod. Etiam porta molestie lobortis. Nam consectetur malesuada ante non sagittis. Nunc nec odio ex. Duis non hendrerit diam. Integer vulputate, mi a gravida pretium, ligula libero laoreet libero, in vestibulum arcu velit at velit.
|
||||
|
||||
Suspendisse at neque commodo, sollicitudin lectus sed, blandit sem. Curabitur pharetra suscipit elit ac ultrices. Quisque ullamcorper quis massa et fringilla. Donec euismod, metus id porttitor semper, tortor velit accumsan metus, ut malesuada risus elit eu lorem. Mauris magna odio, efficitur et elit eu, suscipit fermentum sapien. Donec lacinia aliquet augue eu convallis. Suspendisse tincidunt lacus ac ipsum mattis malesuada. Curabitur pellentesque nec nulla ut commodo. Suspendisse pretium nunc in risus iaculis dignissim. Donec faucibus tempus lectus, vel ultrices lectus tincidunt et. Mauris pulvinar ut est in iaculis. Maecenas facilisis enim nec pharetra mattis. Aliquam laoreet egestas lacus, et porta nisl. Ut euismod laoreet purus sed eleifend. Vivamus ullamcorper sodales arcu, sit amet accumsan augue placerat semper. Duis condimentum mattis nulla sed consequat.
|
||||
|
||||
Donec non dui ligula. Aliquam id efficitur massa. Donec tristique aliquet dolor, quis rhoncus felis dignissim sit amet. Duis pellentesque orci eget rhoncus lacinia. Ut dapibus neque id ex fringilla, vitae lobortis turpis interdum. Donec mi lectus, finibus id placerat ut, molestie sit amet erat. Vivamus laoreet semper dui, id efficitur eros. Etiam mollis a nisi a ullamcorper. Vivamus ut porta odio. Maecenas dictum dignissim faucibus. Vestibulum lectus lacus, tempus pulvinar fermentum in, suscipit eget ex. Sed mollis non libero at dignissim. Curabitur non justo vel dui convallis feugiat. Suspendisse quis dictum augue, et pharetra arcu.
|
||||
|
||||
Curabitur sem purus, sagittis quis lorem ac, iaculis laoreet lacus. Fusce eleifend congue massa a ornare. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque sodales, tortor ut hendrerit lacinia, velit metus commodo libero, eu consequat est metus sit amet odio. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Pellentesque eu sem vehicula, vulputate est sit amet, mattis nisi. Nullam consequat at turpis vitae pretium. Nulla risus velit, pharetra ac sollicitudin sed, volutpat nec felis.
|
||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam pretium efficitur lectus, porttitor ornare dolor luctus eu. Vivamus auctor nunc non vestibulum tempor. Integer tristique massa sit amet mi auctor euismod. In finibus nec purus et volutpat. Nullam consectetur est id lorem posuere, quis blandit eros dignissim. Curabitur fringilla iaculis est sed porttitor. Duis in nisi felis.
|
||||
|
||||
Suspendisse ex sem, eleifend vitae felis eu, finibus malesuada odio. Duis eget risus in sem facilisis venenatis eget nec turpis. Aliquam ac sapien dictum, tempor libero sed, feugiat odio. Mauris bibendum nisi justo, eu pulvinar neque tempor ac. Vivamus suscipit in elit interdum euismod. Etiam porta molestie lobortis. Nam consectetur malesuada ante non sagittis. Nunc nec odio ex. Duis non hendrerit diam. Integer vulputate, mi a gravida pretium, ligula libero laoreet libero, in vestibulum arcu velit at velit.
|
||||
|
||||
Suspendisse at neque commodo, sollicitudin lectus sed, blandit sem. Curabitur pharetra suscipit elit ac ultrices. Quisque ullamcorper quis massa et fringilla. Donec euismod, metus id porttitor semper, tortor velit accumsan metus, ut malesuada risus elit eu lorem. Mauris magna odio, efficitur et elit eu, suscipit fermentum sapien. Donec lacinia aliquet augue eu convallis. Suspendisse tincidunt lacus ac ipsum mattis malesuada. Curabitur pellentesque nec nulla ut commodo. Suspendisse pretium nunc in risus iaculis dignissim. Donec faucibus tempus lectus, vel ultrices lectus tincidunt et. Mauris pulvinar ut est in iaculis. Maecenas facilisis enim nec pharetra mattis. Aliquam laoreet egestas lacus, et porta nisl. Ut euismod laoreet purus sed eleifend. Vivamus ullamcorper sodales arcu, sit amet accumsan augue placerat semper. Duis condimentum mattis nulla sed consequat.
|
||||
|
||||
Donec non dui ligula. Aliquam id efficitur massa. Donec tristique aliquet dolor, quis rhoncus felis dignissim sit amet. Duis pellentesque orci eget rhoncus lacinia. Ut dapibus neque id ex fringilla, vitae lobortis turpis interdum. Donec mi lectus, finibus id placerat ut, molestie sit amet erat. Vivamus laoreet semper dui, id efficitur eros. Etiam mollis a nisi a ullamcorper. Vivamus ut porta odio. Maecenas dictum dignissim faucibus. Vestibulum lectus lacus, tempus pulvinar fermentum in, suscipit eget ex. Sed mollis non libero at dignissim. Curabitur non justo vel dui convallis feugiat. Suspendisse quis dictum augue, et pharetra arcu.
|
||||
|
||||
Curabitur sem purus, sagittis quis lorem ac, iaculis laoreet lacus. Fusce eleifend congue massa a ornare. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque sodales, tortor ut hendrerit lacinia, velit metus commodo libero, eu consequat est metus sit amet odio. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Pellentesque eu sem vehicula, vulputate est sit amet, mattis nisi. Nullam consequat at turpis vitae pretium. Nulla risus velit, pharetra ac sollicitudin sed, volutpat nec felis.
|
||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam pretium efficitur lectus, porttitor ornare dolor luctus eu. Vivamus auctor nunc non vestibulum tempor. Integer tristique massa sit amet mi auctor euismod. In finibus nec purus et volutpat. Nullam consectetur est id lorem posuere, quis blandit eros dignissim. Curabitur fringilla iaculis est sed porttitor. Duis in nisi felis.
|
||||
|
||||
Suspendisse ex sem, eleifend vitae felis eu, finibus malesuada odio. Duis eget risus in sem facilisis venenatis eget nec turpis. Aliquam ac sapien dictum, tempor libero sed, feugiat odio. Mauris bibendum nisi justo, eu pulvinar neque tempor ac. Vivamus suscipit in elit interdum euismod. Etiam porta molestie lobortis. Nam consectetur malesuada ante non sagittis. Nunc nec odio ex. Duis non hendrerit diam. Integer vulputate, mi a gravida pretium, ligula libero laoreet libero, in vestibulum arcu velit at velit.
|
||||
|
||||
Suspendisse at neque commodo, sollicitudin lectus sed, blandit sem. Curabitur pharetra suscipit elit ac ultrices. Quisque ullamcorper quis massa et fringilla. Donec euismod, metus id porttitor semper, tortor velit accumsan metus, ut malesuada risus elit eu lorem. Mauris magna odio, efficitur et elit eu, suscipit fermentum sapien. Donec lacinia aliquet augue eu convallis. Suspendisse tincidunt lacus ac ipsum mattis malesuada. Curabitur pellentesque nec nulla ut commodo. Suspendisse pretium nunc in risus iaculis dignissim. Donec faucibus tempus lectus, vel ultrices lectus tincidunt et. Mauris pulvinar ut est in iaculis. Maecenas facilisis enim nec pharetra mattis. Aliquam laoreet egestas lacus, et porta nisl. Ut euismod laoreet purus sed eleifend. Vivamus ullamcorper sodales arcu, sit amet accumsan augue placerat semper. Duis condimentum mattis nulla sed consequat.
|
||||
|
||||
Donec non dui ligula. Aliquam id efficitur massa. Donec tristique aliquet dolor, quis rhoncus felis dignissim sit amet. Duis pellentesque orci eget rhoncus lacinia. Ut dapibus neque id ex fringilla, vitae lobortis turpis interdum. Donec mi lectus, finibus id placerat ut, molestie sit amet erat. Vivamus laoreet semper dui, id efficitur eros. Etiam mollis a nisi a ullamcorper. Vivamus ut porta odio. Maecenas dictum dignissim faucibus. Vestibulum lectus lacus, tempus pulvinar fermentum in, suscipit eget ex. Sed mollis non libero at dignissim. Curabitur non justo vel dui convallis feugiat. Suspendisse quis dictum augue, et pharetra arcu.
|
||||
|
||||
Curabitur sem purus, sagittis quis lorem ac, iaculis laoreet lacus. Fusce eleifend congue massa a ornare. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque sodales, tortor ut hendrerit lacinia, velit metus commodo libero, eu consequat est metus sit amet odio. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Pellentesque eu sem vehicula, vulputate est sit amet, mattis nisi. Nullam consequat at turpis vitae pretium. Nulla risus velit, pharetra ac sollicitudin sed, volutpat nec felis.
|
||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam pretium efficitur lectus, porttitor ornare dolor luctus eu. Vivamus auctor nunc non vestibulum tempor. Integer tristique massa sit amet mi auctor euismod. In finibus nec purus et volutpat. Nullam consectetur est id lorem posuere, quis blandit eros dignissim. Curabitur fringilla iaculis est sed porttitor. Duis in nisi felis.
|
||||
|
||||
Suspendisse ex sem, eleifend vitae felis eu, finibus malesuada odio. Duis eget risus in sem facilisis venenatis eget nec turpis. Aliquam ac sapien dictum, tempor libero sed, feugiat odio. Mauris bibendum nisi justo, eu pulvinar neque tempor ac. Vivamus suscipit in elit interdum euismod. Etiam porta molestie lobortis. Nam consectetur malesuada ante non sagittis. Nunc nec odio ex. Duis non hendrerit diam. Integer vulputate, mi a gravida pretium, ligula libero laoreet libero, in vestibulum arcu velit at velit.
|
||||
|
||||
Suspendisse at neque commodo, sollicitudin lectus sed, blandit sem. Curabitur pharetra suscipit elit ac ultrices. Quisque ullamcorper quis massa et fringilla. Donec euismod, metus id porttitor semper, tortor velit accumsan metus, ut malesuada risus elit eu lorem. Mauris magna odio, efficitur et elit eu, suscipit fermentum sapien. Donec lacinia aliquet augue eu convallis. Suspendisse tincidunt lacus ac ipsum mattis malesuada. Curabitur pellentesque nec nulla ut commodo. Suspendisse pretium nunc in risus iaculis dignissim. Donec faucibus tempus lectus, vel ultrices lectus tincidunt et. Mauris pulvinar ut est in iaculis. Maecenas facilisis enim nec pharetra mattis. Aliquam laoreet egestas lacus, et porta nisl. Ut euismod laoreet purus sed eleifend. Vivamus ullamcorper sodales arcu, sit amet accumsan augue placerat semper. Duis condimentum mattis nulla sed consequat.
|
||||
|
||||
Donec non dui ligula. Aliquam id efficitur massa. Donec tristique aliquet dolor, quis rhoncus felis dignissim sit amet. Duis pellentesque orci eget rhoncus lacinia. Ut dapibus neque id ex fringilla, vitae lobortis turpis interdum. Donec mi lectus, finibus id placerat ut, molestie sit amet erat. Vivamus laoreet semper dui, id efficitur eros. Etiam mollis a nisi a ullamcorper. Vivamus ut porta odio. Maecenas dictum dignissim faucibus. Vestibulum lectus lacus, tempus pulvinar fermentum in, suscipit eget ex. Sed mollis non libero at dignissim. Curabitur non justo vel dui convallis feugiat. Suspendisse quis dictum augue, et pharetra arcu.
|
||||
|
||||
Curabitur sem purus, sagittis quis lorem ac, iaculis laoreet lacus. Fusce eleifend congue massa a ornare. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque sodales, tortor ut hendrerit lacinia, velit metus commodo libero, eu consequat est metus sit amet odio. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Pellentesque eu sem vehicula, vulputate est sit amet, mattis nisi. Nullam consequat at turpis vitae pretium. Nulla risus velit, pharetra ac sollicitudin sed, volutpat nec felis.
|
||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam pretium efficitur lectus, porttitor ornare dolor luctus eu. Vivamus auctor nunc non vestibulum tempor. Integer tristique massa sit amet mi auctor euismod. In finibus nec purus et volutpat. Nullam consectetur est id lorem posuere, quis blandit eros dignissim. Curabitur fringilla iaculis est sed porttitor. Duis in nisi felis.
|
||||
|
||||
Suspendisse ex sem, eleifend vitae felis eu, finibus malesuada odio. Duis eget risus in sem facilisis venenatis eget nec turpis. Aliquam ac sapien dictum, tempor libero sed, feugiat odio. Mauris bibendum nisi justo, eu pulvinar neque tempor ac. Vivamus suscipit in elit interdum euismod. Etiam porta molestie lobortis. Nam consectetur malesuada ante non sagittis. Nunc nec odio ex. Duis non hendrerit diam. Integer vulputate, mi a gravida pretium, ligula libero laoreet libero, in vestibulum arcu velit at velit.
|
||||
|
||||
Suspendisse at neque commodo, sollicitudin lectus sed, blandit sem. Curabitur pharetra suscipit elit ac ultrices. Quisque ullamcorper quis massa et fringilla. Donec euismod, metus id porttitor semper, tortor velit accumsan metus, ut malesuada risus elit eu lorem. Mauris magna odio, efficitur et elit eu, suscipit fermentum sapien. Donec lacinia aliquet augue eu convallis. Suspendisse tincidunt lacus ac ipsum mattis malesuada. Curabitur pellentesque nec nulla ut commodo. Suspendisse pretium nunc in risus iaculis dignissim. Donec faucibus tempus lectus, vel ultrices lectus tincidunt et. Mauris pulvinar ut est in iaculis. Maecenas facilisis enim nec pharetra mattis. Aliquam laoreet egestas lacus, et porta nisl. Ut euismod laoreet purus sed eleifend. Vivamus ullamcorper sodales arcu, sit amet accumsan augue placerat semper. Duis condimentum mattis nulla sed consequat.
|
||||
|
||||
Donec non dui ligula. Aliquam id efficitur massa. Donec tristique aliquet dolor, quis rhoncus felis dignissim sit amet. Duis pellentesque orci eget rhoncus lacinia. Ut dapibus neque id ex fringilla, vitae lobortis turpis interdum. Donec mi lectus, finibus id placerat ut, molestie sit amet erat. Vivamus laoreet semper dui, id efficitur eros. Etiam mollis a nisi a ullamcorper. Vivamus ut porta odio. Maecenas dictum dignissim faucibus. Vestibulum lectus lacus, tempus pulvinar fermentum in, suscipit eget ex. Sed mollis non libero at dignissim. Curabitur non justo vel dui convallis feugiat. Suspendisse quis dictum augue, et pharetra arcu.
|
||||
|
||||
Curabitur sem purus, sagittis quis lorem ac, iaculis laoreet lacus. Fusce eleifend congue massa a ornare. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque sodales, tortor ut hendrerit lacinia, velit metus commodo libero, eu consequat est metus sit amet odio. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Pellentesque eu sem vehicula, vulputate est sit amet, mattis nisi. Nullam consequat at turpis vitae pretium. Nulla risus velit, pharetra ac sollicitudin sed, volutpat nec felis.
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="https://code.jquery.com/ui/1.11.0/jquery-ui.min.js"></script>
|
||||
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/mode/xml/xml.min.js"></script>
|
||||
|
||||
<script type="text/javascript" src="../../../js/froala_editor.min.js" ></script>
|
||||
|
||||
<script type="text/javascript" src="../../../js/plugins/align.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/code_beautifier.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/code_view.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/colors.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/draggable.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/emoticons.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/font_size.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/font_family.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/image.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/file.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/image_manager.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/line_breaker.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/link.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/lists.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/paragraph_format.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/paragraph_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/video.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/table.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/url.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/entities.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/char_counter.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/inline_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/save.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/fullscreen.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/quote.min.js"></script>
|
||||
|
||||
<script type="text/javascript" src="../../../js/languages/ro.js"></script>
|
||||
|
||||
<script>
|
||||
$(function(){
|
||||
$( "#dialog" ).dialog({
|
||||
minWidth: 1000
|
||||
});
|
||||
|
||||
$('#edit').froalaEditor({
|
||||
enter: $.FroalaEditor.ENTER_P
|
||||
})
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,90 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0"/>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
|
||||
<link rel="stylesheet" href="../../../css/froala_editor.css">
|
||||
<link rel="stylesheet" href="../../../css/froala_style.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/code_view.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/colors.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/emoticons.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/image_manager.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/image.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/line_breaker.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/table.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/char_counter.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/video.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/fullscreen.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/file.css">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.css">
|
||||
|
||||
<style>
|
||||
body {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
section {
|
||||
width: 80%;
|
||||
margin: auto;
|
||||
text-align: left;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<section id="editor">
|
||||
<div id='edit' style="margin-top: 30px;">
|
||||
<img src="../../../img/photo1.jpg" alt="Old Clock" width="300" style="float: left; margin-right: 10px; margin-bottom: 10px; margin-top: 10px;"/>
|
||||
|
||||
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec facilisis diam in odio iaculis blandit. Nunc eu mauris sit amet purus viverra gravida ut a dui. Vivamus nec rutrum augue, pharetra faucibus purus. Maecenas non orci sagittis, vehicula lorem et, dignissim nunc. Suspendisse suscipit, diam non varius facilisis, enim libero tincidunt magna, sit amet iaculis eros libero sit amet eros. Vestibulum a rhoncus felis. Nam lacus nulla, consequat ac lacus sit amet, accumsan pellentesque risus. Aenean viverra mi at urna mattis fermentum. Curabitur porta metus in tortor elementum, in semper nulla ullamcorper. Vestibulum mattis tempor tortor quis gravida. In rhoncus risus nibh. Nullam condimentum dapibus massa vel fringilla. Sed hendrerit sed est quis facilisis. Ut sit amet nibh sem. Pellentesque imperdiet mollis libero.</p>
|
||||
|
||||
<p><a href="http://google.com" title="Aenean sed hendrerit">Aenean sed hendrerit</a> velit. Nullam eu mi dolor. Maecenas et erat risus. Nulla ac auctor diam, non aliquet ante. Fusce ullamcorper, ipsum id tempor lacinia, sem tellus malesuada libero, quis ornare sem massa in orci. Sed dictum dictum tristique. Proin eros turpis, ultricies eu sapien eget, ornare rutrum ipsum. Pellentesque eros nisl, ornare nec ipsum sed, aliquet sollicitudin erat. Nulla tincidunt porta vehicula.</p>
|
||||
|
||||
<p>Nullam laoreet imperdiet orci ac euismod. Curabitur vel lectus nisi. Phasellus accumsan aliquet augue, eu rutrum tellus iaculis in. Nunc viverra ultrices mollis. Curabitur malesuada nunc massa, ut imperdiet arcu lobortis sed. Cras ac arcu mauris. Maecenas id lectus nisl. Donec consectetur scelerisque quam at ultricies. Nam quis magna iaculis, condimentum metus ut, elementum metus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vivamus id tempus nisi.</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<script data-main="js/app" src="js/lib/require.js"></script>
|
||||
<script>
|
||||
// Froala Editor plugins list.
|
||||
var fe_plugins = ['align', 'char_counter', 'code_view', 'colors', 'draggable', 'emoticons',
|
||||
'entities', 'file', 'font_family', 'font_size', 'fullscreen',
|
||||
'image_manager', 'image', 'inline_style', 'line_breaker',
|
||||
'link', 'lists', 'paragraph_format', 'paragraph_style', 'quote',
|
||||
'save', 'table', 'url', 'video']
|
||||
|
||||
// Define paths.
|
||||
var paths = {
|
||||
'app': '../app',
|
||||
'jquery': 'https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min',
|
||||
'froala_editor': '../../../../../js/froala_editor.min'
|
||||
};
|
||||
|
||||
// Add Froala Editor plugins to path.
|
||||
for (var i = 0; i < fe_plugins.length; i++) {
|
||||
paths['fe_' + fe_plugins[i]] = '../../../../../js/plugins/' + fe_plugins[i] + '.min';
|
||||
}
|
||||
|
||||
var shim = {
|
||||
'froala_editor': {deps: ['jquery']}
|
||||
};
|
||||
|
||||
for (var i = 0; i < fe_plugins.length; i++) {
|
||||
shim['fe_' + fe_plugins[i]] = {
|
||||
deps: ['froala_editor']
|
||||
}
|
||||
}
|
||||
|
||||
// Init RequireJS.
|
||||
requirejs.config({
|
||||
'baseUrl': 'js/lib',
|
||||
'paths': paths,
|
||||
shim: shim
|
||||
});
|
||||
|
||||
// Load the main app module to start the app
|
||||
requirejs(["app"]);
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,6 @@
|
||||
// Load the editor and the plugins we need.
|
||||
define(["jquery", "froala_editor", "fe_image", "fe_link"], function($) {
|
||||
$(function() {
|
||||
$('#edit').froalaEditor()
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,36 @@
|
||||
/*
|
||||
RequireJS 2.1.14 Copyright (c) 2010-2014, The Dojo Foundation All Rights Reserved.
|
||||
Available via the MIT or new BSD license.
|
||||
see: http://github.com/jrburke/requirejs for details
|
||||
*/
|
||||
var requirejs,require,define;
|
||||
(function(ba){function G(b){return"[object Function]"===K.call(b)}function H(b){return"[object Array]"===K.call(b)}function v(b,c){if(b){var d;for(d=0;d<b.length&&(!b[d]||!c(b[d],d,b));d+=1);}}function T(b,c){if(b){var d;for(d=b.length-1;-1<d&&(!b[d]||!c(b[d],d,b));d-=1);}}function t(b,c){return fa.call(b,c)}function m(b,c){return t(b,c)&&b[c]}function B(b,c){for(var d in b)if(t(b,d)&&c(b[d],d))break}function U(b,c,d,e){c&&B(c,function(c,g){if(d||!t(b,g))e&&"object"===typeof c&&c&&!H(c)&&!G(c)&&!(c instanceof
|
||||
RegExp)?(b[g]||(b[g]={}),U(b[g],c,d,e)):b[g]=c});return b}function u(b,c){return function(){return c.apply(b,arguments)}}function ca(b){throw b;}function da(b){if(!b)return b;var c=ba;v(b.split("."),function(b){c=c[b]});return c}function C(b,c,d,e){c=Error(c+"\nhttp://requirejs.org/docs/errors.html#"+b);c.requireType=b;c.requireModules=e;d&&(c.originalError=d);return c}function ga(b){function c(a,k,b){var f,l,c,d,e,g,i,p,k=k&&k.split("/"),h=j.map,n=h&&h["*"];if(a){a=a.split("/");l=a.length-1;j.nodeIdCompat&&
|
||||
Q.test(a[l])&&(a[l]=a[l].replace(Q,""));"."===a[0].charAt(0)&&k&&(l=k.slice(0,k.length-1),a=l.concat(a));l=a;for(c=0;c<l.length;c++)if(d=l[c],"."===d)l.splice(c,1),c-=1;else if(".."===d&&!(0===c||1==c&&".."===l[2]||".."===l[c-1])&&0<c)l.splice(c-1,2),c-=2;a=a.join("/")}if(b&&h&&(k||n)){l=a.split("/");c=l.length;a:for(;0<c;c-=1){e=l.slice(0,c).join("/");if(k)for(d=k.length;0<d;d-=1)if(b=m(h,k.slice(0,d).join("/")))if(b=m(b,e)){f=b;g=c;break a}!i&&(n&&m(n,e))&&(i=m(n,e),p=c)}!f&&i&&(f=i,g=p);f&&(l.splice(0,
|
||||
g,f),a=l.join("/"))}return(f=m(j.pkgs,a))?f:a}function d(a){z&&v(document.getElementsByTagName("script"),function(k){if(k.getAttribute("data-requiremodule")===a&&k.getAttribute("data-requirecontext")===i.contextName)return k.parentNode.removeChild(k),!0})}function e(a){var k=m(j.paths,a);if(k&&H(k)&&1<k.length)return k.shift(),i.require.undef(a),i.makeRequire(null,{skipMap:!0})([a]),!0}function n(a){var k,c=a?a.indexOf("!"):-1;-1<c&&(k=a.substring(0,c),a=a.substring(c+1,a.length));return[k,a]}function p(a,
|
||||
k,b,f){var l,d,e=null,g=k?k.name:null,j=a,p=!0,h="";a||(p=!1,a="_@r"+(K+=1));a=n(a);e=a[0];a=a[1];e&&(e=c(e,g,f),d=m(r,e));a&&(e?h=d&&d.normalize?d.normalize(a,function(a){return c(a,g,f)}):-1===a.indexOf("!")?c(a,g,f):a:(h=c(a,g,f),a=n(h),e=a[0],h=a[1],b=!0,l=i.nameToUrl(h)));b=e&&!d&&!b?"_unnormalized"+(O+=1):"";return{prefix:e,name:h,parentMap:k,unnormalized:!!b,url:l,originalName:j,isDefine:p,id:(e?e+"!"+h:h)+b}}function s(a){var k=a.id,b=m(h,k);b||(b=h[k]=new i.Module(a));return b}function q(a,
|
||||
k,b){var f=a.id,c=m(h,f);if(t(r,f)&&(!c||c.defineEmitComplete))"defined"===k&&b(r[f]);else if(c=s(a),c.error&&"error"===k)b(c.error);else c.on(k,b)}function w(a,b){var c=a.requireModules,f=!1;if(b)b(a);else if(v(c,function(b){if(b=m(h,b))b.error=a,b.events.error&&(f=!0,b.emit("error",a))}),!f)g.onError(a)}function x(){R.length&&(ha.apply(A,[A.length,0].concat(R)),R=[])}function y(a){delete h[a];delete V[a]}function F(a,b,c){var f=a.map.id;a.error?a.emit("error",a.error):(b[f]=!0,v(a.depMaps,function(f,
|
||||
d){var e=f.id,g=m(h,e);g&&(!a.depMatched[d]&&!c[e])&&(m(b,e)?(a.defineDep(d,r[e]),a.check()):F(g,b,c))}),c[f]=!0)}function D(){var a,b,c=(a=1E3*j.waitSeconds)&&i.startTime+a<(new Date).getTime(),f=[],l=[],g=!1,h=!0;if(!W){W=!0;B(V,function(a){var i=a.map,j=i.id;if(a.enabled&&(i.isDefine||l.push(a),!a.error))if(!a.inited&&c)e(j)?g=b=!0:(f.push(j),d(j));else if(!a.inited&&(a.fetched&&i.isDefine)&&(g=!0,!i.prefix))return h=!1});if(c&&f.length)return a=C("timeout","Load timeout for modules: "+f,null,
|
||||
f),a.contextName=i.contextName,w(a);h&&v(l,function(a){F(a,{},{})});if((!c||b)&&g)if((z||ea)&&!X)X=setTimeout(function(){X=0;D()},50);W=!1}}function E(a){t(r,a[0])||s(p(a[0],null,!0)).init(a[1],a[2])}function I(a){var a=a.currentTarget||a.srcElement,b=i.onScriptLoad;a.detachEvent&&!Y?a.detachEvent("onreadystatechange",b):a.removeEventListener("load",b,!1);b=i.onScriptError;(!a.detachEvent||Y)&&a.removeEventListener("error",b,!1);return{node:a,id:a&&a.getAttribute("data-requiremodule")}}function J(){var a;
|
||||
for(x();A.length;){a=A.shift();if(null===a[0])return w(C("mismatch","Mismatched anonymous define() module: "+a[a.length-1]));E(a)}}var W,Z,i,L,X,j={waitSeconds:7,baseUrl:"./",paths:{},bundles:{},pkgs:{},shim:{},config:{}},h={},V={},$={},A=[],r={},S={},aa={},K=1,O=1;L={require:function(a){return a.require?a.require:a.require=i.makeRequire(a.map)},exports:function(a){a.usingExports=!0;if(a.map.isDefine)return a.exports?r[a.map.id]=a.exports:a.exports=r[a.map.id]={}},module:function(a){return a.module?
|
||||
a.module:a.module={id:a.map.id,uri:a.map.url,config:function(){return m(j.config,a.map.id)||{}},exports:a.exports||(a.exports={})}}};Z=function(a){this.events=m($,a.id)||{};this.map=a;this.shim=m(j.shim,a.id);this.depExports=[];this.depMaps=[];this.depMatched=[];this.pluginMaps={};this.depCount=0};Z.prototype={init:function(a,b,c,f){f=f||{};if(!this.inited){this.factory=b;if(c)this.on("error",c);else this.events.error&&(c=u(this,function(a){this.emit("error",a)}));this.depMaps=a&&a.slice(0);this.errback=
|
||||
c;this.inited=!0;this.ignore=f.ignore;f.enabled||this.enabled?this.enable():this.check()}},defineDep:function(a,b){this.depMatched[a]||(this.depMatched[a]=!0,this.depCount-=1,this.depExports[a]=b)},fetch:function(){if(!this.fetched){this.fetched=!0;i.startTime=(new Date).getTime();var a=this.map;if(this.shim)i.makeRequire(this.map,{enableBuildCallback:!0})(this.shim.deps||[],u(this,function(){return a.prefix?this.callPlugin():this.load()}));else return a.prefix?this.callPlugin():this.load()}},load:function(){var a=
|
||||
this.map.url;S[a]||(S[a]=!0,i.load(this.map.id,a))},check:function(){if(this.enabled&&!this.enabling){var a,b,c=this.map.id;b=this.depExports;var f=this.exports,l=this.factory;if(this.inited)if(this.error)this.emit("error",this.error);else{if(!this.defining){this.defining=!0;if(1>this.depCount&&!this.defined){if(G(l)){if(this.events.error&&this.map.isDefine||g.onError!==ca)try{f=i.execCb(c,l,b,f)}catch(d){a=d}else f=i.execCb(c,l,b,f);this.map.isDefine&&void 0===f&&((b=this.module)?f=b.exports:this.usingExports&&
|
||||
(f=this.exports));if(a)return a.requireMap=this.map,a.requireModules=this.map.isDefine?[this.map.id]:null,a.requireType=this.map.isDefine?"define":"require",w(this.error=a)}else f=l;this.exports=f;if(this.map.isDefine&&!this.ignore&&(r[c]=f,g.onResourceLoad))g.onResourceLoad(i,this.map,this.depMaps);y(c);this.defined=!0}this.defining=!1;this.defined&&!this.defineEmitted&&(this.defineEmitted=!0,this.emit("defined",this.exports),this.defineEmitComplete=!0)}}else this.fetch()}},callPlugin:function(){var a=
|
||||
this.map,b=a.id,d=p(a.prefix);this.depMaps.push(d);q(d,"defined",u(this,function(f){var l,d;d=m(aa,this.map.id);var e=this.map.name,P=this.map.parentMap?this.map.parentMap.name:null,n=i.makeRequire(a.parentMap,{enableBuildCallback:!0});if(this.map.unnormalized){if(f.normalize&&(e=f.normalize(e,function(a){return c(a,P,!0)})||""),f=p(a.prefix+"!"+e,this.map.parentMap),q(f,"defined",u(this,function(a){this.init([],function(){return a},null,{enabled:!0,ignore:!0})})),d=m(h,f.id)){this.depMaps.push(f);
|
||||
if(this.events.error)d.on("error",u(this,function(a){this.emit("error",a)}));d.enable()}}else d?(this.map.url=i.nameToUrl(d),this.load()):(l=u(this,function(a){this.init([],function(){return a},null,{enabled:!0})}),l.error=u(this,function(a){this.inited=!0;this.error=a;a.requireModules=[b];B(h,function(a){0===a.map.id.indexOf(b+"_unnormalized")&&y(a.map.id)});w(a)}),l.fromText=u(this,function(f,c){var d=a.name,e=p(d),P=M;c&&(f=c);P&&(M=!1);s(e);t(j.config,b)&&(j.config[d]=j.config[b]);try{g.exec(f)}catch(h){return w(C("fromtexteval",
|
||||
"fromText eval for "+b+" failed: "+h,h,[b]))}P&&(M=!0);this.depMaps.push(e);i.completeLoad(d);n([d],l)}),f.load(a.name,n,l,j))}));i.enable(d,this);this.pluginMaps[d.id]=d},enable:function(){V[this.map.id]=this;this.enabling=this.enabled=!0;v(this.depMaps,u(this,function(a,b){var c,f;if("string"===typeof a){a=p(a,this.map.isDefine?this.map:this.map.parentMap,!1,!this.skipMap);this.depMaps[b]=a;if(c=m(L,a.id)){this.depExports[b]=c(this);return}this.depCount+=1;q(a,"defined",u(this,function(a){this.defineDep(b,
|
||||
a);this.check()}));this.errback&&q(a,"error",u(this,this.errback))}c=a.id;f=h[c];!t(L,c)&&(f&&!f.enabled)&&i.enable(a,this)}));B(this.pluginMaps,u(this,function(a){var b=m(h,a.id);b&&!b.enabled&&i.enable(a,this)}));this.enabling=!1;this.check()},on:function(a,b){var c=this.events[a];c||(c=this.events[a]=[]);c.push(b)},emit:function(a,b){v(this.events[a],function(a){a(b)});"error"===a&&delete this.events[a]}};i={config:j,contextName:b,registry:h,defined:r,urlFetched:S,defQueue:A,Module:Z,makeModuleMap:p,
|
||||
nextTick:g.nextTick,onError:w,configure:function(a){a.baseUrl&&"/"!==a.baseUrl.charAt(a.baseUrl.length-1)&&(a.baseUrl+="/");var b=j.shim,c={paths:!0,bundles:!0,config:!0,map:!0};B(a,function(a,b){c[b]?(j[b]||(j[b]={}),U(j[b],a,!0,!0)):j[b]=a});a.bundles&&B(a.bundles,function(a,b){v(a,function(a){a!==b&&(aa[a]=b)})});a.shim&&(B(a.shim,function(a,c){H(a)&&(a={deps:a});if((a.exports||a.init)&&!a.exportsFn)a.exportsFn=i.makeShimExports(a);b[c]=a}),j.shim=b);a.packages&&v(a.packages,function(a){var b,
|
||||
a="string"===typeof a?{name:a}:a;b=a.name;a.location&&(j.paths[b]=a.location);j.pkgs[b]=a.name+"/"+(a.main||"main").replace(ia,"").replace(Q,"")});B(h,function(a,b){!a.inited&&!a.map.unnormalized&&(a.map=p(b))});if(a.deps||a.callback)i.require(a.deps||[],a.callback)},makeShimExports:function(a){return function(){var b;a.init&&(b=a.init.apply(ba,arguments));return b||a.exports&&da(a.exports)}},makeRequire:function(a,e){function j(c,d,m){var n,q;e.enableBuildCallback&&(d&&G(d))&&(d.__requireJsBuild=
|
||||
!0);if("string"===typeof c){if(G(d))return w(C("requireargs","Invalid require call"),m);if(a&&t(L,c))return L[c](h[a.id]);if(g.get)return g.get(i,c,a,j);n=p(c,a,!1,!0);n=n.id;return!t(r,n)?w(C("notloaded",'Module name "'+n+'" has not been loaded yet for context: '+b+(a?"":". Use require([])"))):r[n]}J();i.nextTick(function(){J();q=s(p(null,a));q.skipMap=e.skipMap;q.init(c,d,m,{enabled:!0});D()});return j}e=e||{};U(j,{isBrowser:z,toUrl:function(b){var d,e=b.lastIndexOf("."),k=b.split("/")[0];if(-1!==
|
||||
e&&(!("."===k||".."===k)||1<e))d=b.substring(e,b.length),b=b.substring(0,e);return i.nameToUrl(c(b,a&&a.id,!0),d,!0)},defined:function(b){return t(r,p(b,a,!1,!0).id)},specified:function(b){b=p(b,a,!1,!0).id;return t(r,b)||t(h,b)}});a||(j.undef=function(b){x();var c=p(b,a,!0),e=m(h,b);d(b);delete r[b];delete S[c.url];delete $[b];T(A,function(a,c){a[0]===b&&A.splice(c,1)});e&&(e.events.defined&&($[b]=e.events),y(b))});return j},enable:function(a){m(h,a.id)&&s(a).enable()},completeLoad:function(a){var b,
|
||||
c,d=m(j.shim,a)||{},g=d.exports;for(x();A.length;){c=A.shift();if(null===c[0]){c[0]=a;if(b)break;b=!0}else c[0]===a&&(b=!0);E(c)}c=m(h,a);if(!b&&!t(r,a)&&c&&!c.inited){if(j.enforceDefine&&(!g||!da(g)))return e(a)?void 0:w(C("nodefine","No define call for "+a,null,[a]));E([a,d.deps||[],d.exportsFn])}D()},nameToUrl:function(a,b,c){var d,e,h;(d=m(j.pkgs,a))&&(a=d);if(d=m(aa,a))return i.nameToUrl(d,b,c);if(g.jsExtRegExp.test(a))d=a+(b||"");else{d=j.paths;a=a.split("/");for(e=a.length;0<e;e-=1)if(h=a.slice(0,
|
||||
e).join("/"),h=m(d,h)){H(h)&&(h=h[0]);a.splice(0,e,h);break}d=a.join("/");d+=b||(/^data\:|\?/.test(d)||c?"":".js");d=("/"===d.charAt(0)||d.match(/^[\w\+\.\-]+:/)?"":j.baseUrl)+d}return j.urlArgs?d+((-1===d.indexOf("?")?"?":"&")+j.urlArgs):d},load:function(a,b){g.load(i,a,b)},execCb:function(a,b,c,d){return b.apply(d,c)},onScriptLoad:function(a){if("load"===a.type||ja.test((a.currentTarget||a.srcElement).readyState))N=null,a=I(a),i.completeLoad(a.id)},onScriptError:function(a){var b=I(a);if(!e(b.id))return w(C("scripterror",
|
||||
"Script error for: "+b.id,a,[b.id]))}};i.require=i.makeRequire();return i}var g,x,y,D,I,E,N,J,s,O,ka=/(\/\*([\s\S]*?)\*\/|([^:]|^)\/\/(.*)$)/mg,la=/[^.]\s*require\s*\(\s*["']([^'"\s]+)["']\s*\)/g,Q=/\.js$/,ia=/^\.\//;x=Object.prototype;var K=x.toString,fa=x.hasOwnProperty,ha=Array.prototype.splice,z=!!("undefined"!==typeof window&&"undefined"!==typeof navigator&&window.document),ea=!z&&"undefined"!==typeof importScripts,ja=z&&"PLAYSTATION 3"===navigator.platform?/^complete$/:/^(complete|loaded)$/,
|
||||
Y="undefined"!==typeof opera&&"[object Opera]"===opera.toString(),F={},q={},R=[],M=!1;if("undefined"===typeof define){if("undefined"!==typeof requirejs){if(G(requirejs))return;q=requirejs;requirejs=void 0}"undefined"!==typeof require&&!G(require)&&(q=require,require=void 0);g=requirejs=function(b,c,d,e){var n,p="_";!H(b)&&"string"!==typeof b&&(n=b,H(c)?(b=c,c=d,d=e):b=[]);n&&n.context&&(p=n.context);(e=m(F,p))||(e=F[p]=g.s.newContext(p));n&&e.configure(n);return e.require(b,c,d)};g.config=function(b){return g(b)};
|
||||
g.nextTick="undefined"!==typeof setTimeout?function(b){setTimeout(b,4)}:function(b){b()};require||(require=g);g.version="2.1.14";g.jsExtRegExp=/^\/|:|\?|\.js$/;g.isBrowser=z;x=g.s={contexts:F,newContext:ga};g({});v(["toUrl","undef","defined","specified"],function(b){g[b]=function(){var c=F._;return c.require[b].apply(c,arguments)}});if(z&&(y=x.head=document.getElementsByTagName("head")[0],D=document.getElementsByTagName("base")[0]))y=x.head=D.parentNode;g.onError=ca;g.createNode=function(b){var c=
|
||||
b.xhtml?document.createElementNS("http://www.w3.org/1999/xhtml","html:script"):document.createElement("script");c.type=b.scriptType||"text/javascript";c.charset="utf-8";c.async=!0;return c};g.load=function(b,c,d){var e=b&&b.config||{};if(z)return e=g.createNode(e,c,d),e.setAttribute("data-requirecontext",b.contextName),e.setAttribute("data-requiremodule",c),e.attachEvent&&!(e.attachEvent.toString&&0>e.attachEvent.toString().indexOf("[native code"))&&!Y?(M=!0,e.attachEvent("onreadystatechange",b.onScriptLoad)):
|
||||
(e.addEventListener("load",b.onScriptLoad,!1),e.addEventListener("error",b.onScriptError,!1)),e.src=d,J=e,D?y.insertBefore(e,D):y.appendChild(e),J=null,e;if(ea)try{importScripts(d),b.completeLoad(c)}catch(m){b.onError(C("importscripts","importScripts failed for "+c+" at "+d,m,[c]))}};z&&!q.skipDataMain&&T(document.getElementsByTagName("script"),function(b){y||(y=b.parentNode);if(I=b.getAttribute("data-main"))return s=I,q.baseUrl||(E=s.split("/"),s=E.pop(),O=E.length?E.join("/")+"/":"./",q.baseUrl=
|
||||
O),s=s.replace(Q,""),g.jsExtRegExp.test(s)&&(s=I),q.deps=q.deps?q.deps.concat(s):[s],!0});define=function(b,c,d){var e,g;"string"!==typeof b&&(d=c,c=b,b=null);H(c)||(d=c,c=null);!c&&G(d)&&(c=[],d.length&&(d.toString().replace(ka,"").replace(la,function(b,d){c.push(d)}),c=(1===d.length?["require"]:["require","exports","module"]).concat(c)));if(M){if(!(e=J))N&&"interactive"===N.readyState||T(document.getElementsByTagName("script"),function(b){if("interactive"===b.readyState)return N=b}),e=N;e&&(b||
|
||||
(b=e.getAttribute("data-requiremodule")),g=F[e.getAttribute("data-requirecontext")])}(g?g.defQueue:R).push([b,c,d])};define.amd={jQuery:!0};g.exec=function(b){return eval(b)};g(q)}})(this);
|
||||
@@ -0,0 +1,105 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0"/>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
|
||||
<link rel="stylesheet" href="../../../css/froala_editor.css">
|
||||
<link rel="stylesheet" href="../../../css/froala_style.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/colors.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/emoticons.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/image_manager.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/image.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/line_breaker.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/table.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/char_counter.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/video.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/fullscreen.css">
|
||||
<link rel="stylesheet" href="../../../css/plugins/file.css">
|
||||
<!--<link rel="stylesheet" href="../../../css/plugins/file.css">-->
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/at.js/1.4.0/css/jquery.atwho.min.css">
|
||||
|
||||
<!-- Code Mirror CSS file. -->
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.css">
|
||||
|
||||
<!-- Include the plugin CSS file. -->
|
||||
<link rel="stylesheet" href="../../../css/plugins/code_view.css">
|
||||
|
||||
<link rel="stylesheet" href="../../../css/third_party/spell_checker.min.css">
|
||||
|
||||
<style>
|
||||
body {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
div#editor {
|
||||
width: 81%;
|
||||
margin: auto;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.atwho-view-ul {
|
||||
text-align: left;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="editor">
|
||||
|
||||
<div id="edit" style="margin-top: 30px;">
|
||||
<h1>Spell Checker example</h1>
|
||||
|
||||
<img class="fr-fir fr-dii" src="../../../img/photo1.jpg" alt="Old Clock" width="300"/>
|
||||
|
||||
<p>Below is a text written in Spanish that has typos try the Spell Checker to see how it works. The spell checker it is initialized to use as a spell checking language Spanish.</p>
|
||||
|
||||
<p>El plugin spell checker.min.js se puede utilizaro como es o puedee utilizzar también utilizaarlo juntoo con Code Mirror.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/mode/xml/xml.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/at.js/1.4.0/js/jquery.atwho.min.js"></script>
|
||||
|
||||
<script type="text/javascript" src="../../../js/froala_editor.min.js" ></script>
|
||||
|
||||
<script type="text/javascript" src="../../../js/plugins/align.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/code_beautifier.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/code_view.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/font_size.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/font_family.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/image.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/image_manager.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/link.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/lists.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/paragraph_format.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/url.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/entities.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/plugins/save.min.js"></script>
|
||||
<script type="text/javascript" src="../../../js/third_party/spell_checker.min.js"></script>
|
||||
|
||||
<script>
|
||||
$(function(){
|
||||
$('#edit').froalaEditor({
|
||||
scaytAutoload: true,
|
||||
scaytOptions: {
|
||||
enableOnTouchDevices: false,
|
||||
localization:'en',
|
||||
extraModules: 'ui',
|
||||
DefaultSelection: 'American English',
|
||||
spellcheckLang: 'en_US',
|
||||
contextMenuSections: 'suggest|moresuggest',
|
||||
serviceProtocol: 'https',
|
||||
servicePort:'80',
|
||||
serviceHost:'svc.webspellchecker.net',
|
||||
servicePath:'spellcheck/script/ssrv.cgi',
|
||||
contextMenuForMisspelledOnly: true,
|
||||
scriptPath: 'https://svc.webspellchecker.net/spellcheck31/lf/scayt3/customscayt/customscayt.js'
|
||||
}
|
||||
})
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,88 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0"/>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
|
||||
<link rel="stylesheet" href="../../css/froala_editor.css">
|
||||
<link rel="stylesheet" href="../../css/froala_style.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/code_view.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/colors.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/emoticons.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image_manager.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/line_breaker.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/table.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/char_counter.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/video.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/fullscreen.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/file.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/quick_insert.css">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.css">
|
||||
|
||||
<style>
|
||||
body {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
div#editor {
|
||||
width: 81%;
|
||||
margin: auto;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.ss {
|
||||
background-color: red;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="editor">
|
||||
<div id='edit' style="margin-top: 30px;">
|
||||
<h1>Get Edited HTML</h1>
|
||||
|
||||
<p>You can use at any time in your code the following snippet to get the content inside the Froala WYSIWYG HTML Editor</p>
|
||||
<p><code>$('div#selector').froalaEditor('html.get');</code></p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/mode/xml/xml.min.js"></script>
|
||||
|
||||
<script type="text/javascript" src="../../js/froala_editor.min.js" ></script>
|
||||
<script type="text/javascript" src="../../js/plugins/align.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/char_counter.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_beautifier.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_view.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/colors.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/draggable.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/emoticons.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/entities.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/file.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/font_size.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/font_family.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/fullscreen.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image_manager.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/line_breaker.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/inline_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/link.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/lists.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/paragraph_format.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/paragraph_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/quick_insert.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/quote.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/table.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/save.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/url.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/video.min.js"></script>
|
||||
|
||||
<script>
|
||||
$(function(){
|
||||
$('#edit').froalaEditor()
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,101 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0"/>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
|
||||
<link rel="stylesheet" href="../../css/froala_editor.css">
|
||||
<link rel="stylesheet" href="../../css/froala_style.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/code_view.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image_manager.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/table.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/video.css">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.css">
|
||||
|
||||
|
||||
<style>
|
||||
body {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
div#editor {
|
||||
width: 81%;
|
||||
margin: auto;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
div#buttons {
|
||||
margin-top: 30px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="buttons">
|
||||
<button id="init">Init Editor</button>
|
||||
<button id="destroy">Destroy Editor</button>
|
||||
</div>
|
||||
|
||||
<div id="editor">
|
||||
<div id='edit' class="fr-view" style="margin-top: 30px;">
|
||||
<h1>Init / Destroy editor</h1>
|
||||
|
||||
<p>The buttons above will initialize and destroy the rich text editor again.</p>
|
||||
|
||||
<img class="fr-fir fr-dii" src="../../img/photo1.jpg" alt="Old Clock" width="300"/>Lorem <strong>ipsum</strong> dolor sit amet, consectetur <strong>adipiscing <em>elit.</em> Donec</strong> facilisis diam in odio iaculis blandit. Nunc eu mauris sit amet purus <strong>viverra</strong><em> gravida</em> ut a dui.<br/>
|
||||
<ul><li>Vivamus nec rutrum augue, pharetra faucibus purus. Maecenas non orci sagittis, vehicula lorem et, dignissim nunc.</li> <li>Suspendisse suscipit, diam non varius facilisis, enim libero tincidunt magna, sit amet iaculis eros libero sit amet eros. Vestibulum a rhoncus felis.<ol><li>Nam lacus nulla, consequat ac lacus sit amet, accumsan pellentesque risus. Aenean viverra mi at urna mattis fermentum.</li> <li>Curabitur porta metus in tortor elementum, in semper nulla ullamcorper. Vestibulum mattis tempor tortor quis gravida. In rhoncus risus nibh. Nullam condimentum dapibus massa vel fringilla. Sed hendrerit sed est quis facilisis. Ut sit amet nibh sem. Pellentesque imperdiet mollis libero.</li></ol></li></ul>
|
||||
|
||||
<table style="width: 100%;">
|
||||
<tr>
|
||||
<td style="width: 25%;"></td>
|
||||
<td style="width: 25%;"></td>
|
||||
<td style="width: 25%;"></td>
|
||||
<td style="width: 25%;"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="width: 25%;"></td>
|
||||
<td style="width: 25%;"></td>
|
||||
<td style="width: 25%;"></td>
|
||||
<td style="width: 25%;"></td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
<a href="http://google.com" title="Aenean sed hendrerit">Aenean sed hendrerit</a> velit. Nullam eu mi dolor. Maecenas et erat risus. Nulla ac auctor diam, non aliquet ante. Fusce ullamcorper, ipsum id tempor lacinia, sem tellus malesuada libero, quis ornare sem massa in orci. Sed dictum dictum tristique. Proin eros turpis, ultricies eu sapien eget, ornare rutrum ipsum. Pellentesque eros nisl, ornare nec ipsum sed, aliquet sollicitudin erat. Nulla tincidunt porta <strong>vehicula.</strong><br/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/mode/xml/xml.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/froala_editor.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/align.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_beautifier.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_view.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/draggable.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image_manager.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/link.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/lists.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/paragraph_format.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/paragraph_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/table.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/video.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/url.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/entities.min.js"></script>
|
||||
|
||||
<script>
|
||||
$(function(){
|
||||
$('#init').on('click', function(e) {
|
||||
console.log("Initializing Froala Editor...");
|
||||
$('#edit').removeClass('fr-view').froalaEditor();
|
||||
})
|
||||
$('#destroy').on('click', function (e) {
|
||||
console.log("Destroying Froala Editor...");
|
||||
$('#edit').froalaEditor('destroy');
|
||||
$('#edit').addClass('fr-view');
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,99 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0"/>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
|
||||
<link rel="stylesheet" href="../../css/froala_editor.css">
|
||||
<link rel="stylesheet" href="../../css/froala_style.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/code_view.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/colors.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/emoticons.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image_manager.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/line_breaker.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/table.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/char_counter.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/video.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/fullscreen.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/file.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/quick_insert.css">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.css">
|
||||
|
||||
<style>
|
||||
body {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
div#editor {
|
||||
width: 81%;
|
||||
margin: auto;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.ss {
|
||||
background-color: red;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="editor">
|
||||
<div id='edit' style="margin-top: 30px;">
|
||||
<h1>Insert HTML</h1>
|
||||
<p>Click the insert HTML button in the toolbar to insert some HTML.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/mode/xml/xml.min.js"></script>
|
||||
|
||||
<script type="text/javascript" src="../../js/froala_editor.min.js" ></script>
|
||||
<script type="text/javascript" src="../../js/plugins/align.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/char_counter.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_beautifier.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_view.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/colors.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/draggable.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/emoticons.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/entities.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/file.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/font_size.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/font_family.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/fullscreen.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image_manager.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/line_breaker.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/inline_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/link.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/lists.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/paragraph_format.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/paragraph_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/quick_insert.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/quote.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/table.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/save.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/url.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/video.min.js"></script>
|
||||
|
||||
<script>
|
||||
$(function(){
|
||||
$.FroalaEditor.DefineIcon('insertHTML', {NAME: 'plus'});
|
||||
$.FroalaEditor.RegisterCommand('insertHTML', {
|
||||
title: 'Insert HTML',
|
||||
focus: true,
|
||||
undo: true,
|
||||
refreshAfterCallback: true,
|
||||
callback: function () {
|
||||
this.html.insert('Some Custom HTML.');
|
||||
this.undo.saveStep();
|
||||
}
|
||||
});
|
||||
$('#edit').froalaEditor({
|
||||
toolbarButtons: ['bold', 'italic', 'underline', 'paragraphFormat', 'formatOL', 'formatUL', 'insertHTML', 'undo', 'redo', 'html']
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,79 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0"/>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
|
||||
<link rel="stylesheet" href="../../css/froala_editor.css">
|
||||
<link rel="stylesheet" href="../../css/froala_style.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/code_view.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image_manager.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/table.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/video.css">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.css">
|
||||
|
||||
|
||||
<style>
|
||||
body {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
div#editor {
|
||||
width: 81%;
|
||||
margin: auto;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
pre#preview {
|
||||
padding: 10px;
|
||||
background: #efefef;
|
||||
white-space: pre-line;
|
||||
line-height: 1.5;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="editor">
|
||||
<div id='edit' style="margin-top: 30px;">
|
||||
<img class="fr-fir fr-dii" src="../../img/photo1.jpg" alt="Old Clock" width="200"/>
|
||||
|
||||
<h1>Live Code Preview</h1>
|
||||
|
||||
<p>This example allows you to see when the <a href="https://www.froala.com/wysiwyg-editor/v2.0/docs/events#contentChanged" title="contentChanged event" target="_blank">contentChanged</a> event is triggered and how the rich text editor's content appears outside the editable area.</p>
|
||||
|
||||
<p>Start typing and you can preview the code of the WYSIWYG HTML editor as you type below the editing box.</p>
|
||||
</div>
|
||||
|
||||
<pre id="preview"></pre>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/mode/xml/xml.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/froala_editor.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/align.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_beautifier.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_view.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/draggable.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image_manager.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/link.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/lists.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/paragraph_format.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/paragraph_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/table.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/video.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/url.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/entities.min.js"></script>
|
||||
|
||||
<script>
|
||||
$(function(){
|
||||
$('#edit').on('froalaEditor.contentChanged froalaEditor.initialized', function (e, editor) {
|
||||
$('#preview').text(editor.codeBeautifier.run(editor.html.get()))
|
||||
}).froalaEditor();
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,78 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0"/>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
|
||||
<link rel="stylesheet" href="../../css/froala_editor.css">
|
||||
<link rel="stylesheet" href="../../css/froala_style.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/code_view.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image_manager.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/table.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/video.css">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.css">
|
||||
|
||||
|
||||
<style>
|
||||
body {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
div#editor {
|
||||
width: 81%;
|
||||
margin: auto;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
div#preview {
|
||||
padding: 10px;
|
||||
background: #efefef;
|
||||
margin-top: 20px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="editor">
|
||||
<div id='edit' style="margin-top: 30px;">
|
||||
<img class="fr-fir fr-dii" src="../../img/photo1.jpg" alt="Old Clock" width="200"/>
|
||||
|
||||
<h1>Live Content Preview</h1>
|
||||
|
||||
<p>This example allows you to see when the <a href="https://www.froala.com/wysiwyg-editor/v2.0/docs/events#contentChanged" title="contentChanged event" target="_blank">contentChanged</a> event is triggered and how the rich text editor's content appears outside the editable area.</p>
|
||||
|
||||
<p>Start typing and you can preview the content of the WYSIWYG HTML editor as you type below the editing box.</p>
|
||||
</div>
|
||||
|
||||
<div id="preview" class="fr-view"></div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/mode/xml/xml.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/froala_editor.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/align.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_beautifier.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_view.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/draggable.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image_manager.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/link.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/lists.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/paragraph_format.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/paragraph_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/table.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/video.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/url.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/entities.min.js"></script>
|
||||
|
||||
<script>
|
||||
$(function(){
|
||||
$('#edit').on('froalaEditor.contentChanged froalaEditor.initialized', function (e, editor) {
|
||||
$('#preview').html(editor.html.get());
|
||||
}).froalaEditor();
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,130 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0"/>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
|
||||
<link rel="stylesheet" href="../../css/froala_editor.css">
|
||||
<link rel="stylesheet" href="../../css/froala_style.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/code_view.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/colors.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/emoticons.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image_manager.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/line_breaker.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/table.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/char_counter.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/video.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/fullscreen.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/file.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/quick_insert.css">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.css">
|
||||
|
||||
<style>
|
||||
body {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
div#editor {
|
||||
width: 81%;
|
||||
margin: auto;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.ss {
|
||||
background-color: red;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="editor">
|
||||
<div id='edit' style="margin-top: 30px;">
|
||||
<h1>Save / Restore Selection</h1>
|
||||
<ol>
|
||||
<li>You can use the buttons to play around with the selection:
|
||||
<ul>
|
||||
<li>The first button saves the selection.</li>
|
||||
<li>The second button restores the selection.</li>
|
||||
<li>The last button clears the selection.</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>The selection will be restored correctly only if you don't make any changes by typing into the WYSIWYG HTML editor after you save it.</li>
|
||||
</ol>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/mode/xml/xml.min.js"></script>
|
||||
|
||||
<script type="text/javascript" src="../../js/froala_editor.min.js" ></script>
|
||||
<script type="text/javascript" src="../../js/plugins/align.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/char_counter.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_beautifier.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_view.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/colors.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/draggable.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/emoticons.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/entities.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/file.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/font_size.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/font_family.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/fullscreen.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image_manager.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/line_breaker.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/inline_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/link.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/lists.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/paragraph_format.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/paragraph_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/quick_insert.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/quote.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/table.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/save.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/url.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/video.min.js"></script>
|
||||
|
||||
<script>
|
||||
$(function(){
|
||||
$.FroalaEditor.DefineIcon('saveSelection', {NAME: 'download'});
|
||||
$.FroalaEditor.RegisterCommand('saveSelection', {
|
||||
title: 'Save',
|
||||
focus: true,
|
||||
undo: false,
|
||||
refreshAfterCallback: false,
|
||||
callback: function () {
|
||||
this.selection.save();
|
||||
alert('selection saved');
|
||||
}
|
||||
});
|
||||
|
||||
$.FroalaEditor.DefineIcon('restoreSelection', {NAME: 'upload'});
|
||||
$.FroalaEditor.RegisterCommand('restoreSelection', {
|
||||
title: 'Restore',
|
||||
focus: true,
|
||||
undo: false,
|
||||
refreshAfterCallback: false,
|
||||
callback: function () {
|
||||
this.selection.restore();
|
||||
}
|
||||
});
|
||||
|
||||
$.FroalaEditor.DefineIcon('clearSelection', {NAME: 'trash'});
|
||||
$.FroalaEditor.RegisterCommand('clearSelection', {
|
||||
title: 'Clear',
|
||||
focus: true,
|
||||
undo: false,
|
||||
refreshAfterCallback: false,
|
||||
callback: function () {
|
||||
this.selection.clear();
|
||||
}
|
||||
});
|
||||
$('#edit').froalaEditor({
|
||||
toolbarButtons: ['saveSelection', 'restoreSelection', 'clearSelection']
|
||||
})
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,123 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0"/>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
|
||||
<link rel="stylesheet" href="../../css/froala_editor.css">
|
||||
<link rel="stylesheet" href="../../css/froala_style.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/code_view.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/colors.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/emoticons.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image_manager.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/line_breaker.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/table.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/char_counter.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/video.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/fullscreen.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/file.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/quick_insert.css">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.css">
|
||||
|
||||
<style>
|
||||
body {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
div#editor {
|
||||
width: 81%;
|
||||
margin: auto;
|
||||
text-align: left;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="editor">
|
||||
<div id='edit' style="margin-top: 30px;">
|
||||
<h1>Custom Buttons</h1>
|
||||
|
||||
<p>You can see the new buttons added after the separator in the toolbar.</p>
|
||||
|
||||
<p>Froala WYSIWYG HTML Editor covers a lot of functionalities through the default buttons. However, you might need buttons with another behavior to be integrated in the toolbar. This can be done by defining a custom command and then passing the command in the buttons list. More details about defining a custom command can be found in the <a href="https://www.froala.com/wysiwyg-editor/docs/concepts/custom/button" title="Custom Button Concept" target="_blank">Custom Button</a> concept.</p>
|
||||
|
||||
<p>After defining custom buttons you need to add them to the toolbar buttons list, using the following options: <a href="https://www.froala.com/wysiwyg-editor/docs/options#toolbarButtons" title="toolbarButtons" target="_blank">toolbarButtons</a>, <a href="https://www.froala.com/wysiwyg-editor/docs/options#toolbarButtonsMD" title="toolbarButtonsMD" target="_blank">toolbarButtonsMD</a>, <a href="https://www.froala.com/wysiwyg-editor/docs/options#toolbarButtonsSM" title="toolbarButtonsSM" target="_blank">toolbarButtonsSM</a> and <a href="https://www.froala.com/wysiwyg-editor/docs/options#toolbarButtonsXS" title="toolbarButtonsXS" target="_blank">toolbarButtonsXS</a> as explained in the <a href="https://froala.com/wysiwyg-editor/examples/custom-toolbar" title="Custom Toolbar Example" target="_blank">Custom Toolbar</a> example.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/mode/xml/xml.min.js"></script>
|
||||
|
||||
<script type="text/javascript" src="../../js/froala_editor.min.js" ></script>
|
||||
<script type="text/javascript" src="../../js/plugins/align.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/char_counter.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_beautifier.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_view.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/colors.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/draggable.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/emoticons.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/entities.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/file.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/font_size.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/font_family.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/fullscreen.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image_manager.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/line_breaker.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/inline_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/link.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/lists.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/paragraph_format.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/paragraph_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/quick_insert.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/quote.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/table.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/save.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/url.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/video.min.js"></script>
|
||||
|
||||
<script>
|
||||
$(function(){
|
||||
$.FroalaEditor.DefineIcon('alert', {NAME: 'info'});
|
||||
$.FroalaEditor.RegisterCommand('alert', {
|
||||
title: 'Hello',
|
||||
focus: false,
|
||||
undo: false,
|
||||
refreshAfterCallback: false,
|
||||
callback: function () {
|
||||
alert('Hello!');
|
||||
}
|
||||
});
|
||||
|
||||
$.FroalaEditor.DefineIcon('clear', {NAME: 'remove'});
|
||||
$.FroalaEditor.RegisterCommand('clear', {
|
||||
title: 'Clear HTML',
|
||||
focus: false,
|
||||
undo: true,
|
||||
refreshAfterCallback: true,
|
||||
callback: function () {
|
||||
this.html.set('');
|
||||
this.events.focus();
|
||||
}
|
||||
});
|
||||
|
||||
$.FroalaEditor.DefineIcon('insert', {NAME: 'plus'});
|
||||
$.FroalaEditor.RegisterCommand('insert', {
|
||||
title: 'Insert HTML',
|
||||
focus: true,
|
||||
undo: true,
|
||||
refreshAfterCallback: true,
|
||||
callback: function () {
|
||||
this.html.insert('My New HTML');
|
||||
}
|
||||
});
|
||||
|
||||
$('#edit').froalaEditor({
|
||||
toolbarButtons: ['undo', 'redo' , 'bold', '|', 'alert', 'clear', 'insert']
|
||||
})
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,113 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0"/>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
|
||||
<link rel="stylesheet" href="../../css/froala_editor.css">
|
||||
<link rel="stylesheet" href="../../css/froala_style.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/code_view.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/colors.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/emoticons.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image_manager.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/line_breaker.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/table.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/char_counter.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/video.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/fullscreen.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/file.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/quick_insert.css">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.css">
|
||||
|
||||
<style>
|
||||
body {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
div#editor {
|
||||
width: 81%;
|
||||
margin: auto;
|
||||
text-align: left;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="editor">
|
||||
<div id='edit' style="margin-top: 30px;">
|
||||
<h1>Custom Dropdown</h1>
|
||||
|
||||
<p>An example of custom dropdown for the WYSIWYG HTML editor.</p>
|
||||
|
||||
<p>More details about defining a custom dropdown can be found in the <a href="https://froala.com/wysiwyg-editor/docs/concepts/custom/dropdown" title="Custom Dropdown Concept" target="_blank">Custom Dropdown</a> concept.</p>
|
||||
|
||||
<p>After defining custom buttons you need to add them to the toolbar buttons list, using the following options: <a href="https://froala.com/wysiwyg-editor/docs/options#toolbarButtons" title="toolbarButtons" target="_blank">toolbarButtons</a>, <a href="https://froala.com/wysiwyg-editor/docs/options#toolbarButtonsMD" title="toolbarButtonsMD" target="_blank">toolbarButtonsMD</a>, <a href="https://froala.com/wysiwyg-editor/docs/options#toolbarButtonsSM" title="toolbarButtonsSM" target="_blank">toolbarButtonsSM</a> and <a href="https://froala.com/wysiwyg-editor/docs/options#toolbarButtonsXS" title="toolbarButtonsXS" target="_blank">toolbarButtonsXS</a> as explained in the <a href="https://froala.com/wysiwyg-editor/examples/custom-toolbar" title="Custom Toolbar Example" target="_blank">Custom Toolbar</a> example.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/mode/xml/xml.min.js"></script>
|
||||
|
||||
<script type="text/javascript" src="../../js/froala_editor.min.js" ></script>
|
||||
<script type="text/javascript" src="../../js/plugins/align.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/char_counter.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_beautifier.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_view.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/colors.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/draggable.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/emoticons.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/entities.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/file.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/font_size.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/font_family.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/fullscreen.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image_manager.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/line_breaker.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/inline_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/link.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/lists.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/paragraph_format.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/paragraph_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/quick_insert.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/quote.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/table.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/save.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/url.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/video.min.js"></script>
|
||||
|
||||
<script>
|
||||
$(function(){
|
||||
$.FroalaEditor.DefineIcon('my_dropdown', {NAME: 'cog'});
|
||||
$.FroalaEditor.RegisterCommand('my_dropdown', {
|
||||
title: 'Advanced options',
|
||||
type: 'dropdown',
|
||||
focus: false,
|
||||
undo: false,
|
||||
refreshAfterCallback: true,
|
||||
options: {
|
||||
'v1': 'Option 1',
|
||||
'v2': 'Option 2'
|
||||
},
|
||||
callback: function (cmd, val) {
|
||||
console.log (val);
|
||||
},
|
||||
// Callback on refresh.
|
||||
refresh: function ($btn) {
|
||||
console.log ('do refresh');
|
||||
},
|
||||
// Callback on dropdown show.
|
||||
refreshOnShow: function ($btn, $dropdown) {
|
||||
console.log ('do refresh when show');
|
||||
}
|
||||
});
|
||||
|
||||
$('#edit').froalaEditor({
|
||||
toolbarButtons: ['bold', 'italic', 'formatBlock', 'my_dropdown']
|
||||
})
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,90 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0"/>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
|
||||
<link rel="stylesheet" href="../../css/froala_editor.css">
|
||||
<link rel="stylesheet" href="../../css/froala_style.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/code_view.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/colors.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/emoticons.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image_manager.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/line_breaker.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/table.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/char_counter.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/video.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/fullscreen.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/file.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/quick_insert.css">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.css">
|
||||
|
||||
<style>
|
||||
body {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
div#editor {
|
||||
width: 81%;
|
||||
margin: auto;
|
||||
text-align: left;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="editor">
|
||||
<div id='edit' style="margin-top: 30px;">
|
||||
<h1>External Button</h1>
|
||||
|
||||
<p>This example illustrates how to clear the text using a button external to the Froala WYSIWYG HTML Editor interface.</p>
|
||||
</div>
|
||||
|
||||
<p><button id="get-text">Clear</button></p>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/mode/xml/xml.min.js"></script>
|
||||
|
||||
<script type="text/javascript" src="../../js/froala_editor.min.js" ></script>
|
||||
<script type="text/javascript" src="../../js/plugins/align.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/char_counter.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_beautifier.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_view.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/colors.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/draggable.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/emoticons.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/entities.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/file.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/font_size.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/font_family.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/fullscreen.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image_manager.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/line_breaker.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/inline_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/link.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/lists.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/paragraph_format.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/paragraph_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/quick_insert.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/quote.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/table.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/save.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/url.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/video.min.js"></script>
|
||||
|
||||
<script>
|
||||
$(function(){
|
||||
$('#edit').on('froalaEditor.initialized', function (e, editor) {
|
||||
editor.events.bindClick($('body'), 'button#get-text', function () {
|
||||
editor.html.set('');
|
||||
editor.events.focus();
|
||||
})
|
||||
}).froalaEditor()
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,85 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0"/>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
|
||||
<link rel="stylesheet" href="../../css/froala_editor.css">
|
||||
<link rel="stylesheet" href="../../css/froala_style.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/code_view.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/colors.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/emoticons.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image_manager.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/line_breaker.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/table.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/char_counter.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/video.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/fullscreen.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/file.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/quick_insert.css">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.css">
|
||||
|
||||
<style>
|
||||
body {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
div#editor {
|
||||
width: 81%;
|
||||
margin: auto;
|
||||
text-align: left;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="editor">
|
||||
<div id='edit' style="margin-top: 30px;">
|
||||
<h1>Subscript and Superscript</h1>
|
||||
|
||||
<p>To use <code>subscript</code> and <code>superscript</code>, just make sure that you include these buttons in the buttons list using the <a href="https://froala.com/wysiwyg-editor/docs/options#toolbarButtons" target="_blank" title="toolbarButtons option">toolbarButtons</a> option.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/mode/xml/xml.min.js"></script>
|
||||
|
||||
<script type="text/javascript" src="../../js/froala_editor.min.js" ></script>
|
||||
<script type="text/javascript" src="../../js/plugins/align.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/char_counter.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_beautifier.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_view.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/colors.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/draggable.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/emoticons.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/entities.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/file.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/font_size.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/font_family.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/fullscreen.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image_manager.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/line_breaker.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/inline_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/link.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/lists.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/paragraph_format.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/paragraph_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/quick_insert.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/quote.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/table.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/save.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/url.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/video.min.js"></script>
|
||||
|
||||
<script>
|
||||
$(function(){
|
||||
$('#edit').froalaEditor({
|
||||
toolbarButtons: ['bold', 'italic', '|', 'indent', 'outdent', 'formatOL', 'formatUL', '|', 'insertLink', 'insertImage', 'subscript', 'superscript']
|
||||
})
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,92 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0"/>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
|
||||
<link rel="stylesheet" href="../../css/froala_editor.css">
|
||||
<link rel="stylesheet" href="../../css/froala_style.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/code_view.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/colors.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/emoticons.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image_manager.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/line_breaker.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/table.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/video.css">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.css">
|
||||
|
||||
<style>
|
||||
body {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
div#editor {
|
||||
width: 81%;
|
||||
margin: auto;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
div#input-parent {
|
||||
background: #efefef;
|
||||
padding: 10px;
|
||||
margin-top: 30px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="editor">
|
||||
<div id='edit' style="margin-top: 30px;">
|
||||
<h1>Blur / Focus Events</h1>
|
||||
<p>This example allows you to see when the <a href="https://www.froala.com/wysiwyg-editor/docs/events#blur" title="Blur event" target="_blank">blur</a> and the <a href="https://www.froala.com/wysiwyg-editor/docs/events#focus" title="Focus event" target="_blank">focus</a> events are triggered. Open the browser console to follow the event flow.</p>
|
||||
</div>
|
||||
|
||||
<div id="input-parent">
|
||||
<p>Use the input below to test focus and blur events together with an input.</p>
|
||||
<input id="asd" type="text"><br/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/mode/xml/xml.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/froala_editor.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/align.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_beautifier.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_view.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/colors.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/draggable.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/emoticons.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/font_size.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/font_family.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image_manager.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/line_breaker.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/link.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/lists.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/paragraph_format.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/table.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/video.min.js"></script>
|
||||
|
||||
<script>
|
||||
$(function(){
|
||||
$('#edit').froalaEditor({
|
||||
enter: $.FroalaEditor.ENTER_P
|
||||
})
|
||||
.on('froalaEditor.focus', function () {
|
||||
console.log ('focus');
|
||||
})
|
||||
.on('froalaEditor.blur', function () {
|
||||
console.log ('blur');
|
||||
})
|
||||
|
||||
$('#asd').on('focus', function () {
|
||||
console.log ('input focus')
|
||||
}).on('blur', function () {
|
||||
console.log ('input blur')
|
||||
})
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,72 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0"/>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
|
||||
<link rel="stylesheet" href="../../css/froala_editor.css">
|
||||
<link rel="stylesheet" href="../../css/froala_style.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/code_view.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/colors.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/emoticons.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image_manager.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/line_breaker.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/table.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/video.css">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.css">
|
||||
|
||||
<style>
|
||||
body {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
div#editor {
|
||||
width: 81%;
|
||||
margin: auto;
|
||||
text-align: left;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="editor">
|
||||
<div id='edit' style="margin-top: 30px;">
|
||||
<h1>Content Changed Event</h1>
|
||||
<p>This example allows you to see when the <a href="https://www.froala.com/wysiwyg-editor/v2.0/docs/events#contentChanged" title="contentChanged event" target="_blank">contentChanged</a> event is triggered. Open the browser console to follow the event.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/mode/xml/xml.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/froala_editor.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/align.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_beautifier.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_view.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/draggable.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/colors.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/emoticons.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/font_size.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/font_family.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image_manager.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/line_breaker.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/link.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/lists.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/inline_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/table.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/video.min.js"></script>
|
||||
|
||||
<script>
|
||||
$(function(){
|
||||
$('#edit').froalaEditor({
|
||||
enter: $.FroalaEditor.ENTER_P
|
||||
})
|
||||
.on ('froalaEditor.contentChanged', function () {
|
||||
console.log ('content changed');
|
||||
})
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,103 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0"/>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
|
||||
<link rel="stylesheet" href="../../css/froala_editor.css">
|
||||
<link rel="stylesheet" href="../../css/froala_style.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/code_view.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/colors.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/emoticons.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image_manager.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/line_breaker.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/table.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/video.css">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.css">
|
||||
|
||||
<style>
|
||||
body {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
div#editor {
|
||||
width: 81%;
|
||||
margin: auto;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
div#dragme {
|
||||
border: solid 1px #CCC;
|
||||
display: inline-block;
|
||||
padding: 10px;
|
||||
background: #efefef;
|
||||
}
|
||||
|
||||
[draggable=true] {
|
||||
-khtml-user-drag: element;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="editor">
|
||||
<div id="dragme" draggable="true">
|
||||
Drag & Drop me inside the editor
|
||||
</div>
|
||||
<div id='edit' style="margin-top: 30px;">
|
||||
<h1>Drop Event</h1>
|
||||
<p>Drag & Drop the box above into the editable area to see the <a href="https://www.froala.com/wysiwyg-editor/docs/events#drop" title="Drop Event">drop</a> event being triggered. Don't forget to open the browser console to follow the event.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/mode/xml/xml.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/froala_editor.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/align.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_beautifier.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_view.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/colors.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/draggable.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/emoticons.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/font_size.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/font_family.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/line_breaker.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/link.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/lists.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/inline_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/table.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/video.min.js"></script>
|
||||
|
||||
<script>
|
||||
$(function(){
|
||||
$('#edit').froalaEditor({
|
||||
enter: $.FroalaEditor.ENTER_P
|
||||
})
|
||||
.on ('froalaEditor.drop', function (e, editor, dropEvent) {
|
||||
console.log ('drop')
|
||||
|
||||
// Focus at the current posisiton.
|
||||
editor.markers.insertAtPoint(dropEvent.originalEvent);
|
||||
var $marker = editor.$el.find('.fr-marker');
|
||||
$marker.replaceWith($.FroalaEditor.MARKERS);
|
||||
editor.selection.restore();
|
||||
|
||||
// Insert HTML.
|
||||
editor.html.insert('Element dropped here.')
|
||||
|
||||
|
||||
dropEvent.preventDefault();
|
||||
dropEvent.stopPropagation();
|
||||
return false;
|
||||
})
|
||||
|
||||
// For Firefox to work.
|
||||
$('#dragme').on('dragstart', function (e) {
|
||||
e.originalEvent.dataTransfer.setData('Text', this.id);
|
||||
})
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,76 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0"/>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
|
||||
<link rel="stylesheet" href="../../css/froala_editor.css">
|
||||
<link rel="stylesheet" href="../../css/froala_style.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/code_view.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/colors.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/emoticons.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image_manager.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/line_breaker.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/table.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/video.css">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.css">
|
||||
|
||||
<style>
|
||||
body {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
div#editor {
|
||||
width: 81%;
|
||||
margin: auto;
|
||||
text-align: left;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="editor">
|
||||
<div id='edit' style="margin-top: 30px;">
|
||||
<h1>Image Removed event</h1>
|
||||
<p>In this example you can see how the <a href="https://www.froala.com/wysiwyg-editor/docs/events#image.removed" title="image.removed">image.removed</a> event is fired. Don't forget to open the browser console.</p>
|
||||
|
||||
<img class="fr-fir fr-dii" src="../../img/photo1.jpg" alt="Old Clock" width="300"/>Lorem <strong>ipsum</strong> dolor sit amet, consectetur <strong>adipiscing <em>elit.</em> Donec</strong> facilisis diam in odio iaculis blandit. Nunc eu mauris sit amet purus <strong>viverra</strong><em> gravida</em> ut a dui.<br/>
|
||||
<ul><li>Vivamus nec rutrum augue, pharetra faucibus purus. Maecenas non orci sagittis, vehicula lorem et, dignissim nunc.</li> <li>Suspendisse suscipit, diam non varius facilisis, enim libero tincidunt magna, sit amet iaculis eros libero sit amet eros. Vestibulum a rhoncus felis.<ol><li>Nam lacus nulla, consequat ac lacus sit amet, accumsan pellentesque risus. Aenean viverra mi at urna mattis fermentum.</li> <li>Curabitur porta metus in tortor elementum, in semper nulla ullamcorper. Vestibulum mattis tempor tortor quis gravida. In rhoncus risus nibh. Nullam condimentum dapibus massa vel fringilla. Sed hendrerit sed est quis facilisis. Ut sit amet nibh sem. Pellentesque imperdiet mollis libero.</li></ol></li></ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/mode/xml/xml.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/froala_editor.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/align.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_beautifier.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_view.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/colors.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/draggable.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/emoticons.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/font_size.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/font_family.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image_manager.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/line_breaker.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/link.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/lists.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/inline_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/table.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/video.min.js"></script>
|
||||
|
||||
<script>
|
||||
$(function(){
|
||||
$('#edit').froalaEditor({
|
||||
enter: $.FroalaEditor.ENTER_P
|
||||
})
|
||||
.on ('froalaEditor.image.removed', function (e, editor, $img) {
|
||||
console.log ('image removed', $img);
|
||||
console.log ('image src', $img.attr('src'))
|
||||
})
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,87 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0"/>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
|
||||
<link rel="stylesheet" href="../../css/froala_editor.css">
|
||||
<link rel="stylesheet" href="../../css/froala_style.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/code_view.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image_manager.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/table.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/video.css">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.css">
|
||||
|
||||
|
||||
<style>
|
||||
body {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
div#editor {
|
||||
width: 81%;
|
||||
margin: auto;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
div#buttons {
|
||||
margin-top: 30px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="buttons">
|
||||
<button id="init">Init Editor</button>
|
||||
<button id="destroy">Destroy Editor</button>
|
||||
</div>
|
||||
|
||||
<div id="editor">
|
||||
<div id='edit' style="margin-top: 30px;">
|
||||
<h1>Initialized / Destroy Events</h1>
|
||||
<p>This example allows you to see when the <a href="https://www.froala.com/wysiwyg-editor/v2.0/docs/events#initialized" title="Initialized Event" target="_blank">initialized</a> and <a href="https://www.froala.com/wysiwyg-editor/v2.0/docs/events#destroy" title="Destroy Event" target="_blank">destroy</a> events are triggered. Open the browser console to follow the events.</p>
|
||||
<p>You can destroy and initialize the editor again to see the events being triggered.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/mode/xml/xml.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/froala_editor.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/align.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_beautifier.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_view.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/draggable.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image_manager.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/link.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/lists.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/paragraph_format.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/paragraph_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/table.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/video.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/url.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/entities.min.js"></script>
|
||||
|
||||
<script>
|
||||
$(function(){
|
||||
$('#init').on('click', function(e) {
|
||||
$('#edit').on('froalaEditor.initialized', function (e, editor) {
|
||||
console.log('Initialized')
|
||||
})
|
||||
|
||||
$('#edit').removeClass('fr-view').froalaEditor();
|
||||
})
|
||||
$('#destroy').on('click', function (e) {
|
||||
$('#edit').on('froalaEditor.destroy', function (e, editor) {
|
||||
console.log('Destroy')
|
||||
})
|
||||
|
||||
$('#edit').froalaEditor('destroy');
|
||||
$('#edit').addClass('fr-view');
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,182 @@
|
||||
<?php
|
||||
// Set date timezone.
|
||||
date_default_timezone_set('Europe/Bucharest');
|
||||
|
||||
// important variables that will be used throughout this example
|
||||
$bucket = 'froala-dev';
|
||||
$region = 's3';
|
||||
$keyStart = 'editor/';
|
||||
$acl = 'public-read';
|
||||
|
||||
// these can be found on your Account page, under Security Credentials > Access Keys
|
||||
$accessKeyId = $_SERVER['AWS_ACCESS_KEY'];
|
||||
$secret = $_SERVER['AWS_SECRET_ACCESS_KEY'];
|
||||
|
||||
$policy = base64_encode(json_encode(array(
|
||||
// ISO 8601 - date('c'); generates uncompatible date, so better do it manually
|
||||
'expiration' => date('Y-m-d\TH:i:s.000\Z', strtotime('+1 day')),
|
||||
'conditions' => array(
|
||||
array('bucket' => $bucket),
|
||||
array('acl' => $acl),
|
||||
array('success_action_status' => '201'),
|
||||
array('x-requested-with' => 'xhr'),
|
||||
array('starts-with', '$key', $keyStart),
|
||||
array('starts-with', '$Content-Type', '') // accept all files
|
||||
)
|
||||
)));
|
||||
|
||||
$signature = base64_encode(hash_hmac('sha1', $policy, $secret, true));
|
||||
?>
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0"/>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
|
||||
<link rel="stylesheet" href="../css/froala_editor.css">
|
||||
<link rel="stylesheet" href="../css/froala_style.css">
|
||||
<link rel="stylesheet" href="../css/plugins/code_view.css">
|
||||
<link rel="stylesheet" href="../css/plugins/colors.css">
|
||||
<link rel="stylesheet" href="../css/plugins/emoticons.css">
|
||||
<link rel="stylesheet" href="../css/plugins/image_manager.css">
|
||||
<link rel="stylesheet" href="../css/plugins/image.css">
|
||||
<link rel="stylesheet" href="../css/plugins/line_breaker.css">
|
||||
<link rel="stylesheet" href="../css/plugins/table.css">
|
||||
<link rel="stylesheet" href="../css/plugins/char_counter.css">
|
||||
<link rel="stylesheet" href="../css/plugins/video.css">
|
||||
<link rel="stylesheet" href="../css/plugins/file.css">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.css">
|
||||
|
||||
<style>
|
||||
body {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
div#editor {
|
||||
width: 81%;
|
||||
margin: auto;
|
||||
text-align: left;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="editor">
|
||||
<div id='edit' style="margin-top: 30px;">
|
||||
<h1>Click and edit</h1>
|
||||
|
||||
<img class="fr-fir fr-dii" src="../img/photo1.jpg" alt="Old Clock" width="300"/>Lorem <strong>ipsum</strong> dolor sit amet, consectetur <strong>adipiscing <em>elit.</em> Donec</strong> facilisis diam in odio iaculis blandit. Nunc eu mauris sit amet purus <strong>viverra</strong><em> gravida</em> ut a dui.<br/>
|
||||
<ul><li>Vivamus nec rutrum augue, pharetra faucibus purus. Maecenas non orci sagittis, vehicula lorem et, dignissim nunc.</li> <li>Suspendisse suscipit, diam non varius facilisis, enim libero tincidunt magna, sit amet iaculis eros libero sit amet eros. Vestibulum a rhoncus felis.<ol><li>Nam lacus nulla, consequat ac lacus sit amet, accumsan pellentesque risus. Aenean viverra mi at urna mattis fermentum.</li> <li>Curabitur porta metus in tortor elementum, in semper nulla ullamcorper. Vestibulum mattis tempor tortor quis gravida. In rhoncus risus nibh. Nullam condimentum dapibus massa vel fringilla. Sed hendrerit sed est quis facilisis. Ut sit amet nibh sem. Pellentesque imperdiet mollis libero.</li></ol></li></ul>
|
||||
|
||||
<table style="width: 100%;">
|
||||
<tr><td>asdasd</td><td>asdasdasd</td></tr>
|
||||
</table>
|
||||
|
||||
Sed dictum dictum tristique. Proin eros turpis, ultricies eu sapien eget, ornare rutrum ipsum. Pellentesque eros nisl, ornare nec ipsum sed, aliquet sollicitudin erat. Nulla tincidunt porta <strong>vehicula.</strong><br/>
|
||||
|
||||
<a href="http://google.com" title="Aenean sed hendrerit">Aenean sed hendrerit</a> velit. Nullam eu mi dolor. Maecenas et erat risus. Nulla ac auctor diam, non aliquet ante. Fusce ullamcorper, ipsum id tempor lacinia, sem tellus malesuada libero, quis ornare sem massa in orci. Sed dictum dictum tristique. Proin eros turpis, ultricies eu sapien eget, ornare rutrum ipsum. Pellentesque eros nisl, ornare nec ipsum sed, aliquet sollicitudin erat. Nulla tincidunt porta <strong>vehicula.</strong><br/>
|
||||
|
||||
<i>Nullam laoreet</i> imperdiet orci ac euismod. Curabitur vel lectus nisi. Phasellus accumsan aliquet augue, eu rutrum tellus iaculis in. Nunc viverra ultrices mollis. Curabitur malesuada nunc massa, ut imperdiet arcu lobortis sed. Cras ac arcu mauris. Maecenas id lectus nisl. Donec consectetur scelerisque quam at ultricies. Nam quis magna iaculis, condimentum metus ut, elementum metus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vivamus id tempus nisi.<br/>
|
||||
</div>
|
||||
|
||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam pretium efficitur lectus, porttitor ornare dolor luctus eu. Vivamus auctor nunc non vestibulum tempor. Integer tristique massa sit amet mi auctor euismod. In finibus nec purus et volutpat. Nullam consectetur est id lorem posuere, quis blandit eros dignissim. Curabitur fringilla iaculis est sed porttitor. Duis in nisi felis.
|
||||
|
||||
Suspendisse ex sem, eleifend vitae felis eu, finibus malesuada odio. Duis eget risus in sem facilisis venenatis eget nec turpis. Aliquam ac sapien dictum, tempor libero sed, feugiat odio. Mauris bibendum nisi justo, eu pulvinar neque tempor ac. Vivamus suscipit in elit interdum euismod. Etiam porta molestie lobortis. Nam consectetur malesuada ante non sagittis. Nunc nec odio ex. Duis non hendrerit diam. Integer vulputate, mi a gravida pretium, ligula libero laoreet libero, in vestibulum arcu velit at velit.
|
||||
|
||||
Suspendisse at neque commodo, sollicitudin lectus sed, blandit sem. Curabitur pharetra suscipit elit ac ultrices. Quisque ullamcorper quis massa et fringilla. Donec euismod, metus id porttitor semper, tortor velit accumsan metus, ut malesuada risus elit eu lorem. Mauris magna odio, efficitur et elit eu, suscipit fermentum sapien. Donec lacinia aliquet augue eu convallis. Suspendisse tincidunt lacus ac ipsum mattis malesuada. Curabitur pellentesque nec nulla ut commodo. Suspendisse pretium nunc in risus iaculis dignissim. Donec faucibus tempus lectus, vel ultrices lectus tincidunt et. Mauris pulvinar ut est in iaculis. Maecenas facilisis enim nec pharetra mattis. Aliquam laoreet egestas lacus, et porta nisl. Ut euismod laoreet purus sed eleifend. Vivamus ullamcorper sodales arcu, sit amet accumsan augue placerat semper. Duis condimentum mattis nulla sed consequat.
|
||||
|
||||
Donec non dui ligula. Aliquam id efficitur massa. Donec tristique aliquet dolor, quis rhoncus felis dignissim sit amet. Duis pellentesque orci eget rhoncus lacinia. Ut dapibus neque id ex fringilla, vitae lobortis turpis interdum. Donec mi lectus, finibus id placerat ut, molestie sit amet erat. Vivamus laoreet semper dui, id efficitur eros. Etiam mollis a nisi a ullamcorper. Vivamus ut porta odio. Maecenas dictum dignissim faucibus. Vestibulum lectus lacus, tempus pulvinar fermentum in, suscipit eget ex. Sed mollis non libero at dignissim. Curabitur non justo vel dui convallis feugiat. Suspendisse quis dictum augue, et pharetra arcu.
|
||||
|
||||
Curabitur sem purus, sagittis quis lorem ac, iaculis laoreet lacus. Fusce eleifend congue massa a ornare. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque sodales, tortor ut hendrerit lacinia, velit metus commodo libero, eu consequat est metus sit amet odio. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Pellentesque eu sem vehicula, vulputate est sit amet, mattis nisi. Nullam consequat at turpis vitae pretium. Nulla risus velit, pharetra ac sollicitudin sed, volutpat nec felis.
|
||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam pretium efficitur lectus, porttitor ornare dolor luctus eu. Vivamus auctor nunc non vestibulum tempor. Integer tristique massa sit amet mi auctor euismod. In finibus nec purus et volutpat. Nullam consectetur est id lorem posuere, quis blandit eros dignissim. Curabitur fringilla iaculis est sed porttitor. Duis in nisi felis.
|
||||
|
||||
Suspendisse ex sem, eleifend vitae felis eu, finibus malesuada odio. Duis eget risus in sem facilisis venenatis eget nec turpis. Aliquam ac sapien dictum, tempor libero sed, feugiat odio. Mauris bibendum nisi justo, eu pulvinar neque tempor ac. Vivamus suscipit in elit interdum euismod. Etiam porta molestie lobortis. Nam consectetur malesuada ante non sagittis. Nunc nec odio ex. Duis non hendrerit diam. Integer vulputate, mi a gravida pretium, ligula libero laoreet libero, in vestibulum arcu velit at velit.
|
||||
|
||||
Suspendisse at neque commodo, sollicitudin lectus sed, blandit sem. Curabitur pharetra suscipit elit ac ultrices. Quisque ullamcorper quis massa et fringilla. Donec euismod, metus id porttitor semper, tortor velit accumsan metus, ut malesuada risus elit eu lorem. Mauris magna odio, efficitur et elit eu, suscipit fermentum sapien. Donec lacinia aliquet augue eu convallis. Suspendisse tincidunt lacus ac ipsum mattis malesuada. Curabitur pellentesque nec nulla ut commodo. Suspendisse pretium nunc in risus iaculis dignissim. Donec faucibus tempus lectus, vel ultrices lectus tincidunt et. Mauris pulvinar ut est in iaculis. Maecenas facilisis enim nec pharetra mattis. Aliquam laoreet egestas lacus, et porta nisl. Ut euismod laoreet purus sed eleifend. Vivamus ullamcorper sodales arcu, sit amet accumsan augue placerat semper. Duis condimentum mattis nulla sed consequat.
|
||||
|
||||
Donec non dui ligula. Aliquam id efficitur massa. Donec tristique aliquet dolor, quis rhoncus felis dignissim sit amet. Duis pellentesque orci eget rhoncus lacinia. Ut dapibus neque id ex fringilla, vitae lobortis turpis interdum. Donec mi lectus, finibus id placerat ut, molestie sit amet erat. Vivamus laoreet semper dui, id efficitur eros. Etiam mollis a nisi a ullamcorper. Vivamus ut porta odio. Maecenas dictum dignissim faucibus. Vestibulum lectus lacus, tempus pulvinar fermentum in, suscipit eget ex. Sed mollis non libero at dignissim. Curabitur non justo vel dui convallis feugiat. Suspendisse quis dictum augue, et pharetra arcu.
|
||||
|
||||
Curabitur sem purus, sagittis quis lorem ac, iaculis laoreet lacus. Fusce eleifend congue massa a ornare. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque sodales, tortor ut hendrerit lacinia, velit metus commodo libero, eu consequat est metus sit amet odio. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Pellentesque eu sem vehicula, vulputate est sit amet, mattis nisi. Nullam consequat at turpis vitae pretium. Nulla risus velit, pharetra ac sollicitudin sed, volutpat nec felis.
|
||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam pretium efficitur lectus, porttitor ornare dolor luctus eu. Vivamus auctor nunc non vestibulum tempor. Integer tristique massa sit amet mi auctor euismod. In finibus nec purus et volutpat. Nullam consectetur est id lorem posuere, quis blandit eros dignissim. Curabitur fringilla iaculis est sed porttitor. Duis in nisi felis.
|
||||
|
||||
Suspendisse ex sem, eleifend vitae felis eu, finibus malesuada odio. Duis eget risus in sem facilisis venenatis eget nec turpis. Aliquam ac sapien dictum, tempor libero sed, feugiat odio. Mauris bibendum nisi justo, eu pulvinar neque tempor ac. Vivamus suscipit in elit interdum euismod. Etiam porta molestie lobortis. Nam consectetur malesuada ante non sagittis. Nunc nec odio ex. Duis non hendrerit diam. Integer vulputate, mi a gravida pretium, ligula libero laoreet libero, in vestibulum arcu velit at velit.
|
||||
|
||||
Suspendisse at neque commodo, sollicitudin lectus sed, blandit sem. Curabitur pharetra suscipit elit ac ultrices. Quisque ullamcorper quis massa et fringilla. Donec euismod, metus id porttitor semper, tortor velit accumsan metus, ut malesuada risus elit eu lorem. Mauris magna odio, efficitur et elit eu, suscipit fermentum sapien. Donec lacinia aliquet augue eu convallis. Suspendisse tincidunt lacus ac ipsum mattis malesuada. Curabitur pellentesque nec nulla ut commodo. Suspendisse pretium nunc in risus iaculis dignissim. Donec faucibus tempus lectus, vel ultrices lectus tincidunt et. Mauris pulvinar ut est in iaculis. Maecenas facilisis enim nec pharetra mattis. Aliquam laoreet egestas lacus, et porta nisl. Ut euismod laoreet purus sed eleifend. Vivamus ullamcorper sodales arcu, sit amet accumsan augue placerat semper. Duis condimentum mattis nulla sed consequat.
|
||||
|
||||
Donec non dui ligula. Aliquam id efficitur massa. Donec tristique aliquet dolor, quis rhoncus felis dignissim sit amet. Duis pellentesque orci eget rhoncus lacinia. Ut dapibus neque id ex fringilla, vitae lobortis turpis interdum. Donec mi lectus, finibus id placerat ut, molestie sit amet erat. Vivamus laoreet semper dui, id efficitur eros. Etiam mollis a nisi a ullamcorper. Vivamus ut porta odio. Maecenas dictum dignissim faucibus. Vestibulum lectus lacus, tempus pulvinar fermentum in, suscipit eget ex. Sed mollis non libero at dignissim. Curabitur non justo vel dui convallis feugiat. Suspendisse quis dictum augue, et pharetra arcu.
|
||||
|
||||
Curabitur sem purus, sagittis quis lorem ac, iaculis laoreet lacus. Fusce eleifend congue massa a ornare. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque sodales, tortor ut hendrerit lacinia, velit metus commodo libero, eu consequat est metus sit amet odio. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Pellentesque eu sem vehicula, vulputate est sit amet, mattis nisi. Nullam consequat at turpis vitae pretium. Nulla risus velit, pharetra ac sollicitudin sed, volutpat nec felis.
|
||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam pretium efficitur lectus, porttitor ornare dolor luctus eu. Vivamus auctor nunc non vestibulum tempor. Integer tristique massa sit amet mi auctor euismod. In finibus nec purus et volutpat. Nullam consectetur est id lorem posuere, quis blandit eros dignissim. Curabitur fringilla iaculis est sed porttitor. Duis in nisi felis.
|
||||
|
||||
Suspendisse ex sem, eleifend vitae felis eu, finibus malesuada odio. Duis eget risus in sem facilisis venenatis eget nec turpis. Aliquam ac sapien dictum, tempor libero sed, feugiat odio. Mauris bibendum nisi justo, eu pulvinar neque tempor ac. Vivamus suscipit in elit interdum euismod. Etiam porta molestie lobortis. Nam consectetur malesuada ante non sagittis. Nunc nec odio ex. Duis non hendrerit diam. Integer vulputate, mi a gravida pretium, ligula libero laoreet libero, in vestibulum arcu velit at velit.
|
||||
|
||||
Suspendisse at neque commodo, sollicitudin lectus sed, blandit sem. Curabitur pharetra suscipit elit ac ultrices. Quisque ullamcorper quis massa et fringilla. Donec euismod, metus id porttitor semper, tortor velit accumsan metus, ut malesuada risus elit eu lorem. Mauris magna odio, efficitur et elit eu, suscipit fermentum sapien. Donec lacinia aliquet augue eu convallis. Suspendisse tincidunt lacus ac ipsum mattis malesuada. Curabitur pellentesque nec nulla ut commodo. Suspendisse pretium nunc in risus iaculis dignissim. Donec faucibus tempus lectus, vel ultrices lectus tincidunt et. Mauris pulvinar ut est in iaculis. Maecenas facilisis enim nec pharetra mattis. Aliquam laoreet egestas lacus, et porta nisl. Ut euismod laoreet purus sed eleifend. Vivamus ullamcorper sodales arcu, sit amet accumsan augue placerat semper. Duis condimentum mattis nulla sed consequat.
|
||||
|
||||
Donec non dui ligula. Aliquam id efficitur massa. Donec tristique aliquet dolor, quis rhoncus felis dignissim sit amet. Duis pellentesque orci eget rhoncus lacinia. Ut dapibus neque id ex fringilla, vitae lobortis turpis interdum. Donec mi lectus, finibus id placerat ut, molestie sit amet erat. Vivamus laoreet semper dui, id efficitur eros. Etiam mollis a nisi a ullamcorper. Vivamus ut porta odio. Maecenas dictum dignissim faucibus. Vestibulum lectus lacus, tempus pulvinar fermentum in, suscipit eget ex. Sed mollis non libero at dignissim. Curabitur non justo vel dui convallis feugiat. Suspendisse quis dictum augue, et pharetra arcu.
|
||||
|
||||
Curabitur sem purus, sagittis quis lorem ac, iaculis laoreet lacus. Fusce eleifend congue massa a ornare. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque sodales, tortor ut hendrerit lacinia, velit metus commodo libero, eu consequat est metus sit amet odio. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Pellentesque eu sem vehicula, vulputate est sit amet, mattis nisi. Nullam consequat at turpis vitae pretium. Nulla risus velit, pharetra ac sollicitudin sed, volutpat nec felis.
|
||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam pretium efficitur lectus, porttitor ornare dolor luctus eu. Vivamus auctor nunc non vestibulum tempor. Integer tristique massa sit amet mi auctor euismod. In finibus nec purus et volutpat. Nullam consectetur est id lorem posuere, quis blandit eros dignissim. Curabitur fringilla iaculis est sed porttitor. Duis in nisi felis.
|
||||
|
||||
Suspendisse ex sem, eleifend vitae felis eu, finibus malesuada odio. Duis eget risus in sem facilisis venenatis eget nec turpis. Aliquam ac sapien dictum, tempor libero sed, feugiat odio. Mauris bibendum nisi justo, eu pulvinar neque tempor ac. Vivamus suscipit in elit interdum euismod. Etiam porta molestie lobortis. Nam consectetur malesuada ante non sagittis. Nunc nec odio ex. Duis non hendrerit diam. Integer vulputate, mi a gravida pretium, ligula libero laoreet libero, in vestibulum arcu velit at velit.
|
||||
|
||||
Suspendisse at neque commodo, sollicitudin lectus sed, blandit sem. Curabitur pharetra suscipit elit ac ultrices. Quisque ullamcorper quis massa et fringilla. Donec euismod, metus id porttitor semper, tortor velit accumsan metus, ut malesuada risus elit eu lorem. Mauris magna odio, efficitur et elit eu, suscipit fermentum sapien. Donec lacinia aliquet augue eu convallis. Suspendisse tincidunt lacus ac ipsum mattis malesuada. Curabitur pellentesque nec nulla ut commodo. Suspendisse pretium nunc in risus iaculis dignissim. Donec faucibus tempus lectus, vel ultrices lectus tincidunt et. Mauris pulvinar ut est in iaculis. Maecenas facilisis enim nec pharetra mattis. Aliquam laoreet egestas lacus, et porta nisl. Ut euismod laoreet purus sed eleifend. Vivamus ullamcorper sodales arcu, sit amet accumsan augue placerat semper. Duis condimentum mattis nulla sed consequat.
|
||||
|
||||
Donec non dui ligula. Aliquam id efficitur massa. Donec tristique aliquet dolor, quis rhoncus felis dignissim sit amet. Duis pellentesque orci eget rhoncus lacinia. Ut dapibus neque id ex fringilla, vitae lobortis turpis interdum. Donec mi lectus, finibus id placerat ut, molestie sit amet erat. Vivamus laoreet semper dui, id efficitur eros. Etiam mollis a nisi a ullamcorper. Vivamus ut porta odio. Maecenas dictum dignissim faucibus. Vestibulum lectus lacus, tempus pulvinar fermentum in, suscipit eget ex. Sed mollis non libero at dignissim. Curabitur non justo vel dui convallis feugiat. Suspendisse quis dictum augue, et pharetra arcu.
|
||||
|
||||
Curabitur sem purus, sagittis quis lorem ac, iaculis laoreet lacus. Fusce eleifend congue massa a ornare. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque sodales, tortor ut hendrerit lacinia, velit metus commodo libero, eu consequat est metus sit amet odio. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Pellentesque eu sem vehicula, vulputate est sit amet, mattis nisi. Nullam consequat at turpis vitae pretium. Nulla risus velit, pharetra ac sollicitudin sed, volutpat nec felis.
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/mode/xml/xml.min.js"></script>
|
||||
<script type="text/javascript" src="../js/froala_editor.min.js"></script>
|
||||
<script type="text/javascript" src="../js/plugins/align.min.js"></script>
|
||||
<script type="text/javascript" src="../js/plugins/code_beautifier.min.js"></script>
|
||||
<script type="text/javascript" src="../js/plugins/code_view.min.js"></script>
|
||||
<script type="text/javascript" src="../js/plugins/colors.min.js"></script>
|
||||
<script type="text/javascript" src="../js/plugins/draggable.min.js"></script>
|
||||
<script type="text/javascript" src="../js/plugins/emoticons.min.js"></script>
|
||||
<script type="text/javascript" src="../js/plugins/font_size.min.js"></script>
|
||||
<script type="text/javascript" src="../js/plugins/font_family.min.js"></script>
|
||||
<script type="text/javascript" src="../js/plugins/image.min.js"></script>
|
||||
<script type="text/javascript" src="../js/plugins/image_manager.min.js"></script>
|
||||
<script type="text/javascript" src="../js/plugins/line_breaker.min.js"></script>
|
||||
<script type="text/javascript" src="../js/plugins/link.min.js"></script>
|
||||
<script type="text/javascript" src="../js/plugins/lists.min.js"></script>
|
||||
<script type="text/javascript" src="../js/plugins/paragraph_format.min.js"></script>
|
||||
<script type="text/javascript" src="../js/plugins/paragraph_style.min.js"></script>
|
||||
<script type="text/javascript" src="../js/plugins/video.min.js"></script>
|
||||
<script type="text/javascript" src="../js/plugins/table.min.js"></script>
|
||||
<script type="text/javascript" src="../js/plugins/url.min.js"></script>
|
||||
<script type="text/javascript" src="../js/plugins/entities.min.js"></script>
|
||||
<script type="text/javascript" src="../js/plugins/char_counter.min.js"></script>
|
||||
<script type="text/javascript" src="../js/plugins/inline_style.min.js"></script>
|
||||
<script type="text/javascript" src="../js/plugins/save.min.js"></script>
|
||||
<script type="text/javascript" src="../js/plugins/file.min.js"></script>
|
||||
<script type="text/javascript" src="../js/languages/ro.js"></script>
|
||||
|
||||
<script>
|
||||
$(function(){
|
||||
$('#edit').froalaEditor({
|
||||
enter: $.FroalaEditor.ENTER_P,
|
||||
fileUploadToS3: {
|
||||
bucket: '<?php echo $bucket; ?>',
|
||||
region: '<?php echo $region; ?>',
|
||||
keyStart: '<?php echo $keyStart; ?>',
|
||||
params: {
|
||||
acl: '<?php echo $acl; ?>',
|
||||
AWSAccessKeyId: '<?php echo $accessKeyId; ?>',
|
||||
policy: '<?php echo $policy; ?>',
|
||||
signature: '<?php echo $signature; ?>',
|
||||
}
|
||||
}
|
||||
})
|
||||
.on('froala.file.uploadedToS3', function (e, editor, link, key, response) {
|
||||
console.log ('S3 Link:', link);
|
||||
console.log ('S3 Key:', key);
|
||||
})
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,102 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0"/>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
|
||||
<link rel="stylesheet" href="../../css/froala_editor.css">
|
||||
<link rel="stylesheet" href="../../css/froala_style.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/code_view.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/colors.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/emoticons.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image_manager.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/line_breaker.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/table.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/char_counter.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/video.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/fullscreen.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/file.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/quick_insert.css">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.css">
|
||||
|
||||
<style>
|
||||
body {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
div#editor {
|
||||
width: 81%;
|
||||
margin: auto;
|
||||
text-align: left;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="editor">
|
||||
<div id='edit' style="margin-top: 30px;">
|
||||
<img class="fr-fir fr-dii" src="../../img/photo1.jpg" alt="Old Clock" width="200"/>
|
||||
<h1>Custom Image Button</h1>
|
||||
|
||||
<p>Click on the image to see the custom image button.</p>
|
||||
|
||||
<p>An example of custom button for the image editing popup. More details about defining a custom image button can be found in the <a href="https://www.froala.com/wysiwyg-editor/docs/concepts/custom/button" title="Custom Button Concept" target="_blank">Custom Button</a> concept.</p>
|
||||
|
||||
<p>After defining custom buttons you need to add them to the image popup buttons list, using the <a href="https://www.froala.com/wysiwyg-editor/docs/options#imageEditButtons" title="imageEditButtons" target="_blank">imageEditButtons</a> option.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/mode/xml/xml.min.js"></script>
|
||||
|
||||
<script type="text/javascript" src="../../js/froala_editor.min.js" ></script>
|
||||
<script type="text/javascript" src="../../js/plugins/align.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/char_counter.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_beautifier.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_view.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/colors.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/draggable.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/emoticons.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/entities.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/file.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/font_size.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/font_family.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/fullscreen.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image_manager.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/line_breaker.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/inline_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/link.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/lists.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/paragraph_format.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/paragraph_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/quick_insert.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/quote.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/table.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/save.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/url.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/video.min.js"></script>
|
||||
|
||||
<script>
|
||||
$(function(){
|
||||
$.FroalaEditor.DefineIcon('imageInfo', {NAME: 'info'});
|
||||
$.FroalaEditor.RegisterCommand('imageInfo', {
|
||||
title: 'Info',
|
||||
focus: false,
|
||||
undo: false,
|
||||
refreshAfterCallback: false,
|
||||
callback: function () {
|
||||
var $img = this.image.get();
|
||||
alert($img.attr('src'));
|
||||
}
|
||||
});
|
||||
|
||||
$('#edit').froalaEditor({
|
||||
imageEditButtons: ['imageDisplay', 'imageAlign', 'imageInfo', 'imageRemove']
|
||||
})
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,96 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0"/>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
|
||||
<link rel="stylesheet" href="../../css/froala_editor.css">
|
||||
<link rel="stylesheet" href="../../css/froala_style.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/code_view.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/colors.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/emoticons.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image_manager.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/line_breaker.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/table.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/char_counter.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/video.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/fullscreen.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/file.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/quick_insert.css">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.css">
|
||||
|
||||
<style>
|
||||
body {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
div#editor {
|
||||
width: 81%;
|
||||
margin: auto;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.class1 {
|
||||
border-radius: 10%;
|
||||
border: 2px solid #efefef;
|
||||
}
|
||||
|
||||
.class2 {
|
||||
opacity: 0.5;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="editor">
|
||||
<div id='edit' style="margin-top: 30px;">
|
||||
<h1>Default Width</h1>
|
||||
|
||||
<p>Images inserted in the editor have a default width of 300px. This can be changed using the <a href="https://www.froala.com/wysiwyg-editor/docs/options#imageDefaultWidth" title="Image Default Width option">imageDefaultWidth</a> option.</p>
|
||||
|
||||
<p>Setting this option to 0 will not set any width to the inserted image.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/mode/xml/xml.min.js"></script>
|
||||
|
||||
<script type="text/javascript" src="../../js/froala_editor.min.js" ></script>
|
||||
<script type="text/javascript" src="../../js/plugins/align.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/char_counter.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_beautifier.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_view.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/colors.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/draggable.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/emoticons.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/entities.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/file.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/font_size.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/font_family.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/fullscreen.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image_manager.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/line_breaker.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/inline_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/link.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/lists.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/paragraph_format.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/paragraph_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/quick_insert.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/quote.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/table.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/save.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/url.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/video.min.js"></script>
|
||||
|
||||
<script>
|
||||
$(function(){
|
||||
$('#edit').froalaEditor({
|
||||
imageDefaultWidth: 0
|
||||
})
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,103 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0"/>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
|
||||
<link rel="stylesheet" href="../../css/froala_editor.css">
|
||||
<link rel="stylesheet" href="../../css/froala_style.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/code_view.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/colors.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/emoticons.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image_manager.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/line_breaker.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/table.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/char_counter.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/video.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/fullscreen.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/file.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/quick_insert.css">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.css">
|
||||
|
||||
<style>
|
||||
body {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
div#editor {
|
||||
width: 81%;
|
||||
margin: auto;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.class1 {
|
||||
border-radius: 10%;
|
||||
border: 2px solid #efefef;
|
||||
}
|
||||
|
||||
.class2 {
|
||||
opacity: 0.5;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="editor">
|
||||
<div id='edit' style="margin-top: 30px;">
|
||||
<h1>Image Styles</h1>
|
||||
|
||||
<p>The classes should be defined in CSS, otherwise no changes will be visible on the image's appearance.</p>
|
||||
|
||||
<img class="fr-fil fr-dii" src="../../img/photo1.jpg" alt="Old Clock" width="200"/>
|
||||
|
||||
<p>You can define your own image styles using the <code><a href="https://www.froala.com/wysiwyg-editor/docs/options#imageStyles" title="imageStyles" target="_blank">imageStyles</a></code> option. This option is an Object where the key represents the class name and its value is the style name that appears in the dropdown list. It is important to have unique keys otherwise they will not work properly.</p>
|
||||
<p>By default you can select multiple image styles at a time. If you want to toggle them and allow only one style to be selected at a time use the <code><a href="https://www.froala.com/wysiwyg-editor/docs/options#imageMultipleStyles" title="imageMultipleStyles" target="_blank">imageMultipleStyles</a></code> option.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/mode/xml/xml.min.js"></script>
|
||||
|
||||
<script type="text/javascript" src="../../js/froala_editor.min.js" ></script>
|
||||
<script type="text/javascript" src="../../js/plugins/align.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/char_counter.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_beautifier.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_view.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/colors.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/draggable.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/emoticons.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/entities.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/file.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/font_size.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/font_family.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/fullscreen.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image_manager.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/line_breaker.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/inline_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/link.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/lists.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/paragraph_format.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/paragraph_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/quick_insert.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/quote.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/table.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/save.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/url.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/video.min.js"></script>
|
||||
|
||||
<script>
|
||||
$(function(){
|
||||
$('#edit').froalaEditor({
|
||||
// Define new image styles.
|
||||
imageStyles: {
|
||||
class1: 'Class 1',
|
||||
class2: 'Class 2'
|
||||
}
|
||||
})
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,106 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0"/>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
|
||||
<link rel="stylesheet" href="../../css/froala_editor.css">
|
||||
<link rel="stylesheet" href="../../css/froala_style.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/code_view.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/colors.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/emoticons.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image_manager.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/line_breaker.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/table.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/char_counter.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/video.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/fullscreen.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/file.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/quick_insert.css">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.css">
|
||||
|
||||
<style>
|
||||
body {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
div#editor {
|
||||
width: 81%;
|
||||
margin: auto;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.class1 {
|
||||
border-radius: 10%;
|
||||
border: 2px solid #efefef;
|
||||
}
|
||||
|
||||
.class2 {
|
||||
opacity: 0.5;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="editor">
|
||||
<div id='edit' style="margin-top: 30px;">
|
||||
<h1>Insert as Base64</h1>
|
||||
|
||||
<p>Using the <code>image.beforeUpload</code> event, the images can be inserted as base64 instead of being uploaded to the server.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/mode/xml/xml.min.js"></script>
|
||||
|
||||
<script type="text/javascript" src="../../js/froala_editor.min.js" ></script>
|
||||
<script type="text/javascript" src="../../js/plugins/align.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/char_counter.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_beautifier.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_view.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/colors.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/draggable.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/emoticons.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/entities.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/file.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/font_size.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/font_family.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/fullscreen.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image_manager.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/line_breaker.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/inline_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/link.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/lists.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/paragraph_format.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/paragraph_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/quick_insert.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/quote.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/table.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/save.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/url.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/video.min.js"></script>
|
||||
|
||||
<script>
|
||||
$(function(){
|
||||
$('#edit').froalaEditor()
|
||||
.on('froalaEditor.image.beforeUpload', function (e, editor, files) {
|
||||
if (files.length) {
|
||||
var reader = new FileReader();
|
||||
reader.onload = function (e) {
|
||||
var result = e.target.result;
|
||||
|
||||
editor.image.insert(result, null, null, editor.image.get());
|
||||
};
|
||||
|
||||
reader.readAsDataURL(files[0]);
|
||||
}
|
||||
|
||||
return false;
|
||||
})
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,180 @@
|
||||
<?php
|
||||
// Set date timezone.
|
||||
date_default_timezone_set('Europe/Bucharest');
|
||||
|
||||
// important variables that will be used throughout this example
|
||||
$bucket = 'froala-dev';
|
||||
$region = 's3';
|
||||
$keyStart = 'editor/';
|
||||
$acl = 'public-read';
|
||||
|
||||
// these can be found on your Account page, under Security Credentials > Access Keys
|
||||
$accessKeyId = $_SERVER['AWS_ACCESS_KEY'];
|
||||
$secret = $_SERVER['AWS_SECRET_ACCESS_KEY'];
|
||||
|
||||
$policy = base64_encode(json_encode(array(
|
||||
// ISO 8601 - date('c'); generates uncompatible date, so better do it manually
|
||||
'expiration' => date('Y-m-d\TH:i:s.000\Z', strtotime('+1 day')),
|
||||
'conditions' => array(
|
||||
array('bucket' => $bucket),
|
||||
array('acl' => $acl),
|
||||
array('success_action_status' => '201'),
|
||||
array('x-requested-with' => 'xhr'),
|
||||
array('starts-with', '$key', $keyStart),
|
||||
array('starts-with', '$Content-Type', '') // accept all files
|
||||
)
|
||||
)));
|
||||
|
||||
$signature = base64_encode(hash_hmac('sha1', $policy, $secret, true));
|
||||
?>
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0"/>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
|
||||
<link rel="stylesheet" href="../css/froala_editor.css">
|
||||
<link rel="stylesheet" href="../css/froala_style.css">
|
||||
<link rel="stylesheet" href="../css/plugins/code_view.css">
|
||||
<link rel="stylesheet" href="../css/plugins/colors.css">
|
||||
<link rel="stylesheet" href="../css/plugins/emoticons.css">
|
||||
<link rel="stylesheet" href="../css/plugins/image_manager.css">
|
||||
<link rel="stylesheet" href="../css/plugins/image.css">
|
||||
<link rel="stylesheet" href="../css/plugins/line_breaker.css">
|
||||
<link rel="stylesheet" href="../css/plugins/table.css">
|
||||
<link rel="stylesheet" href="../css/plugins/char_counter.css">
|
||||
<link rel="stylesheet" href="../css/plugins/video.css">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.css">
|
||||
|
||||
<style>
|
||||
body {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
div#editor {
|
||||
width: 81%;
|
||||
margin: auto;
|
||||
text-align: left;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="editor">
|
||||
<div id='edit' style="margin-top: 30px;">
|
||||
<h1>Click and edit</h1>
|
||||
|
||||
<img class="fr-fir fr-dii" src="../img/photo1.jpg" alt="Old Clock" width="300"/>Lorem <strong>ipsum</strong> dolor sit amet, consectetur <strong>adipiscing <em>elit.</em> Donec</strong> facilisis diam in odio iaculis blandit. Nunc eu mauris sit amet purus <strong>viverra</strong><em> gravida</em> ut a dui.<br/>
|
||||
<ul><li>Vivamus nec rutrum augue, pharetra faucibus purus. Maecenas non orci sagittis, vehicula lorem et, dignissim nunc.</li> <li>Suspendisse suscipit, diam non varius facilisis, enim libero tincidunt magna, sit amet iaculis eros libero sit amet eros. Vestibulum a rhoncus felis.<ol><li>Nam lacus nulla, consequat ac lacus sit amet, accumsan pellentesque risus. Aenean viverra mi at urna mattis fermentum.</li> <li>Curabitur porta metus in tortor elementum, in semper nulla ullamcorper. Vestibulum mattis tempor tortor quis gravida. In rhoncus risus nibh. Nullam condimentum dapibus massa vel fringilla. Sed hendrerit sed est quis facilisis. Ut sit amet nibh sem. Pellentesque imperdiet mollis libero.</li></ol></li></ul>
|
||||
|
||||
<table style="width: 100%;">
|
||||
<tr><td>asdasd</td><td>asdasdasd</td></tr>
|
||||
</table>
|
||||
|
||||
Sed dictum dictum tristique. Proin eros turpis, ultricies eu sapien eget, ornare rutrum ipsum. Pellentesque eros nisl, ornare nec ipsum sed, aliquet sollicitudin erat. Nulla tincidunt porta <strong>vehicula.</strong><br/>
|
||||
|
||||
<a href="http://google.com" title="Aenean sed hendrerit">Aenean sed hendrerit</a> velit. Nullam eu mi dolor. Maecenas et erat risus. Nulla ac auctor diam, non aliquet ante. Fusce ullamcorper, ipsum id tempor lacinia, sem tellus malesuada libero, quis ornare sem massa in orci. Sed dictum dictum tristique. Proin eros turpis, ultricies eu sapien eget, ornare rutrum ipsum. Pellentesque eros nisl, ornare nec ipsum sed, aliquet sollicitudin erat. Nulla tincidunt porta <strong>vehicula.</strong><br/>
|
||||
|
||||
<i>Nullam laoreet</i> imperdiet orci ac euismod. Curabitur vel lectus nisi. Phasellus accumsan aliquet augue, eu rutrum tellus iaculis in. Nunc viverra ultrices mollis. Curabitur malesuada nunc massa, ut imperdiet arcu lobortis sed. Cras ac arcu mauris. Maecenas id lectus nisl. Donec consectetur scelerisque quam at ultricies. Nam quis magna iaculis, condimentum metus ut, elementum metus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vivamus id tempus nisi.<br/>
|
||||
</div>
|
||||
|
||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam pretium efficitur lectus, porttitor ornare dolor luctus eu. Vivamus auctor nunc non vestibulum tempor. Integer tristique massa sit amet mi auctor euismod. In finibus nec purus et volutpat. Nullam consectetur est id lorem posuere, quis blandit eros dignissim. Curabitur fringilla iaculis est sed porttitor. Duis in nisi felis.
|
||||
|
||||
Suspendisse ex sem, eleifend vitae felis eu, finibus malesuada odio. Duis eget risus in sem facilisis venenatis eget nec turpis. Aliquam ac sapien dictum, tempor libero sed, feugiat odio. Mauris bibendum nisi justo, eu pulvinar neque tempor ac. Vivamus suscipit in elit interdum euismod. Etiam porta molestie lobortis. Nam consectetur malesuada ante non sagittis. Nunc nec odio ex. Duis non hendrerit diam. Integer vulputate, mi a gravida pretium, ligula libero laoreet libero, in vestibulum arcu velit at velit.
|
||||
|
||||
Suspendisse at neque commodo, sollicitudin lectus sed, blandit sem. Curabitur pharetra suscipit elit ac ultrices. Quisque ullamcorper quis massa et fringilla. Donec euismod, metus id porttitor semper, tortor velit accumsan metus, ut malesuada risus elit eu lorem. Mauris magna odio, efficitur et elit eu, suscipit fermentum sapien. Donec lacinia aliquet augue eu convallis. Suspendisse tincidunt lacus ac ipsum mattis malesuada. Curabitur pellentesque nec nulla ut commodo. Suspendisse pretium nunc in risus iaculis dignissim. Donec faucibus tempus lectus, vel ultrices lectus tincidunt et. Mauris pulvinar ut est in iaculis. Maecenas facilisis enim nec pharetra mattis. Aliquam laoreet egestas lacus, et porta nisl. Ut euismod laoreet purus sed eleifend. Vivamus ullamcorper sodales arcu, sit amet accumsan augue placerat semper. Duis condimentum mattis nulla sed consequat.
|
||||
|
||||
Donec non dui ligula. Aliquam id efficitur massa. Donec tristique aliquet dolor, quis rhoncus felis dignissim sit amet. Duis pellentesque orci eget rhoncus lacinia. Ut dapibus neque id ex fringilla, vitae lobortis turpis interdum. Donec mi lectus, finibus id placerat ut, molestie sit amet erat. Vivamus laoreet semper dui, id efficitur eros. Etiam mollis a nisi a ullamcorper. Vivamus ut porta odio. Maecenas dictum dignissim faucibus. Vestibulum lectus lacus, tempus pulvinar fermentum in, suscipit eget ex. Sed mollis non libero at dignissim. Curabitur non justo vel dui convallis feugiat. Suspendisse quis dictum augue, et pharetra arcu.
|
||||
|
||||
Curabitur sem purus, sagittis quis lorem ac, iaculis laoreet lacus. Fusce eleifend congue massa a ornare. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque sodales, tortor ut hendrerit lacinia, velit metus commodo libero, eu consequat est metus sit amet odio. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Pellentesque eu sem vehicula, vulputate est sit amet, mattis nisi. Nullam consequat at turpis vitae pretium. Nulla risus velit, pharetra ac sollicitudin sed, volutpat nec felis.
|
||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam pretium efficitur lectus, porttitor ornare dolor luctus eu. Vivamus auctor nunc non vestibulum tempor. Integer tristique massa sit amet mi auctor euismod. In finibus nec purus et volutpat. Nullam consectetur est id lorem posuere, quis blandit eros dignissim. Curabitur fringilla iaculis est sed porttitor. Duis in nisi felis.
|
||||
|
||||
Suspendisse ex sem, eleifend vitae felis eu, finibus malesuada odio. Duis eget risus in sem facilisis venenatis eget nec turpis. Aliquam ac sapien dictum, tempor libero sed, feugiat odio. Mauris bibendum nisi justo, eu pulvinar neque tempor ac. Vivamus suscipit in elit interdum euismod. Etiam porta molestie lobortis. Nam consectetur malesuada ante non sagittis. Nunc nec odio ex. Duis non hendrerit diam. Integer vulputate, mi a gravida pretium, ligula libero laoreet libero, in vestibulum arcu velit at velit.
|
||||
|
||||
Suspendisse at neque commodo, sollicitudin lectus sed, blandit sem. Curabitur pharetra suscipit elit ac ultrices. Quisque ullamcorper quis massa et fringilla. Donec euismod, metus id porttitor semper, tortor velit accumsan metus, ut malesuada risus elit eu lorem. Mauris magna odio, efficitur et elit eu, suscipit fermentum sapien. Donec lacinia aliquet augue eu convallis. Suspendisse tincidunt lacus ac ipsum mattis malesuada. Curabitur pellentesque nec nulla ut commodo. Suspendisse pretium nunc in risus iaculis dignissim. Donec faucibus tempus lectus, vel ultrices lectus tincidunt et. Mauris pulvinar ut est in iaculis. Maecenas facilisis enim nec pharetra mattis. Aliquam laoreet egestas lacus, et porta nisl. Ut euismod laoreet purus sed eleifend. Vivamus ullamcorper sodales arcu, sit amet accumsan augue placerat semper. Duis condimentum mattis nulla sed consequat.
|
||||
|
||||
Donec non dui ligula. Aliquam id efficitur massa. Donec tristique aliquet dolor, quis rhoncus felis dignissim sit amet. Duis pellentesque orci eget rhoncus lacinia. Ut dapibus neque id ex fringilla, vitae lobortis turpis interdum. Donec mi lectus, finibus id placerat ut, molestie sit amet erat. Vivamus laoreet semper dui, id efficitur eros. Etiam mollis a nisi a ullamcorper. Vivamus ut porta odio. Maecenas dictum dignissim faucibus. Vestibulum lectus lacus, tempus pulvinar fermentum in, suscipit eget ex. Sed mollis non libero at dignissim. Curabitur non justo vel dui convallis feugiat. Suspendisse quis dictum augue, et pharetra arcu.
|
||||
|
||||
Curabitur sem purus, sagittis quis lorem ac, iaculis laoreet lacus. Fusce eleifend congue massa a ornare. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque sodales, tortor ut hendrerit lacinia, velit metus commodo libero, eu consequat est metus sit amet odio. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Pellentesque eu sem vehicula, vulputate est sit amet, mattis nisi. Nullam consequat at turpis vitae pretium. Nulla risus velit, pharetra ac sollicitudin sed, volutpat nec felis.
|
||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam pretium efficitur lectus, porttitor ornare dolor luctus eu. Vivamus auctor nunc non vestibulum tempor. Integer tristique massa sit amet mi auctor euismod. In finibus nec purus et volutpat. Nullam consectetur est id lorem posuere, quis blandit eros dignissim. Curabitur fringilla iaculis est sed porttitor. Duis in nisi felis.
|
||||
|
||||
Suspendisse ex sem, eleifend vitae felis eu, finibus malesuada odio. Duis eget risus in sem facilisis venenatis eget nec turpis. Aliquam ac sapien dictum, tempor libero sed, feugiat odio. Mauris bibendum nisi justo, eu pulvinar neque tempor ac. Vivamus suscipit in elit interdum euismod. Etiam porta molestie lobortis. Nam consectetur malesuada ante non sagittis. Nunc nec odio ex. Duis non hendrerit diam. Integer vulputate, mi a gravida pretium, ligula libero laoreet libero, in vestibulum arcu velit at velit.
|
||||
|
||||
Suspendisse at neque commodo, sollicitudin lectus sed, blandit sem. Curabitur pharetra suscipit elit ac ultrices. Quisque ullamcorper quis massa et fringilla. Donec euismod, metus id porttitor semper, tortor velit accumsan metus, ut malesuada risus elit eu lorem. Mauris magna odio, efficitur et elit eu, suscipit fermentum sapien. Donec lacinia aliquet augue eu convallis. Suspendisse tincidunt lacus ac ipsum mattis malesuada. Curabitur pellentesque nec nulla ut commodo. Suspendisse pretium nunc in risus iaculis dignissim. Donec faucibus tempus lectus, vel ultrices lectus tincidunt et. Mauris pulvinar ut est in iaculis. Maecenas facilisis enim nec pharetra mattis. Aliquam laoreet egestas lacus, et porta nisl. Ut euismod laoreet purus sed eleifend. Vivamus ullamcorper sodales arcu, sit amet accumsan augue placerat semper. Duis condimentum mattis nulla sed consequat.
|
||||
|
||||
Donec non dui ligula. Aliquam id efficitur massa. Donec tristique aliquet dolor, quis rhoncus felis dignissim sit amet. Duis pellentesque orci eget rhoncus lacinia. Ut dapibus neque id ex fringilla, vitae lobortis turpis interdum. Donec mi lectus, finibus id placerat ut, molestie sit amet erat. Vivamus laoreet semper dui, id efficitur eros. Etiam mollis a nisi a ullamcorper. Vivamus ut porta odio. Maecenas dictum dignissim faucibus. Vestibulum lectus lacus, tempus pulvinar fermentum in, suscipit eget ex. Sed mollis non libero at dignissim. Curabitur non justo vel dui convallis feugiat. Suspendisse quis dictum augue, et pharetra arcu.
|
||||
|
||||
Curabitur sem purus, sagittis quis lorem ac, iaculis laoreet lacus. Fusce eleifend congue massa a ornare. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque sodales, tortor ut hendrerit lacinia, velit metus commodo libero, eu consequat est metus sit amet odio. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Pellentesque eu sem vehicula, vulputate est sit amet, mattis nisi. Nullam consequat at turpis vitae pretium. Nulla risus velit, pharetra ac sollicitudin sed, volutpat nec felis.
|
||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam pretium efficitur lectus, porttitor ornare dolor luctus eu. Vivamus auctor nunc non vestibulum tempor. Integer tristique massa sit amet mi auctor euismod. In finibus nec purus et volutpat. Nullam consectetur est id lorem posuere, quis blandit eros dignissim. Curabitur fringilla iaculis est sed porttitor. Duis in nisi felis.
|
||||
|
||||
Suspendisse ex sem, eleifend vitae felis eu, finibus malesuada odio. Duis eget risus in sem facilisis venenatis eget nec turpis. Aliquam ac sapien dictum, tempor libero sed, feugiat odio. Mauris bibendum nisi justo, eu pulvinar neque tempor ac. Vivamus suscipit in elit interdum euismod. Etiam porta molestie lobortis. Nam consectetur malesuada ante non sagittis. Nunc nec odio ex. Duis non hendrerit diam. Integer vulputate, mi a gravida pretium, ligula libero laoreet libero, in vestibulum arcu velit at velit.
|
||||
|
||||
Suspendisse at neque commodo, sollicitudin lectus sed, blandit sem. Curabitur pharetra suscipit elit ac ultrices. Quisque ullamcorper quis massa et fringilla. Donec euismod, metus id porttitor semper, tortor velit accumsan metus, ut malesuada risus elit eu lorem. Mauris magna odio, efficitur et elit eu, suscipit fermentum sapien. Donec lacinia aliquet augue eu convallis. Suspendisse tincidunt lacus ac ipsum mattis malesuada. Curabitur pellentesque nec nulla ut commodo. Suspendisse pretium nunc in risus iaculis dignissim. Donec faucibus tempus lectus, vel ultrices lectus tincidunt et. Mauris pulvinar ut est in iaculis. Maecenas facilisis enim nec pharetra mattis. Aliquam laoreet egestas lacus, et porta nisl. Ut euismod laoreet purus sed eleifend. Vivamus ullamcorper sodales arcu, sit amet accumsan augue placerat semper. Duis condimentum mattis nulla sed consequat.
|
||||
|
||||
Donec non dui ligula. Aliquam id efficitur massa. Donec tristique aliquet dolor, quis rhoncus felis dignissim sit amet. Duis pellentesque orci eget rhoncus lacinia. Ut dapibus neque id ex fringilla, vitae lobortis turpis interdum. Donec mi lectus, finibus id placerat ut, molestie sit amet erat. Vivamus laoreet semper dui, id efficitur eros. Etiam mollis a nisi a ullamcorper. Vivamus ut porta odio. Maecenas dictum dignissim faucibus. Vestibulum lectus lacus, tempus pulvinar fermentum in, suscipit eget ex. Sed mollis non libero at dignissim. Curabitur non justo vel dui convallis feugiat. Suspendisse quis dictum augue, et pharetra arcu.
|
||||
|
||||
Curabitur sem purus, sagittis quis lorem ac, iaculis laoreet lacus. Fusce eleifend congue massa a ornare. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque sodales, tortor ut hendrerit lacinia, velit metus commodo libero, eu consequat est metus sit amet odio. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Pellentesque eu sem vehicula, vulputate est sit amet, mattis nisi. Nullam consequat at turpis vitae pretium. Nulla risus velit, pharetra ac sollicitudin sed, volutpat nec felis.
|
||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam pretium efficitur lectus, porttitor ornare dolor luctus eu. Vivamus auctor nunc non vestibulum tempor. Integer tristique massa sit amet mi auctor euismod. In finibus nec purus et volutpat. Nullam consectetur est id lorem posuere, quis blandit eros dignissim. Curabitur fringilla iaculis est sed porttitor. Duis in nisi felis.
|
||||
|
||||
Suspendisse ex sem, eleifend vitae felis eu, finibus malesuada odio. Duis eget risus in sem facilisis venenatis eget nec turpis. Aliquam ac sapien dictum, tempor libero sed, feugiat odio. Mauris bibendum nisi justo, eu pulvinar neque tempor ac. Vivamus suscipit in elit interdum euismod. Etiam porta molestie lobortis. Nam consectetur malesuada ante non sagittis. Nunc nec odio ex. Duis non hendrerit diam. Integer vulputate, mi a gravida pretium, ligula libero laoreet libero, in vestibulum arcu velit at velit.
|
||||
|
||||
Suspendisse at neque commodo, sollicitudin lectus sed, blandit sem. Curabitur pharetra suscipit elit ac ultrices. Quisque ullamcorper quis massa et fringilla. Donec euismod, metus id porttitor semper, tortor velit accumsan metus, ut malesuada risus elit eu lorem. Mauris magna odio, efficitur et elit eu, suscipit fermentum sapien. Donec lacinia aliquet augue eu convallis. Suspendisse tincidunt lacus ac ipsum mattis malesuada. Curabitur pellentesque nec nulla ut commodo. Suspendisse pretium nunc in risus iaculis dignissim. Donec faucibus tempus lectus, vel ultrices lectus tincidunt et. Mauris pulvinar ut est in iaculis. Maecenas facilisis enim nec pharetra mattis. Aliquam laoreet egestas lacus, et porta nisl. Ut euismod laoreet purus sed eleifend. Vivamus ullamcorper sodales arcu, sit amet accumsan augue placerat semper. Duis condimentum mattis nulla sed consequat.
|
||||
|
||||
Donec non dui ligula. Aliquam id efficitur massa. Donec tristique aliquet dolor, quis rhoncus felis dignissim sit amet. Duis pellentesque orci eget rhoncus lacinia. Ut dapibus neque id ex fringilla, vitae lobortis turpis interdum. Donec mi lectus, finibus id placerat ut, molestie sit amet erat. Vivamus laoreet semper dui, id efficitur eros. Etiam mollis a nisi a ullamcorper. Vivamus ut porta odio. Maecenas dictum dignissim faucibus. Vestibulum lectus lacus, tempus pulvinar fermentum in, suscipit eget ex. Sed mollis non libero at dignissim. Curabitur non justo vel dui convallis feugiat. Suspendisse quis dictum augue, et pharetra arcu.
|
||||
|
||||
Curabitur sem purus, sagittis quis lorem ac, iaculis laoreet lacus. Fusce eleifend congue massa a ornare. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque sodales, tortor ut hendrerit lacinia, velit metus commodo libero, eu consequat est metus sit amet odio. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Pellentesque eu sem vehicula, vulputate est sit amet, mattis nisi. Nullam consequat at turpis vitae pretium. Nulla risus velit, pharetra ac sollicitudin sed, volutpat nec felis.
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/mode/xml/xml.min.js"></script>
|
||||
<script type="text/javascript" src="../js/froala_editor.min.js"></script>
|
||||
<script type="text/javascript" src="../js/plugins/align.min.js"></script>
|
||||
<script type="text/javascript" src="../js/plugins/code_beautifier.min.js"></script>
|
||||
<script type="text/javascript" src="../js/plugins/code_view.min.js"></script>
|
||||
<script type="text/javascript" src="../js/plugins/draggable.min.js"></script>
|
||||
<script type="text/javascript" src="../js/plugins/colors.min.js"></script>
|
||||
<script type="text/javascript" src="../js/plugins/emoticons.min.js"></script>
|
||||
<script type="text/javascript" src="../js/plugins/font_size.min.js"></script>
|
||||
<script type="text/javascript" src="../js/plugins/font_family.min.js"></script>
|
||||
<script type="text/javascript" src="../js/plugins/image.min.js"></script>
|
||||
<script type="text/javascript" src="../js/plugins/image_manager.min.js"></script>
|
||||
<script type="text/javascript" src="../js/plugins/line_breaker.min.js"></script>
|
||||
<script type="text/javascript" src="../js/plugins/link.min.js"></script>
|
||||
<script type="text/javascript" src="../js/plugins/lists.min.js"></script>
|
||||
<script type="text/javascript" src="../js/plugins/paragraph_format.min.js"></script>
|
||||
<script type="text/javascript" src="../js/plugins/paragraph_style.min.js"></script>
|
||||
<script type="text/javascript" src="../js/plugins/video.min.js"></script>
|
||||
<script type="text/javascript" src="../js/plugins/table.min.js"></script>
|
||||
<script type="text/javascript" src="../js/plugins/url.min.js"></script>
|
||||
<script type="text/javascript" src="../js/plugins/entities.min.js"></script>
|
||||
<script type="text/javascript" src="../js/plugins/char_counter.min.js"></script>
|
||||
<script type="text/javascript" src="../js/plugins/inline_style.min.js"></script>
|
||||
<script type="text/javascript" src="../js/plugins/save.min.js"></script>
|
||||
<script type="text/javascript" src="../js/languages/ro.js"></script>
|
||||
|
||||
<script>
|
||||
$(function(){
|
||||
$('#edit').froalaEditor({
|
||||
enter: $.FroalaEditor.ENTER_P,
|
||||
imageUploadToS3: {
|
||||
bucket: '<?php echo $bucket; ?>',
|
||||
region: '<?php echo $region; ?>',
|
||||
keyStart: '<?php echo $keyStart; ?>',
|
||||
params: {
|
||||
acl: '<?php echo $acl; ?>',
|
||||
AWSAccessKeyId: '<?php echo $accessKeyId; ?>',
|
||||
policy: '<?php echo $policy; ?>',
|
||||
signature: '<?php echo $signature; ?>',
|
||||
}
|
||||
}
|
||||
})
|
||||
.on('froalaEditor.image.uploadedToS3', function (e, editor, link, key, response) {
|
||||
console.log ('S3 Link:', link);
|
||||
console.log ('S3 Key:', key);
|
||||
})
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,96 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
|
||||
<link rel="stylesheet" href="../../css/froala_editor.css">
|
||||
<link rel="stylesheet" href="../../css/froala_style.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/code_view.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/colors.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/emoticons.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image_manager.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/line_breaker.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/table.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/file.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/char_counter.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/video.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/emoticons.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/fullscreen.css">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.css">
|
||||
|
||||
<style>
|
||||
body {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
section {
|
||||
width: 80%;
|
||||
margin: auto;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
iframe {
|
||||
width: 100%;
|
||||
height: 400px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<section id="editor">
|
||||
<iframe id="content" src="content.html">
|
||||
<p>Your browser does not support iframes.</p>
|
||||
</iframe>
|
||||
</section>
|
||||
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/mode/xml/xml.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/froala_editor.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/align.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_beautifier.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_view.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/colors.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/draggable.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/emoticons.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/font_size.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/font_family.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image_manager.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/line_breaker.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/link.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/lists.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/paragraph_format.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/paragraph_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/video.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/table.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/url.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/emoticons.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/file.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/entities.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/char_counter.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/inline_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/save.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/fullscreen.min.js"></script>
|
||||
|
||||
<script>
|
||||
$(function () {
|
||||
var timer = setInterval(function () {
|
||||
var iframe = document.getElementById('content');
|
||||
var iframeDoc = iframe.contentDocument || iframe.contentWindow.document;
|
||||
|
||||
// Check if loading is complete
|
||||
if (iframeDoc.readyState == 'complete' || iframeDoc.readyState == 'interactive') {
|
||||
$(iframe).contents().find('#edit').froalaEditor({
|
||||
scrollableContainer: $(iframe).contents().find('body')
|
||||
})
|
||||
|
||||
clearInterval(timer);
|
||||
return;
|
||||
}
|
||||
}, 500);
|
||||
})
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,36 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
|
||||
<link rel="stylesheet" href="../../css/froala_editor.css">
|
||||
<link rel="stylesheet" href="../../css/froala_style.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/code_view.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/colors.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/emoticons.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image_manager.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/line_breaker.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/table.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/file.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/char_counter.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/video.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/emoticons.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/fullscreen.css">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id='edit' style="margin-top: 30px;">
|
||||
<img class="fr-fir" src="../../img/photo1.jpg" alt="Old Clock" width="300"/>
|
||||
|
||||
<h1>Init inside iframe</h1>
|
||||
|
||||
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec facilisis diam in odio iaculis blandit. Nunc eu mauris sit amet purus viverra gravida ut a dui. Vivamus nec rutrum augue, pharetra faucibus purus. Maecenas non orci sagittis, vehicula lorem et, dignissim nunc. Suspendisse suscipit, diam non varius facilisis, enim libero tincidunt magna, sit amet iaculis eros libero sit amet eros. Vestibulum a rhoncus felis. Nam lacus nulla, consequat ac lacus sit amet, accumsan pellentesque risus. Aenean viverra mi at urna mattis fermentum. Curabitur porta metus in tortor elementum, in semper nulla ullamcorper. Vestibulum mattis tempor tortor quis gravida. In rhoncus risus nibh. Nullam condimentum dapibus massa vel fringilla. Sed hendrerit sed est quis facilisis. Ut sit amet nibh sem. Pellentesque imperdiet mollis libero.</p>
|
||||
|
||||
<p><a href="http://google.com" title="Aenean sed hendrerit">Aenean sed hendrerit</a> velit. Nullam eu mi dolor. Maecenas et erat risus. Nulla ac auctor diam, non aliquet ante. Fusce ullamcorper, ipsum id tempor lacinia, sem tellus malesuada libero, quis ornare sem massa in orci. Sed dictum dictum tristique. Proin eros turpis, ultricies eu sapien eget, ornare rutrum ipsum. Pellentesque eros nisl, ornare nec ipsum sed, aliquet sollicitudin erat. Nulla tincidunt porta vehicula.</p>
|
||||
|
||||
<p>Nullam laoreet imperdiet orci ac euismod. Curabitur vel lectus nisi. Phasellus accumsan aliquet augue, eu rutrum tellus iaculis in. Nunc viverra ultrices mollis. Curabitur malesuada nunc massa, ut imperdiet arcu lobortis sed. Cras ac arcu mauris. Maecenas id lectus nisl. Donec consectetur scelerisque quam at ultricies. Nam quis magna iaculis, condimentum metus ut, elementum metus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vivamus id tempus nisi.</p>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,102 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
|
||||
<link rel="stylesheet" href="../../css/froala_editor.css">
|
||||
<link rel="stylesheet" href="../../css/froala_style.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/code_view.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/colors.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/emoticons.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image_manager.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/line_breaker.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/table.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/file.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/char_counter.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/video.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/emoticons.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/fullscreen.css">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.css">
|
||||
|
||||
<style>
|
||||
body {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
section {
|
||||
width: 80%;
|
||||
margin: auto;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
iframe {
|
||||
width: 100%;
|
||||
height: 400px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<section id="editor">
|
||||
<iframe id="content" src="content.html">
|
||||
<p>Your browser does not support iframes.</p>
|
||||
</iframe>
|
||||
</section>
|
||||
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/mode/xml/xml.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/froala_editor.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/align.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_beautifier.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_view.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/colors.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/draggable.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/emoticons.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/font_size.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/font_family.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image_manager.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/line_breaker.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/link.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/lists.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/paragraph_format.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/paragraph_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/video.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/table.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/url.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/emoticons.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/file.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/entities.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/char_counter.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/inline_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/save.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/fullscreen.min.js"></script>
|
||||
|
||||
<script>
|
||||
$(function () {
|
||||
// Chrome loading workaround.
|
||||
var timer = setInterval(function () {
|
||||
var iframe = document.getElementById('content');
|
||||
var iframeDoc = iframe.contentDocument || iframe.contentWindow.document;
|
||||
|
||||
// Check if loading is complete
|
||||
if (iframeDoc.readyState == 'complete' || iframeDoc.readyState == 'interactive') {
|
||||
$(iframe).contents().find('#edit').froalaEditor({
|
||||
toolbarInline: true,
|
||||
toolbarButtons: ['bold', 'italic', 'underline', 'strikeThrough', 'color', 'emoticons', '-', 'paragraphFormat', 'align', 'formatOL', 'formatUL', 'indent', 'outdent', '-', 'insertImage', 'insertLink', 'insertFile', 'insertVideo', 'undo', 'redo'],
|
||||
toolbarButtonsMD: null,
|
||||
toolbarButtonsSM: null,
|
||||
toolbarButtonsXS: null,
|
||||
scrollableContainer: $(iframe).contents().find('body')
|
||||
})
|
||||
|
||||
clearInterval(timer);
|
||||
return;
|
||||
}
|
||||
}, 100);
|
||||
})
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,85 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0"/>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
|
||||
<link rel="stylesheet" href="../../css/froala_editor.css">
|
||||
<link rel="stylesheet" href="../../css/froala_style.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/code_view.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/colors.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/emoticons.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image_manager.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/line_breaker.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/table.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/char_counter.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/video.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/fullscreen.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/file.css">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.css">
|
||||
|
||||
<style>
|
||||
body {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
div#editor {
|
||||
width: 81%;
|
||||
margin: auto;
|
||||
text-align: left;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="editor">
|
||||
<div id='edit' style="margin-top: 30px;">
|
||||
<h1>Init on click</h1>
|
||||
|
||||
<p>Init on click improves the page performance by initializing only the basic code when the page is loaded and the rest of the code when clicking in the editable area. It is highly recommended to use the <a href="https://www.froala.com/wysiwyg-editor/docs/options#initOnClick" target="_blank" title="initOnClick option">initOnClick</a> option if you have more rich text editors on the same page.</p>
|
||||
|
||||
<p><strong>Click here to initialize the WYSIWYG HTML editor on this text.</strong></p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/mode/xml/xml.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/froala_editor.min.js" ></script>
|
||||
<script type="text/javascript" src="../../js/plugins/align.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_beautifier.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_view.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/colors.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/draggable.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/emoticons.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/font_size.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/font_family.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/file.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image_manager.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/line_breaker.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/link.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/lists.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/paragraph_format.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/paragraph_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/video.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/table.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/url.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/entities.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/char_counter.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/inline_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/save.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/fullscreen.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/languages/ro.js"></script>
|
||||
|
||||
<script>
|
||||
$(function(){
|
||||
$('#edit').froalaEditor({
|
||||
enter: $.FroalaEditor.ENTER_P,
|
||||
initOnClick: true
|
||||
})
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,86 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0"/>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
|
||||
<link rel="stylesheet" href="../../css/froala_editor.css">
|
||||
<link rel="stylesheet" href="../../css/froala_style.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/code_view.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/colors.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/emoticons.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image_manager.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/line_breaker.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/table.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/char_counter.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/video.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/fullscreen.css">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.css">
|
||||
|
||||
<style>
|
||||
body {
|
||||
text-align: center;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
div#editor {
|
||||
width: 81%;
|
||||
margin: auto;
|
||||
text-align: left;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="editor">
|
||||
<div id='edit' style="margin-top: 30px;">
|
||||
<h1>Init on click</h1>
|
||||
|
||||
<p>Init on click improves the page performance by initializing only the basic code when the page is loaded and the rest of the code when clicking in the editable area. It is highly recommended to use the <a href="https://www.froala.com/wysiwyg-editor/docs/options#initOnClick" target="_blank" title="initOnClick option">initOnClick</a> option if you have more rich text editors on the same page.</p>
|
||||
|
||||
<p><strong>Click here to initialize the WYSIWYG HTML editor on this text.</strong></p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/mode/xml/xml.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/froala_editor.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/align.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_beautifier.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_view.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/colors.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/draggable.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/emoticons.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/font_size.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/font_family.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image_manager.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/line_breaker.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/link.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/lists.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/paragraph_format.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/paragraph_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/video.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/table.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/url.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/entities.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/char_counter.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/inline_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/save.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/fullscreen.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/languages/ro.js"></script>
|
||||
|
||||
<script>
|
||||
$(function(){
|
||||
$('#edit').froalaEditor({
|
||||
enter: $.FroalaEditor.ENTER_P,
|
||||
toolbarInline: true,
|
||||
initOnClick: true,
|
||||
toolbarButtons: ['bold', 'italic', 'underline', 'strikeThrough', 'color', 'emoticons', '-', 'paragraphFormat', 'align', 'formatOL', 'formatUL', 'indent', 'outdent', '-', 'insertImage', 'insertLink', 'insertFile', 'insertVideo', 'undo', 'redo']
|
||||
})
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,97 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0"/>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
|
||||
<link rel="stylesheet" href="../../css/froala_editor.css">
|
||||
<link rel="stylesheet" href="../../css/froala_style.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/code_view.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/colors.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/emoticons.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image_manager.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/line_breaker.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/table.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/char_counter.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/video.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/fullscreen.css">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.css">
|
||||
|
||||
<style>
|
||||
body {
|
||||
text-align: center;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
div#editor {
|
||||
width: 81%;
|
||||
margin: auto;
|
||||
text-align: left;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="editor">
|
||||
<div id='edit' style="margin-top: 30px;">
|
||||
<h1>Init on click - 1st editor</h1>
|
||||
|
||||
<p>Init on click improves the page performance by initializing only the basic code when the page is loaded and the rest of the code when clicking in the editable area. It is highly recommended to use the <a href="https://www.froala.com/wysiwyg-editor/docs/options#initOnClick" target="_blank" title="initOnClick option">initOnClick</a> option if you have more rich text editors on the same page.</p>
|
||||
|
||||
<p><strong>Click here to initialize the WYSIWYG HTML editor on this text.</strong></p>
|
||||
</div>
|
||||
|
||||
<div id='edit2' style="margin-top: 30px;">
|
||||
<h1>Init on click - 2nd editor</h1>
|
||||
|
||||
<a href="http://google.com" title="Aenean sed hendrerit">Aenean sed hendrerit</a> velit. Nullam eu mi dolor. Maecenas et erat risus. Nulla ac auctor diam, non aliquet ante. Fusce ullamcorper, ipsum id tempor lacinia, sem tellus malesuada libero, quis ornare sem massa in orci. Sed dictum dictum tristique. Proin eros turpis, ultricies eu sapien eget, ornare rutrum ipsum. Pellentesque eros nisl, ornare nec ipsum sed, aliquet sollicitudin erat. Nulla tincidunt porta <strong>vehicula.</strong><br/>
|
||||
|
||||
<i>Nullam laoreet</i> imperdiet orci ac euismod. Curabitur vel lectus nisi. Phasellus accumsan aliquet augue, eu rutrum tellus iaculis in. Nunc viverra ultrices mollis. Curabitur malesuada nunc massa, ut imperdiet arcu lobortis sed. Cras ac arcu mauris. Maecenas id lectus nisl. Donec consectetur scelerisque quam at ultricies. Nam quis magna iaculis, condimentum metus ut, elementum metus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vivamus id tempus nisi.<br/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/mode/xml/xml.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/froala_editor.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/align.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_beautifier.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_view.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/colors.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/draggable.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/emoticons.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/font_size.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/font_family.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image_manager.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/line_breaker.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/link.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/lists.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/paragraph_format.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/paragraph_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/video.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/table.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/url.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/entities.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/char_counter.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/inline_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/save.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/fullscreen.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/languages/ro.js"></script>
|
||||
|
||||
<script>
|
||||
$(function(){
|
||||
var options = {
|
||||
enter: $.FroalaEditor.ENTER_P,
|
||||
toolbarInline: true,
|
||||
initOnClick: true,
|
||||
toolbarButtons: ['bold', 'italic', 'underline', 'strikeThrough', 'color', 'emoticons', '-', 'paragraphFormat', 'align', 'formatOL', 'formatUL', 'indent', 'outdent', '-', 'insertImage', 'insertLink', 'insertFile', 'insertVideo', 'undo', 'redo']
|
||||
};
|
||||
|
||||
$('#edit').froalaEditor($.extend({}, options, {zIndex: 21}))
|
||||
$('#edit2').froalaEditor($.extend({}, options, {zIndex: 1}))
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,40 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0"/>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
|
||||
<link rel="stylesheet" href="../../css/froala_editor.css">
|
||||
<link rel="stylesheet" href="../../css/froala_style.css">
|
||||
|
||||
<style>
|
||||
div#editor {
|
||||
width: 81%;
|
||||
margin: auto;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
#edit {
|
||||
display: inline-block;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="editor">
|
||||
<div id='edit' style="margin-top: 30px;">Click here to edit this text in a Froala popup.</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
|
||||
|
||||
<script type="text/javascript" src="../../js/froala_editor.min.js" ></script>
|
||||
|
||||
<script>
|
||||
$(function(){
|
||||
$('#edit').froalaEditor({
|
||||
editInPopup: true
|
||||
})
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,42 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0"/>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
|
||||
<link rel="stylesheet" href="../../css/froala_editor.css">
|
||||
<link rel="stylesheet" href="../../css/froala_style.css">
|
||||
|
||||
<style>
|
||||
body {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
div#editor {
|
||||
width: 81%;
|
||||
margin: auto;
|
||||
text-align: left;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="editor">
|
||||
<h1>Init On Button</h1>
|
||||
<p>It is possible to initialize the WYSIWYG HTML editor only on a button.</p>
|
||||
<button id='edit'>Button</button>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/froala_editor.min.js" ></script>
|
||||
|
||||
<script>
|
||||
$(function(){
|
||||
$('#edit').froalaEditor()
|
||||
.on('froalaEditor.contentChanged', function () {
|
||||
console.log ('content changed');
|
||||
})
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,85 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0"/>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
|
||||
<link rel="stylesheet" href="../../css/froala_editor.css">
|
||||
<link rel="stylesheet" href="../../css/froala_style.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/code_view.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/colors.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/emoticons.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image_manager.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/line_breaker.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/table.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/char_counter.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/video.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/fullscreen.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/file.css">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.css">
|
||||
|
||||
<style>
|
||||
body {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
div#editor {
|
||||
width: 81%;
|
||||
margin: auto;
|
||||
text-align: left;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="editor">
|
||||
<div id='edit' style="margin-top: 30px;">
|
||||
<h1>Init on click</h1>
|
||||
|
||||
<p>Init on click improves the page performance by initializing only the basic code when the page is loaded and the rest of the code when clicking in the editable area. It is highly recommended to use the <a href="https://www.froala.com/wysiwyg-editor/docs/options#initOnClick" target="_blank" title="initOnClick option">initOnClick</a> option if you have more rich text editors on the same page.</p>
|
||||
|
||||
<p><strong>Click here to initialize the WYSIWYG HTML editor on this text.</strong></p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/mode/xml/xml.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/froala_editor.min.js" ></script>
|
||||
<script type="text/javascript" src="../../js/plugins/align.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_beautifier.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_view.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/colors.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/draggable.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/emoticons.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/font_size.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/font_family.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/file.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image_manager.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/line_breaker.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/link.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/lists.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/paragraph_format.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/paragraph_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/video.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/table.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/url.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/entities.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/char_counter.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/inline_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/save.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/fullscreen.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/languages/ro.js"></script>
|
||||
|
||||
<script>
|
||||
$(function(){
|
||||
$('#edit').froalaEditor({
|
||||
enter: $.FroalaEditor.ENTER_P,
|
||||
initOnClick: true
|
||||
})
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,67 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0"/>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
|
||||
<link rel="stylesheet" href="../../css/froala_editor.css">
|
||||
<link rel="stylesheet" href="../../css/froala_style.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/code_view.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/colors.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/emoticons.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/line_breaker.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/char_counter.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/fullscreen.css">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.css">
|
||||
|
||||
<style>
|
||||
body {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
div#editor {
|
||||
width: 81%;
|
||||
margin: auto;
|
||||
text-align: left;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="editor">
|
||||
<h1 id='edit' style="margin-top: 30px;">
|
||||
Init on Heading 1.
|
||||
</h1>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/mode/xml/xml.min.js"></script>
|
||||
|
||||
<script type="text/javascript" src="../../js/froala_editor.min.js" ></script>
|
||||
|
||||
<script type="text/javascript" src="../../js/plugins/align.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_beautifier.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_view.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/colors.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/emoticons.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/font_size.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/font_family.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/draggable.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/link.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/url.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/entities.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/char_counter.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/inline_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/save.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/fullscreen.min.js"></script>
|
||||
|
||||
<script>
|
||||
$(function(){
|
||||
$('#edit').froalaEditor({
|
||||
enter: $.FroalaEditor.ENTER_BR
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,44 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0"/>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
|
||||
<link rel="stylesheet" href="../../css/froala_editor.css">
|
||||
<link rel="stylesheet" href="../../css/froala_style.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image.css">
|
||||
|
||||
<style>
|
||||
body {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
div#editor {
|
||||
width: 81%;
|
||||
margin: auto;
|
||||
text-align: left;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="editor">
|
||||
<div style="margin-top: 30px; text-align: center;">
|
||||
<h1>Init On Image</h1>
|
||||
<p>Using the <code>image.min.js</code> plugin it is possible to initialize the WYSIWYG HTML editor only on an image.</p>
|
||||
<img id="edit" class="fr-dii" src="../../img/photo1.jpg" alt="Old Clock" width="300"/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/froala_editor.min.js" ></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/link.min.js"></script>
|
||||
|
||||
<script>
|
||||
$(function(){
|
||||
$('#edit').froalaEditor()
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,43 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0"/>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
|
||||
<link rel="stylesheet" href="../../css/froala_editor.css">
|
||||
<link rel="stylesheet" href="../../css/froala_style.css">
|
||||
|
||||
<style>
|
||||
body {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
div#editor {
|
||||
width: 81%;
|
||||
margin: auto;
|
||||
text-align: left;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="editor">
|
||||
<h1>Init On Link</h1>
|
||||
<p>Using the <code>link.min.js</code> plugin it is possible to initialize the WYSIWYG HTML editor only on a link.</p>
|
||||
<p>The rich text editor will be initialized only on this following link: <a id="edit" href="https://www.froala.com/wysiwyg-editor">Froala WYSIWYG HTML editor website</a></p>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/froala_editor.min.js" ></script>
|
||||
<script type="text/javascript" src="../../js/plugins/link.min.js" ></script>
|
||||
|
||||
<script>
|
||||
$(function(){
|
||||
$('#edit').froalaEditor()
|
||||
.on('froalaEditor.contentChanged', function () {
|
||||
console.log ('content changed');
|
||||
})
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,83 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0"/>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
|
||||
<link rel="stylesheet" href="../../css/froala_editor.css">
|
||||
<link rel="stylesheet" href="../../css/froala_style.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/code_view.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image_manager.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/table.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/video.css">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.css">
|
||||
|
||||
|
||||
<style>
|
||||
body {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
div#editor {
|
||||
width: 81%;
|
||||
margin: auto;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
div#buttons {
|
||||
margin-top: 30px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="buttons">
|
||||
<button id="init">Init Editor</button>
|
||||
<button id="destroy">Destroy Editor</button>
|
||||
</div>
|
||||
|
||||
<div id="editor">
|
||||
<div id='edit' style="margin-top: 30px;">
|
||||
<h1>Initialized Event</h1>
|
||||
<p>This example allows you to see when the <a href="https://www.froala.com/wysiwyg-editor/v2.0/docs/events#initialized" title="Initialized Event" target="_blank">initialized</a> event is triggered. Open the browser console to follow the event.</p>
|
||||
<p>You can destroy and initialize the editor again to see the event being triggered.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/mode/xml/xml.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/froala_editor.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/align.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_beautifier.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_view.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/draggable.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image_manager.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/link.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/lists.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/paragraph_format.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/paragraph_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/table.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/video.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/url.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/entities.min.js"></script>
|
||||
|
||||
<script>
|
||||
$(function(){
|
||||
$('#init').on('click', function(e) {
|
||||
$('#edit').on('froalaEditor.initialized', function (e, editor) {
|
||||
console.log('Initialized')
|
||||
})
|
||||
|
||||
$('#edit').removeClass('fr-view').froalaEditor();
|
||||
})
|
||||
$('#destroy').on('click', function (e) {
|
||||
$('#edit').froalaEditor('destroy');
|
||||
$('#edit').addClass('fr-view');
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,101 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
|
||||
<link rel="stylesheet" href="../../css/froala_editor.css">
|
||||
<link rel="stylesheet" href="../../css/froala_style.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/code_view.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/colors.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/emoticons.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image_manager.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/line_breaker.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/table.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/char_counter.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/video.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/fullscreen.css">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.css">
|
||||
|
||||
<style>
|
||||
body {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
section {
|
||||
width: 81%;
|
||||
margin: auto;
|
||||
text-align: left;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<section id="editor">
|
||||
<div id='edit' style="margin-top: 30px;">
|
||||
<h1>Editor Direction RTL</h1>
|
||||
|
||||
<img class="fr-fir" src="../../img/photo1.jpg" alt="Old Clock" width="300"/>
|
||||
|
||||
<p>The rich text editor has full RTL support. Set the <a href="https://www.froala.com/wysiwyg-editor/v2.0/docs/options#direction" title="direction option" target="_blank">direction</a> option to rtl and writing in Arabic or Farsi will feel naturally.</p>
|
||||
|
||||
<a href="http://froala.com" title="Aenean sed hendrerit" target="_blank">Aenean sed hendrerit</a> velit. Nullam eu mi dolor. Maecenas et erat risus. Nulla ac auctor diam, non aliquet ante. Fusce ullamcorper, ipsum id tempor lacinia, sem tellus malesuada libero, quis ornare sem massa in orci. Sed dictum dictum tristique. Proin eros turpis, ultricies eu sapien eget, ornare rutrum ipsum. Pellentesque eros nisl, ornare nec ipsum sed, aliquet sollicitudin erat. Nulla tincidunt porta <strong>vehicula.</strong><br/>
|
||||
|
||||
<table style="width: 60%;">
|
||||
<tr>
|
||||
<td style="width: 25%;">testing rtl</td>
|
||||
<td style="width: 25%;">rtl</td>
|
||||
<td style="width: 25%;">testing rtl</td>
|
||||
<td style="width: 25%;">rtl</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="width: 25%;">testing rtl</td>
|
||||
<td style="width: 25%;">rtl</td>
|
||||
<td style="width: 25%;">testing rtl</td>
|
||||
<td style="width: 25%;">rtl</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/mode/xml/xml.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/froala_editor.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/align.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_beautifier.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_view.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/colors.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/draggable.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/emoticons.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/font_size.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/font_family.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image_manager.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/line_breaker.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/link.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/lists.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/paragraph_format.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/paragraph_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/video.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/table.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/url.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/entities.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/char_counter.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/inline_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/save.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/fullscreen.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/print.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/languages/ro.js"></script>
|
||||
|
||||
<script>
|
||||
$(function(){
|
||||
$('#edit').froalaEditor({
|
||||
direction: 'rtl'
|
||||
})
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,105 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0"/>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
|
||||
<link rel="stylesheet" href="../../css/froala_editor.css">
|
||||
<link rel="stylesheet" href="../../css/froala_style.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/code_view.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/colors.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/emoticons.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image_manager.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/line_breaker.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/table.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/char_counter.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/video.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/fullscreen.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/file.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/quick_insert.css">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.css">
|
||||
|
||||
<style>
|
||||
body {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
div#editor {
|
||||
width: 81%;
|
||||
margin: auto;
|
||||
text-align: left;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="editor">
|
||||
<div id='edit' style="margin-top: 30px;">
|
||||
<h1>Language</h1>
|
||||
|
||||
<p>The rich text editor's language can be easily changed using the <a href="https://www.froala.com/wysiwyg-editor/v2.0/docs/options#language" title="language option" target="_blank">language</a> option. You can see the complete list of available languages in <a href="https://www.froala.com/wysiwyg-editor/v2.0/languages" title="Languages" target="_blank">Languages</a>.</p>
|
||||
|
||||
<img class="fr-fir fr-dii" src="../../img/photo1.jpg" alt="Old Clock" width="300"/>Lorem <strong>ipsum</strong> dolor sit amet, consectetur <strong>adipiscing <em>elit.</em> Donec</strong> facilisis diam in odio iaculis blandit. Nunc eu mauris sit amet purus <strong>viverra</strong><em> gravida</em> ut a dui.<br/>
|
||||
<ul><li>Vivamus nec rutrum augue, pharetra faucibus purus. Maecenas non orci sagittis, vehicula lorem et, dignissim nunc.</li> <li>Suspendisse suscipit, diam non varius facilisis, enim libero tincidunt magna, sit amet iaculis eros libero sit amet eros. Vestibulum a rhoncus felis.<ol><li>Nam lacus nulla, consequat ac lacus sit amet, accumsan pellentesque risus. Aenean viverra mi at urna mattis fermentum.</li> <li>Curabitur porta metus in tortor elementum, in semper nulla ullamcorper. Vestibulum mattis tempor tortor quis gravida. In rhoncus risus nibh. Nullam condimentum dapibus massa vel fringilla. Sed hendrerit sed est quis facilisis. Ut sit amet nibh sem. Pellentesque imperdiet mollis libero.</li></ol></li></ul>
|
||||
|
||||
<table style="width: 100%;">
|
||||
<tr>
|
||||
<td style="width: 25%;"></td>
|
||||
<td style="width: 25%;"></td>
|
||||
<td style="width: 25%;"></td>
|
||||
<td style="width: 25%;"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="width: 25%;"></td>
|
||||
<td style="width: 25%;"></td>
|
||||
<td style="width: 25%;"></td>
|
||||
<td style="width: 25%;"></td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
<a href="http://google.com" title="Aenean sed hendrerit">Aenean sed hendrerit</a> velit. Nullam eu mi dolor. Maecenas et erat risus. Nulla ac auctor diam, non aliquet ante. Fusce ullamcorper, ipsum id tempor lacinia, sem tellus malesuada libero, quis ornare sem massa in orci. Sed dictum dictum tristique. Proin eros turpis, ultricies eu sapien eget, ornare rutrum ipsum. Pellentesque eros nisl, ornare nec ipsum sed, aliquet sollicitudin erat. Nulla tincidunt porta <strong>vehicula.</strong><br/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/mode/xml/xml.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/froala_editor.min.js" ></script>
|
||||
<script type="text/javascript" src="../../js/plugins/align.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_beautifier.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_view.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/colors.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/draggable.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/emoticons.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/font_size.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/font_family.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/file.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image_manager.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/line_breaker.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/link.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/lists.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/paragraph_format.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/paragraph_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/video.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/table.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/url.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/entities.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/char_counter.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/inline_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/save.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/fullscreen.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/quote.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/quick_insert.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/languages/ro.js"></script>
|
||||
|
||||
<script>
|
||||
$(function(){
|
||||
$('#edit').froalaEditor({
|
||||
language: 'ro'
|
||||
})
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,139 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
|
||||
<link rel="stylesheet" href="../../css/froala_editor.css">
|
||||
<link rel="stylesheet" href="../../css/froala_style.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/code_view.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/colors.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/emoticons.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image_manager.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/image.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/line_breaker.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/table.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/char_counter.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/video.css">
|
||||
<link rel="stylesheet" href="../../css/plugins/fullscreen.css">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.css">
|
||||
|
||||
<style>
|
||||
body {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
section {
|
||||
width: 81%;
|
||||
margin: auto;
|
||||
text-align: left;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<section id="editor">
|
||||
<div id='edit' style="margin-top: 30px;">
|
||||
<h1>RTL LTR Direction Buttons</h1>
|
||||
|
||||
<p>Custom buttons for RTL and LTR to change direction for the current selection.</p>
|
||||
|
||||
<img class="fr-fir" src="../../img/photo1.jpg" alt="Old Clock" width="300"/>
|
||||
|
||||
<p>The rich text editor has full RTL support. Set the <a href="https://www.froala.com/wysiwyg-editor/v2.0/docs/options#direction" title="direction option" target="_blank">direction</a> option to rtl and writing in Arabic or Farsi will feel naturally.</p>
|
||||
|
||||
<a href="http://froala.com" title="Aenean sed hendrerit" target="_blank">Aenean sed hendrerit</a> velit. Nullam eu mi dolor. Maecenas et erat risus. Nulla ac auctor diam, non aliquet ante. Fusce ullamcorper, ipsum id tempor lacinia, sem tellus malesuada libero, quis ornare sem massa in orci. Sed dictum dictum tristique. Proin eros turpis, ultricies eu sapien eget, ornare rutrum ipsum. Pellentesque eros nisl, ornare nec ipsum sed, aliquet sollicitudin erat. Nulla tincidunt porta <strong>vehicula.</strong><br/>
|
||||
|
||||
<table style="width: 60%;">
|
||||
<tr>
|
||||
<td style="width: 25%;">testing rtl</td>
|
||||
<td style="width: 25%;">rtl</td>
|
||||
<td style="width: 25%;">testing rtl</td>
|
||||
<td style="width: 25%;">rtl</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="width: 25%;">testing rtl</td>
|
||||
<td style="width: 25%;">rtl</td>
|
||||
<td style="width: 25%;">testing rtl</td>
|
||||
<td style="width: 25%;">rtl</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/mode/xml/xml.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/froala_editor.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/align.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_beautifier.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/code_view.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/colors.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/draggable.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/emoticons.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/font_size.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/font_family.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/image_manager.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/line_breaker.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/link.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/lists.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/paragraph_format.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/paragraph_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/video.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/table.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/url.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/entities.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/char_counter.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/inline_style.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/save.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/plugins/fullscreen.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/languages/ro.js"></script>
|
||||
|
||||
<script>
|
||||
$(function(){
|
||||
var changeDirection = function (dir, align) {
|
||||
this.selection.save();
|
||||
var elements = this.selection.blocks();
|
||||
for (var i = 0; i < elements.length; i++) {
|
||||
var element = elements[i];
|
||||
if (element != this.$el.get(0)) {
|
||||
$(element)
|
||||
.css('direction', dir)
|
||||
.css('text-align', align);
|
||||
}
|
||||
}
|
||||
|
||||
this.selection.restore();
|
||||
}
|
||||
|
||||
$.FroalaEditor.DefineIcon('rightToLeft', {NAME: 'long-arrow-left'});
|
||||
$.FroalaEditor.RegisterCommand('rightToLeft', {
|
||||
title: 'RTL',
|
||||
focus: true,
|
||||
undo: true,
|
||||
refreshAfterCallback: true,
|
||||
callback: function () {
|
||||
changeDirection.apply(this, ['rtl', 'right']);
|
||||
}
|
||||
})
|
||||
|
||||
$.FroalaEditor.DefineIcon('leftToRight', {NAME: 'long-arrow-right'});
|
||||
$.FroalaEditor.RegisterCommand('leftToRight', {
|
||||
title: 'LTR',
|
||||
focus: true,
|
||||
undo: true,
|
||||
refreshAfterCallback: true,
|
||||
callback: function () {
|
||||
changeDirection.apply(this, ['ltr', 'left']);
|
||||
}
|
||||
});
|
||||
|
||||
$('#edit').froalaEditor({
|
||||
toolbarButtons: ['undo', 'redo' , 'bold', 'formatOL', 'formatUL', '|', 'rightToLeft', 'leftToRight']
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user