This commit is contained in:
Joshua Haines
2015-09-14 17:04:37 +10:00
parent cf4b179688
commit cb466772dd
59 changed files with 171 additions and 5370 deletions
+9
View File
@@ -0,0 +1,9 @@
# Ruby Gems for building and testing Bootstrap
# Run `grunt update-gemfile-lock` to update to the latest compatible versions
source 'https://rubygems.org'
group :development, :test do
gem 'jekyll', '~> 2.5.3'
gem 'jekyll-redirect-from', '~> 0.8.0'
end
+76
View File
@@ -0,0 +1,76 @@
GEM
remote: https://rubygems.org/
specs:
blankslate (2.1.2.4)
celluloid (0.16.0)
timers (~> 4.0.0)
classifier-reborn (2.0.3)
fast-stemmer (~> 1.0)
coffee-script (2.4.1)
coffee-script-source
execjs
coffee-script-source (1.9.1.1)
colorator (0.1)
execjs (2.6.0)
fast-stemmer (1.0.2)
ffi (1.9.10)
hitimes (1.2.3)
jekyll (2.5.3)
classifier-reborn (~> 2.0)
colorator (~> 0.1)
jekyll-coffeescript (~> 1.0)
jekyll-gist (~> 1.0)
jekyll-paginate (~> 1.0)
jekyll-sass-converter (~> 1.0)
jekyll-watch (~> 1.1)
kramdown (~> 1.3)
liquid (~> 2.6.1)
mercenary (~> 0.3.3)
pygments.rb (~> 0.6.0)
redcarpet (~> 3.1)
safe_yaml (~> 1.0)
toml (~> 0.1.0)
jekyll-coffeescript (1.0.1)
coffee-script (~> 2.2)
jekyll-gist (1.3.4)
jekyll-paginate (1.1.0)
jekyll-redirect-from (0.8.0)
jekyll (>= 2.0)
jekyll-sass-converter (1.3.0)
sass (~> 3.2)
jekyll-watch (1.2.1)
listen (~> 2.7)
kramdown (1.8.0)
liquid (2.6.3)
listen (2.10.1)
celluloid (~> 0.16.0)
rb-fsevent (>= 0.9.3)
rb-inotify (>= 0.9)
mercenary (0.3.5)
parslet (1.5.0)
blankslate (~> 2.0)
posix-spawn (0.3.11)
pygments.rb (0.6.3)
posix-spawn (~> 0.3.6)
yajl-ruby (~> 1.2.0)
rb-fsevent (0.9.6)
rb-inotify (0.9.5)
ffi (>= 0.5.0)
redcarpet (3.3.2)
safe_yaml (1.0.4)
sass (3.4.18)
timers (4.0.4)
hitimes
toml (0.1.2)
parslet (~> 1.5.0)
yajl-ruby (1.2.1)
PLATFORMS
ruby
DEPENDENCIES
jekyll (~> 2.5.3)
jekyll-redirect-from (~> 0.8.0)
BUNDLED WITH
1.10.6
+4 -1
View File
@@ -1,2 +1,5 @@
exclude: [tinymce-documentation.sublime-project, tinymce-documentation.sublime-workspace]
permalink: /javascript-api/:categories/index.html
permalink: pretty
gems:
- jekyll-redirect-from
-36
View File
@@ -1,36 +0,0 @@
- text: Getting Started
url: ../getting-started/
ignorecontent: true
- text: Configuration
id: configuration
subitems:
- text: General
id: general
subitems:
- text: auto_focus
id: general_auto-focus
include: configuration/general/auto_focus.html
- text: br_in_pre
id: general_br_in_pre
include: configuration/general/br_in_pre.html
- text: directionality
include: configuration/general/directionality.html
id: general_directionality
- text: Cleanup/Output
id: cleanup_output
subitems:
- text: allow_conditional_comments
id: cleanup_output_allow-conditional-comments
include: configuration/cleanup_output/allow_conditional_comments.html
- text: allow_html_in_named_anchor
id: cleanup_output_allow-html-in-named-anchor
include: configuration/cleanup_output/allow_html_in_named_anchor.html
- text: Using TinyMCE
url: ../using-tinymce/
ignorecontent: true
- text: Javascript API
url: ../javascript-api/
ignorecontent: true
- text: Other Versions
url: ../other-versions/
ignorecontent: true
-24
View File
@@ -1,24 +0,0 @@
- text: Getting Started
id: getting-started
subitems:
- text: Installation
id: getting-started_installation
include: getting-started/installation.html
- text: Basic Configuration
id: getting-started_basic-configuration
include: getting-started/basic-configuration.html
- text: Inline Mode
id: getting-started_inline
include: getting-started/inline.html
- text: Configuration
url: ../configuration/
ignorecontent: true
- text: Using TinyMCE
url: ../using-tinymce/
ignorecontent: true
- text: Javascript API
url: ../javascript-api/
ignorecontent: true
- text: Other Versions
url: ../other-versions/
ignorecontent: true
-87
View File
@@ -1,87 +0,0 @@
- text: Getting Started
url: ../getting-started/
ignorecontent: true
- text: Configuration
url: ../configuration/
ignorecontent: true
- text: Using TinyMCE
url: ../using-tinymce/
ignorecontent: true
- text: Javascript API
id: javascript-api
subitems:
- text: tinymce
id: javascript-api_tinymce
location: ./tinymce/index.html
subitems:
- text: tinymce.dom
id: javascript-api_tinymce_dom
location: ./tinymce/dom/index.html
collapsed: true
subitems:
- text: tinymce.dom.BookmarkManager
id: javascript-api_tinymce_dom_bookmarkmanager
location: ./tinymce/dom/bookmarkmanager/index.html
- text: tinymce.dom.ControlSelection
id: javascript-api_tinymce_dom_controlselection
location: ./tinymce/dom/controlselection/index.html
- text: tinymce.dom.DomQuery
id: javascript-api_tinymce_dom_domquery
location: ./tinymce/dom/domquery/index.html
- text: tinymce.dom.DomUtils
id: javascript-api_tinymce_dom_domutils
location: ./tinymce/dom/domutils/index.html
- text: tinymce.dom.EventUtils
id: javascript-api_tinymce_dom_eventutils
location: ./tinymce/dom/eventutils/index.html
- text: tinymce.html
id: javascript-api_tinymce_html
location: ./tinymce/html/index.html
collapsed: true
subitems:
- text: tinymce.html.DomParser
id: javascript-api_tinymce_html_domparser
location: ./tinymce/html/domparser/index.html
- text: tinymce.html.Entities
id: javascript-api_tinymce_html_entities
location: ./tinymce/html/entities/index.html
- text: tinymce.html.Node
id: javascript-api_tinymce_html_node
location: ./tinymce/html/node/index.html
- text: tinymce.html.SaxParser
id: javascript-api_tinymce_html_saxparser
location: ./tinymce/html/saxparser/index.html
- text: tinymce.ui
id: javascript-api_tinymce_ui
location: ./tinymce/ui/index.html
collapsed: true
subitems:
- text: tinymce.ui.AbsoluteLayout
id: javascript-api_tinymce_ui_absolutelayout
location: ./tinymce/ui/absolutelayout/index.html
- text: tinymce.ui.Button
id: javascript-api_tinymce_ui_button
location: ./tinymce/ui/button/index.html
- text: tinymce.ui.ButtonGroup
id: javascript-api_tinymce_ui_buttongroup
location: ./tinymce/ui/buttongroup/index.html
- text: tinymce.ui.Checkbox
id: javascript-api_tinymce_ui_checkbox
location: ./tinymce/ui/checkbox/index.html
- text: tinymce.util
id: javascript-api_tinymce_util
location: ./tinymce/util/index.html
collapsed: true
subitems:
- text: tinymce.util.Color
id: javascript-api_tinymce_util_color
location: ./tinymce/util/color/index.html
- text: tinymce.AddOnManager
id: javascript-api_tinymce_AddOnManager
location: ./tinymce/addonmanager/index.html
- text: tinymce.CommandEvent
id: javascript-api_tinymce_CommandEvent
location: ./tinymce/commandevent/index.html
- text: Other Versions
url: ../other-versions/
ignorecontent: true
+18
View File
@@ -0,0 +1,18 @@
- title: Getting Started
pages:
- title: Installation
- title: Basic Configuration
- title: Inline
- title: Configuration
pages:
- title: Cleanup & Output
pages:
- title: Allow Conditional Comments
- title: Allow HTML in Named Anchor
- title: Using TinyMCE
- title: JavaScript API
- title: Other Versions
-14
View File
@@ -1,14 +0,0 @@
- text: Getting Started
url: ../getting-started/
ignorecontent: true
- text: Configuration
url: ../configuration/
ignorecontent: true
- text: Using TinyMCE
url: ../using-tinymce/
ignorecontent: true
- text: Javascript API
url: ../javascript-api/
ignorecontent: true
- text: Other Versions
ignorecontent: true
-45
View File
@@ -1,45 +0,0 @@
- text: Getting Started
url: ../getting-started/
ignorecontent: true
- text: Configuration
url: ../configuration/
ignorecontent: true
- text: Using TinyMCE
id: using-tinymce
subitems:
- text: Advanced Configuration
id: using-tinymce_advanced-configuration
include: using-tinymce/advanced-configuration.html
- text: Creating a Plugin
id: using-tinymce_creating-a-plugin
include: using-tinymce/creating-a-plugin.html
- text: Creating a Skin
id: using-tinymce_creating-a-skin
include: using-tinymce/creating-a-skin.html
- text: Creating Custom Dialogs
id: using-tinymce_creating-custom-dialogs
include: using-tinymce/creating-custom-dialogs.html
- text: Handling Asynchronous Image Uploads
id: using-tinymce_handling-asynchronous-image-uploads
include: using-tinymce/handling-asynchronous-image-uploads.html
- text: Migration Guide From 3.x
id: using-tinymce_migration-guide-from-3x
include: using-tinymce/migration-guide-from-3x.html
- text: TinyMCE in a Bootstrap Dialog
id: using-tinymce_tinymce-in-a-bootstrap-dialog
include: using-tinymce/tinymce-in-a-bootstrap-dialog.html
- text: TinyMCE in a jQuery UI Dialog
id: using-tinymce_tinymce-in-a-jquery-ui-dialog
include: using-tinymce/tinymce-in-a-jquery-ui-dialog.html
- text: Using CDN
id: using-tinymce_using-cdn
include: using-tinymce/using-cdn.html
- text: Using the Gzip Compressors
id: using-tinymce_using-the-gzip-compressors
include: using-tinymce/using-the-gzip-compressors.html
- text: Javascript API
url: ../javascript-api/
ignorecontent: true
- text: Other Versions
url: ../other-versions/
ignorecontent: true
-29
View File
@@ -1,29 +0,0 @@
{% if include.collapsed %}
<ul class="nav nav-stacked collapsed">
{% else %}
<ul class="nav nav-stacked">
{% endif %}
{% for item in include.nav %}
<li>
{% if item.url %}
<a href="{{ item.url }}">
{{ item.text }}
</a>
{% elsif item.location %}
<a href="#{{ item.id }}" data-url="{{ item.location }}" data-text="{{ item.text }}">
{{ item.text }}
</a>
{% else %}
<a href="#{{ item.id }}">
{{ item.text }}
</a>
{% endif %}
{% if item.subitems and item.collapsed%}
<div class="collapser">+</div>
{% endif %}
</li>
{% if item.subitems %}
{% include api-nav.html nav=item.subitems collapsed=item.collapsed %}
{% endif %}
{% endfor %}
</ul>
@@ -1,3 +0,0 @@
<p>This option enables you to auto focus an editor instance. The value of this option should be an editor instance id. The editor instance id is the id for the original textarea or div element that got replaced.</p>
<p>Example of usage of the auto_focus option:</p>
<pre class="js">tinymce.init({<br /> ...<br /> auto_focus: "elm1"<br />});</pre>
@@ -1,3 +0,0 @@
<p>This option allows you to disable TinyMCE's default behaviour when pressing enter within a PRE tag. Pressing enter within a PRE tag will produce a BR tag and will only split PRE tags upon&nbsp;pressing shift+enter when this setting is enabled.</p>
<p>An example that disables this setting is as follows:</p>
<pre class="js">tinymce.init({<br />&nbsp; &nbsp; br_in_pre: false<br />});</pre>
@@ -1,10 +0,0 @@
<p>This option allows you to set the base direction of directionally neutral text (i.e., text that doesn't have inherent directionality as defined in Unicode) within the editor. This is similar to the use of the "dir" attribute when using content editable elements by themself.</p>
<p>The allowed values for this configuration option are:</p>
<ul>
<ul>
<li>"ltr"</li>
<li>"rtl"</li>
</ul>
</ul>
<p>An example of this setting is as follows:</p>
<pre class="js">tinymce.init({<br />&nbsp;&nbsp;&nbsp;&nbsp;...<br />&nbsp;&nbsp;&nbsp;&nbsp;directionality : 'ltr',<br />&nbsp;&nbsp;&nbsp;&nbsp;...<br />});</pre>
-19
View File
@@ -1,19 +0,0 @@
{% for item in include.nav %}
{% if item.ignorecontent != true %}
{% if include.subsection %}
<div class="tiny-docs-subsection">
{% else %}
<div class="tiny-docs-section">
{% endif %}
<h{{ include.headinglevel }} id="{{ item.id }}">{{ item.text }}</h{{ include.headinglevel }}>
{% if item.include %}
{% capture includename %}{{ item.include }}{% endcapture %}
{% include {{ includename }} %}
{% endif %}
{% if item.subitems %}
{% assign nextheadinglevel = include.headinglevel | plus:1 %}
{% include content.html nav=item.subitems headinglevel=nextheadinglevel subsection=true %}
{% endif %}
</div>
{% endif %}
{% endfor %}
+22 -18
View File
@@ -1,22 +1,26 @@
{% if include.subsection %}
<ul class="nav nav-stacked navsubsection">
{% else %}
<ul class="nav nav-stacked navsection">
{% endif %}
{% for item in include.nav %}
<li>
{% if item.url %}
<a href="{{ item.url }}">
{{ item.text }}
</a>
{% else %}
<a href="#{{ item.id }}">
{{ item.text }}
</a>
{% endif %}
<ul class="nav nav-stacked">
{% for item in include.pages %}
{% assign slug = item.title | downcase | replace: ' ', '-' | replace:'-&-','-' %}
{% capture endslashslug %}{{ slug }}/{% endcapture %}
{% capture bothslashslug %}/{{ slug }}/{% endcapture %}
{% if page.url contains bothslashslug %}
{% assign active = 'active' %}
{% else %}
{% assign active = nil %}
{% endif %}
{% capture address %}{{ include.precedingaddress }}{{ endslashslug }}{% endcapture %}
<li class="{{ active }}">
<a href="{{ site.baseurl }}{{ address }}">
{{ item.title }}
</a>
</li>
{% if item.subitems %}
{% include nav.html nav=item.subitems subsection="true" %}
{% if item.pages %}
{% include nav.html pages=item.pages precedingaddress=address%}
{% endif %}
{% endfor %}
</ul>
-8
View File
@@ -1,8 +0,0 @@
<script>
$( document ).ready(function() {
$('body').scrollspy({
target: '#sidebar',
offset: 90
});
});
</script>
@@ -1,21 +0,0 @@
<p>Some advanced installation configurations are shown here.</p>
<pre class="js">&lt;!-- place in header of your html document --&gt;<br />&lt;script&gt;<br />tinymce.init({<br /> selector: "textarea#elm1",<br /> theme: "modern",<br /> width: 300,<br /> height: 300,<br /> plugins: [<br /> "advlist autolink link image lists charmap print preview hr anchor pagebreak spellchecker",<br /> "searchreplace wordcount visualblocks visualchars code fullscreen insertdatetime media nonbreaking",<br /> "save table contextmenu directionality emoticons template paste textcolor"<br /> ],<br /> content_css: "css/content.css",<br /> toolbar: "insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | l ink image | print preview media fullpage | forecolor backcolor emoticons", <br />&nbsp;&nbsp; style_formats: [<br />&nbsp; &nbsp; &nbsp; &nbsp; {title: 'Bold text', inline: 'b'},<br />&nbsp; &nbsp; &nbsp; &nbsp; {title: 'Red text', inline: 'span', styles: {color: '#ff0000'}},<br />&nbsp; &nbsp; &nbsp; &nbsp; {title: 'Red header', block: 'h1', styles: {color: '#ff0000'}},<br />&nbsp; &nbsp; &nbsp; &nbsp; {title: 'Example 1', inline: 'span', classes: 'example1'},<br />&nbsp; &nbsp; &nbsp; &nbsp; {title: 'Example 2', inline: 'span', classes: 'example2'},<br />&nbsp; &nbsp; &nbsp; &nbsp; {title: 'Table styles'},<br />&nbsp; &nbsp; &nbsp; &nbsp; {title: 'Table row 1', selector: 'tr', classes: 'tablerow1'}<br />&nbsp; &nbsp; ]<br /> }); <br />&lt;/script&gt;<br /><br />&lt;!-- place in body of your html document --&gt;<br />&lt;textarea id="elm1" name="area"&gt;&lt;/textarea&gt;</pre>
<h3>Example breakdown</h3>
<pre class="js">selector: "textarea#elm1",</pre>
<p>Select only the textarea with ID elm1</p>
<pre class="js">theme: "modern",</pre>
<p>Set the modern theme (default, not needed).</p>
<pre class="js">width: 300,</pre>
<p>Width of editor in pixels, integer value.</p>
<pre class="js">height: 300,</pre>
<p>Height of editor in pixels, integer value.</p>
<pre class="js">plugins: [<br /> "advlist autolink link image lists charmap print preview hr anchor pagebreak spellchecker",<br /> "searchreplace wordcount visualblocks visualchars code fullscreen insertdatetime media nonbreaking",<br /> "save table contextmenu directionality emoticons template paste textcolor"<br />],</pre>
<p>A list of plugins that should be included on load.</p>
<pre class="js">content_css: "css/content.css",</pre>
<p>Set a css to use inside the editor window, should be a stripped down version of your website CSS, with things such as styles for headers (H1-H6), table layouts, margins, paddings around elements (images, paragraphs etc).</p>
<pre class="js">toolbar: "insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | l <br />ink image | print preview media fullpage | forecolor backcolor emoticons",</pre>
<p>Select what buttons you might want in your toolbar, you can use comma or space as a seperator.</p>
<pre class="js">&nbsp; &nbsp; style_formats: [<br />&nbsp; &nbsp; &nbsp; &nbsp; {title: 'Bold text', inline: 'b'},<br />&nbsp; &nbsp; &nbsp; &nbsp; {title: 'Red text', inline: 'span', styles: {color: '#ff0000'}},<br />&nbsp; &nbsp; &nbsp; &nbsp; {title: 'Red header', block: 'h1', styles: {color: '#ff0000'}},<br />&nbsp; &nbsp; &nbsp; &nbsp; {title: 'Example 1', inline: 'span', classes: 'example1'},<br />&nbsp; &nbsp; &nbsp; &nbsp; {title: 'Example 2', inline: 'span', classes: 'example2'},<br />&nbsp; &nbsp; &nbsp; &nbsp; {title: 'Table styles'},<br />&nbsp; &nbsp; &nbsp; &nbsp; {title: 'Table row 1', selector: 'tr', classes: 'tablerow1'}<br />&nbsp; &nbsp; ],</pre>
<p>Very powerfull styles configuration, for example, "Bold text" simply makes a &lt;b&gt; tag, "Red Text" makes a span with a style coloring it RED.</p>
<p>The "Table row" can only be applied to a table row (tr).</p>
<p>Check out the formats options for more information on how to bend these options to your will.</p>
@@ -1,62 +0,0 @@
<p>Creating plugins in TinyMCE is pretty simple this tutorial tries to outline some of the basic concepts of creating a plugin. For more details consult the API documentation and check the existing plugins we ship with the core.</p>
<h2>File Structure</h2>
<p>To create a plugin you need to create a directory in the tinymce plugins directory. TinyMCE will load the plugin.js file if you use the tinymce.js file in your page. If you use the tinymce.min.js file it will load the plugin.min.js file. It's recommended to use the tinymce.js file while developing then have a build script minifying the plugin.js into plugin.min.js for production usage.</p>
<p>The build scripts that comes with the dev package of TinyMCE will automatically build all plugins including your custom ones.</p>
<h3>Example of the plugin file structure</h3>
<pre class="js">/tinymce/plugins/example/plugin.js<br />/tinymce/plugins/example/plugin.min.js</pre>
<p>This new example plugin can now be loaded using the tinymce.init plugins option.</p>
<pre class="js">tinymce.init({<br /> selector: 'textarea',<br /> plugins: 'example'<br />});</pre>
<p>You can also have the plugin in any location you want by loading the plugin.js/plugin.min.js files directrly after the tinymce.js/tinymce.min.js.</p>
<h3>Example of loading the plugin from another url</h3>
<pre class="js">&lt;script src="/tinymce/js/tinymce.min.js"&gt;&lt;/script&gt;<br />&lt;script src="/scripts/my.tinymce.plugin.js"&gt;&lt;/script&gt;<br />&lt;script&gt;<br />tinymce.init({..});<br />&lt;/script&gt;</pre>
<h2>Example plugin</h2>
<p>Here is an <a href="http://fiddle.tinymce.com/ngdaab/0">example</a> plugin showing how you add a simple toolbar button and menu item. The button opens a dialog that lets you type in a title that gets inserted into the editor. The menu item will open the tinymce site in a dialog.</p>
<pre class="js">tinymce.PluginManager.add('example', function(editor, url) {
&nbsp; &nbsp; // Add a button that opens a window
&nbsp; &nbsp; editor.addButton('example', {
&nbsp; &nbsp; &nbsp; &nbsp; text: 'My button',
&nbsp; &nbsp; &nbsp; &nbsp; icon: false,
&nbsp; &nbsp; &nbsp; &nbsp; onclick: function() {
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; // Open window
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; editor.windowManager.open({
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; title: 'Example plugin',
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; body: [
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; {type: 'textbox', name: 'title', label: 'Title'}
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ],
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; onsubmit: function(e) {
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; // Insert content when the window form is submitted
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; editor.insertContent('Title: ' + e.data.title);
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; });
&nbsp; &nbsp; &nbsp; &nbsp; }
&nbsp; &nbsp; });
&nbsp; &nbsp; // Adds a menu item to the tools menu
&nbsp; &nbsp; editor.addMenuItem('example', {
&nbsp; &nbsp; &nbsp; &nbsp; text: 'Example plugin',
&nbsp; &nbsp; &nbsp; &nbsp; context: 'tools',
&nbsp; &nbsp; &nbsp; &nbsp; onclick: function() {
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; // Open window with a specific url
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; editor.windowManager.open({
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; title: 'TinyMCE site',
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; url: 'http://www.tinymce.com',
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; width: 800,
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; height: 600,
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; buttons: [{
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; text: 'Close',
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; onclick: 'close'
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }]
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; });
&nbsp; &nbsp; &nbsp; &nbsp; }
&nbsp; &nbsp; });
});</pre>
<h2>Example init</h2>
<p>Here is a example on how to use the new toolbar button.</p>
<pre class="js">tinymce.init({<br />&nbsp;&nbsp;&nbsp;&nbsp;selector: 'textarea',<br />&nbsp;&nbsp;&nbsp;&nbsp;plugins: 'example',<br />&nbsp;&nbsp;&nbsp;&nbsp;toolbar: 'example'<br />});</pre>
<h2>Internationalization</h2>
<p>If you want to have custom translations for your plugin you need to create a "langs" directory in your plugin directory. TinyMCE will then try to load language files based on the specified language core for example if the language is "sv_SE" it will try to load "&lt;your plugin&gt;/langs/sv_SE.js".</p>
<p>This file is similar to .po files it has the English string on the left side and the translated string on the right side.</p>
<h3>Example of a Swedish translation for the dialog title</h3>
<pre class="js">tinymce.addI18n('sv_SE', {<br /> "Example plugin": "Exempel plugin"<br />});</pre>
<p>Some times you don't have all the translations that the full TinyMCE package has this would result in a 404 error while loading the non existing file. This can be avoided by adding this line to the top of your plugin file.</p>
<pre class="js">tinymce.PluginManager.requireLangPack('example', 'sv_SE,de_AT');</pre>
@@ -1,13 +0,0 @@
<p>There are two ways of creating skins for TinyMCE one of them using the <a href="http://skin.tinymce.com">TinyMCE Skin Creator</a> tool the other one is to manually modify less files and build them using the node js build process. Since the skin creator is pretty self explanatory we will focus on the manual process in this tutorial.</p>
<h3>Preparation</h3>
<p>In order to manually build the less files you will have to download the <a href="/download/download.php">TinyMCE development package</a>. This package contains the source code for the whole TinyMCE project and the less files needed to skin the editor. You will also need to install node js and the NPM node module dependencies needed for the build process. This <a href="https://github.com/tinymce/tinymce/blob/master/readme.md">readme.md</a> file explains how to manually build tinymce.</p>
<h3>Building skin.min.css from less files</h3>
<p>Start of by making a copy of the default skin "lightgray" to for example "myskin" place that copy inside the skins directory next to the "lightgray" skin.</p>
<p>Then go to the root directory of tinymce in a console and invoke "jake less" this command will automatically build css files out of the less files contained in the skins directories.</p>
<p>The build process will produce four css files: skin.min.css, skin.ie7.min.css, content.min.css, content.inline.min.css. The ones prefixed with content are the ones used for the content inside the editor these files contain CSS for normalizing editing behavior and the look for things like video placeholders. The skin.min.css is used for the UI and the skin.ie7.min.css is used for IE7 users. This is a spearate file since this will be removed when we drop IE 7 support in the future.</p>
<h3>Modifying the less files</h3>
<p>Most of the things can be modified by altering the Variables.less file it contains variables for font size, font familiy, colors, borders and so on. But you might need to modify other files if you are going to do a radically different skin. The skin only changes the visual presentation of the UI not the placement of elements. Placement of elements is done by the TinyMCE UI framework and this is what makes it possible to do really complex UI layouts on all browsers without touching any CSS when you create plugins.</p>
<h3>Modifying the icons</h3>
<p>The icons we ship with default skin is created by <a href="http://icomoon.io/">IcoMoon</a> project. And are embedded as web fonts, this makes them retina ready and easy to skin. If you need more icons or other icons I suggest checking that service out.</p>
<p>You can import the existing TinyMCE icons by uploading the "icomoon.dev.svg" file and then add more icons or change the ones we use. Adding more icons requires you to alter the Icons.less file and Icons.ie7.less file.</p>
<p>There are a few images that are used for placeholders within the contents of the editor.</p>
@@ -1,9 +0,0 @@
<h3>Dialogs as HTML pages</h3>
<p>In TinyMCE 3.x all dialogs where HTML pages that got loaded into a iframe or window. This was changed in TinyMCE 4 to make it easier to make plugins and fully support CDN:s. But you can still load HTML based pages into TinyMCE dialogs by using the WindowManager.</p>
<pre class="js">// Opens a HTML page inside a TinyMCE dialog<br />editor.windowManager.open({<br /> title: "My html dialog",<br /> url: 'mydialog.html',<br /> width: 700,<br /> height: 600<br />});</pre>
<p>You can also pass in parameters to the dialog just as you could in 3.x by using the second parameter of the WindowManager.open.</p>
<pre class="js">// Opens a HTML page inside a TinyMCE dialog and pass in two parameters<br />editor.windowManager.open({<br /> title: "My html dialog",<br /> url: 'mydialog.html',<br /> width: 700,<br /> height: 600<br />}, {<br /> arg1: 42,<br /> arg2: "Hello world"<br />});</pre>
<p>You can access these parameters from your mydialog.html page by using this code:</p>
<pre class="js">// Get the parameters passed into the window from the top frame<br />var args = top.tinymce.activeEditor.windowManager.getParams();<br />console.log(args.arg1, args.arg2);</pre>
<p>You can also close the current window by calling:</p>
<pre class="js">// Close the front most window (mydialog.html)<br />top.tinymce.activeEditor.windowManager.close();</pre>
@@ -1,67 +0,0 @@
<p>With the release of version 4.2, TinyMCE can now upload local images directly to an image handler of your choice. &nbsp;&nbsp;</p>
<p>The image uploader is designed to complement the new image editing functionality of TinyMCE 4.2. Images that are edited within TinyMCE can be uploaded using this function. Local images that are added through other means - for example drag and drop when using the <a href="/wiki.php/Configuration:paste_data_images">paste_data_images</a> configuration property or using Ephox's Power Paste Plugin - can also be uploaded using this functionality.</p>
<p>Once uploaded, TinyMCE will automatically update the &lt;image&gt; src attribute with the new path to the remote image. &nbsp;</p>
<p>Local images can be uploaded to TinyMCE through the use of the new editor.uploadImages() function. &nbsp;This functionality is handled asynchronously, meaning that it is possible for users to save their content before all images have completed uploading. &nbsp;If this occurs, no server path to the remote image will be available and the images will be stored as Base64.</p>
<p>To avoid this situation, it is recommended that the editor.uploadImages() function be executed prior to submitting the editor contents to the server. Once all images have been uploaded, a success callback can be utilized to execute code. &nbsp;This success callback can be used to save the editor's content to the server through a POST, again helping to prevent the above situation.</p>
<p>Examples of this function are below:</p>
<h5>Using uploadImages With jQuery</h5>
<pre class="js">tinymce.activeEditor.uploadImages(function(success) {<br /> $.post("ajax/post.php", tinymce.activeEditor.getContent()).done(function() {<br /> console.log("Uploaded images and posted content as an ajax request.");<br /> });<br />});</pre>
<h5>Using uploadImages and Then Posting a Form</h5>
<pre class="js">tinymce.activeEditor.uploadImages(function(success) {<br /> document.forms[0].submit();<br />});</pre>
<h3>Image Uploader Requirements</h3>
<p>In order to upload local images to the remote server, you will need a server-side upload handler script that accepts the images on the server, stores them appropriately, and returns a JSON object containing the location that they were uploaded to.</p>
<p>An example PHP upload handler implementation is available&nbsp;<a href="/wiki.php/PHP_Upload_Handler">here</a>.</p>
<p>This server-side upload handler must return a JSON object that contains a "location" property. This property should represent the remote location or filename of the newly uploaded image.</p>
<pre class="js">{ location : '/uploaded/image/path/image.png' } </pre>
<h3>Image Uploader Options</h3>
<p>There are multiple configuration options that will affect the operation of this feature. &nbsp;These options are detailed below.</p>
<p><strong>Please note, for image uploads to function correctly, either the images_upload_url or images_upload_handler options must be set.</strong></p>
<table>
<tbody>
<tr>
<td><strong>Image Upload Handling Option</strong></td>
<td><strong>Description</strong></td>
</tr>
<tr>
<td><a href="/wiki.php/Configuration:images_upload_url">images_upload_url</a></td>
<td>This option lets you specify a URL to where you want images to be uploaded when you call editor.uploadImages.</td>
</tr>
<tr>
<td><a href="/wiki.php/Configuration:images_upload_base_path">images_upload_base_path</a></td>
<td>This option lets you specify a basepath to prepend to urls returned from the configured images_upload_url page.</td>
</tr>
<tr>
<td><a href="/wiki.php/Configuration:images_upload_credentials">images_upload_credentials</a></td>
<td>This option lets you specify if calls to the configured images_upload_url should pass along credentials like cookies etc cross domain. This is disabled by default.</td>
</tr>
<tr>
<td><a href="/wiki.php/Configuration:images_upload_handler">images_upload_handler</a></td>
<td>This option lets you replace TinyMCE's default javascript upload handler function with custom logic. The upload handler function takes three arguments, blobInfo, a success callback and a failure callback. When this option is not set, TinyMCE utilizes an XMLHttpRequest to upload images one at a time to the server, and calls the success callback with the location of the remote image.</td>
</tr>
</tbody>
</table>
<p>An example of a typical setup is below:</p>
<pre class="js">tinymce.init({<br />&nbsp;&nbsp;&nbsp;&nbsp;...<br />&nbsp;&nbsp;&nbsp;&nbsp;images_upload_url: "postAcceptor.php",<br />&nbsp;&nbsp;&nbsp;&nbsp;images_upload_base_path: "/some/basepath",<br />&nbsp;&nbsp;&nbsp;&nbsp;images_upload_credentials: true<br />});
</pre>
<h3>Rolling Your Own Image Handler</h3>
<p>If the default behaviour of TinyMCE's image upload logic is not right for you, you may set your own behaviour by using the images_upload_handler configuration property.</p>
<p>Please note that while using this option, no other image uploader options are necessary. &nbsp;Additionally, if you would like TinyMCE to replace the &lt;image&gt; tag's src attribute with the remote location, please use the success callback defined in the image_upload_handler function with the returned JSON object's location property.</p>
<p>An example of this setup is below:</p>
<pre class="js">tinymce.init({<br />&nbsp;&nbsp;&nbsp;&nbsp;...<br />&nbsp;&nbsp;&nbsp;&nbsp;images_upload_handler: function (blobInfo, success, failure) {<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;var xhr, formData;<br /><br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;xhr = new XMLHttpRequest();<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;xhr.withCredentials = false;<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;xhr.open('POST', "postAcceptor.php");<br /><br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;xhr.onload = function() {<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;var json;<br /><br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if (xhr.status != 200) {<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;failure("HTTP Error: " + xhr.status);<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;return;<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}<br /><br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;json = JSON.parse(xhr.responseText);<br /><br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if (!json || typeof json.location != "string") {<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;failure("Invalid JSON: " + xhr.responseText);<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;return;<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}<br /><br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;success(json.location);<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;};<br /><br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;formData = new FormData();<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;formData.append('file', blobInfo.blob(), fileName(blobInfo));<br /><br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;xhr.send(formData);<br />&nbsp;&nbsp;&nbsp;&nbsp;}<br />});</pre>
<h3>CORS Considerations</h3>
<p>You may choose for your web application to upload image data to a separate domain. If so, you will need to configure&nbsp;<a href="http://en.wikipedia.org/wiki/Cross-origin_resource_sharing">Cross-origin resource sharing (CORS)</a>&nbsp;for your application to comply with JavaScript "same origin" restrictions.</p>
<p>CORS has very strict rules about what constitutes a cross-origin request. The browser can require CORS headers when uploading to the same server the editor is hosted on, for example:</p>
<ul>
<li>A different port on the same domain name</li>
<li>Using the host IP address instead of the domain name</li>
<li>Swapping between HTTP and HTTPS for the page and the upload script</li>
</ul>
<p>The upload script URL origin must&nbsp;<em>exactly</em>&nbsp;match the origin of the URL in the address bar, or the browser will require CORS headers to access it. A good way to guarantee this is to use a relative URL to specify the script address, instead of an absolute one.</p>
<p>All supported browsers will print a message to the JavaScript console if there is a CORS error.</p>
<p>The&nbsp;<a href="/wiki.php/PHP_Upload_Handler">PHP Upload Handler Script</a>&nbsp;provided here configures CORS in the $accepted_origins variable. You may choose to configure CORS at the&nbsp;<a href="http://www.w3.org/wiki/CORS_Enabled#At_the_Web_Application_level...">web application layer</a>&nbsp;or the&nbsp;<a href="http://www.w3.org/wiki/CORS_Enabled#At_the_HTTP_Server_level...">HTTP server layer</a>. &nbsp;</p>
<p><strong>Further Reading on CORS</strong></p>
<ul>
<li><a href="http://www.w3.org/wiki/CORS_Enabled">W3C Wiki - CORS Enabled</a></li>
<li><a href="https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS">MDN - HTTP access control (CORS)</a></li>
<li><a href="http://www.w3.org/TR/cors/">W3C - Cross-Origin Resource Sharing&nbsp;</a><a href="http://www.w3.org/TR/cors/">Specification</a></li>
</ul>
@@ -1,29 +0,0 @@
<h4>File structure</h4>
<p>The file structure was changed in the 4.0 release to more closely match other JavaScript projects. All minified files are suffixed with ".min.js" and "editor_plugin" and "editor_theme" was replaced with "plugin" and "theme".</p>
<pre class="js">/tiny_mce/tiny_mce.js -&gt; /tinymce/tinymce.min.js <br />/tiny_mce/tiny_mce_src.js -&gt; /tinymce/tinymce.js <br />/tiny_mce/plugins/&lt;plugin&gt;/editor_plugin.js -&gt; /tinymce/plugins/&lt;plugin&gt;/plugin.min.js <br />/tiny_mce/plugins/&lt;plugin&gt;/editor_plugin_src.js -&gt; /tinymce/plugins/&lt;plugin&gt;/plugin.js <br />/tiny_mce/theme/&lt;plugin&gt;/editor_template.js -&gt; /tinymce/plugins/&lt;plugin&gt;/theme.min.js <br />/tiny_mce/theme/&lt;plugin&gt;/editor_template_src.js -&gt; /tinymce/plugins/&lt;plugin&gt;/theme.js </pre>
<h4>Removed plugins</h4>
<p>These plugins where removed in 4.0: <a href="/wiki.php/Plugin3x:advhr">advhr</a>, <a href="/wiki.php/Plugin3x:advimage">advimage</a>, <a href="/wiki.php/Plugin3x:advlink">advlink</a>, <a href="/wiki.php/Plugin3x:iespell">iespell</a>, <a href="/wiki.php/Plugin3x:inlinepopups">inlinepopups</a>, <a href="/wiki.php/Plugin3x:style">style</a>, <a href="/wiki.php/Plugin3x:emotions">emotions</a>&nbsp;and <a href="/wiki.php/Plugin3x:xhtmlxtras">xhtmlxtras</a>.</p>
<h4>New plugins</h4>
<p>These are the new plugins in 4.0: <a href="/wiki.php/Plugin:anchor">anchor</a>, <a href="/wiki.php/Plugin:charmap">charmap</a>, <a href="/wiki.php/Plugin:compat3x">compat3x</a>, <a href="/wiki.php/Plugin:hr">hr</a>, <a href="/wiki.php/Plugin:image">image</a>, <a href="/wiki.php/Plugin:link">link</a>, <a href="/wiki.php/Plugin:emoticons">emoticons</a>, <a href="/wiki.php/Plugin:code">code</a> and <a href="/wiki.php/Plugin:textcolor">textcolor</a>.</p>
<h4>Removed themes</h4>
<p>The "simple" and "advanced" themes where removed in 4.0.</p>
<h4>New themes</h4>
<p>The new "modern" theme was introduced in 4.0. More themes will be added in the future.</p>
<h4>Event handling</h4>
<p>TinyMCE 4.0 has a new way of binding events. Instead of the old dispatcher method it uses the more common "on" and "off" like for example jQuery. It also allows you to bind multiple events and cancel events using the more common preventDefault and stopPropagation. Check the <a href="/wiki.php/api4:class.tinymce.Editor">API documentation</a> for a full list of events.</p>
<pre class="js">// Old event<br />editor.onInit(editor, args) {<br /> // Custom logic<br />});<br /><br />// New event<br />editor.on('init', function(args) {<br /> // Custom logic<br />});</pre>
<h4>User interface</h4>
<p>The user interface logic has been changed compleatly in 4.0. Though the more easier methods of adding buttons and windows are the same more complex controls or dialogs needs to be written in the new API style.</p>
<h3>Control states</h3>
<p>Each control in TinyMCE 4 is supposed to be an self contained unit. This enables controls to be created at multiple locations in the UI. So the old controlManager with fixed names has been removed.</p>
<pre class="js">// This is how control states used to function in the 3.x UI API<br />editor.onNodeChange.add(function(editor, controlManager, node) {<br />&nbsp;&nbsp;&nbsp;&nbsp;controlManager.setActive('SomeButton', node.nodeName == 'A');<br />});</pre>
<pre class="js">// In TinyMCE 4 you can use the simpler stateSelector setting<br />editor.addButton('SomeButton', {<br />&nbsp;&nbsp;&nbsp;&nbsp;text: 'My button',<br />&nbsp;&nbsp;&nbsp;&nbsp;stateSelector: 'a'<br />});<br /><br />// Or you can use custom logic using the "nodechange" event<br />editor.addButton('SomeButton', {<br /> text: 'My button',<br />&nbsp;&nbsp;&nbsp;&nbsp;onPostRender: function() {<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;var ctrl = this;<br /> <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;ed.on('NodeChange', function(e) {<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;ctrl.active(e.element.nodeName == 'A');<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;});<br />&nbsp;&nbsp;&nbsp;&nbsp;}<br />});</pre>
<h3>Dialogs/Windows</h3>
<p>In TinyMCE 3.x all dialogs where HTML files loaded in iframes or separate windows. In 4.x all windows are DIV elements placed onto the same page as the editor. You can however still load pages into iframe based windows.</p>
<pre class="js">// Open URL based window<br />editor.windowManager.open({<br />&nbsp;&nbsp;&nbsp;&nbsp;title: "My dialog",<br />&nbsp;&nbsp;&nbsp;&nbsp;width: 500,<br />&nbsp;&nbsp;&nbsp;&nbsp;height: 400,<br />&nbsp;&nbsp;&nbsp;&nbsp;url: "somepage.html"<br />}, {<br />&nbsp;&nbsp;&nbsp;&nbsp;someArg: "someValue"<br />});</pre>
<p>Here are some examples on how to extract parameters passed to windows and closing windows inside your "somepage.html" code.</p>
<pre class="js">// Get someArg value inside iframe dialog<br />var someArg = top.tinymce.activeEditor.windowManager.getParams().someArg;<br /><br />// Close the top most window<br />top.tinymce.activeEditor.windowManager.close();</pre>
<h4>HTML5 output</h4>
<p>TinyMCE produces HTML5 loose output as of 4.0. This means it can handle all new HTML5 elements and also allow the deprecated HTML4 attributes and elements. If you want to use html4 or html5-strict output check the <a href="/wiki.php/Configuration:schema">schema</a> option for details.</p>
<h4>Using the compat3x plugin</h4>
<p>As a last resort one can use the <a href="/wiki.php/Plugin:compat3x">compat3x plugin</a>&nbsp;it mimic parts of the 3.x API contains a few files removed from 4.x. We only recommend this as a last resort and it won't work for all plugins. But most plugins should work right out of the box we tested it with some of our own old 3.x plugins.</p>
@@ -1,3 +0,0 @@
<p>You need to override the built in block on focusin in bootstrap dialogs when using TinyMCE inside it. See this <a href="http://fiddle.tinymce.com/oxdaab">working example</a> for details.</p>
<p>Bootstrap blocks all focus events on contents within the dialog. Add this script to your page and it will allow users to click inside the editor.</p>
<pre class="js">// Prevent bootstrap dialog from blocking focusin<br />$(document).on('focusin', function(e) {<br /> if ($(e.target).closest(".mce-window").length) {<br /> e.stopImmediatePropagation();<br /> }<br />});</pre>
@@ -1 +0,0 @@
<p>You need to add some custom logic when rendering TinyMCE instances inside jQuery UI dialogs since it blocks all focus in calls of elements outside the dialog. Check this <a href="http://fiddle.tinymce.com/rsdaab">fiddle</a> out for a working example.</p>
-9
View File
@@ -1,9 +0,0 @@
<p>Cachefly is sponsoring the CDN hosting of TinyMCE, to use it, simply include this line of code into your HTML page.</p>
<pre class="js">&lt;script src="//tinymce.cachefly.net/4.0/tinymce.min.js"&gt;&lt;/script&gt;</pre>
<p>There are a few special things you need to take in consideration when using the CDN version, first of all, if you wish to use any local plugins (Like <a href="http://www.moxiemanager.com">MoxieManager</a> for example) you need to load them using the new option called:</p>
<p><a href="/wiki.php/Configuration:external_plugins">external_plugins</a></p>
<p>Also, if you wish to use a custom language, you need to enter the location of the language file into the new option called:</p>
<p><a href="/wiki.php/Configuration:language_url">language_url</a></p>
<p>For a list of possible versions, check this text document:</p>
<p><a href="http://tinymce.cachefly.net/index.txt">http://tinymce.cachefly.net/index.txt</a></p>
<p>If you haven't tried CacheFly, now is the perfect time. Try CacheFly's risk-free 2TB 14-Day trial&mdash;no credit card required. Use promo code: TINYMCE and get exclusive Pay-As-You-Go pricing. Sign up at <a href="http://www.cachefly.com">www.cachefly.com</a>.</p>
@@ -1,5 +0,0 @@
<p>The <a href="/download/compressors.php">TinyMCE gzip compressors</a>&nbsp;helps you to dynamically combine and compress the different parts of TinyMCE to reduce the loading time. These compressors are very easy to use as of 4.x just drop the script into the tinymce folder change the path to the script from tinymce.min.js to tinymce.gzip.js and it will compress for you automatically when you call tinymce.init to create editor instances.</p>
<h3>Example using the tinymce.gzip.js</h3>
<pre class="js">&lt;script src="/js/tinymce/tinymce.gzip.js"&gt;&lt;/script&gt;<br />&lt;script&gt;<br />tinymce.init({<br />&nbsp;&nbsp;&nbsp;&nbsp;selector: 'textarea',<br />&nbsp;&nbsp;&nbsp;&nbsp;plugins: 'image link'<br />});<br />&lt;/script&gt;</pre>
<h3>Example using the jQuery plugin</h3>
<pre class="js">&lt;script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"&gt;&lt;/script&gt;<br />&lt;script src="js/tinymce/jquery.tinymce.min.js"&gt;&lt;/script&gt;<br />&lt;script&gt;<br /> $(function() {<br /> $('textarea.tinymce').tinymce({<br /> script_url: 'js/tinymce/tinymce.gzip.php',<br /> plugins: 'media,code'<br /> });<br /> });<br />&lt;/script&gt;</pre>
+13 -5
View File
@@ -5,11 +5,11 @@
<title>TinyMCE - {{ page.title }}</title>
<meta name="author" content="Joshua Haines" />
<script src="//code.jquery.com/jquery-2.1.4.min.js"></script>
<link href="../assets/css/theme.css" rel="stylesheet">
<link href="/assets/css/theme.css" rel="stylesheet">
<!-- Bootstrap -->
<link href="../assets/bootstrap-3.3.5-dist/css/bootstrap.min.css" rel="stylesheet">
<link href="/assets/bootstrap-3.3.5-dist/css/bootstrap.min.css" rel="stylesheet">
<!-- Optional theme -->
<link href="../assets/bootstrap-3.3.5-dist/css/bootstrap-theme.min.css" rel="stylesheet" >
<link href="/assets/bootstrap-3.3.5-dist/css/bootstrap-theme.min.css" rel="stylesheet" >
</head>
<body role="document">
<!-- Fixed navbar -->
@@ -34,10 +34,18 @@
</nav>
<div class="container theme-showcase" role="main">
{{ content }}
<div class="col-xs-9">
{{ content }}
</div>
<div class="col-xs-3">
<div style="position: fixed" id="sidebar">
{% include nav.html pages=site.data.nav precedingaddress="/"%}
</div>
</div>
</div>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="../assets/bootstrap-3.3.5-dist/js/bootstrap.min.js"></script>
<script src="/assets/bootstrap-3.3.5-dist/js/bootstrap.min.js"></script>
</body>
</html>
@@ -1,75 +0,0 @@
---
categories:
- tinymce
- AddOnManager
---
<div class="api classdetails">
<div class="description">This class handles the loading of themes/plugins or other add-ons and their language packs.</div>
<div class="methods">
<h2>Methods</h2>
<table>
<thead class="small">
<tr>
<th class="first">Method</th>
<th class="last">Defined By</th>
</tr>
</thead>
<tbody>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.AddOnManager.add" class="member">add</a></div>
<div>Adds a instance of the add-on by it's short name</div>
</td>
<td class="last">
tinymce.AddOnManager
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.AddOnManager.addComponents" class="member">addComponents</a></div>
<div>Add a set of components that will make up the add-on</div>
</td>
<td class="last">
tinymce.AddOnManager
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.AddOnManager.get" class="member">get</a></div>
<div>Returns the specified add on by the short name</div>
</td>
<td class="last">
tinymce.AddOnManager
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.AddOnManager.load" class="member">load</a></div>
<div>Loads an add-on from a specific url</div>
</td>
<td class="last">
tinymce.AddOnManager
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.AddOnManager.requireLangPack" class="member">requireLangPack</a></div>
<div>Loads a language pack for the specified add-on</div>
</td>
<td class="last">
tinymce.AddOnManager
</td>
</tr>
</tbody>
</table>
</div>
</div>
@@ -1,155 +0,0 @@
---
categories:
- tinymce
- CommandEvent
---
<div class="api classdetails">
<div class="classinfo">
<table>
<tbody>
<tr>
<td class="first">Inheritance</td>
<td class="last">
<ul class="inherits">
<li class="first">CommandEvent</li>
<li><a href="/wiki.php/api4:class.tinymce.Event">Event</a></li>
</ul>
</td>
</tr>
</tbody>
</table>
</div>
<div class="description">This class is the event object send when the BeforeExecCommand and ExecCommand event occurs.</div>
<div class="examples">
<h2>Examples</h2>
<pre class="js prettyprint"><span class="pln">tinymce</span><span class="pun">.</span><span class="pln">activeEditor</span><span class="pun">.</span><span class="pln">on</span><span class="pun">(</span><span class="str">'ExecCommand'</span><span class="pun">,</span><span class="pln"> </span><span class="kwd">function</span><span class="pun">(</span><span class="pln">e</span><span class="pun">)</span><span class="pln"> </span><span class="pun">{</span><span class="pln"><br>&nbsp; &nbsp; console</span><span class="pun">.</span><span class="pln">log</span><span class="pun">(</span><span class="pln">e</span><span class="pun">.</span><span class="pln">command</span><span class="pun">,</span><span class="pln"> e</span><span class="pun">.</span><span class="pln">ui</span><span class="pun">,</span><span class="pln"> e</span><span class="pun">.</span><span class="pln">value</span><span class="pun">);</span><span class="pln"><br></span><span class="pun">});</span></pre>
</div>
<div class="properties">
<h2>Properties</h2>
<table>
<thead class="small">
<tr>
<th class="first">Property</th>
<th class="last">Defined By</th>
</tr>
</thead>
<tbody>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:property.tinymce.CommandEvent.command" class="member">command</a></div>
<div>Name of the command to execute</div>
</td>
<td class="last">
tinymce.CommandEvent
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:property.tinymce.Event.type" class="member">type</a></div>
<div>The event type name for example "click"</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.Event">tinymce.Event</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:property.tinymce.CommandEvent.ui" class="member">ui</a></div>
<div> User interface state</div>
</td>
<td class="last">
tinymce.CommandEvent
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:property.tinymce.CommandEvent.value" class="member">value</a></div>
<div>Value object for the execCommand call</div>
</td>
<td class="last">
tinymce.CommandEvent
</td>
</tr>
</tbody>
</table>
</div>
<div class="methods">
<h2>Methods</h2>
<table>
<thead class="small">
<tr>
<th class="first">Method</th>
<th class="last">Defined By</th>
</tr>
</thead>
<tbody>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.Event.isDefaultPrevented" class="member">isDefaultPrevented</a></div>
<div>Returns true/false if the default action is to be prevented or not</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.Event">tinymce.Event</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.Event.isImmediatePropagationStopped" class="member">isImmediatePropagationStopped</a></div>
<div>Returns true/false if the event immediate propagation is stopped or not</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.Event">tinymce.Event</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.Event.isPropagationStopped" class="member">isPropagationStopped</a></div>
<div>Returns true/false if the event propagation is stopped or not</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.Event">tinymce.Event</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.Event.preventDefault" class="member">preventDefault</a></div>
<div>Prevents the default action of an event to be executed</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.Event">tinymce.Event</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.Event.stopImmediatePropagation" class="member">stopImmediatePropagation</a></div>
<div>Prevents the event from propagating to listeners on the same object</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.Event">tinymce.Event</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.Event.stopPropagation" class="member">stopPropagation</a></div>
<div>Stops the event from propagating up to listeners on parent objects</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.Event">tinymce.Event</a>
</td>
</tr>
</tbody>
</table>
</div>
</div>
@@ -1,74 +0,0 @@
---
categories:
- tinymce
- dom
---
<div class="api namespacedetails">
<div class="details">Contains classes for handling the browsers DOM.</div>
<div class="classes">
<h2>Classes</h2>
<table>
<thead class="small">
<tr>
<th class="first">Class</th>
<th class="last">Summary</th>
</tr>
</thead>
<tbody>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.dom.BookmarkManager" class="class">tinymce.dom.BookmarkManager</a></td>
<td class="last">This class handles selection bookmarks</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.dom.ControlSelection" class="class">tinymce.dom.ControlSelection</a></td>
<td class="last">This class handles control selection of elements</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.dom.DomQuery" class="class">tinymce.dom.DomQuery</a></td>
<td class="last">This class mimics most of the jQuery API:
This is whats currently implemented:
- Utility functions
</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.dom.DOMUtils" class="class">tinymce.dom.DOMUtils</a></td>
<td class="last">Utility class for various DOM manipulation and retrieval functions</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.dom.EventUtils" class="class">tinymce.dom.EventUtils</a></td>
<td class="last">This class wraps the browsers native event logic with more convenient methods</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.dom.RangeUtils" class="class">tinymce.dom.RangeUtils</a></td>
<td class="last">This class contains a few utility methods for ranges</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.dom.ScriptLoader" class="class">tinymce.dom.ScriptLoader</a></td>
<td class="last">This class handles asynchronous/synchronous loading of JavaScript files it will execute callbacks
wh</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.dom.Selection" class="class">tinymce.dom.Selection</a></td>
<td class="last">This class handles text and control selection it's an crossbrowser utility class</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.dom.Serializer" class="class">tinymce.dom.Serializer</a></td>
<td class="last">This class is used to serialize DOM trees into a string</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.dom.TreeWalker" class="class">tinymce.dom.TreeWalker</a></td>
<td class="last">TreeWalker class enables you to walk the DOM in a linear manner</td>
</tr>
</tbody>
</table>
</div>
</div>
@@ -1,61 +0,0 @@
---
categories:
- tinymce
- html
---
<div class="api namespacedetails">
<div class="details">Contains html parser and serializer logic.</div>
<div class="classes">
<h2>Classes</h2>
<table>
<thead class="small">
<tr>
<th class="first">Class</th>
<th class="last">Summary</th>
</tr>
</thead>
<tbody>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.html.DomParser" class="class">tinymce.html.DomParser</a></td>
<td class="last">This class parses HTML code into a DOM like structure of nodes it will remove redundant whitespace a</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.html.Entities" class="class">tinymce.html.Entities</a></td>
<td class="last">Entity encoder class</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.html.Node" class="class">tinymce.html.Node</a></td>
<td class="last">This class is a minimalistic implementation of a DOM like node used by the DomParser class</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.html.SaxParser" class="class">tinymce.html.SaxParser</a></td>
<td class="last">This class parses HTML code using pure JavaScript and executes various events for each item it finds</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.html.Schema" class="class">tinymce.html.Schema</a></td>
<td class="last">Schema validator class</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.html.Serializer" class="class">tinymce.html.Serializer</a></td>
<td class="last">This class is used to serialize down the DOM tree into a string using a Writer instance</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.html.Styles" class="class">tinymce.html.Styles</a></td>
<td class="last">This class is used to parse CSS styles it also compresses styles to reduce the output size</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.html.Writer" class="class">tinymce.html.Writer</a></td>
<td class="last">This class is used to write HTML tags out it can be used with the Serializer or the SaxParser</td>
</tr>
</tbody>
</table>
</div>
</div>
@@ -1,147 +0,0 @@
---
categories:
- tinymce
---
<div class="api namespacedetails">
<div class="details">Root level namespace this contains classes directly releated to the TinyMCE editor.</div>
<div class="namespaces">
<h2>Namespaces</h2>
<table>
<thead class="small">
<tr>
<th class="first">Namespace</th>
<th class="last">Summary</th>
</tr>
</thead>
<tbody>
<tr>
<td class="first"><a href="/wiki.php/api4:namespace.tinymce.dom" class="namespace">tinymce.dom</a></td>
<td class="last">Contains classes for handling the browsers DOM.</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:namespace.tinymce.html" class="namespace">tinymce.html</a></td>
<td class="last">Contains html parser and serializer logic.</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:namespace.tinymce.ui" class="namespace">tinymce.ui</a></td>
<td class="last">Contains the different UI types such as buttons, listboxes etc.</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:namespace.tinymce.util" class="namespace">tinymce.util</a></td>
<td class="last">Contains various utility classes such as json parser, cookies etc.</td>
</tr>
</tbody>
</table>
</div>
<div class="classes">
<h2>Classes</h2>
<table>
<thead class="small">
<tr>
<th class="first">Class</th>
<th class="last">Summary</th>
</tr>
</thead>
<tbody>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.AddOnManager" class="class">tinymce.AddOnManager</a></td>
<td class="last">This class handles the loading of themes/plugins or other add-ons and their language packs</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.Theme" class="class">tinymce.Theme</a></td>
<td class="last">TinyMCE theme class</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.Plugin" class="class">tinymce.Plugin</a></td>
<td class="last">Plugin base class, this is a pseudo class that describes how a plugin is to be created for TinyMCE</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.Event" class="class">tinymce.Event</a></td>
<td class="last">This is the base class for all TinyMCE events</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ContentEvent" class="class">tinymce.ContentEvent</a></td>
<td class="last">This class is the event object send when the content events occurs such as GetContent/SetContent</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.CommandEvent" class="class">tinymce.CommandEvent</a></td>
<td class="last">This class is the event object send when the BeforeExecCommand and ExecCommand event occurs</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ProgressStateEvent" class="class">tinymce.ProgressStateEvent</a></td>
<td class="last">This class is the event object send when the ProgressState event occurs</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.FocusEvent" class="class">tinymce.FocusEvent</a></td>
<td class="last">This class is the event object sent when editors are focused/blurred</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ResizeEvent" class="class">tinymce.ResizeEvent</a></td>
<td class="last">This class is the event object sent when objects gets resized within the editor</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.Editor" class="class">tinymce.Editor</a></td>
<td class="last">This class contains the core logic for a TinyMCE editor</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.EditorCommands" class="class">tinymce.EditorCommands</a></td>
<td class="last">This class enables you to add custom editor commands and it contains
overrides for native browser co</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.EditorManager" class="class">tinymce.EditorManager</a></td>
<td class="last">This class used as a factory for manager for tinymce</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.Env" class="class">tinymce.Env</a></td>
<td class="last">This class contains various environment constants like browser versions etc</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.FocusManager" class="class">tinymce.FocusManager</a></td>
<td class="last">This class manages the focus/blur state of the editor</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.Formatter" class="class">tinymce.Formatter</a></td>
<td class="last">Text formatter engine class</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.Shortcuts" class="class">tinymce.Shortcuts</a></td>
<td class="last">Contains all logic for handling of keyboard shortcuts</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.UndoManager" class="class">tinymce.UndoManager</a></td>
<td class="last">This class handles the undo/redo history levels for the editor</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.WindowManager" class="class">tinymce.WindowManager</a></td>
<td class="last">This class handles the creation of native windows and dialogs</td>
</tr>
</tbody>
</table>
</div>
<div class="mixins">
<h2>Mixins</h2>
<table>
<thead class="small">
<tr>
<th class="first">Mixin</th>
<th class="last">Summary</th>
</tr>
</thead>
<tbody>
<tr>
<td class="first"><a href="/wiki.php/api4:mixin.tinymce.EditorObservable" class="mixin">tinymce.EditorObservable</a></td>
<td class="last">This mixin contains the event logic for the tinymce</td>
</tr>
</tbody>
</table>
</div>
</div>
@@ -1,269 +0,0 @@
---
categories:
- tinymce
- ui
---
<div class="api namespacedetails">
<div class="details">Contains the different UI types such as buttons, listboxes etc.</div>
<div class="classes">
<h2>Classes</h2>
<table>
<thead class="small">
<tr>
<th class="first">Class</th>
<th class="last">Summary</th>
</tr>
</thead>
<tbody>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ui.AbsoluteLayout" class="class">tinymce.ui.AbsoluteLayout</a></td>
<td class="last">LayoutManager for absolute positioning</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ui.Button" class="class">tinymce.ui.Button</a></td>
<td class="last">This class is used to create buttons</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ui.ButtonGroup" class="class">tinymce.ui.ButtonGroup</a></td>
<td class="last">This control enables you to put multiple buttons into a group</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ui.Checkbox" class="class">tinymce.ui.Checkbox</a></td>
<td class="last">This control creates a custom checkbox</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ui.Collection" class="class">tinymce.ui.Collection</a></td>
<td class="last">Control collection, this class contains control instances and it enables you to
perform actions on a</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ui.ColorBox" class="class">tinymce.ui.ColorBox</a></td>
<td class="last">This widget lets you enter colors and browse for colors by pressing the color button</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ui.ColorButton" class="class">tinymce.ui.ColorButton</a></td>
<td class="last">This class creates a color button control</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ui.ColorPicker" class="class">tinymce.ui.ColorPicker</a></td>
<td class="last">Color picker widget lets you select colors</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ui.ComboBox" class="class">tinymce.ui.ComboBox</a></td>
<td class="last">This class creates a combobox control</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ui.Container" class="class">tinymce.ui.Container</a></td>
<td class="last">Container control</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ui.Control" class="class">tinymce.ui.Control</a></td>
<td class="last">This is the base class for all controls and containers</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ui.DragHelper" class="class">tinymce.ui.DragHelper</a></td>
<td class="last">Drag/drop helper class</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ui.ElementPath" class="class">tinymce.ui.ElementPath</a></td>
<td class="last">This control creates an path for the current selections parent elements in TinyMCE</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ui.Factory" class="class">tinymce.ui.Factory</a></td>
<td class="last">This class is a factory for control instances</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ui.FieldSet" class="class">tinymce.ui.FieldSet</a></td>
<td class="last">This class creates fieldset containers</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ui.FilePicker" class="class">tinymce.ui.FilePicker</a></td>
<td class="last">This class creates a file picker control</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ui.FitLayout" class="class">tinymce.ui.FitLayout</a></td>
<td class="last">This layout manager will resize the control to be the size of it's parent container</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ui.FlexLayout" class="class">tinymce.ui.FlexLayout</a></td>
<td class="last">This layout manager works similar to the CSS flex box</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ui.FloatPanel" class="class">tinymce.ui.FloatPanel</a></td>
<td class="last">This class creates a floating panel</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ui.FlowLayout" class="class">tinymce.ui.FlowLayout</a></td>
<td class="last">This layout manager will place the controls by using the browsers native layout</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ui.Form" class="class">tinymce.ui.Form</a></td>
<td class="last">This class creates a form container</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ui.FormatControls" class="class">tinymce.ui.FormatControls</a></td>
<td class="last">Internal class containing all TinyMCE specific control types such as
format listboxes, fontlist boxe</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ui.FormItem" class="class">tinymce.ui.FormItem</a></td>
<td class="last">This class is a container created by the form element with
a label and control item</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ui.GridLayout" class="class">tinymce.ui.GridLayout</a></td>
<td class="last">This layout manager places controls in a grid</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ui.Iframe" class="class">tinymce.ui.Iframe</a></td>
<td class="last">This class creates an iframe</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ui.KeyboardNavigation" class="class">tinymce.ui.KeyboardNavigation</a></td>
<td class="last">This class handles keyboard navigation of controls and elements</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ui.Label" class="class">tinymce.ui.Label</a></td>
<td class="last">This class creates a label element</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ui.Layout" class="class">tinymce.ui.Layout</a></td>
<td class="last">Base layout manager class</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ui.ListBox" class="class">tinymce.ui.ListBox</a></td>
<td class="last">Creates a new list box control</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ui.Menu" class="class">tinymce.ui.Menu</a></td>
<td class="last">Creates a new menu</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ui.MenuBar" class="class">tinymce.ui.MenuBar</a></td>
<td class="last">Creates a new menubar</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ui.MenuButton" class="class">tinymce.ui.MenuButton</a></td>
<td class="last">Creates a new menu button</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ui.MenuItem" class="class">tinymce.ui.MenuItem</a></td>
<td class="last">Creates a new menu item</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ui.MessageBox" class="class">tinymce.ui.MessageBox</a></td>
<td class="last">This class is used to create MessageBoxes like alerts/confirms etc</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ui.Panel" class="class">tinymce.ui.Panel</a></td>
<td class="last">Creates a new panel</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ui.PanelButton" class="class">tinymce.ui.PanelButton</a></td>
<td class="last">Creates a new panel button</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ui.Path" class="class">tinymce.ui.Path</a></td>
<td class="last">Creates a new path control</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ui.Radio" class="class">tinymce.ui.Radio</a></td>
<td class="last">Creates a new radio button</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ui.Rect" class="class">tinymce.ui.Rect</a></td>
<td class="last">Contains various tools for rect/position calculation</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ui.ReflowQueue" class="class">tinymce.ui.ReflowQueue</a></td>
<td class="last">This class will automatically reflow controls on the next animation frame within a few milliseconds </td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ui.ResizeHandle" class="class">tinymce.ui.ResizeHandle</a></td>
<td class="last">Renders a resize handle that fires ResizeStart, Resize and ResizeEnd events</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ui.Selector" class="class">tinymce.ui.Selector</a></td>
<td class="last">Selector engine, enables you to select controls by using CSS like expressions</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ui.Slider" class="class">tinymce.ui.Slider</a></td>
<td class="last">Slider control</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ui.Spacer" class="class">tinymce.ui.Spacer</a></td>
<td class="last">Creates a spacer</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ui.SplitButton" class="class">tinymce.ui.SplitButton</a></td>
<td class="last">Creates a split button</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ui.StackLayout" class="class">tinymce.ui.StackLayout</a></td>
<td class="last">This layout uses the browsers layout when the items are blocks</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ui.TabPanel" class="class">tinymce.ui.TabPanel</a></td>
<td class="last">Creates a tab panel control</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ui.TextBox" class="class">tinymce.ui.TextBox</a></td>
<td class="last">Creates a new textbox</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ui.Throbber" class="class">tinymce.ui.Throbber</a></td>
<td class="last">This class enables you to display a Throbber for any element</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ui.Toolbar" class="class">tinymce.ui.Toolbar</a></td>
<td class="last">Creates a new toolbar</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ui.ToolTip" class="class">tinymce.ui.ToolTip</a></td>
<td class="last">Creates a tooltip instance</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ui.Widget" class="class">tinymce.ui.Widget</a></td>
<td class="last">Widget base class a widget is a control that has a tooltip and some basic states</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.ui.Window" class="class">tinymce.ui.Window</a></td>
<td class="last">Creates a new window</td>
</tr>
</tbody>
</table>
</div>
<div class="mixins">
<h2>Mixins</h2>
<table>
<thead class="small">
<tr>
<th class="first">Mixin</th>
<th class="last">Summary</th>
</tr>
</thead>
<tbody>
<tr>
<td class="first"><a href="/wiki.php/api4:mixin.tinymce.ui.Movable" class="mixin">tinymce.ui.Movable</a></td>
<td class="last">Movable mixin</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:mixin.tinymce.ui.Resizable" class="mixin">tinymce.ui.Resizable</a></td>
<td class="last">Resizable mixin</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:mixin.tinymce.ui.Scrollable" class="mixin">tinymce.ui.Scrollable</a></td>
<td class="last">This mixin makes controls scrollable using custom scrollbars</td>
</tr>
</tbody>
</table>
</div>
</div>
@@ -1,82 +0,0 @@
---
categories:
- tinymce
- util
---
<div class="api namespacedetails">
<div class="details">Contains various utility classes such as json parser, cookies etc.</div>
<div class="classes">
<h2>Classes</h2>
<table>
<thead class="small">
<tr>
<th class="first">Class</th>
<th class="last">Summary</th>
</tr>
</thead>
<tbody>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.util.Color" class="class">tinymce.util.Color</a></td>
<td class="last">This class lets you parse/serialize colors and convert rgb/hsb</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.util.EventDispatcher" class="class">tinymce.util.EventDispatcher</a></td>
<td class="last">This class lets you add/remove and fire events by name on the specified scope</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.util.I18n" class="class">tinymce.util.I18n</a></td>
<td class="last">I18n class that handles translation of TinyMCE UI</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.util.JSON" class="class">tinymce.util.JSON</a></td>
<td class="last">JSON parser and serializer class</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.util.JSONRequest" class="class">tinymce.util.JSONRequest</a></td>
<td class="last">This class enables you to use JSON-RPC to call backend methods</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.util.LocalStorage" class="class">tinymce.util.LocalStorage</a></td>
<td class="last">This class will simulate LocalStorage on IE 7 and return the native version on modern browsers</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.util.Tools" class="class">tinymce.util.Tools</a></td>
<td class="last">This class contains various utlity functions</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.util.URI" class="class">tinymce.util.URI</a></td>
<td class="last">This class handles parsing, modification and serialization of URI/URL strings</td>
</tr>
<tr>
<td class="first"><a href="/wiki.php/api4:class.tinymce.util.XHR" class="class">tinymce.util.XHR</a></td>
<td class="last">This class enables you to send XMLHTTPRequests cross browser</td>
</tr>
</tbody>
</table>
</div>
<div class="mixins">
<h2>Mixins</h2>
<table>
<thead class="small">
<tr>
<th class="first">Mixin</th>
<th class="last">Summary</th>
</tr>
</thead>
<tbody>
<tr>
<td class="first"><a href="/wiki.php/api4:mixin.tinymce.util.Observable" class="mixin">tinymce.util.Observable</a></td>
<td class="last">This mixin will add event binding logic to classes</td>
</tr>
</tbody>
</table>
</div>
</div>
@@ -1,80 +0,0 @@
---
categories:
- tinymce
- dom
- BookmarkManager
---
<div class="api classdetails">
<div class="description">This class handles selection bookmarks.</div>
<div class="constructors">
<h2>Constructors</h2>
<table>
<thead class="small">
<tr>
<th class="first">Method</th>
<th class="last">Defined By</th>
</tr>
</thead>
<tbody>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:constructor.tinymce.dom.BookmarkManager.BookmarkManager" class="member">BookmarkManager</a></div>
<div>Constructs a new BookmarkManager instance for a specific selection instance</div>
</td>
<td class="last">
tinymce.dom.BookmarkManager
</td>
</tr>
</tbody>
</table>
</div>
<div class="methods">
<h2>Methods</h2>
<table>
<thead class="small">
<tr>
<th class="first">Method</th>
<th class="last">Defined By</th>
</tr>
</thead>
<tbody>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.BookmarkManager.getBookmark" class="member">getBookmark</a></div>
<div>Returns a bookmark location for the current selection</div>
</td>
<td class="last">
tinymce.dom.BookmarkManager
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.BookmarkManager.isBookmarkNode.static" class="member">isBookmarkNode</a> <span class="static">static</span></div>
<div>Returns true/false if the specified node is a bookmark node or not</div>
</td>
<td class="last">
tinymce.dom.BookmarkManager
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.BookmarkManager.moveToBookmark" class="member">moveToBookmark</a></div>
<div>Restores the selection to the specified bookmark</div>
</td>
<td class="last">
tinymce.dom.BookmarkManager
</td>
</tr>
</tbody>
</table>
</div>
</div>
@@ -1,14 +0,0 @@
---
categories:
- tinymce
- dom
- ControlSelection
---
<div class="api classdetails">
<div class="description">This class handles control selection of elements. Controls are elements
that can be resized and needs to be selected as a whole. It adds custom resize handles
to all browser engines that support properly disabling the built in resize logic.</div>
</div>
@@ -1,614 +0,0 @@
---
categories:
- tinymce
- dom
- DomQuery
---
<div class="api classdetails">
<div class="description">This class mimics most of the jQuery API:
This is whats currently implemented:
- Utility functions
- DOM traversial
- DOM manipulation
- Event binding
This is not currently implemented:
- Dimension
- Ajax
- Animation
- Advanced chaining</div>
<div class="examples">
<h2>Examples</h2>
<pre class="js prettyprint"><span class="kwd">var</span><span class="pln"> $ </span><span class="pun">=</span><span class="pln"> tinymce</span><span class="pun">.</span><span class="pln">dom</span><span class="pun">.</span><span class="typ">DomQuery</span><span class="pun">;</span><span class="pln"><br>$</span><span class="pun">(</span><span class="str">'p'</span><span class="pun">).</span><span class="pln">attr</span><span class="pun">(</span><span class="str">'attr'</span><span class="pun">,</span><span class="pln"> </span><span class="str">'value'</span><span class="pun">).</span><span class="pln">addClass</span><span class="pun">(</span><span class="str">'class'</span><span class="pun">);</span></pre>
</div>
<div class="properties">
<h2>Properties</h2>
<table>
<thead class="small">
<tr>
<th class="first">Property</th>
<th class="last">Defined By</th>
</tr>
</thead>
<tbody>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:property.tinymce.dom.DomQuery.context" class="member">context</a></div>
<div>Context used to create the set</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:property.tinymce.dom.DomQuery.length" class="member">length</a></div>
<div>Number of items in the current set</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:property.tinymce.dom.DomQuery.selector" class="member">selector</a></div>
<div>Selector for the current set</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
</tbody>
</table>
</div>
<div class="constructors">
<h2>Constructors</h2>
<table>
<thead class="small">
<tr>
<th class="first">Method</th>
<th class="last">Defined By</th>
</tr>
</thead>
<tbody>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:constructor.tinymce.dom.DomQuery.DomQuery" class="member">DomQuery</a></div>
<div>Constructs a new DomQuery instance with the specified selector or context</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
</tbody>
</table>
</div>
<div class="methods">
<h2>Methods</h2>
<table>
<thead class="small">
<tr>
<th class="first">Method</th>
<th class="last">Defined By</th>
</tr>
</thead>
<tbody>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.add" class="member">add</a></div>
<div>Adds new nodes to the set</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.addClass" class="member">addClass</a></div>
<div>Adds the specified class name to the current set elements</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.after" class="member">after</a></div>
<div>Adds the specified elements after current set nodes</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.append" class="member">append</a></div>
<div>Appends the specified node/html or node set to the current set nodes</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.appendTo" class="member">appendTo</a></div>
<div>Appends the specified set nodes to the specified selector/instance</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.attr" class="member">attr</a></div>
<div>Sets/gets properties on the elements in the current set</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.before" class="member">before</a></div>
<div>Adds the specified elements before current set nodes</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.children" class="member">children</a></div>
<div>Returns all child elements matching the optional selector</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.clone" class="member">clone</a></div>
<div>Clones all nodes in set</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.closest" class="member">closest</a></div>
<div>Gets the current node or any partent matching the specified selector</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.contents" class="member">contents</a></div>
<div>Returns all child nodes matching the optional selector</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.css" class="member">css</a></div>
<div>Sets/gets styles on the elements in the current set</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.each" class="member">each</a></div>
<div>Executes the callback function for each item DomQuery collection</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.each.static" class="member">each</a> <span class="static">static</span></div>
<div>Executes the callback function for each item in array/object</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.empty" class="member">empty</a></div>
<div>Empties all elements in set</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.eq" class="member">eq</a></div>
<div>Makes the set equal to the specified index</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.extend.static" class="member">extend</a> <span class="static">static</span></div>
<div>Extends the specified object with one or more objects</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.filter" class="member">filter</a></div>
<div>Filters the current set with the specified selector</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.find" class="member">find</a></div>
<div>Finds elements by the specified selector for each element in set</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.first" class="member">first</a></div>
<div>Makes the set equal to first element in set</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.grep.static" class="member">grep</a> <span class="static">static</span></div>
<div>Filters out items from the input array by calling the specified function for each item</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.hasClass" class="member">hasClass</a></div>
<div>Returns true/false if the first item in set has the specified class</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.hide" class="member">hide</a></div>
<div>Hides all elements in set</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.html" class="member">html</a></div>
<div>Sets or gets the HTML of the current set or first set node</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.inArray.static" class="member">inArray</a> <span class="static">static</span></div>
<div>Returns the index of the specified item inside the array</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.is" class="member">is</a></div>
<div>Returns true/false if the current set items matches the selector</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.isArray.static" class="member">isArray</a> <span class="static">static</span></div>
<div>Returns true/false if the specified object is an array or not</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.last" class="member">last</a></div>
<div>Makes the set equal to last element in set</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.makeArray.static" class="member">makeArray</a> <span class="static">static</span></div>
<div>Creates an array out of an array like object</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.next" class="member">next</a></div>
<div>Returns a new collection with next sibling of each item in current collection matching the optional </div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.nextUntil" class="member">nextUntil</a></div>
<div>Returns a new collection with all next siblings of each item in current collection matching the opti</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.off" class="member">off</a></div>
<div>Unbinds an event with callback function to the elements in set</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.offset" class="member">offset</a></div>
<div>Returns the offset of the first element in set or sets the top/left css properties of all elements i</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.on" class="member">on</a></div>
<div>Binds an event with callback function to the elements in set</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.parent" class="member">parent</a></div>
<div>Returns a new collection with the parent of each item in current collection matching the optional se</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.parents" class="member">parents</a></div>
<div>Returns a new collection with the all the parents of each item in current collection matching the op</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.parentsUntil" class="member">parentsUntil</a></div>
<div>Returns a new collection with the all the parents until the matching selector/element
of each item i</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.prepend" class="member">prepend</a></div>
<div>Prepends the specified node/html or node set to the current set nodes</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.prependTo" class="member">prependTo</a></div>
<div>Prepends the specified set nodes to the specified selector/instance</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.prev" class="member">prev</a></div>
<div>Returns a new collection with previous sibling of each item in current collection matching the optio</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.prevUntil" class="member">prevUntil</a></div>
<div>Returns a new collection with all previous siblings of each item in current collection matching the </div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.remove" class="member">remove</a></div>
<div>Removes all nodes in set from the document</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.removeAttr" class="member">removeAttr</a></div>
<div>Removes attributse on the elements in the current set</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.removeClass" class="member">removeClass</a></div>
<div>Removes the specified class name to the current set elements</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.replaceWith" class="member">replaceWith</a></div>
<div>Replaces the nodes in set with the specified content</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.show" class="member">show</a></div>
<div>Shows all elements in set</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.slice" class="member">slice</a></div>
<div>Slices the current set</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.text" class="member">text</a></div>
<div>Sets or gets the text of the current set or first set node</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.toArray" class="member">toArray</a></div>
<div>Converts the current set to an array</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.toggleClass" class="member">toggleClass</a></div>
<div>Toggles the specified class name on the current set elements</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.trigger" class="member">trigger</a></div>
<div>Triggers the specified event by name or event object</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.trim.static" class="member">trim</a> <span class="static">static</span></div>
<div>Removes whitespace from the beginning and end of a string</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.unwrap" class="member">unwrap</a></div>
<div>Unwraps all elements by removing the parent element of each item in set</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.wrap" class="member">wrap</a></div>
<div>Wraps all elements in set with the specified wrapper</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.wrapAll" class="member">wrapAll</a></div>
<div>Wraps all nodes in set with the specified wrapper</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DomQuery.wrapInner" class="member">wrapInner</a></div>
<div>Wraps all elements inner contents in set with the specified wrapper</div>
</td>
<td class="last">
tinymce.dom.DomQuery
</td>
</tr>
</tbody>
</table>
</div>
</div>
@@ -1,593 +0,0 @@
---
categories:
- tinymce
- dom
- DomUtils
---
<div class="api classdetails">
<div class="description">Utility class for various DOM manipulation and retrieval functions.</div>
<div class="examples">
<h2>Examples</h2>
<pre class="js prettyprint"><span class="com">// Add a class to an element by id in the page</span><span class="pln"><br>tinymce</span><span class="pun">.</span><span class="pln">DOM</span><span class="pun">.</span><span class="pln">addClass</span><span class="pun">(</span><span class="str">'someid'</span><span class="pun">,</span><span class="pln"> </span><span class="str">'someclass'</span><span class="pun">);</span><span class="pln"><br><br></span><span class="com">// Add a class to an element by id inside the editor</span><span class="pln"><br>tinymce</span><span class="pun">.</span><span class="pln">activeEditor</span><span class="pun">.</span><span class="pln">dom</span><span class="pun">.</span><span class="pln">addClass</span><span class="pun">(</span><span class="str">'someid'</span><span class="pun">,</span><span class="pln"> </span><span class="str">'someclass'</span><span class="pun">);</span></pre>
</div>
<div class="properties">
<h2>Properties</h2>
<table>
<thead class="small">
<tr>
<th class="first">Property</th>
<th class="last">Defined By</th>
</tr>
</thead>
<tbody>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:property.tinymce.dom.DOMUtils.DOM.static" class="member">DOM</a> <span class="static">static</span></div>
<div>Instance of DOMUtils for the current document</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
</tbody>
</table>
</div>
<div class="constructors">
<h2>Constructors</h2>
<table>
<thead class="small">
<tr>
<th class="first">Method</th>
<th class="last">Defined By</th>
</tr>
</thead>
<tbody>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:constructor.tinymce.dom.DOMUtils.DOMUtils" class="member">DOMUtils</a></div>
<div>Constructs a new DOMUtils instance</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
</tbody>
</table>
</div>
<div class="methods">
<h2>Methods</h2>
<table>
<thead class="small">
<tr>
<th class="first">Method</th>
<th class="last">Defined By</th>
</tr>
</thead>
<tbody>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.add" class="member">add</a></div>
<div>Adds the specified element to another element or elements</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.addClass" class="member">addClass</a></div>
<div>Adds a class to the specified element or elements</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.addStyle" class="member">addStyle</a></div>
<div>Adds a style element at the top of the document with the specified cssText content</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.bind" class="member">bind</a></div>
<div>Adds an event handler to the specified object</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.create" class="member">create</a></div>
<div>Creates a new element</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.createFragment" class="member">createFragment</a></div>
<div>Creates a document fragment out of the specified HTML string</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.createHTML" class="member">createHTML</a></div>
<div>Creates HTML string for element</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.createRng" class="member">createRng</a></div>
<div>Creates a new DOM Range object</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.decode" class="member">decode</a></div>
<div>Entity decodes a string</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.destroy" class="member">destroy</a></div>
<div>Destroys all internal references to the DOM to solve IE leak issues</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.encode" class="member">encode</a></div>
<div>Entity encodes a string</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.findCommonAncestor" class="member">findCommonAncestor</a></div>
<div>Find the common ancestor of two elements</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.fire" class="member">fire</a></div>
<div>Fires the specified event name with object on target</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.get" class="member">get</a></div>
<div>Returns the specified element by ID or the input element if it isn't a string</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.getAttrib" class="member">getAttrib</a></div>
<div>Returns the specified attribute by name</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.getAttribs" class="member">getAttribs</a></div>
<div>Returns a NodeList with attributes for the element</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.getNext" class="member">getNext</a></div>
<div>Returns the next node that matches selector or function</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.getOuterHTML" class="member">getOuterHTML</a></div>
<div>Returns the outer HTML of an element</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.getParent" class="member">getParent</a></div>
<div>Returns a node by the specified selector function</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.getParents" class="member">getParents</a></div>
<div>Returns a node list of all parents matching the specified selector function or pattern</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.getPos" class="member">getPos</a></div>
<div>Returns the absolute x, y position of a node</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.getPrev" class="member">getPrev</a></div>
<div>Returns the previous node that matches selector or function</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.getRect" class="member">getRect</a></div>
<div>Returns the rectangle for a specific element</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.getRoot" class="member">getRoot</a></div>
<div>Returns the root node of the document</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.getSize" class="member">getSize</a></div>
<div>Returns the size dimensions of the specified element</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.getStyle" class="member">getStyle</a></div>
<div>Returns the current style or runtime/computed value of an element</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.getViewPort" class="member">getViewPort</a></div>
<div>Returns the viewport of the window</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.hasClass" class="member">hasClass</a></div>
<div>Returns true if the specified element has the specified class</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.hide" class="member">hide</a></div>
<div>Hides the specified element(s) by ID by setting the "display" style</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.insertAfter" class="member">insertAfter</a></div>
<div>Inserts an element after the reference element</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.is" class="member">is</a></div>
<div>Returns true/false if the specified element matches the specified css pattern</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.isBlock" class="member">isBlock</a></div>
<div>Returns true/false if the specified element is a block element or not</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.isEmpty" class="member">isEmpty</a></div>
<div>Returns true/false if the specified node is to be considered empty or not</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.isHidden" class="member">isHidden</a></div>
<div>Returns true/false if the element is hidden or not by checking the "display" style</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.loadCSS" class="member">loadCSS</a></div>
<div>Imports/loads the specified CSS file into the document bound to the class</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.nodeIndex" class="member">nodeIndex</a></div>
<div>Returns the index of the specified node within its parent</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.parseStyle" class="member">parseStyle</a></div>
<div>Parses the specified style value into an object collection</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.remove" class="member">remove</a></div>
<div>Removes/deletes the specified element(s) from the DOM</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.removeAllAttribs" class="member">removeAllAttribs</a></div>
<div>Removes all attributes from an element or elements</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.removeClass" class="member">removeClass</a></div>
<div>Removes a class from the specified element or elements</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.rename" class="member">rename</a></div>
<div>Renames the specified element and keeps its attributes and children</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.replace" class="member">replace</a></div>
<div>Replaces the specified element or elements with the new element specified</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.run" class="member">run</a></div>
<div>Executes the specified function on the element by id or dom element node or array of elements/id</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.select" class="member">select</a></div>
<div>Selects specific elements by a CSS level 3 pattern</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.serializeStyle" class="member">serializeStyle</a></div>
<div>Serializes the specified style object into a string</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.setAttrib" class="member">setAttrib</a></div>
<div>Sets the specified attribute of an element or elements</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.setAttribs" class="member">setAttribs</a></div>
<div>Sets two or more specified attributes of an element or elements</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.setHTML" class="member">setHTML</a></div>
<div>Sets the specified HTML content inside the element or elements</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.setOuterHTML" class="member">setOuterHTML</a></div>
<div>Sets the specified outer HTML on an element or elements</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.setStyle" class="member">setStyle</a></div>
<div>Sets the CSS style value on a HTML element</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.setStyles" class="member">setStyles</a></div>
<div>Sets multiple styles on the specified element(s)</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.show" class="member">show</a></div>
<div>Shows the specified element(s) by ID by setting the "display" style</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.split" class="member">split</a></div>
<div>Splits an element into two new elements and places the specified split
element or elements between t</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.toHex" class="member">toHex</a></div>
<div>Parses the specified RGB color value and returns a hex version of that color</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.toggleClass" class="member">toggleClass</a></div>
<div>Toggles the specified class on/off</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.unbind" class="member">unbind</a></div>
<div>Removes the specified event handler by name and function from an element or collection of elements</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.DOMUtils.uniqueId" class="member">uniqueId</a></div>
<div>Returns a unique id</div>
</td>
<td class="last">
tinymce.dom.DOMUtils
</td>
</tr>
</tbody>
</table>
</div>
</div>
@@ -1,67 +0,0 @@
---
categories:
- tinymce
- dom
- EventUtils
---
<div class="api classdetails">
<div class="description">This class wraps the browsers native event logic with more convenient methods.</div>
<div class="methods">
<h2>Methods</h2>
<table>
<thead class="small">
<tr>
<th class="first">Method</th>
<th class="last">Defined By</th>
</tr>
</thead>
<tbody>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.EventUtils.bind" class="member">bind</a></div>
<div>Binds a callback to an event on the specified target</div>
</td>
<td class="last">
tinymce.dom.EventUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.EventUtils.clean" class="member">clean</a></div>
<div>Removes all bound event listeners for the specified target</div>
</td>
<td class="last">
tinymce.dom.EventUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.EventUtils.fire" class="member">fire</a></div>
<div>Fires the specified event on the specified target</div>
</td>
<td class="last">
tinymce.dom.EventUtils
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.dom.EventUtils.unbind" class="member">unbind</a></div>
<div>Unbinds the specified event by name, name and callback or all events on the target</div>
</td>
<td class="last">
tinymce.dom.EventUtils
</td>
</tr>
</tbody>
</table>
</div>
</div>
@@ -1,96 +0,0 @@
---
categories:
- tinymce
- html
- DomParser
---
<div class="api classdetails">
<div class="description">This class parses HTML code into a DOM like structure of nodes it will remove redundant whitespace and make
sure that the node tree is valid according to the specified schema.
So for example: &lt;p&gt;a&lt;p&gt;b&lt;/p&gt;c&lt;/p&gt; will become &lt;p&gt;a&lt;/p&gt;&lt;p&gt;b&lt;/p&gt;&lt;p&gt;c&lt;/p&gt;</div>
<div class="examples">
<h2>Examples</h2>
<pre class="js prettyprint"><span class="kwd">var</span><span class="pln"> parser </span><span class="pun">=</span><span class="pln"> </span><span class="kwd">new</span><span class="pln"> tinymce</span><span class="pun">.</span><span class="pln">html</span><span class="pun">.</span><span class="typ">DomParser</span><span class="pun">({</span><span class="pln">validate</span><span class="pun">:</span><span class="pln"> </span><span class="kwd">true</span><span class="pun">},</span><span class="pln"> schema</span><span class="pun">);</span><span class="pln"><br></span><span class="kwd">var</span><span class="pln"> rootNode </span><span class="pun">=</span><span class="pln"> parser</span><span class="pun">.</span><span class="pln">parse</span><span class="pun">(</span><span class="str">'&lt;h1&gt;content&lt;/h1&gt;'</span><span class="pun">);</span></pre>
</div>
<div class="constructors">
<h2>Constructors</h2>
<table>
<thead class="small">
<tr>
<th class="first">Method</th>
<th class="last">Defined By</th>
</tr>
</thead>
<tbody>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:constructor.tinymce.html.DomParser.DomParser" class="member">DomParser</a></div>
<div>Constructs a new DomParser instance</div>
</td>
<td class="last">
tinymce.html.DomParser
</td>
</tr>
</tbody>
</table>
</div>
<div class="methods">
<h2>Methods</h2>
<table>
<thead class="small">
<tr>
<th class="first">Method</th>
<th class="last">Defined By</th>
</tr>
</thead>
<tbody>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.html.DomParser.addAttributeFilter" class="member">addAttributeFilter</a></div>
<div>Adds a attribute filter function to the parser, the parser will collect nodes that has the specified</div>
</td>
<td class="last">
tinymce.html.DomParser
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.html.DomParser.addNodeFilter" class="member">addNodeFilter</a></div>
<div>Adds a node filter function to the parser, the parser will collect the specified nodes by name
and t</div>
</td>
<td class="last">
tinymce.html.DomParser
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.html.DomParser.filterNode" class="member">filterNode</a></div>
<div>Runs the specified node though the element and attributes filters</div>
</td>
<td class="last">
tinymce.html.DomParser
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.html.DomParser.parse" class="member">parse</a></div>
<div>Parses the specified HTML string into a DOM like node tree and returns the result</div>
</td>
<td class="last">
tinymce.html.DomParser
</td>
</tr>
</tbody>
</table>
</div>
</div>
@@ -1,85 +0,0 @@
---
categories:
- tinymce
- html
- Entities
---
<div class="api classdetails">
<div class="description">Entity encoder class.</div>
<div class="methods">
<h2>Methods</h2>
<table>
<thead class="small">
<tr>
<th class="first">Method</th>
<th class="last">Defined By</th>
</tr>
</thead>
<tbody>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.html.Entities.decode.static" class="member">decode</a> <span class="static">static</span></div>
<div>Decodes the specified string, this will replace entities with raw UTF characters</div>
</td>
<td class="last">
tinymce.html.Entities
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.html.Entities.encodeAllRaw.static" class="member">encodeAllRaw</a> <span class="static">static</span></div>
<div>Encoded the specified text with both the attributes and text entities</div>
</td>
<td class="last">
tinymce.html.Entities
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.html.Entities.encodeNamed.static" class="member">encodeNamed</a> <span class="static">static</span></div>
<div>Encodes the specified string using named entities</div>
</td>
<td class="last">
tinymce.html.Entities
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.html.Entities.encodeNumeric.static" class="member">encodeNumeric</a> <span class="static">static</span></div>
<div>Encodes the specified string using numeric entities</div>
</td>
<td class="last">
tinymce.html.Entities
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.html.Entities.encodeRaw.static" class="member">encodeRaw</a> <span class="static">static</span></div>
<div>Encodes the specified string using raw entities</div>
</td>
<td class="last">
tinymce.html.Entities
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.html.Entities.getEncodeFunc.static" class="member">getEncodeFunc</a> <span class="static">static</span></div>
<div>Returns an encode function based on the name(s) and it's optional entities</div>
</td>
<td class="last">
tinymce.html.Entities
</td>
</tr>
</tbody>
</table>
</div>
</div>
@@ -1,174 +0,0 @@
---
categories:
- tinymce
- html
- Node
---
<div class="api classdetails">
<div class="description">This class is a minimalistic implementation of a DOM like node used by the DomParser class.</div>
<div class="examples">
<h2>Examples</h2>
<pre class="js prettyprint"><span class="kwd">var</span><span class="pln"> node </span><span class="pun">=</span><span class="pln"> </span><span class="kwd">new</span><span class="pln"> tinymce</span><span class="pun">.</span><span class="pln">html</span><span class="pun">.</span><span class="typ">Node</span><span class="pun">(</span><span class="str">'strong'</span><span class="pun">,</span><span class="pln"> </span><span class="lit">1</span><span class="pun">);</span><span class="pln"><br>someRoot</span><span class="pun">.</span><span class="pln">append</span><span class="pun">(</span><span class="pln">node</span><span class="pun">);</span></pre>
</div>
<div class="constructors">
<h2>Constructors</h2>
<table>
<thead class="small">
<tr>
<th class="first">Method</th>
<th class="last">Defined By</th>
</tr>
</thead>
<tbody>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:constructor.tinymce.html.Node.Node" class="member">Node</a></div>
<div>Constructs a new Node instance</div>
</td>
<td class="last">
tinymce.html.Node
</td>
</tr>
</tbody>
</table>
</div>
<div class="methods">
<h2>Methods</h2>
<table>
<thead class="small">
<tr>
<th class="first">Method</th>
<th class="last">Defined By</th>
</tr>
</thead>
<tbody>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.html.Node.append" class="member">append</a></div>
<div>Appends a new node as a child of the current node</div>
</td>
<td class="last">
tinymce.html.Node
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.html.Node.attr" class="member">attr</a></div>
<div>Gets/sets or removes an attribute by name</div>
</td>
<td class="last">
tinymce.html.Node
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.html.Node.clone" class="member">clone</a></div>
<div>Does a shallow clones the node into a new node</div>
</td>
<td class="last">
tinymce.html.Node
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.html.Node.create.static" class="member">create</a> <span class="static">static</span></div>
<div>Creates a node of a specific type</div>
</td>
<td class="last">
tinymce.html.Node
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.html.Node.empty" class="member">empty</a></div>
<div>Removes all children of the current node</div>
</td>
<td class="last">
tinymce.html.Node
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.html.Node.getAll" class="member">getAll</a></div>
<div>Get all children by name</div>
</td>
<td class="last">
tinymce.html.Node
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.html.Node.insert" class="member">insert</a></div>
<div>Inserts a node at a specific position as a child of the current node</div>
</td>
<td class="last">
tinymce.html.Node
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.html.Node.isEmpty" class="member">isEmpty</a></div>
<div>Returns true/false if the node is to be considered empty or not</div>
</td>
<td class="last">
tinymce.html.Node
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.html.Node.remove" class="member">remove</a></div>
<div>Removes the node from it's parent</div>
</td>
<td class="last">
tinymce.html.Node
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.html.Node.replace" class="member">replace</a></div>
<div>Replaces the current node with the specified one</div>
</td>
<td class="last">
tinymce.html.Node
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.html.Node.unwrap" class="member">unwrap</a></div>
<div>Unwraps the node in other words it removes the node but keeps the children</div>
</td>
<td class="last">
tinymce.html.Node
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.html.Node.walk" class="member">walk</a></div>
<div>Walks to the next or previous node and returns that node or null if it wasn't found</div>
</td>
<td class="last">
tinymce.html.Node
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.html.Node.wrap" class="member">wrap</a></div>
<div>Wraps the node in in another node</div>
</td>
<td class="last">
tinymce.html.Node
</td>
</tr>
</tbody>
</table>
</div>
</div>
File diff suppressed because one or more lines are too long
@@ -1,94 +0,0 @@
---
categories:
- tinymce
- ui
- AbsoluteLayout
---
<div class="api classdetails">
<div class="classinfo">
<table>
<tbody>
<tr>
<td class="first">Inheritance</td>
<td class="last">
<ul class="inherits">
<li class="first">AbsoluteLayout</li>
<li><a href="/wiki.php/api4:class.tinymce.ui.Layout">Layout</a></li>
</ul>
</td>
</tr>
<tr>
<td class="first">Subclasses</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.FitLayout">FitLayout</a>
<a href="/wiki.php/api4:class.tinymce.ui.FlexLayout">FlexLayout</a>
<a href="/wiki.php/api4:class.tinymce.ui.GridLayout">GridLayout</a>
</td>
</tr>
</tbody>
</table>
</div>
<div class="description">LayoutManager for absolute positioning. This layout manager is more of
a base class for other layouts but can be created and used directly.</div>
<div class="methods">
<h2>Methods</h2>
<table>
<thead class="small">
<tr>
<th class="first">Method</th>
<th class="last">Defined By</th>
</tr>
</thead>
<tbody>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Layout.postRender" class="member">postRender</a></div>
<div>This method gets invoked after the layout renders the controls</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Layout">tinymce.ui.Layout</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Layout.preRender" class="member">preRender</a></div>
<div>This method gets invoked before the layout renders the controls</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Layout">tinymce.ui.Layout</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.AbsoluteLayout.recalc" class="member">recalc</a></div>
<div>Recalculates the positions of the controls in the specified container</div>
</td>
<td class="last">
tinymce.ui.AbsoluteLayout
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.AbsoluteLayout.renderHtml" class="member">renderHtml</a></div>
<div>Renders the specified container and any layout specific HTML</div>
</td>
<td class="last">
tinymce.ui.AbsoluteLayout
</td>
</tr>
</tbody>
</table>
</div>
</div>
@@ -1,601 +0,0 @@
---
categories:
- tinymce
- ui
- Button
---
<div class="api classdetails">
<div class="classinfo">
<table>
<tbody>
<tr>
<td class="first">Inheritance</td>
<td class="last">
<ul class="inherits">
<li class="first">Button</li>
<li><a href="/wiki.php/api4:class.tinymce.ui.Widget">Widget</a></li>
<li><a href="/wiki.php/api4:class.tinymce.ui.Control">Control</a></li>
</ul>
</td>
</tr>
<tr>
<td class="first">Subclasses</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.MenuButton">MenuButton</a>
<a href="/wiki.php/api4:class.tinymce.ui.PanelButton">PanelButton</a>
<a href="/wiki.php/api4:class.tinymce.ui.SplitButton">SplitButton</a>
</td>
</tr>
</tbody>
</table>
</div>
<div class="description">This class is used to create buttons. You can create them directly or through the Factory.</div>
<div class="examples">
<h2>Examples</h2>
<pre class="js prettyprint"><span class="com">// Create and render a button to the body element</span><span class="pln"><br>tinymce</span><span class="pun">.</span><span class="pln">ui</span><span class="pun">.</span><span class="typ">Factory</span><span class="pun">.</span><span class="pln">create</span><span class="pun">({</span><span class="pln"><br>&nbsp; &nbsp; type</span><span class="pun">:</span><span class="pln"> </span><span class="str">'button'</span><span class="pun">,</span><span class="pln"><br>&nbsp; &nbsp; text</span><span class="pun">:</span><span class="pln"> </span><span class="str">'My button'</span><span class="pln"><br></span><span class="pun">}).</span><span class="pln">renderTo</span><span class="pun">(</span><span class="pln">document</span><span class="pun">.</span><span class="pln">body</span><span class="pun">);</span></pre>
</div>
<div class="settings">
<h2>Settings</h2>
<table>
<thead class="small">
<tr>
<th class="first">Setting</th>
<th class="last">Defined By</th>
</tr>
</thead>
<tbody>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:setting.tinymce.ui.Widget.autofocus" class="member">autofocus</a></div>
<div> True if the control should be focused when rendered</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Widget">tinymce.ui.Widget</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:setting.tinymce.ui.Control.border" class="member">border</a></div>
<div> Border box values example: 1 1 1 1</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:setting.tinymce.ui.Control.classes" class="member">classes</a></div>
<div> Space separated list of classes to add</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:setting.tinymce.ui.Control.disabled" class="member">disabled</a></div>
<div> Is the control disabled by default</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:setting.tinymce.ui.Control.hidden" class="member">hidden</a></div>
<div> Is the control hidden by default</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:setting.tinymce.ui.Button.icon" class="member">icon</a></div>
<div> Icon to use for button</div>
</td>
<td class="last">
tinymce.ui.Button
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:setting.tinymce.ui.Button.image" class="member">image</a></div>
<div> Image to use for icon</div>
</td>
<td class="last">
tinymce.ui.Button
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:setting.tinymce.ui.Control.margin" class="member">margin</a></div>
<div> Margin box values example: 1 1 1 1</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:setting.tinymce.ui.Control.minHeight" class="member">minHeight</a></div>
<div> Minimal height for the control</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:setting.tinymce.ui.Control.minWidth" class="member">minWidth</a></div>
<div> Minimal width for the control</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:setting.tinymce.ui.Control.name" class="member">name</a></div>
<div> Name of the control instance</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:setting.tinymce.ui.Control.padding" class="member">padding</a></div>
<div> Padding box values example: 1 1 1 1</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:setting.tinymce.ui.Control.role" class="member">role</a></div>
<div> WAI-ARIA role to use for control</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:setting.tinymce.ui.Button.size" class="member">size</a></div>
<div> Size of the button small|medium|large</div>
</td>
<td class="last">
tinymce.ui.Button
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:setting.tinymce.ui.Control.style" class="member">style</a></div>
<div> Style CSS properties to add</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:setting.tinymce.ui.Widget.text" class="member">text</a></div>
<div> Text to display inside widget</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Widget">tinymce.ui.Widget</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:setting.tinymce.ui.Widget.tooltip" class="member">tooltip</a></div>
<div> Tooltip text to display when hovering</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Widget">tinymce.ui.Widget</a>
</td>
</tr>
</tbody>
</table>
</div>
<div class="constructors">
<h2>Constructors</h2>
<table>
<thead class="small">
<tr>
<th class="first">Method</th>
<th class="last">Defined By</th>
</tr>
</thead>
<tbody>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:constructor.tinymce.ui.Button.Button" class="member">Button</a></div>
<div>Constructs a new button instance with the specified settings</div>
</td>
<td class="last">
tinymce.ui.Button
</td>
</tr>
</tbody>
</table>
</div>
<div class="methods">
<h2>Methods</h2>
<table>
<thead class="small">
<tr>
<th class="first">Method</th>
<th class="last">Defined By</th>
</tr>
</thead>
<tbody>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.active" class="member">active</a></div>
<div>Sets/gets the active for the control</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.after" class="member">after</a></div>
<div>Adds items after the current control</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.aria" class="member">aria</a></div>
<div>Sets the specified aria property</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.before" class="member">before</a></div>
<div>Adds items before the current control</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.blur" class="member">blur</a></div>
<div>Blurs the current control</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.disabled" class="member">disabled</a></div>
<div>Sets/gets the disabled state on the control</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.encode" class="member">encode</a></div>
<div>Encodes the specified string with HTML entities</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.fire" class="member">fire</a></div>
<div>Fires the specified event by name and arguments on the control</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.focus" class="member">focus</a></div>
<div>Focuses the current control</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.getContainerElm" class="member">getContainerElm</a></div>
<div>Returns the root element to render controls into</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.getEl" class="member">getEl</a></div>
<div>Returns the control DOM element or sub element</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.getParentCtrl" class="member">getParentCtrl</a></div>
<div>Returns a control instance for the current DOM element</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.hasEventListeners" class="member">hasEventListeners</a></div>
<div>Returns true/false if the specified event has any listeners</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.hide" class="member">hide</a></div>
<div>Sets the visible state to false</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Button.icon" class="member">icon</a></div>
<div>Sets/gets the current button icon</div>
</td>
<td class="last">
tinymce.ui.Button
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.initLayoutRect" class="member">initLayoutRect</a></div>
<div>Initializes the current controls layout rect</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.innerHtml" class="member">innerHtml</a></div>
<div>Sets the inner HTML of the control element</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.layoutRect" class="member">layoutRect</a></div>
<div>Getter/setter for the current layout rect</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.name" class="member">name</a></div>
<div>Sets/gets the name for the control</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.next" class="member">next</a></div>
<div>Returns the control next to the current control</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.off" class="member">off</a></div>
<div>Unbinds the specified event and optionally a specific callback</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.on" class="member">on</a></div>
<div>Binds a callback to the specified event</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.parent" class="member">parent</a></div>
<div>Sets/gets the parent container for the control</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.parents" class="member">parents</a></div>
<div>Returns a control collection with all parent controls</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.parentsAndSelf" class="member">parentsAndSelf</a></div>
<div>Returns the current control and it's parents</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Widget.postRender" class="member">postRender</a></div>
<div>Called after the control has been rendered</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Widget">tinymce.ui.Widget</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.prev" class="member">prev</a></div>
<div>Returns the control previous to the current control</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.reflow" class="member">reflow</a></div>
<div>Reflows the current control and it's parents</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Widget.remove" class="member">remove</a></div>
<div>Removes the current control from DOM and from UI collections</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Widget">tinymce.ui.Widget</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.renderBefore" class="member">renderBefore</a></div>
<div>Renders the control to the specified element</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Button.renderHtml" class="member">renderHtml</a></div>
<div>Renders the control as a HTML string</div>
</td>
<td class="last">
tinymce.ui.Button
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Button.repaint" class="member">repaint</a></div>
<div>Repaints the button for example after it's been resizes by a layout engine</div>
</td>
<td class="last">
tinymce.ui.Button
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.scrollIntoView" class="member">scrollIntoView</a></div>
<div>Scrolls the current control into view</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.show" class="member">show</a></div>
<div>Sets the visible state to true</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.text" class="member">text</a></div>
<div>Sets/gets the text for the control</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.title" class="member">title</a></div>
<div>Sets/gets the title for the control</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Widget.tooltip" class="member">tooltip</a></div>
<div>Returns the current tooltip instance</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Widget">tinymce.ui.Widget</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.translate" class="member">translate</a></div>
<div>Returns the translated string</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.visible" class="member">visible</a></div>
<div>Sets/gets the visible for the control</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
</tbody>
</table>
</div>
</div>
@@ -1,627 +0,0 @@
---
categories:
- tinymce
- ui
- ButtonGroup
---
<div class="api classdetails">
<div class="classinfo">
<table>
<tbody>
<tr>
<td class="first">Inheritance</td>
<td class="last">
<ul class="inherits">
<li class="first">ButtonGroup</li>
<li><a href="/wiki.php/api4:class.tinymce.ui.Container">Container</a></li>
<li><a href="/wiki.php/api4:class.tinymce.ui.Control">Control</a></li>
</ul>
</td>
</tr>
</tbody>
</table>
</div>
<div class="description">This control enables you to put multiple buttons into a group. This is
useful when you want to combine similar toolbar buttons into a group.</div>
<div class="examples">
<h2>Examples</h2>
<pre class="js prettyprint"><span class="com">// Create and render a buttongroup with two buttons to the body element</span><span class="pln"><br>tinymce</span><span class="pun">.</span><span class="pln">ui</span><span class="pun">.</span><span class="typ">Factory</span><span class="pun">.</span><span class="pln">create</span><span class="pun">({</span><span class="pln"><br>&nbsp; &nbsp; type</span><span class="pun">:</span><span class="pln"> </span><span class="str">'buttongroup'</span><span class="pun">,</span><span class="pln"><br>&nbsp; &nbsp; items</span><span class="pun">:</span><span class="pln"> </span><span class="pun">[</span><span class="pln"><br>&nbsp; &nbsp; &nbsp; &nbsp; </span><span class="pun">{</span><span class="pln">text</span><span class="pun">:</span><span class="pln"> </span><span class="str">'Button A'</span><span class="pun">},</span><span class="pln"><br>&nbsp; &nbsp; &nbsp; &nbsp; </span><span class="pun">{</span><span class="pln">text</span><span class="pun">:</span><span class="pln"> </span><span class="str">'Button B'</span><span class="pun">}</span><span class="pln"><br>&nbsp; &nbsp; </span><span class="pun">]</span><span class="pln"><br></span><span class="pun">}).</span><span class="pln">renderTo</span><span class="pun">(</span><span class="pln">document</span><span class="pun">.</span><span class="pln">body</span><span class="pun">);</span></pre>
</div>
<div class="settings">
<h2>Settings</h2>
<table>
<thead class="small">
<tr>
<th class="first">Setting</th>
<th class="last">Defined By</th>
</tr>
</thead>
<tbody>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:setting.tinymce.ui.Control.border" class="member">border</a></div>
<div> Border box values example: 1 1 1 1</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:setting.tinymce.ui.Control.classes" class="member">classes</a></div>
<div> Space separated list of classes to add</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:setting.tinymce.ui.Container.defaults" class="member">defaults</a></div>
<div> Default settings to apply to all items</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Container">tinymce.ui.Container</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:setting.tinymce.ui.Control.disabled" class="member">disabled</a></div>
<div> Is the control disabled by default</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:setting.tinymce.ui.Control.hidden" class="member">hidden</a></div>
<div> Is the control hidden by default</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:setting.tinymce.ui.Container.items" class="member">items</a></div>
<div> Items to add to container in JSON format or control instances</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Container">tinymce.ui.Container</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:setting.tinymce.ui.Container.layout" class="member">layout</a></div>
<div> Layout manager by name to use</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Container">tinymce.ui.Container</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:setting.tinymce.ui.Control.margin" class="member">margin</a></div>
<div> Margin box values example: 1 1 1 1</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:setting.tinymce.ui.Control.minHeight" class="member">minHeight</a></div>
<div> Minimal height for the control</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:setting.tinymce.ui.Control.minWidth" class="member">minWidth</a></div>
<div> Minimal width for the control</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:setting.tinymce.ui.Control.name" class="member">name</a></div>
<div> Name of the control instance</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:setting.tinymce.ui.Control.padding" class="member">padding</a></div>
<div> Padding box values example: 1 1 1 1</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:setting.tinymce.ui.Control.role" class="member">role</a></div>
<div> WAI-ARIA role to use for control</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:setting.tinymce.ui.Control.style" class="member">style</a></div>
<div> Style CSS properties to add</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
</tbody>
</table>
</div>
<div class="methods">
<h2>Methods</h2>
<table>
<thead class="small">
<tr>
<th class="first">Method</th>
<th class="last">Defined By</th>
</tr>
</thead>
<tbody>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.active" class="member">active</a></div>
<div>Sets/gets the active for the control</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Container.add" class="member">add</a></div>
<div>Adds one or many items to the current container</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Container">tinymce.ui.Container</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.after" class="member">after</a></div>
<div>Adds items after the current control</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Container.append" class="member">append</a></div>
<div>Appends new instances to the current container</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Container">tinymce.ui.Container</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.aria" class="member">aria</a></div>
<div>Sets the specified aria property</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.before" class="member">before</a></div>
<div>Adds items before the current control</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.blur" class="member">blur</a></div>
<div>Blurs the current control</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Container.create" class="member">create</a></div>
<div>Creates the specified items</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Container">tinymce.ui.Container</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.disabled" class="member">disabled</a></div>
<div>Sets/gets the disabled state on the control</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.encode" class="member">encode</a></div>
<div>Encodes the specified string with HTML entities</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Container.find" class="member">find</a></div>
<div>Find child controls by selector</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Container">tinymce.ui.Container</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.fire" class="member">fire</a></div>
<div>Fires the specified event by name and arguments on the control</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Container.focus" class="member">focus</a></div>
<div>Focuses the current container instance</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Container">tinymce.ui.Container</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Container.fromJSON" class="member">fromJSON</a></div>
<div>Populates the form fields from the specified JSON data object</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Container">tinymce.ui.Container</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.getContainerElm" class="member">getContainerElm</a></div>
<div>Returns the root element to render controls into</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.getEl" class="member">getEl</a></div>
<div>Returns the control DOM element or sub element</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.getParentCtrl" class="member">getParentCtrl</a></div>
<div>Returns a control instance for the current DOM element</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.hasEventListeners" class="member">hasEventListeners</a></div>
<div>Returns true/false if the specified event has any listeners</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.hide" class="member">hide</a></div>
<div>Sets the visible state to false</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Container.initLayoutRect" class="member">initLayoutRect</a></div>
<div>Initializes the current controls layout rect</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Container">tinymce.ui.Container</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.innerHtml" class="member">innerHtml</a></div>
<div>Sets the inner HTML of the control element</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Container.insert" class="member">insert</a></div>
<div>Inserts an control at a specific index</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Container">tinymce.ui.Container</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Container.items" class="member">items</a></div>
<div>Returns a collection of child items that the container currently have</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Container">tinymce.ui.Container</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.layoutRect" class="member">layoutRect</a></div>
<div>Getter/setter for the current layout rect</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.name" class="member">name</a></div>
<div>Sets/gets the name for the control</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.next" class="member">next</a></div>
<div>Returns the control next to the current control</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.off" class="member">off</a></div>
<div>Unbinds the specified event and optionally a specific callback</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.on" class="member">on</a></div>
<div>Binds a callback to the specified event</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.parent" class="member">parent</a></div>
<div>Sets/gets the parent container for the control</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.parents" class="member">parents</a></div>
<div>Returns a control collection with all parent controls</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.parentsAndSelf" class="member">parentsAndSelf</a></div>
<div>Returns the current control and it's parents</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Container.postRender" class="member">postRender</a></div>
<div>Post render method</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Container">tinymce.ui.Container</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Container.prepend" class="member">prepend</a></div>
<div>Prepends new instances to the current container</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Container">tinymce.ui.Container</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.prev" class="member">prev</a></div>
<div>Returns the control previous to the current control</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Container.recalc" class="member">recalc</a></div>
<div>Recalculates the positions of the controls in the current container</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Container">tinymce.ui.Container</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Container.reflow" class="member">reflow</a></div>
<div>Reflows the current container and it's children and possible parents</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Container">tinymce.ui.Container</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.remove" class="member">remove</a></div>
<div>Removes the current control from DOM and from UI collections</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.renderBefore" class="member">renderBefore</a></div>
<div>Renders the control to the specified element</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.ButtonGroup.renderHtml" class="member">renderHtml</a></div>
<div>Renders the control as a HTML string</div>
</td>
<td class="last">
tinymce.ui.ButtonGroup
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.repaint" class="member">repaint</a></div>
<div>Repaints the control after a layout operation</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Container.replace" class="member">replace</a></div>
<div>Replaces the specified child control with a new control</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Container">tinymce.ui.Container</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.scrollIntoView" class="member">scrollIntoView</a></div>
<div>Scrolls the current control into view</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.show" class="member">show</a></div>
<div>Sets the visible state to true</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.text" class="member">text</a></div>
<div>Sets/gets the text for the control</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.title" class="member">title</a></div>
<div>Sets/gets the title for the control</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Container.toJSON" class="member">toJSON</a></div>
<div>Serializes the form into a JSON object by getting all items
that has a name and a value</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Container">tinymce.ui.Container</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.translate" class="member">translate</a></div>
<div>Returns the translated string</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.visible" class="member">visible</a></div>
<div>Sets/gets the visible for the control</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
</tbody>
</table>
</div>
</div>
@@ -1,590 +0,0 @@
---
categories:
- tinymce
- ui
- Checkbox
---
<div class="api classdetails">
<div class="classinfo">
<table>
<tbody>
<tr>
<td class="first">Inheritance</td>
<td class="last">
<ul class="inherits">
<li class="first">Checkbox</li>
<li><a href="/wiki.php/api4:class.tinymce.ui.Widget">Widget</a></li>
<li><a href="/wiki.php/api4:class.tinymce.ui.Control">Control</a></li>
</ul>
</td>
</tr>
<tr>
<td class="first">Subclasses</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Radio">Radio</a>
</td>
</tr>
</tbody>
</table>
</div>
<div class="description">This control creates a custom checkbox.</div>
<div class="examples">
<h2>Examples</h2>
<pre class="js prettyprint"><span class="com">// Create and render a checkbox to the body element</span><span class="pln"><br>tinymce</span><span class="pun">.</span><span class="pln">ui</span><span class="pun">.</span><span class="typ">Factory</span><span class="pun">.</span><span class="pln">create</span><span class="pun">({</span><span class="pln"><br>&nbsp; &nbsp; type</span><span class="pun">:</span><span class="pln"> </span><span class="str">'checkbox'</span><span class="pun">,</span><span class="pln"><br>&nbsp; &nbsp; </span><span class="kwd">checked</span><span class="pun">:</span><span class="pln"> </span><span class="kwd">true</span><span class="pun">,</span><span class="pln"><br>&nbsp; &nbsp; text</span><span class="pun">:</span><span class="pln"> </span><span class="str">'My checkbox'</span><span class="pln"><br></span><span class="pun">}).</span><span class="pln">renderTo</span><span class="pun">(</span><span class="pln">document</span><span class="pun">.</span><span class="pln">body</span><span class="pun">);</span></pre>
</div>
<div class="settings">
<h2>Settings</h2>
<table>
<thead class="small">
<tr>
<th class="first">Setting</th>
<th class="last">Defined By</th>
</tr>
</thead>
<tbody>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:setting.tinymce.ui.Widget.autofocus" class="member">autofocus</a></div>
<div> True if the control should be focused when rendered</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Widget">tinymce.ui.Widget</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:setting.tinymce.ui.Control.border" class="member">border</a></div>
<div> Border box values example: 1 1 1 1</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:setting.tinymce.ui.Checkbox.checked" class="member">checked</a></div>
<div> True if the checkbox should be checked by default</div>
</td>
<td class="last">
tinymce.ui.Checkbox
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:setting.tinymce.ui.Control.classes" class="member">classes</a></div>
<div> Space separated list of classes to add</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:setting.tinymce.ui.Control.disabled" class="member">disabled</a></div>
<div> Is the control disabled by default</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:setting.tinymce.ui.Control.hidden" class="member">hidden</a></div>
<div> Is the control hidden by default</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:setting.tinymce.ui.Control.margin" class="member">margin</a></div>
<div> Margin box values example: 1 1 1 1</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:setting.tinymce.ui.Control.minHeight" class="member">minHeight</a></div>
<div> Minimal height for the control</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:setting.tinymce.ui.Control.minWidth" class="member">minWidth</a></div>
<div> Minimal width for the control</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:setting.tinymce.ui.Control.name" class="member">name</a></div>
<div> Name of the control instance</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:setting.tinymce.ui.Control.padding" class="member">padding</a></div>
<div> Padding box values example: 1 1 1 1</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:setting.tinymce.ui.Control.role" class="member">role</a></div>
<div> WAI-ARIA role to use for control</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:setting.tinymce.ui.Control.style" class="member">style</a></div>
<div> Style CSS properties to add</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:setting.tinymce.ui.Widget.text" class="member">text</a></div>
<div> Text to display inside widget</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Widget">tinymce.ui.Widget</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:setting.tinymce.ui.Widget.tooltip" class="member">tooltip</a></div>
<div> Tooltip text to display when hovering</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Widget">tinymce.ui.Widget</a>
</td>
</tr>
</tbody>
</table>
</div>
<div class="constructors">
<h2>Constructors</h2>
<table>
<thead class="small">
<tr>
<th class="first">Method</th>
<th class="last">Defined By</th>
</tr>
</thead>
<tbody>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:constructor.tinymce.ui.Checkbox.Checkbox" class="member">Checkbox</a></div>
<div>Constructs a new Checkbox instance with the specified settings</div>
</td>
<td class="last">
tinymce.ui.Checkbox
</td>
</tr>
</tbody>
</table>
</div>
<div class="methods">
<h2>Methods</h2>
<table>
<thead class="small">
<tr>
<th class="first">Method</th>
<th class="last">Defined By</th>
</tr>
</thead>
<tbody>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.active" class="member">active</a></div>
<div>Sets/gets the active for the control</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.after" class="member">after</a></div>
<div>Adds items after the current control</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.aria" class="member">aria</a></div>
<div>Sets the specified aria property</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.before" class="member">before</a></div>
<div>Adds items before the current control</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.blur" class="member">blur</a></div>
<div>Blurs the current control</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Checkbox.checked" class="member">checked</a></div>
<div>Getter/setter function for the checked state</div>
</td>
<td class="last">
tinymce.ui.Checkbox
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.disabled" class="member">disabled</a></div>
<div>Sets/gets the disabled state on the control</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.encode" class="member">encode</a></div>
<div>Encodes the specified string with HTML entities</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.fire" class="member">fire</a></div>
<div>Fires the specified event by name and arguments on the control</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.focus" class="member">focus</a></div>
<div>Focuses the current control</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.getContainerElm" class="member">getContainerElm</a></div>
<div>Returns the root element to render controls into</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.getEl" class="member">getEl</a></div>
<div>Returns the control DOM element or sub element</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.getParentCtrl" class="member">getParentCtrl</a></div>
<div>Returns a control instance for the current DOM element</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.hasEventListeners" class="member">hasEventListeners</a></div>
<div>Returns true/false if the specified event has any listeners</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.hide" class="member">hide</a></div>
<div>Sets the visible state to false</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.initLayoutRect" class="member">initLayoutRect</a></div>
<div>Initializes the current controls layout rect</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.innerHtml" class="member">innerHtml</a></div>
<div>Sets the inner HTML of the control element</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.layoutRect" class="member">layoutRect</a></div>
<div>Getter/setter for the current layout rect</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.name" class="member">name</a></div>
<div>Sets/gets the name for the control</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.next" class="member">next</a></div>
<div>Returns the control next to the current control</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.off" class="member">off</a></div>
<div>Unbinds the specified event and optionally a specific callback</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.on" class="member">on</a></div>
<div>Binds a callback to the specified event</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.parent" class="member">parent</a></div>
<div>Sets/gets the parent container for the control</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.parents" class="member">parents</a></div>
<div>Returns a control collection with all parent controls</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.parentsAndSelf" class="member">parentsAndSelf</a></div>
<div>Returns the current control and it's parents</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Widget.postRender" class="member">postRender</a></div>
<div>Called after the control has been rendered</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Widget">tinymce.ui.Widget</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.prev" class="member">prev</a></div>
<div>Returns the control previous to the current control</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.reflow" class="member">reflow</a></div>
<div>Reflows the current control and it's parents</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Widget.remove" class="member">remove</a></div>
<div>Removes the current control from DOM and from UI collections</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Widget">tinymce.ui.Widget</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.renderBefore" class="member">renderBefore</a></div>
<div>Renders the control to the specified element</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Checkbox.renderHtml" class="member">renderHtml</a></div>
<div>Renders the control as a HTML string</div>
</td>
<td class="last">
tinymce.ui.Checkbox
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.repaint" class="member">repaint</a></div>
<div>Repaints the control after a layout operation</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.scrollIntoView" class="member">scrollIntoView</a></div>
<div>Scrolls the current control into view</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.show" class="member">show</a></div>
<div>Sets the visible state to true</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.text" class="member">text</a></div>
<div>Sets/gets the text for the control</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.title" class="member">title</a></div>
<div>Sets/gets the title for the control</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Widget.tooltip" class="member">tooltip</a></div>
<div>Returns the current tooltip instance</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Widget">tinymce.ui.Widget</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.translate" class="member">translate</a></div>
<div>Returns the translated string</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Checkbox.value" class="member">value</a></div>
<div>Getter/setter function for the value state</div>
</td>
<td class="last">
tinymce.ui.Checkbox
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.ui.Control.visible" class="member">visible</a></div>
<div>Sets/gets the visible for the control</div>
</td>
<td class="last">
<a href="/wiki.php/api4:class.tinymce.ui.Control">tinymce.ui.Control</a>
</td>
</tr>
</tbody>
</table>
</div>
</div>
@@ -1,93 +0,0 @@
---
categories:
- tinymce
- util
- Color
---
<div class="api classdetails">
<div class="description">This class lets you parse/serialize colors and convert rgb/hsb.</div>
<div class="examples">
<h2>Examples</h2>
<pre class="js prettyprint"><span class="kwd">var</span><span class="pln"> white </span><span class="pun">=</span><span class="pln"> </span><span class="kwd">new</span><span class="pln"> tinymce</span><span class="pun">.</span><span class="pln">util</span><span class="pun">.</span><span class="typ">Color</span><span class="pun">({</span><span class="pln">r</span><span class="pun">:</span><span class="pln"> </span><span class="lit">255</span><span class="pun">,</span><span class="pln"> g</span><span class="pun">:</span><span class="pln"> </span><span class="lit">255</span><span class="pun">,</span><span class="pln"> b</span><span class="pun">:</span><span class="pln"> </span><span class="lit">255</span><span class="pun">});</span><span class="pln"><br></span><span class="kwd">var</span><span class="pln"> red </span><span class="pun">=</span><span class="pln"> </span><span class="kwd">new</span><span class="pln"> tinymce</span><span class="pun">.</span><span class="pln">util</span><span class="pun">.</span><span class="typ">Color</span><span class="pun">(</span><span class="str">'#FF0000'</span><span class="pun">);</span><span class="pln"><br><br>console</span><span class="pun">.</span><span class="pln">log</span><span class="pun">(</span><span class="pln">white</span><span class="pun">.</span><span class="pln">toHex</span><span class="pun">(),</span><span class="pln"> red</span><span class="pun">.</span><span class="pln">toHsv</span><span class="pun">());</span></pre>
</div>
<div class="constructors">
<h2>Constructors</h2>
<table>
<thead class="small">
<tr>
<th class="first">Method</th>
<th class="last">Defined By</th>
</tr>
</thead>
<tbody>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:constructor.tinymce.util.Color.Color" class="member">Color</a></div>
<div>Constructs a new color instance</div>
</td>
<td class="last">
tinymce.util.Color
</td>
</tr>
</tbody>
</table>
</div>
<div class="methods">
<h2>Methods</h2>
<table>
<thead class="small">
<tr>
<th class="first">Method</th>
<th class="last">Defined By</th>
</tr>
</thead>
<tbody>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.util.Color.parse" class="member">parse</a></div>
<div>Parses the specified value and populates the color instance</div>
</td>
<td class="last">
tinymce.util.Color
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.util.Color.toHex" class="member">toHex</a></div>
<div>Returns the hex string of the current color</div>
</td>
<td class="last">
tinymce.util.Color
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.util.Color.toHsv" class="member">toHsv</a></div>
<div>Returns the h, s, v values of the color</div>
</td>
<td class="last">
tinymce.util.Color
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.util.Color.toRgb" class="member">toRgb</a></div>
<div>Returns the r, g, b values of the color</div>
</td>
<td class="last">
tinymce.util.Color
</td>
</tr>
</tbody>
</table>
</div>
</div>
@@ -1,91 +0,0 @@
---
categories:
- tinymce
- util
- EventDispatcher
---
<div class="api classdetails">
<div class="description">This class lets you add/remove and fire events by name on the specified scope. This makes
it easy to add event listener logic to any class.</div>
<div class="examples">
<h2>Examples</h2>
<pre class="js prettyprint"><span class="kwd">var</span><span class="pln"> eventDispatcher </span><span class="pun">=</span><span class="pln"> </span><span class="kwd">new</span><span class="pln"> </span><span class="typ">EventDispatcher</span><span class="pun">();</span><span class="pln"><br><br>&nbsp;eventDispatcher</span><span class="pun">.</span><span class="pln">on</span><span class="pun">(</span><span class="str">'click'</span><span class="pun">,</span><span class="pln"> </span><span class="kwd">function</span><span class="pun">()</span><span class="pln"> </span><span class="pun">{</span><span class="pln">console</span><span class="pun">.</span><span class="pln">log</span><span class="pun">(</span><span class="str">'data'</span><span class="pun">);});</span><span class="pln"><br>&nbsp;eventDispatcher</span><span class="pun">.</span><span class="pln">fire</span><span class="pun">(</span><span class="str">'click'</span><span class="pun">,</span><span class="pln"> </span><span class="pun">{</span><span class="pln">data</span><span class="pun">:</span><span class="pln"> </span><span class="lit">123</span><span class="pun">});</span></pre>
</div>
<div class="methods">
<h2>Methods</h2>
<table>
<thead class="small">
<tr>
<th class="first">Method</th>
<th class="last">Defined By</th>
</tr>
</thead>
<tbody>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.util.EventDispatcher.fire" class="member">fire</a></div>
<div>Fires the specified event by name</div>
</td>
<td class="last">
tinymce.util.EventDispatcher
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.util.EventDispatcher.has" class="member">has</a></div>
<div>Returns true/false if the dispatcher has a event of the specified name</div>
</td>
<td class="last">
tinymce.util.EventDispatcher
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.util.EventDispatcher.isNative.static" class="member">isNative</a> <span class="static">static</span></div>
<div>Returns true/false if the specified event name is a native browser event or not</div>
</td>
<td class="last">
tinymce.util.EventDispatcher
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.util.EventDispatcher.off" class="member">off</a></div>
<div>Unbinds an event listener to a specific event by name</div>
</td>
<td class="last">
tinymce.util.EventDispatcher
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.util.EventDispatcher.on" class="member">on</a></div>
<div>Binds an event listener to a specific event by name</div>
</td>
<td class="last">
tinymce.util.EventDispatcher
</td>
</tr>
<tr>
<td class="first">
<div><a href="/wiki.php/api4:method.tinymce.util.EventDispatcher.once" class="member">once</a></div>
<div>Binds an event listener to a specific event by name
and automatically unbind the event once the call</div>
</td>
<td class="last">
tinymce.util.EventDispatcher
</td>
</tr>
</tbody>
</table>
</div>
</div>
@@ -1,3 +1,11 @@
---
layout: default
title: Allow Conditional Comments
redirect_from:
- "/configuration/cleanup-output/"
- "/configuration/"
---
<p>This option allows you to specify whether the editor should parse and keep conditional comments.</p>
<p>An example of this setting is as follows:</p>
<pre class="js">tinymce.init({<br />&nbsp; &nbsp; allow_conditional_comments: false<br />});</pre>
@@ -1,3 +1,8 @@
---
layout: default
title: Allow HTML in Named Anchor
---
<p>This option allows you to specify whether the editor should parse and keep html within named anchor tags.</p>
<p>An example of this setting is as follows:</p>
<pre class="js">tinymce.init({<br />&nbsp; &nbsp; allow_html_in_named_anchor: true<br />});</pre>
-15
View File
@@ -1,15 +0,0 @@
---
layout: default
title: Configuration
---
<div class="row">
<div class="col-xs-9">
{% include content.html nav=site.data.configurationmenu headinglevel=1 %}
</div>
<div class="col-xs-3">
<div style="position: fixed" id="sidebar">
{% include nav.html nav=site.data.configurationmenu %}
</div>
</div>
{% include navigationscript.html %}
</div>
@@ -1,3 +1,8 @@
---
layout: default
title: Basic Configuration
---
<p>TinyMCE provides a number of configuration options enabling you to integrate it tightly with your application. &nbsp;This guide will explore the most commonly used configuration options to help you get the most out of your new TinyMCE installation.</p>
<p>Once you've added the TinyMCE script to your page, there are three main aspects of configuration you need to consider - selector, plugins and toolbar configuration options.</p>
<h3>Selector Configuration Option</h3>
-15
View File
@@ -1,15 +0,0 @@
---
layout: default
title: Getting Started
---
<div class="row">
<div class="col-xs-9">
{% include content.html nav=site.data.gettingstartedmenu headinglevel=1 %}
</div>
<div class="col-xs-3">
<div style="position: fixed" id="sidebar">
{% include nav.html nav=site.data.gettingstartedmenu %}
</div>
</div>
{% include navigationscript.html %}
</div>
@@ -1,3 +1,8 @@
---
layout: default
title: Inline
---
<p>TinyMCE has two main integration modes - a "traditional" forms based mode and an inline editing mode. &nbsp;The inline editing mode is useful when creating user experiences where you want the editing view of the page to be merged with the reading view of the page. &nbsp;This creates a seamless editing experience and true WYSIWYG behaviour. &nbsp;From a technical perspective,&nbsp;in inline mode, the editor does not replace the selected element with it's own iframe, but instead edits the element's content in place instead.&nbsp;</p>
<h3>Forms-based Editing vs Inline Editing</h3>
<p>Most common TinyMCE integrations use the editor in its traditional forms based mode. &nbsp;In this integration mode the editor usage is as a form field that must be filled out to provide content. &nbsp;The editor is always visible as part of the form to be edited.</p>
@@ -1,3 +1,9 @@
---
layout: default
title: Installation
redirect_from: "/getting-started/"
---
<p>Getting started with TinyMCE is really easy. In this guide you will initialize TinyMCE on a &lt;textarea&gt; as part of an HTML &lt;form&gt;.&nbsp;When the&nbsp;&lt;form&gt;&nbsp;is submitted, the contents of the TinyMCE&nbsp;editor will be submitted as part of the&nbsp;&lt;form&gt;&nbsp;POST.&nbsp;&nbsp;</p>
<p>To complete this guide, you will need access to a web server. This guide assumes a web server is running on port 80 of localhost.</p>
<h3>Step 1: Download a copy of TinyMCE and put it on a web server.</h3>
-29
View File
@@ -1,29 +0,0 @@
---
layout: default
title: Javascript API
---
<div class="row">
<div class="col-xs-9">
<h1 id="javascript-api-namespace">Javascript API</h1>
<div id="javascript-api-content">
<p>Content goes here!</p>
</div>
</div>
<div class="col-xs-3">
<div style="position: fixed" id="sidebar">
{% include api-nav.html nav=site.data.javascriptapimenu %}
</div>
</div>
<script>
$('#sidebar a[data-url]').click(function(e) {
$('#sidebar li.active').removeClass('active');
$(this).parent().addClass('active');
$('#javascript-api-namespace').text($(e.target).data('text'));
$('#javascript-api-content').load($(e.target).data('url'));
});
$('.collapser').click(function() {
var parent = $(this).parent();
parent.next('ul').toggleClass('collapsed');
});
</script>
</div>
-25
View File
@@ -1,25 +0,0 @@
---
layout: default
title: Older Versions
---
<div class="row">
<div class="col-xs-9">
<h1>Other Versions</h1>
<p><a href="#">Version 3.x</a></p>
<p><a href="#">Version 4.0</a></p>
<p><a href="#">Version 4.1</a></p>
<p><a href="#">Version 4.2</a></p>
</div>
<div class="col-xs-3">
<div style="position: fixed" id="sidebar">
{% include nav.html nav=site.data.otherversions %}
</div>
</div>
<script>
$('#sidebar a[data-url]').click(function(e) {
$('#javascript-api-namespace').text($(e.target).data('text'));
$('#javascript-api-content').load($(e.target).data('url'));
});
</script>
</div>
-15
View File
@@ -1,15 +0,0 @@
---
layout: default
title: Using TinyMCE
---
<div class="row">
<div class="col-xs-9">
{% include content.html nav=site.data.usingtinymcemenu headinglevel=1 %}
</div>
<div class="col-xs-3">
<div style="position: fixed" id="sidebar">
{% include nav.html nav=site.data.usingtinymcemenu %}
</div>
</div>
{% include navigationscript.html %}
</div>