mirror of
https://github.com/inverse-inc/sogo.git
synced 2026-07-08 09:55:09 +00:00
HTML composition, take 2
Monotone-Parent: dbd490c81ea6cac4c12b2e17661e2fef43219e68 Monotone-Revision: 0801dc9f1e4fdc49ea44fc0450fb025c2639ed26 Monotone-Author: crobert@inverse.ca Monotone-Date: 2009-06-25T19:18:02 Monotone-Branch: ca.inverse.sogo
This commit is contained in:
@@ -0,0 +1,95 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
||||
<!--
|
||||
Copyright (c) 2003-2009, CKSource - Frederico Knabben. All rights reserved.
|
||||
For licensing, see LICENSE.html or http://ckeditor.com/license
|
||||
-->
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Sample - CKEditor</title>
|
||||
<meta content="text/html; charset=utf-8" http-equiv="content-type"/>
|
||||
<script type="text/javascript" src="../ckeditor.js"></script>
|
||||
<script src="sample.js" type="text/javascript"></script>
|
||||
<link href="sample.css" rel="stylesheet" type="text/css"/>
|
||||
<script id="headscript" type="text/javascript">
|
||||
//<![CDATA[
|
||||
|
||||
var editor;
|
||||
|
||||
function createEditor()
|
||||
{
|
||||
if ( editor )
|
||||
return;
|
||||
|
||||
var html = document.getElementById( 'editorcontents' ).innerHTML;
|
||||
|
||||
// Create a new editor inside the <div id="editor">
|
||||
editor = CKEDITOR.appendTo( 'editor' );
|
||||
editor.setData( html );
|
||||
|
||||
// This sample may break here if the ckeditor_basic.js is used. In such case, the following code should be used instead:
|
||||
/*
|
||||
if ( editor.setData )
|
||||
editor.setData( html );
|
||||
else
|
||||
CKEDITOR.on( 'loaded', function()
|
||||
{
|
||||
editor.setData( html );
|
||||
});
|
||||
*/
|
||||
}
|
||||
|
||||
function removeEditor()
|
||||
{
|
||||
if ( !editor )
|
||||
return;
|
||||
|
||||
// Retrieve the editor contents. In an Ajax application, this data would be
|
||||
// sent to the server or used in any other way.
|
||||
document.getElementById( 'editorcontents' ).innerHTML = editor.getData();
|
||||
document.getElementById( 'contents' ).style.display = '';
|
||||
|
||||
// Destroy the editor.
|
||||
editor.destroy();
|
||||
editor = null;
|
||||
}
|
||||
|
||||
//]]>
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<h1>
|
||||
CKEditor Sample
|
||||
</h1>
|
||||
<!-- This <div> holds alert messages to be display in the sample page. -->
|
||||
<div id="alerts">
|
||||
<noscript>
|
||||
<p>
|
||||
<strong>CKEditor requires JavaScript to run</strong>. In a browser with no JavaScript
|
||||
support, like yours, you should still see the contents (HTML data) and you should
|
||||
be able to edit it normally, without a rich editor interface.
|
||||
</p>
|
||||
</noscript>
|
||||
</div>
|
||||
<!-- This <fieldset> holds the HTML that you will usually find in your
|
||||
pages. -->
|
||||
<p>
|
||||
<input onclick="createEditor();" type="button" value="Create Editor"/>
|
||||
<input onclick="removeEditor();" type="button" value="Remove Editor"/>
|
||||
</p>
|
||||
<div id="editor">
|
||||
</div>
|
||||
<div id="contents" style="display: none">
|
||||
<p>Edited Contents:</p>
|
||||
<div id="editorcontents"/>
|
||||
</div>
|
||||
<div id="footer">
|
||||
<hr/>
|
||||
<p>
|
||||
CKEditor - The text editor for Internet - <a href="http://ckeditor.com/" shape="rect">http://ckeditor.com</a>
|
||||
</p>
|
||||
<p id="copy">
|
||||
Copyright © 2003-2009, <a href="http://cksource.com/" shape="rect">CKSource</a> - Frederico Knabben. All rights reserved.
|
||||
</p>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,178 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
||||
<!--
|
||||
Copyright (c) 2003-2009, CKSource - Frederico Knabben. All rights reserved.
|
||||
For licensing, see LICENSE.html or http://ckeditor.com/license
|
||||
-->
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Sample - CKEditor</title>
|
||||
<meta content="text/html; charset=utf-8" http-equiv="content-type"/>
|
||||
<script type="text/javascript" src="../ckeditor.js"></script>
|
||||
<script src="sample.js" type="text/javascript"></script>
|
||||
<link href="sample.css" rel="stylesheet" type="text/css"/>
|
||||
<style id="styles" type="text/css">
|
||||
|
||||
.cke_button_myDialogCmd .cke_icon
|
||||
{
|
||||
display : none !important;
|
||||
}
|
||||
|
||||
.cke_button_myDialogCmd .cke_label
|
||||
{
|
||||
display : inline !important;
|
||||
}
|
||||
|
||||
</style>
|
||||
<script id="headscript" type="text/javascript">
|
||||
//<![CDATA[
|
||||
|
||||
// When opening a dialog, its "definition" is created for it, for
|
||||
// each editor instance. The "dialogDefinition" event is then
|
||||
// fired. We should use this event to make customizations to the
|
||||
// definition of existing dialogs.
|
||||
CKEDITOR.on( 'dialogDefinition', function( ev )
|
||||
{
|
||||
// Take the dialog name and its definition from the event
|
||||
// data.
|
||||
var dialogName = ev.data.name;
|
||||
var dialogDefinition = ev.data.definition;
|
||||
|
||||
// Check if the definition is from the dialog we're
|
||||
// interested on (the "Link" dialog).
|
||||
if ( dialogName == 'link' )
|
||||
{
|
||||
// Get a reference to the "Link Info" tab.
|
||||
var infoTab = dialogDefinition.getContents( 'info' );
|
||||
|
||||
// Add a text field to the "info" tab.
|
||||
infoTab.add( {
|
||||
type : 'text',
|
||||
label : 'My Custom Field',
|
||||
id : 'customField',
|
||||
'default' : 'Sample!',
|
||||
validate : function()
|
||||
{
|
||||
if ( /\d/.test( this.getValue() ) )
|
||||
return 'My Custom Field must not contain digits';
|
||||
}
|
||||
});
|
||||
|
||||
// Remove the "Link Type" combo and the "Browser
|
||||
// Server" button from the "info" tab.
|
||||
infoTab.remove( 'linkType' );
|
||||
infoTab.remove( 'browse' );
|
||||
|
||||
// Set the default value for the URL field.
|
||||
var urlField = infoTab.get( 'url' );
|
||||
urlField['default'] = 'www.example.com';
|
||||
|
||||
// Remove the "Target" tab from the "Link" dialog.
|
||||
dialogDefinition.removeContents( 'target' );
|
||||
|
||||
// Add a new tab to the "Link" dialog.
|
||||
dialogDefinition.addContents({
|
||||
id : 'customTab',
|
||||
label : 'My Tab',
|
||||
accessKey : 'M',
|
||||
elements : [
|
||||
{
|
||||
id : 'myField1',
|
||||
type : 'text',
|
||||
label : 'My Text Field'
|
||||
},
|
||||
{
|
||||
id : 'myField2',
|
||||
type : 'text',
|
||||
label : 'Another Text Field'
|
||||
}
|
||||
]
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
//]]>
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<h1>
|
||||
CKEditor Sample
|
||||
</h1>
|
||||
<!-- This <div> holds alert messages to be display in the sample page. -->
|
||||
<div id="alerts">
|
||||
<noscript>
|
||||
<p>
|
||||
<strong>CKEditor requires JavaScript to run</strong>. In a browser with no JavaScript
|
||||
support, like yours, you should still see the contents (HTML data) and you should
|
||||
be able to edit it normally, without a rich editor interface.
|
||||
</p>
|
||||
</noscript>
|
||||
</div>
|
||||
<!-- This <fieldset> holds the HTML that you will usually find in your
|
||||
pages. -->
|
||||
<p>
|
||||
This sample shows how to use the dialog API to customize dialogs whithout changing
|
||||
the original editor code. The following customizations are being done::</p>
|
||||
<ol>
|
||||
<li><strong>Add dialog pages</strong> ("My Tab" in the Link dialog).</li>
|
||||
<li><strong>Remove a dialog tab</strong> ("Target" tab from the Link dialog).</li>
|
||||
<li><strong>Add dialog fields</strong> ("My Custom Field" into the Link dialog).</li>
|
||||
<li><strong>Remove dialog fields</strong> ("Link Type" and "Browser Server" the Link dialog).</li>
|
||||
<li><strong>Set default values for dialog fields</strong> (for the "URL" field in the
|
||||
Link dialog). </li>
|
||||
<li><strong>Create a custom dialog</strong> ("My Dialog" button).</li>
|
||||
</ol>
|
||||
<textarea cols="80" id="editor1" name="editor1" rows="10"><p>This is some <strong>sample text</strong>. You are using <a href="http://www.fckeditor.net/">CKEditor</a>.</p></textarea>
|
||||
<script type="text/javascript">
|
||||
//<![CDATA[
|
||||
// Replace the <textarea id="editor1"> with an CKEditor instance.
|
||||
var editor = CKEDITOR.replace( 'editor1',
|
||||
{
|
||||
// Defines a simpler toolbar to be used in this sample.
|
||||
// Note that we have added out "MyButton" button here.
|
||||
toolbar : [ [ 'Source', '-', 'Bold', 'Italic', 'Underline', 'Strike','-','Link', '-', 'MyButton' ] ]
|
||||
});
|
||||
|
||||
// Listen for the "pluginsLoaded" event, so we are sure that the
|
||||
// "dialog" plugin has been loaded and we are able to do our
|
||||
// customizations.
|
||||
editor.on( 'pluginsLoaded', function( ev )
|
||||
{
|
||||
// If our custom dialog has not been registered, do that now.
|
||||
if ( !CKEDITOR.dialog.exists( 'myDialog' ) )
|
||||
{
|
||||
// We need to do the following trick to find out the dialog
|
||||
// definition file URL path. In the real world, you would simply
|
||||
// point to an absolute path directly, like "/mydir/mydialog.js".
|
||||
var href = document.location.href.split( '/' );
|
||||
href.pop();
|
||||
href.push( 'api_dialog', 'my_dialog.js' );
|
||||
href = href.join( '/' );
|
||||
|
||||
// Finally, register the dialog.
|
||||
CKEDITOR.dialog.add( 'myDialog', href );
|
||||
}
|
||||
|
||||
// Register the command used to open the dialog.
|
||||
editor.addCommand( 'myDialogCmd', new CKEDITOR.dialogCommand( 'myDialog' ) );
|
||||
|
||||
// Add the a custom toolbar buttons, which fires the above
|
||||
// command..
|
||||
editor.ui.addButton( 'MyButton',
|
||||
{
|
||||
label : 'My Dialog',
|
||||
command : 'myDialogCmd'
|
||||
} );
|
||||
});
|
||||
//]]>
|
||||
</script>
|
||||
<div id="footer">
|
||||
<hr/>
|
||||
<p>
|
||||
CKEditor - The text editor for Internet - <a href="http://ckeditor.com/" shape="rect">http://ckeditor.com</a>
|
||||
</p>
|
||||
<p id="copy">
|
||||
Copyright © 2003-2009, <a href="http://cksource.com/" shape="rect">CKSource</a> - Frederico Knabben. All rights reserved.
|
||||
</p>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,28 @@
|
||||
/*
|
||||
Copyright (c) 2003-2009, CKSource - Frederico Knabben. All rights reserved.
|
||||
For licensing, see LICENSE.html or http://ckeditor.com/license
|
||||
*/
|
||||
|
||||
CKEDITOR.dialog.add( 'myDialog', function( editor )
|
||||
{
|
||||
return {
|
||||
title : 'My Dialog',
|
||||
minWidth : 400,
|
||||
minHeight : 200,
|
||||
contents : [
|
||||
{
|
||||
id : 'tab1',
|
||||
label : 'First Tab',
|
||||
title : 'First Tab',
|
||||
elements :
|
||||
[
|
||||
{
|
||||
id : 'input1',
|
||||
type : 'text',
|
||||
label : 'Input 1'
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
};
|
||||
} );
|
||||
@@ -0,0 +1,136 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
||||
<!--
|
||||
Copyright (c) 2003-2009, CKSource - Frederico Knabben. All rights reserved.
|
||||
For licensing, see LICENSE.html or http://ckeditor.com/license
|
||||
-->
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Sample - CKEditor</title>
|
||||
<meta content="text/html; charset=utf-8" http-equiv="content-type"/>
|
||||
<script type="text/javascript" src="../ckeditor.js"></script>
|
||||
<script src="sample.js" type="text/javascript"></script>
|
||||
<link href="sample.css" rel="stylesheet" type="text/css"/>
|
||||
<style id="styles" type="text/css">
|
||||
|
||||
div.editable
|
||||
{
|
||||
border: solid 2px Transparent;
|
||||
padding-left: 15px;
|
||||
padding-right: 15px;
|
||||
}
|
||||
|
||||
div.editable:hover
|
||||
{
|
||||
border-color: black;
|
||||
}
|
||||
|
||||
</style>
|
||||
<script id="headscript" type="text/javascript">
|
||||
//<![CDATA[
|
||||
|
||||
// Uncomment the following code to test the "Timeout Loading Method".
|
||||
// CKEDITOR.loadFullCoreTimeout = 5;
|
||||
|
||||
window.onload = function()
|
||||
{
|
||||
// Listen to the double click event.
|
||||
if ( window.addEventListener )
|
||||
document.body.addEventListener( 'dblclick', onDoubleClick, false );
|
||||
else if ( window.attachEvent )
|
||||
document.body.attachEvent( 'ondblclick', onDoubleClick );
|
||||
|
||||
};
|
||||
|
||||
function onDoubleClick( ev )
|
||||
{
|
||||
// Get the element which fired the event. This is not necessarily the
|
||||
// element to which the event has been attached.
|
||||
var element = ev.target || ev.srcElement;
|
||||
|
||||
// Find out the div that holds this element.
|
||||
element = element.parentNode;
|
||||
|
||||
if ( element.nodeName.toLowerCase() == 'div' )
|
||||
replaceDiv( element );
|
||||
}
|
||||
|
||||
var editor;
|
||||
|
||||
function replaceDiv( div )
|
||||
{
|
||||
if ( editor )
|
||||
editor.destroy();
|
||||
|
||||
editor = CKEDITOR.replace( div );
|
||||
}
|
||||
|
||||
//]]>
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<h1>
|
||||
CKEditor Sample
|
||||
</h1>
|
||||
<!-- This <div> holds alert messages to be display in the sample page. -->
|
||||
<div id="alerts">
|
||||
<noscript>
|
||||
<p>
|
||||
<strong>CKEditor requires JavaScript to run</strong>. In a browser with no JavaScript
|
||||
support, like yours, you should still see the contents (HTML data) and you should
|
||||
be able to edit it normally, without a rich editor interface.
|
||||
</p>
|
||||
</noscript>
|
||||
</div>
|
||||
<!-- This <fieldset> holds the HTML that you will usually find in your
|
||||
pages. -->
|
||||
<p>
|
||||
Double-click on any of the following DIVs to transform them into editor instances.</p>
|
||||
<div class="editable">
|
||||
<h3>
|
||||
Part 1</h3>
|
||||
<p>
|
||||
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Cras et ipsum quis mi
|
||||
semper accumsan. Integer pretium dui id massa. Suspendisse in nisl sit amet urna
|
||||
rutrum imperdiet. Nulla eu tellus. Donec ante nisi, ullamcorper quis, fringilla
|
||||
nec, sagittis eleifend, pede. Nulla commodo interdum massa. Donec id metus. Fusce
|
||||
eu ipsum. Suspendisse auctor. Phasellus fermentum porttitor risus.
|
||||
</p>
|
||||
</div>
|
||||
<div class="editable">
|
||||
<h3>
|
||||
Part 2</h3>
|
||||
<p>
|
||||
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Cras et ipsum quis mi
|
||||
semper accumsan. Integer pretium dui id massa. Suspendisse in nisl sit amet urna
|
||||
rutrum imperdiet. Nulla eu tellus. Donec ante nisi, ullamcorper quis, fringilla
|
||||
nec, sagittis eleifend, pede. Nulla commodo interdum massa. Donec id metus. Fusce
|
||||
eu ipsum. Suspendisse auctor. Phasellus fermentum porttitor risus.
|
||||
</p>
|
||||
<p>
|
||||
Donec velit. Mauris massa. Vestibulum non nulla. Nam suscipit arcu nec elit. Phasellus
|
||||
sollicitudin iaculis ante. Ut non mauris et sapien tincidunt adipiscing. Vestibulum
|
||||
vitae leo. Suspendisse nec mi tristique nulla laoreet vulputate.
|
||||
</p>
|
||||
</div>
|
||||
<div class="editable">
|
||||
<h3>
|
||||
Part 3</h3>
|
||||
<p>
|
||||
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Cras et ipsum quis mi
|
||||
semper accumsan. Integer pretium dui id massa. Suspendisse in nisl sit amet urna
|
||||
rutrum imperdiet. Nulla eu tellus. Donec ante nisi, ullamcorper quis, fringilla
|
||||
nec, sagittis eleifend, pede. Nulla commodo interdum massa. Donec id metus. Fusce
|
||||
eu ipsum. Suspendisse auctor. Phasellus fermentum porttitor risus.
|
||||
</p>
|
||||
</div>
|
||||
<div id="footer">
|
||||
<hr/>
|
||||
<p>
|
||||
CKEditor - The text editor for Internet - <a href="http://ckeditor.com/" shape="rect">http://ckeditor.com</a>
|
||||
</p>
|
||||
<p id="copy">
|
||||
Copyright © 2003-2009, <a href="http://cksource.com/" shape="rect">CKSource</a> - Frederico Knabben. All rights reserved.
|
||||
</p>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,90 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
||||
<!--
|
||||
Copyright (c) 2003-2009, CKSource - Frederico Knabben. All rights reserved.
|
||||
For licensing, see LICENSE.html or http://ckeditor.com/license
|
||||
-->
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Sample - CKEditor</title>
|
||||
<meta content="text/html; charset=utf-8" http-equiv="content-type"/>
|
||||
<script type="text/javascript" src="../ckeditor.js"></script>
|
||||
<script src="sample.js" type="text/javascript"></script>
|
||||
<link href="sample.css" rel="stylesheet" type="text/css"/>
|
||||
<script id="headscript" type="text/javascript">
|
||||
//<![CDATA[
|
||||
|
||||
var editor;
|
||||
|
||||
function changeEnter()
|
||||
{
|
||||
// If we already have an editor, let's destroy it first.
|
||||
if ( editor )
|
||||
editor.destroy( true );
|
||||
|
||||
// Create the editor again, with the appropriate settings.
|
||||
editor = CKEDITOR.replace( 'editor1',
|
||||
{
|
||||
enterMode : Number( document.getElementById( 'xEnter' ).value ),
|
||||
shiftEnterMode : Number( document.getElementById( 'xShiftEnter' ).value )
|
||||
});
|
||||
}
|
||||
|
||||
window.onload = changeEnter;
|
||||
|
||||
//]]>
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<h1>
|
||||
CKEditor Sample
|
||||
</h1>
|
||||
<!-- This <div> holds alert messages to be display in the sample page. -->
|
||||
<div id="alerts">
|
||||
<noscript>
|
||||
<p>
|
||||
<strong>CKEditor requires JavaScript to run</strong>. In a browser with no JavaScript
|
||||
support, like yours, you should still see the contents (HTML data) and you should
|
||||
be able to edit it normally, without a rich editor interface.
|
||||
</p>
|
||||
</noscript>
|
||||
</div>
|
||||
<!-- This <fieldset> holds the HTML that you will usually find in your
|
||||
pages. -->
|
||||
<div style="float: left; margin-right: 20px">
|
||||
When ENTER is pressed:<br/>
|
||||
<select id="xEnter" onchange="changeEnter();">
|
||||
<option selected="selected" value="1">Create new <P> (recommended)</option>
|
||||
<option value="3">Create new <DIV></option>
|
||||
<option value="2">Break the line with a <BR></option>
|
||||
</select>
|
||||
</div>
|
||||
<div style="float: left">
|
||||
When SHIFT + ENTER is pressed:<br/>
|
||||
<select id="xShiftEnter" onchange="changeEnter();">
|
||||
<option value="1">Create new <P></option>
|
||||
<option value="3">Create new <DIV></option>
|
||||
<option selected="selected" value="2">Break the line with a <BR> (recommended)</option>
|
||||
</select>
|
||||
</div>
|
||||
<br style="clear: both"/>
|
||||
|
||||
<form action="sample_posteddata.php" method="post">
|
||||
<p>
|
||||
<br/>
|
||||
<textarea cols="80" id="editor1" name="editor1" rows="10">This is some <strong>sample text</strong>. You are using <a href="http://www.fckeditor.net/">CKEditor</a>.</textarea>
|
||||
</p>
|
||||
<p>
|
||||
<input type="submit" value="Submit"/>
|
||||
</p>
|
||||
</form>
|
||||
<div id="footer">
|
||||
<hr/>
|
||||
<p>
|
||||
CKEditor - The text editor for Internet - <a href="http://ckeditor.com/" shape="rect">http://ckeditor.com</a>
|
||||
</p>
|
||||
<p id="copy">
|
||||
Copyright © 2003-2009, <a href="http://cksource.com/" shape="rect">CKSource</a> - Frederico Knabben. All rights reserved.
|
||||
</p>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,49 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
||||
<!--
|
||||
Copyright (c) 2003-2009, CKSource - Frederico Knabben. All rights reserved.
|
||||
For licensing, see LICENSE.html or http://ckeditor.com/license
|
||||
-->
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Samples List - CKEditor</title>
|
||||
<link type="text/css" rel="stylesheet" href="sample.css" />
|
||||
</head>
|
||||
<body>
|
||||
<h1>
|
||||
CKEditor Samples List
|
||||
</h1>
|
||||
<h2>
|
||||
Basic Samples
|
||||
</h2>
|
||||
<ul>
|
||||
<li><a href="replacebyclass.html">Replace textareas by class name</a></li>
|
||||
<li><a href="replacebycode.html">Replace textareas by code</a></li>
|
||||
</ul>
|
||||
<h2>
|
||||
Basic Customization
|
||||
</h2>
|
||||
<ul>
|
||||
<li><a href="skins.html">Skins</a></li>
|
||||
<li><a href="ui_color.html">User Interface Color</a></li>
|
||||
<li><a href="ui_languages.html">User Interface Languages</a></li>
|
||||
</ul>
|
||||
<h2>
|
||||
Advanced Samples
|
||||
</h2>
|
||||
<ul>
|
||||
<li><a href="divreplace.html">Replace DIV elements on the fly</a> </li>
|
||||
<li><a href="ajax.html">Create and destroy editor instances for Ajax applications</a></li>
|
||||
<li><a href="api_dialog.html">Using the JavaScript API to customize dialogs</a></li>
|
||||
<li><a href="enterkey.html">Using the "Enter" key in CKEditor</a></li>
|
||||
</ul>
|
||||
<div id="footer">
|
||||
<hr />
|
||||
<p>
|
||||
CKEditor - The text editor for Internet - <a href="http://ckeditor.com/">http://ckeditor.com</a>
|
||||
</p>
|
||||
<p id="copy">
|
||||
Copyright © 2003-2009, <a href="http://cksource.com/">CKSource</a> - Frederico Knabben. All rights reserved.
|
||||
</p>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,50 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
||||
<!--
|
||||
Copyright (c) 2003-2009, CKSource - Frederico Knabben. All rights reserved.
|
||||
For licensing, see LICENSE.html or http://ckeditor.com/license
|
||||
-->
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Sample - CKEditor</title>
|
||||
<meta content="text/html; charset=utf-8" http-equiv="content-type"/>
|
||||
<script type="text/javascript" src="../ckeditor.js"></script>
|
||||
<script src="sample.js" type="text/javascript"></script>
|
||||
<link href="sample.css" rel="stylesheet" type="text/css"/>
|
||||
</head>
|
||||
<body>
|
||||
<h1>
|
||||
CKEditor Sample
|
||||
</h1>
|
||||
<!-- This <div> holds alert messages to be display in the sample page. -->
|
||||
<div id="alerts">
|
||||
<noscript>
|
||||
<p>
|
||||
<strong>CKEditor requires JavaScript to run</strong>. In a browser with no JavaScript
|
||||
support, like yours, you should still see the contents (HTML data) and you should
|
||||
be able to edit it normally, without a rich editor interface.
|
||||
</p>
|
||||
</noscript>
|
||||
</div>
|
||||
<!-- This <fieldset> holds the HTML that you will usually find in your
|
||||
pages. -->
|
||||
<form action="sample_posteddata.php" method="post">
|
||||
<p>
|
||||
<label for="editor1">
|
||||
Editor 1:</label><br/>
|
||||
<textarea class="ckeditor" cols="80" id="editor1" name="editor1" rows="10"><p>This is some <strong>sample text</strong>. You are using <a href="http://www.fckeditor.net/">CKEditor</a>.</p></textarea>
|
||||
</p>
|
||||
<p>
|
||||
<input type="submit" value="Submit"/>
|
||||
</p>
|
||||
</form>
|
||||
<div id="footer">
|
||||
<hr/>
|
||||
<p>
|
||||
CKEditor - The text editor for Internet - <a href="http://ckeditor.com/" shape="rect">http://ckeditor.com</a>
|
||||
</p>
|
||||
<p id="copy">
|
||||
Copyright © 2003-2009, <a href="http://cksource.com/" shape="rect">CKSource</a> - Frederico Knabben. All rights reserved.
|
||||
</p>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,81 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
||||
<!--
|
||||
Copyright (c) 2003-2009, CKSource - Frederico Knabben. All rights reserved.
|
||||
For licensing, see LICENSE.html or http://ckeditor.com/license
|
||||
-->
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Sample - CKEditor</title>
|
||||
<meta content="text/html; charset=utf-8" http-equiv="content-type"/>
|
||||
<script type="text/javascript" src="../ckeditor.js"></script>
|
||||
<script src="sample.js" type="text/javascript"></script>
|
||||
<link href="sample.css" rel="stylesheet" type="text/css"/>
|
||||
</head>
|
||||
<body>
|
||||
<h1>
|
||||
CKEditor Sample
|
||||
</h1>
|
||||
<!-- This <div> holds alert messages to be display in the sample page. -->
|
||||
<div id="alerts">
|
||||
<noscript>
|
||||
<p>
|
||||
<strong>CKEditor requires JavaScript to run</strong>. In a browser with no JavaScript
|
||||
support, like yours, you should still see the contents (HTML data) and you should
|
||||
be able to edit it normally, without a rich editor interface.
|
||||
</p>
|
||||
</noscript>
|
||||
</div>
|
||||
<!-- This <fieldset> holds the HTML that you will usually find in your
|
||||
pages. -->
|
||||
<form action="sample_posteddata.php" method="post">
|
||||
<p>
|
||||
<label for="editor1">
|
||||
Editor 1:</label><br/>
|
||||
<textarea cols="80" id="editor1" name="editor1" rows="10"><p>This is some <strong>sample text</strong>. You are using <a href="http://www.fckeditor.net/">CKEditor</a>.</p></textarea>
|
||||
<script type="text/javascript">
|
||||
//<![CDATA[
|
||||
|
||||
// This call can be placed at any point after the
|
||||
// <textarea>, or inside a <head><script> in a
|
||||
// window.onload event handler.
|
||||
|
||||
// Replace the <textarea id="editor"> with an CKEditor
|
||||
// instance, using default configurations.
|
||||
CKEDITOR.replace( 'editor1' );
|
||||
|
||||
//]]>
|
||||
</script>
|
||||
</p>
|
||||
<p>
|
||||
<label for="editor2">
|
||||
Editor 2:</label><br/>
|
||||
<textarea cols="80" id="editor2" name="editor2" rows="10"><p>This is some <strong>sample text</strong>. You are using <a href="http://www.fckeditor.net/">CKEditor</a>.</p></textarea>
|
||||
<script type="text/javascript">
|
||||
//<![CDATA[
|
||||
|
||||
// This call can be placed at any point after the
|
||||
// <textarea>, or inside a <head><script> in a
|
||||
// window.onload event handler.
|
||||
|
||||
// Replace the <textarea id="editor"> with an CKEditor
|
||||
// instance, using default configurations.
|
||||
CKEDITOR.replace( 'editor2' );
|
||||
|
||||
//]]>
|
||||
</script>
|
||||
</p>
|
||||
<p>
|
||||
<input type="submit" value="Submit"/>
|
||||
</p>
|
||||
</form>
|
||||
<div id="footer">
|
||||
<hr/>
|
||||
<p>
|
||||
CKEditor - The text editor for Internet - <a href="http://ckeditor.com/" shape="rect">http://ckeditor.com</a>
|
||||
</p>
|
||||
<p id="copy">
|
||||
Copyright © 2003-2009, <a href="http://cksource.com/" shape="rect">CKSource</a> - Frederico Knabben. All rights reserved.
|
||||
</p>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,81 @@
|
||||
/*
|
||||
Copyright (c) 2003-2009, CKSource - Frederico Knabben. All rights reserved.
|
||||
For licensing, see LICENSE.html or http://ckeditor.com/license
|
||||
*/
|
||||
|
||||
fieldset
|
||||
{
|
||||
margin: 0;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
form
|
||||
{
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
pre
|
||||
{
|
||||
background-color: #F7F7F7;
|
||||
border: 1px solid #D7D7D7;
|
||||
overflow: auto;
|
||||
margin: 0;
|
||||
padding: 0.25em;
|
||||
}
|
||||
|
||||
#alerts
|
||||
{
|
||||
color: Red;
|
||||
}
|
||||
|
||||
#footer hr
|
||||
{
|
||||
margin: 10px 0 15px 0;
|
||||
height: 1px;
|
||||
border: solid 1px gray;
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
#footer p
|
||||
{
|
||||
margin: 0 10px 10px 10px;
|
||||
float: left;
|
||||
}
|
||||
|
||||
#footer #copy
|
||||
{
|
||||
float: right;
|
||||
}
|
||||
|
||||
#outputSample
|
||||
{
|
||||
width: 100%;
|
||||
table-layout: fixed;
|
||||
}
|
||||
|
||||
#outputSample thead th
|
||||
{
|
||||
color: #dddddd;
|
||||
background-color: #999999;
|
||||
padding: 4px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
#outputSample tbody th
|
||||
{
|
||||
vertical-align: top;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
#outputSample pre
|
||||
{
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
white-space: pre; /* CSS2 */
|
||||
white-space: -moz-pre-wrap; /* Mozilla*/
|
||||
white-space: -o-pre-wrap; /* Opera 7 */
|
||||
white-space: pre-wrap; /* CSS 2.1 */
|
||||
white-space: pre-line; /* CSS 3 (and 2.1 as well, actually) */
|
||||
word-wrap: break-word; /* IE */
|
||||
}
|
||||
@@ -0,0 +1,71 @@
|
||||
/*
|
||||
Copyright (c) 2003-2009, CKSource - Frederico Knabben. All rights reserved.
|
||||
For licensing, see LICENSE.html or http://ckeditor.com/license
|
||||
*/
|
||||
|
||||
// This file is not required by CKEditor and may be safely ignored.
|
||||
// It is just a helper file that displays a red message about browser compatibility
|
||||
// at the top of the samples (if incompatible browser is detected).
|
||||
|
||||
// Firebug has been presented some bugs with console. It must be "initialized"
|
||||
// before the page load to work.
|
||||
// FIXME: Remove the following in the future, if Firebug gets fixed.
|
||||
if ( typeof console != 'undefined' )
|
||||
console.log();
|
||||
|
||||
|
||||
if ( window.CKEDITOR )
|
||||
{
|
||||
(function()
|
||||
{
|
||||
var showCompatibilityMsg = function()
|
||||
{
|
||||
var env = CKEDITOR.env;
|
||||
|
||||
var html = '<p><strong>Your browser is not compatible with CKEditor.</strong>';
|
||||
|
||||
var browsers =
|
||||
{
|
||||
gecko : 'Firefox 2.0',
|
||||
ie : 'Internet Explorer 6.0',
|
||||
opera : 'Opera 9.5',
|
||||
webkit : 'Safari 3.0'
|
||||
};
|
||||
|
||||
var alsoBrowsers = '';
|
||||
|
||||
for ( var key in env )
|
||||
{
|
||||
if ( browsers[ key ] )
|
||||
{
|
||||
if ( env[key] )
|
||||
html += ' CKEditor is compatible with ' + browsers[ key ] + ' or higher.';
|
||||
else
|
||||
alsoBrowsers += browsers[ key ] + '+, ';
|
||||
}
|
||||
}
|
||||
|
||||
alsoBrowsers = alsoBrowsers.replace( /\+,([^,]+), $/, '+ and $1' );
|
||||
|
||||
html += ' It is also compatible with ' + alsoBrowsers + '.';
|
||||
|
||||
html += '</p><p>With non compatible browsers, you should still be able to see and edit the contents (HTML) in a plain text field.</p>';
|
||||
|
||||
document.getElementById( 'alerts' ).innerHTML = html;
|
||||
};
|
||||
|
||||
var onload = function()
|
||||
{
|
||||
// Show a friendly compatibility message as soon as the page is loaded,
|
||||
// for those browsers that are not compatible with CKEditor.
|
||||
if ( !CKEDITOR.env.isCompatible )
|
||||
showCompatibilityMsg();
|
||||
};
|
||||
|
||||
// Register the onload listener.
|
||||
if ( window.addEventListener )
|
||||
window.addEventListener( 'load', onload, false );
|
||||
else if ( window.attachEvent )
|
||||
window.attachEvent( 'onload', onload );
|
||||
})();
|
||||
}
|
||||
@@ -0,0 +1,59 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
||||
<?php
|
||||
/*
|
||||
Copyright (c) 2003-2009, CKSource - Frederico Knabben. All rights reserved.
|
||||
For licensing, see LICENSE.html or http://ckeditor.com/license
|
||||
*/
|
||||
?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Sample - CKEditor</title>
|
||||
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
|
||||
<link type="text/css" rel="stylesheet" href="sample.css" />
|
||||
</head>
|
||||
<body>
|
||||
<h1>
|
||||
CKEditor - Posted Data
|
||||
</h1>
|
||||
<table border="1" cellspacing="0" id="outputSample">
|
||||
<colgroup><col width="100" /></colgroup>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Field Name</th>
|
||||
<th>Value</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<?php
|
||||
|
||||
if ( isset( $_POST ) )
|
||||
$postArray = &$_POST ; // 4.1.0 or later, use $_POST
|
||||
else
|
||||
$postArray = &$HTTP_POST_VARS ; // prior to 4.1.0, use HTTP_POST_VARS
|
||||
|
||||
foreach ( $postArray as $sForm => $value )
|
||||
{
|
||||
if ( get_magic_quotes_gpc() )
|
||||
$postedValue = htmlspecialchars( stripslashes( $value ) ) ;
|
||||
else
|
||||
$postedValue = htmlspecialchars( $value ) ;
|
||||
|
||||
?>
|
||||
<tr>
|
||||
<th style="vertical-align: top"><?php echo $sForm?></th>
|
||||
<td><pre><?php echo $postedValue?></pre></td>
|
||||
</tr>
|
||||
<?php
|
||||
}
|
||||
?>
|
||||
</table>
|
||||
<div id="footer">
|
||||
<hr />
|
||||
<p>
|
||||
CKEditor - The text editor for Internet - <a href="http://ckeditor.com/">http://ckeditor.com</a>
|
||||
</p>
|
||||
<p id="copy">
|
||||
Copyright © 2003-2009, <a href="http://cksource.com/">CKSource</a> - Frederico Knabben. All rights reserved.
|
||||
</p>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,84 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
||||
<!--
|
||||
Copyright (c) 2003-2009, CKSource - Frederico Knabben. All rights reserved.
|
||||
For licensing, see LICENSE.html or http://ckeditor.com/license
|
||||
-->
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Sample - CKEditor</title>
|
||||
<meta content="text/html; charset=utf-8" http-equiv="content-type"/>
|
||||
<script type="text/javascript" src="../ckeditor.js"></script>
|
||||
<script src="sample.js" type="text/javascript"></script>
|
||||
<link href="sample.css" rel="stylesheet" type="text/css"/>
|
||||
</head>
|
||||
<body>
|
||||
<h1>
|
||||
CKEditor Sample
|
||||
</h1>
|
||||
<!-- This <div> holds alert messages to be display in the sample page. -->
|
||||
<div id="alerts">
|
||||
<noscript>
|
||||
<p>
|
||||
<strong>CKEditor requires JavaScript to run</strong>. In a browser with no JavaScript
|
||||
support, like yours, you should still see the contents (HTML data) and you should
|
||||
be able to edit it normally, without a rich editor interface.
|
||||
</p>
|
||||
</noscript>
|
||||
</div>
|
||||
<!-- This <fieldset> holds the HTML that you will usually find in your
|
||||
pages. -->
|
||||
<form action="sample_posteddata.php" method="post">
|
||||
<p>
|
||||
"Kama" skin:<br/>
|
||||
<textarea cols="80" id="editor_kama" name="editor_kama" rows="10"><p>This is some <strong>sample text</strong>. You are using <a href="http://www.fckeditor.net/">CKEditor</a>.</p></textarea>
|
||||
<script type="text/javascript">
|
||||
//<![CDATA[
|
||||
|
||||
CKEDITOR.replace( 'editor_kama',
|
||||
{
|
||||
skin : 'kama'
|
||||
});
|
||||
|
||||
//]]>
|
||||
</script>
|
||||
</p>
|
||||
<p>
|
||||
"Office 2003" skin:<br/>
|
||||
<textarea cols="80" id="editor_office2003" name="editor_office2003" rows="10"><p>This is some <strong>sample text</strong>. You are using <a href="http://www.fckeditor.net/">CKEditor</a>.</p></textarea>
|
||||
<script type="text/javascript">
|
||||
//<![CDATA[
|
||||
|
||||
CKEDITOR.replace( 'editor_office2003',
|
||||
{
|
||||
skin : 'office2003'
|
||||
});
|
||||
|
||||
//]]>
|
||||
</script>
|
||||
</p>
|
||||
<p>
|
||||
"V2" skin:<br/>
|
||||
<textarea cols="80" id="editor_v2" name="editor_v2" rows="10"><p>This is some <strong>sample text</strong>. You are using <a href="http://www.fckeditor.net/">CKEditor</a>.</p></textarea>
|
||||
<script type="text/javascript">
|
||||
//<![CDATA[
|
||||
|
||||
CKEDITOR.replace( 'editor_v2',
|
||||
{
|
||||
skin : 'v2'
|
||||
});
|
||||
|
||||
//]]>
|
||||
</script>
|
||||
</p>
|
||||
</form>
|
||||
<div id="footer">
|
||||
<hr/>
|
||||
<p>
|
||||
CKEditor - The text editor for Internet - <a href="http://ckeditor.com/" shape="rect">http://ckeditor.com</a>
|
||||
</p>
|
||||
<p id="copy">
|
||||
Copyright © 2003-2009, <a href="http://cksource.com/" shape="rect">CKSource</a> - Frederico Knabben. All rights reserved.
|
||||
</p>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,87 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
||||
<!--
|
||||
Copyright (c) 2003-2009, CKSource - Frederico Knabben. All rights reserved.
|
||||
For licensing, see LICENSE.html or http://ckeditor.com/license
|
||||
-->
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Sample - CKEditor</title>
|
||||
<meta content="text/html; charset=utf-8" http-equiv="content-type"/>
|
||||
<script type="text/javascript" src="../ckeditor.js"></script>
|
||||
<script src="sample.js" type="text/javascript"></script>
|
||||
<link href="sample.css" rel="stylesheet" type="text/css"/>
|
||||
</head>
|
||||
<body>
|
||||
<h1>
|
||||
CKEditor Sample
|
||||
</h1>
|
||||
<!-- This <div> holds alert messages to be display in the sample page. -->
|
||||
<div id="alerts">
|
||||
<noscript>
|
||||
<p>
|
||||
<strong>CKEditor requires JavaScript to run</strong>. In a browser with no JavaScript
|
||||
support, like yours, you should still see the contents (HTML data) and you should
|
||||
be able to edit it normally, without a rich editor interface.
|
||||
</p>
|
||||
</noscript>
|
||||
</div>
|
||||
<!-- This <fieldset> holds the HTML that you will usually find in your
|
||||
pages. -->
|
||||
<p>Click the UI Color Picker button to test your color preferences at runtime.</p>
|
||||
<form action="sample_posteddata.php" method="post">
|
||||
<p>
|
||||
<textarea cols="80" id="editor1" name="editor1" rows="10"><p>This is some <strong>sample text</strong>. You are using <a href="http://www.fckeditor.net/">CKEditor</a>.</p></textarea>
|
||||
<script type="text/javascript">
|
||||
//<![CDATA[
|
||||
|
||||
// Replace the <textarea id="editor"> with an CKEditor
|
||||
// instance, using default configurations.
|
||||
CKEDITOR.replace( 'editor1',
|
||||
{
|
||||
extraPlugins : 'uicolor',
|
||||
toolbar :
|
||||
[
|
||||
[ 'Bold', 'Italic', '-', 'NumberedList', 'BulletedList', '-', 'Link', 'Unlink' ],
|
||||
[ 'UIColor' ]
|
||||
]
|
||||
});
|
||||
|
||||
//]]>
|
||||
</script>
|
||||
</p>
|
||||
<p>
|
||||
<textarea cols="80" id="editor2" name="editor2" rows="10"><p>This is some <strong>sample text</strong>. You are using <a href="http://www.fckeditor.net/">CKEditor</a>.</p></textarea>
|
||||
<script type="text/javascript">
|
||||
//<![CDATA[
|
||||
|
||||
// Replace the <textarea id="editor"> with an CKEditor
|
||||
// instance, using default configurations.
|
||||
CKEDITOR.replace( 'editor2',
|
||||
{
|
||||
extraPlugins : 'uicolor',
|
||||
uiColor: '#14B8C4',
|
||||
toolbar :
|
||||
[
|
||||
[ 'Bold', 'Italic', '-', 'NumberedList', 'BulletedList', '-', 'Link', 'Unlink' ],
|
||||
[ 'UIColor' ]
|
||||
]
|
||||
} );
|
||||
|
||||
//]]>
|
||||
</script>
|
||||
</p>
|
||||
<p>
|
||||
<input type="submit" value="Submit"/>
|
||||
</p>
|
||||
</form>
|
||||
<div id="footer">
|
||||
<hr/>
|
||||
<p>
|
||||
CKEditor - The text editor for Internet - <a href="http://ckeditor.com/" shape="rect">http://ckeditor.com</a>
|
||||
</p>
|
||||
<p id="copy">
|
||||
Copyright © 2003-2009, <a href="http://cksource.com/" shape="rect">CKSource</a> - Frederico Knabben. All rights reserved.
|
||||
</p>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,114 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
||||
<!--
|
||||
Copyright (c) 2003-2009, CKSource - Frederico Knabben. All rights reserved.
|
||||
For licensing, see LICENSE.html or http://ckeditor.com/license
|
||||
-->
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Sample - CKEditor</title>
|
||||
<meta content="text/html; charset=utf-8" http-equiv="content-type"/>
|
||||
<script type="text/javascript" src="../ckeditor.js"></script>
|
||||
<script src="sample.js" type="text/javascript"></script>
|
||||
<link href="sample.css" rel="stylesheet" type="text/css"/>
|
||||
<script id="headscript" type="text/javascript">
|
||||
//<![CDATA[
|
||||
|
||||
document.write( '<script type="text/javascript" src="../_source/lang/_languages.js"><\/script>' );
|
||||
|
||||
//]]>
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<h1>
|
||||
CKEditor Sample
|
||||
</h1>
|
||||
<!-- This <div> holds alert messages to be display in the sample page. -->
|
||||
<div id="alerts">
|
||||
<noscript>
|
||||
<p>
|
||||
<strong>CKEditor requires JavaScript to run</strong>. In a browser with no JavaScript
|
||||
support, like yours, you should still see the contents (HTML data) and you should
|
||||
be able to edit it normally, without a rich editor interface.
|
||||
</p>
|
||||
</noscript>
|
||||
</div>
|
||||
<!-- This <fieldset> holds the HTML that you will usually find in your
|
||||
pages. -->
|
||||
<form action="sample_posteddata.php" method="post">
|
||||
<p>
|
||||
<label for="editor1">
|
||||
Available languages (<span id="count"> </span>
|
||||
languages!):</label><br/>
|
||||
<select disabled="disabled" id="languages" onchange="createEditor( this.value );">
|
||||
<script type="text/javascript">
|
||||
//<![CDATA[
|
||||
|
||||
// Get the language list from the _languages.js file.
|
||||
for ( var i = 0 ; i < window.CKEDITOR_LANGS.length ; i++ )
|
||||
{
|
||||
document.write(
|
||||
'<option value="' + window.CKEDITOR_LANGS[i].code + '">' +
|
||||
window.CKEDITOR_LANGS[i].name +
|
||||
'</option>' );
|
||||
}
|
||||
|
||||
//]]>
|
||||
</script>
|
||||
</select>
|
||||
<br/>
|
||||
<span style="color: #888888">(You may see strange characters if your system doesn't
|
||||
support the selected language)</span>
|
||||
</p>
|
||||
<p>
|
||||
<textarea cols="80" id="editor1" name="editor1" rows="10"><p>This is some <strong>sample text</strong>. You are using <a href="http://www.fckeditor.net/">CKEditor</a>.</p></textarea>
|
||||
<script type="text/javascript">
|
||||
//<![CDATA[
|
||||
|
||||
// Set the number of languages.
|
||||
document.getElementById( 'count' ).innerHTML = window.CKEDITOR_LANGS.length;
|
||||
|
||||
var editor;
|
||||
|
||||
function createEditor( languageCode )
|
||||
{
|
||||
if ( editor )
|
||||
editor.destroy();
|
||||
|
||||
// Replace the <textarea id="editor"> with an CKEditor
|
||||
// instance, using default configurations.
|
||||
editor = CKEDITOR.replace( 'editor1',
|
||||
{
|
||||
language : languageCode,
|
||||
|
||||
on :
|
||||
{
|
||||
instanceReady : function()
|
||||
{
|
||||
// Wait for the editor to be ready to set
|
||||
// the language combo.
|
||||
var languages = document.getElementById( 'languages' );
|
||||
languages.value = this.langCode;
|
||||
languages.disabled = false;
|
||||
}
|
||||
}
|
||||
} );
|
||||
}
|
||||
|
||||
// At page startup, load the default language:
|
||||
createEditor( '' );
|
||||
|
||||
//]]>
|
||||
</script>
|
||||
</p>
|
||||
</form>
|
||||
<div id="footer">
|
||||
<hr/>
|
||||
<p>
|
||||
CKEditor - The text editor for Internet - <a href="http://ckeditor.com/" shape="rect">http://ckeditor.com</a>
|
||||
</p>
|
||||
<p id="copy">
|
||||
Copyright © 2003-2009, <a href="http://cksource.com/" shape="rect">CKSource</a> - Frederico Knabben. All rights reserved.
|
||||
</p>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user