+
+ This sample page demonstrates the idea of Advanced Content Filter
+ (ACF), a sophisticated
+ tool that takes control over what kind of data is accepted by the editor and what
+ kind of output is produced.
+
+
When and what is being filtered?
+
+ ACF controls
+ every single source of data that comes to the editor.
+ It process both HTML that is inserted manually (i.e. pasted by the user)
+ and programmatically like:
+
+
+editor.setData( '<p>Hello world!</p>' );
+
+
+ ACF discards invalid,
+ useless HTML tags and attributes so the editor remains "clean" during
+ runtime. ACF behaviour
+ can be configured and adjusted for a particular case to prevent the
+ output HTML (i.e. in CMS systems) from being polluted.
+
+ This kind of filtering is a first, client-side line of defense
+ against "tag soups",
+ the tool that precisely restricts which tags, attributes and styles
+ are allowed (desired). When properly configured, ACF
+ is an easy and fast way to produce a high-quality, intentionally filtered HTML.
+
+
+
How to configure or disable ACF?
+
+ Advanced Content Filter is enabled by default, working in "automatic mode", yet
+ it provides a set of easy rules that allow adjusting filtering rules
+ and disabling the entire feature when necessary. The config property
+ responsible for this feature is config.allowedContent
.
+
+
+ By "automatic mode" is meant that loaded plugins decide which kind
+ of content is enabled and which is not. For example, if the link
+ plugin is loaded it implies that <a>
tag is
+ automatically allowed. Each plugin is given a set
+ of predefined ACF rules
+ that control the editor until
+ config.allowedContent
+ is defined manually.
+
+
+ Let's assume our intention is to restrict the editor to accept (produce) paragraphs
+ only: no attributes, no styles, no other tags.
+ With ACF
+ this is very simple. Basically set
+ config.allowedContent
to 'p'
:
+
+
+var editor = CKEDITOR.replace( textarea_id, {
+ allowedContent: 'p'
+} );
+
+
+ Now try to play with allowed content:
+
+
+// Trying to insert disallowed tag and attribute.
+editor.setData( '<p style="color: red">Hello <em>world</em>!</p>' );
+alert( editor.getData() );
+
+// Filtered data is returned.
+"<p>Hello world!</p>"
+
+
+ What happened? Since config.allowedContent: 'p'
is set the editor assumes
+ that only plain <p>
are accepted. Nothing more. This is why
+ style
attribute and <em>
tag are gone. The same
+ filtering would happen if we pasted disallowed HTML into this editor.
+
+
+ This is just a small sample of what ACF
+ can do. To know more, please refer to the sample section below and
+ the official Advanced Content Filter guide.
+
+
+ You may, of course, want CKEditor to avoid filtering of any kind.
+ To get rid of ACF,
+ basically set
+ config.allowedContent
to true
like this:
+
+
+CKEDITOR.replace( textarea_id, {
+ allowedContent: true
+} );
+
+
+
Beyond data flow: Features activation
+
+ ACF is far more than
+ I/O control: the entire
+ UI of the editor is adjusted to what
+ filters restrict. For example: if <a>
tag is
+ disallowed
+ by ACF,
+ then accordingly link
command, toolbar button and link dialog
+ are also disabled. Editor is smart: it knows which features must be
+ removed from the interface to match filtering rules.
+
+
+ CKEditor can be far more specific. If <a>
tag is
+ allowed by filtering rules to be used but it is restricted
+ to have only one attribute (href
)
+ config.allowedContent = 'a[!href]'
, then
+ "Target" tab of the link dialog is automatically disabled as target
+ attribute isn't included in ACF rules
+ for <a>
. This behaviour applies to dialog fields, context
+ menus and toolbar buttons.
+
+
+
Sample configurations
+
+ There are several editor instances below that present different
+ ACF setups. All of them,
+ except the inline instance, share the same HTML content to visualize
+ how different filtering rules affect the same input data.
+
+
+
+
+
+
+
+ This editor is using a custom set of plugins and buttons.
+
+
+CKEDITOR.replace( 'editor4', {
+ removePlugins: 'bidi,font,forms,horizontalrule,iframe,justify,table,tabletools,smiley',
+ removeButtons: 'Anchor,Underline,Strike,Subscript,Superscript,Image',
+ format_tags: 'p;h1;h2;h3;pre;address'
+} );
+
+
+ As you can see, removing plugins and buttons implies filtering.
+ Several tags are not allowed in the editor because there's no
+ plugin/button that is responsible for creating and editing this
+ kind of content (for example: the image is missing because
+ of removeButtons: 'Image'
). The conclusion is that
+ ACF works "backwards"
+ as well: modifying UI
+ elements is changing allowed content rules.
+
+
+
+
+
+
+ The below editor modify the dialog definition of the above added dialog using the dialogDefinition
event:
+
+
+ Part 2
+
+
+ Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Cras et ipsum quis mi
+ semper accumsan. Integer pretium dui id massa. Suspendisse in nisl sit amet urna
+ rutrum imperdiet. Nulla eu tellus. Donec ante nisi, ullamcorper quis, fringilla
+ nec, sagittis eleifend, pede. Nulla commodo interdum massa. Donec id metus. Fusce
+ eu ipsum. Suspendisse auctor. Phasellus fermentum porttitor risus.
+
+
+ Donec velit. Mauris massa. Vestibulum non nulla. Nam suscipit arcu nec elit. Phasellus
+ sollicitudin iaculis ante. Ut non mauris et sapien tincidunt adipiscing. Vestibulum
+ vitae leo. Suspendisse nec mi tristique nulla laoreet vulputate.
+
+
+
+
+ This sample shows how to configure the Enter and Shift+Enter keys
+ to perform actions specified in the
+ enterMode
+ and shiftEnterMode
+ parameters, respectively.
+ You can choose from the following options:
+
+
+ ENTER_P
– new <p>
paragraphs are created;
+ ENTER_BR
– lines are broken with <br>
elements;
+ ENTER_DIV
– new <div>
blocks are created.
+
+
+ The sample code below shows how to configure CKEditor to create a <div>
block when Enter key is pressed.
+
+
+CKEDITOR.replace( 'textarea_id', {
+ enterMode: CKEDITOR.ENTER_DIV
+});
+
+ Note that textarea_id
in the code above is the id
attribute of
+ the <textarea>
element to be replaced.
+
+
+
+
+ This sample shows how to configure CKEditor to output valid
+ HTML 4.01 code.
+ Traditional HTML elements like <b>
,
+ <i>
, and <font>
are used in place of
+ <strong>
, <em>
, and CSS styles.
+
+
+ To add a CKEditor instance outputting legacy HTML 4.01 code, load the editor using a standard
+ JavaScript call, and define CKEditor features to use the HTML compliant elements and attributes.
+
+
+ A snippet of the configuration code can be seen below; check the source of this page for
+ full definition:
+
+
+CKEDITOR.replace( 'textarea_id', {
+ coreStyles_bold: { element: 'b' },
+ coreStyles_italic: { element: 'i' },
+
+ fontSize_style: {
+ element: 'font',
+ attributes: { 'size': '#(size)' }
+ }
+
+ ...
+});
+
+
+
Apollo 11
+
+
Apollo 11 was the spaceflight that landed the first humans, Americans Neil Armstrong and Buzz Aldrin, on the Moon on July 20, 1969, at 20:18 UTC. Armstrong became the first to step onto the lunar surface 6 hours later on July 21 at 02:56 UTC.
+
+
Armstrong spent about three and a half two and a half hours outside the spacecraft, Aldrin slightly less; and together they collected 47.5 pounds (21.5 kg) of lunar material for return to Earth. A third member of the mission, Michael Collins, piloted the command spacecraft alone in lunar orbit until Armstrong and Aldrin returned to it for the trip back to Earth.
+
+
Broadcasting and quotes
+
+
Broadcast on live TV to a world-wide audience, Armstrong stepped onto the lunar surface and described the event as:
+
+
+ One small step for [a] man, one giant leap for mankind.
+
+
+
Apollo 11 effectively ended the Space Race and fulfilled a national goal proposed in 1961 by the late U.S. President John F. Kennedy in a speech before the United States Congress:
+
+
+ [...] before this decade is out, of landing a man on the Moon and returning him safely to the Earth.
+
+
+
Technical details
+
+
+ Mission crew
+
+
+ Position |
+ Astronaut |
+
+
+
+
+ Commander |
+ Neil A. Armstrong |
+
+
+ Command Module Pilot |
+ Michael Collins |
+
+
+ Lunar Module Pilot |
+ Edwin "Buzz" E. Aldrin, Jr. |
+
+
+
+
+
Launched by a Saturn V rocket from Kennedy Space Center in Merritt Island, Florida on July 16, Apollo 11 was the fifth manned mission of NASA's Apollo program. The Apollo spacecraft had three parts:
+
+
+ - Command Module with a cabin for the three astronauts which was the only part which landed back on Earth
+ - Service Module which supported the Command Module with propulsion, electrical power, oxygen and water
+ - Lunar Module for landing on the Moon.
+
+
+
After being sent to the Moon by the Saturn V's upper stage, the astronauts separated the spacecraft from it and travelled for three days until they entered into lunar orbit. Armstrong and Aldrin then moved into the Lunar Module and landed in the Sea of Tranquility. They stayed a total of about 21 and a half hours on the lunar surface. After lifting off in the upper part of the Lunar Module and rejoining Collins in the Command Module, they returned to Earth and landed in the Pacific Ocean on July 24.
+
+
+
Source: Wikipedia.org
+
+
+
+
+
+
diff --git a/public/assets/vendor/editor/samples/old/inlinetextarea.html b/public/assets/vendor/editor/samples/old/inlinetextarea.html
new file mode 100644
index 0000000..c6171a2
--- /dev/null
+++ b/public/assets/vendor/editor/samples/old/inlinetextarea.html
@@ -0,0 +1,113 @@
+
+
+
+
+
+
+ This sample shows how to automatically replace all <textarea>
elements
+ of a given class with a CKEditor instance.
+
+
+ To replace a <textarea>
element, simply assign it the ckeditor
+ class, as in the code below:
+
+
+<textarea class="ckeditor" name="editor1"></textarea>
+
+
+ Note that other <textarea>
attributes (like id
or name
) need to be adjusted to your document.
+
+
+
+
+
+
diff --git a/public/assets/vendor/editor/samples/old/replacebycode.html b/public/assets/vendor/editor/samples/old/replacebycode.html
new file mode 100644
index 0000000..3cf9a8f
--- /dev/null
+++ b/public/assets/vendor/editor/samples/old/replacebycode.html
@@ -0,0 +1,59 @@
+
+
+
+
+