Ticket #4254: 4254.patch

File 4254.patch, 5.6 KB (added by Alfonso Martínez de Lizarrondo, 15 years ago)

Proposed patch

  • _samples/api.html

     
     1<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
     2<!--
     3Copyright (c) 2003-2009, CKSource - Frederico Knabben. All rights reserved.
     4For licensing, see LICENSE.html or http://ckeditor.com/license
     5-->
     6<html xmlns="http://www.w3.org/1999/xhtml">
     7<head>
     8        <title>API usage - CKEditor Sample</title>
     9        <script type="text/javascript" src="sample.js"></script>
     10        <script id="headscript" type="text/javascript">
     11        //<![CDATA[
     12
     13// The instanceReady event is fired when an instance of CKEditor has finished
     14// its initialization.
     15CKEDITOR.on( 'instanceReady', function( ev )
     16        {
     17                // Show the editor name and description in the browser status bar.
     18                document.getElementById('eMessage').innerHTML = '<p>Instance "' + ev.editor.name + '" loaded.</p>' ;
     19
     20                // Show this sample buttons.
     21                document.getElementById('eButtons').style.visibility = '' ;
     22        });
     23
     24
     25function InsertHTML()
     26{
     27        // Get the editor instance that we want to interact with.
     28        var oEditor = CKEDITOR.instances.editor1 ;
     29        var value = document.getElementById( 'plainArea' ).value ;
     30
     31        // Check the active editing mode.
     32        if (oEditor.mode == 'wysiwyg' )
     33        {
     34                // Insert the desired HTML.
     35                oEditor.insertHtml( value ) ;
     36        }
     37        else
     38                alert( 'You must be on WYSIWYG mode!' ) ;
     39}
     40
     41function SetContents()
     42{
     43        // Get the editor instance that we want to interact with.
     44        var oEditor = CKEDITOR.instances.editor1 ;
     45        var value = document.getElementById( 'plainArea' ).value ;
     46
     47        // Set the editor contents (replace the actual one).
     48        oEditor.setData( value ) ;
     49}
     50
     51function GetContents()
     52{
     53        // Get the editor instance that we want to interact with.
     54        var oEditor = CKEDITOR.instances.editor1 ;
     55
     56        // Get the editor contents
     57        alert( oEditor.getData() ) ;   
     58}
     59
     60function ExecuteCommand( commandName )
     61{
     62        // Get the editor instance that we want to interact with.
     63        var oEditor = CKEDITOR.instances.editor1 ;
     64
     65        // Check the active editing mode.
     66        if (oEditor.mode == 'wysiwyg' )
     67        {
     68                // Execute the command.
     69                oEditor.execCommand( commandName ) ;
     70        }
     71        else
     72                alert( 'You must be on WYSIWYG mode!' ) ;
     73}
     74
     75function CheckDirty()
     76{
     77        // Get the editor instance that we want to interact with.
     78        var oEditor = CKEDITOR.instances.editor1 ;
     79        alert( oEditor.checkDirty() ) ;
     80}
     81
     82function ResetDirty()
     83{
     84        // Get the editor instance that we want to interact with.
     85        var oEditor = CKEDITOR.instances.editor1 ;
     86        oEditor.resetDirty() ;
     87        alert( 'The "IsDirty" status has been reset' ) ;
     88}
     89
     90        //]]>
     91        </script>
     92</head>
     93<body>
     94        <div id="html">
     95                <p>
     96                This sample shows how to use the CKeditor JavaScript API to interact with the editor
     97                at runtime.</p>
     98                <textarea id="editor1" name="editor1" rows="10" cols="80">&lt;p&gt;This is some &lt;strong&gt;sample text&lt;/strong&gt;. You are using &lt;a href="http://www.fckeditor.net/"&gt;CKEditor&lt;/a&gt;.&lt;/p&gt;</textarea>
     99                <script type="text/javascript">
     100                //<![CDATA[
     101                        // Replace the <textarea id="editor1"> with an CKEditor instance.
     102                        var editor = CKEDITOR.replace( 'editor1');
     103                //]]>
     104                </script>
     105                <div id="eMessage">
     106                        &nbsp;
     107                </div>
     108                <div id="eButtons" style="visibility: hidden">
     109                        <input type="button" value="Insert HTML" onclick="InsertHTML();" />
     110                        <input type="button" value="Set Editor Contents" onclick="SetContents();" />
     111                        <input type="button" value="Get Editor Contents (XHTML)" onclick="GetContents();" />
     112                        <br />
     113                        <textarea id="plainArea" cols="80" rows="3">&lt;h2&gt;Test&lt;/h2&gt;&lt;p&gt;This is some &lt;a href="/Test1.html"&gt;sample&lt;/a&gt; HTML&lt;/p&gt;</textarea>
     114                        <br />
     115                        <br />
     116                        <input type="button" value='Execute "bold" Command' onclick="ExecuteCommand('bold');" />
     117                        <input type="button" value='Execute "link" Command' onclick="ExecuteCommand('link');" />
     118                <br />
     119                <br />
     120                <input type="button" value="checkDirty()" onclick="CheckDirty();" />
     121                <input type="button" value="resetDirty()" onclick="ResetDirty();" />
     122                </div>
     123
     124        </div>
     125</body>
     126</html>

  • _samples/index.html

     
    3333        <ul>
    3434                <li><a href="divreplace.html">Replace DIV elements on the fly</a>&nbsp; </li>
    3535                <li><a href="ajax.html">Create and destroy editor instances for Ajax applications</a></li>
     36                <li><a href="api.html">Basic usage of the API</a></li>
    3637                <li><a href="api_dialog.html">Using the JavaScript API to customize dialogs</a></li>
    3738                <li><a href="enterkey.html">Using the "Enter" key in CKEditor</a></li>
    3839        </ul>

  • CHANGES.html

     
    6969                <li><a href="http://dev.fckeditor.net/ticket/4203">#4203</a> : In IE quirksmode + toolbar collapsed + source mode editing block height was incorrect.</li>
    7070                <li><a href="http://dev.fckeditor.net/ticket/4387">#4387</a> : Right clicking in Kama skin can lead to a javascript error.</li>
    7171                <li><a href="http://dev.fckeditor.net/ticket/4397">#4397</a> : Wisiwig mode will cause the host page scroll.</li>
     72                <li><a href="http://dev.fckeditor.net/ticket/4254">#4254</a> : Added basic API sample.</li>
    7273        </ul>
    7374        <h3>
    7475                CKEditor 3.0</h3>
© 2003 – 2022, CKSource sp. z o.o. sp.k. All rights reserved. | Terms of use | Privacy policy