Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Browse files

added examples/insert_list.html

Signed-off-by: Joshua Peek <josh@joshpeek.com>
  • Loading branch information...
commit 96380e4f4d986c9fac4c34b96712c261f579aba0 1 parent f3ec989
@jeffkreeftmeijer jeffkreeftmeijer authored josh committed
Showing with 82 additions and 0 deletions.
  1. +82 −0 examples/insert_list.html
View
82 examples/insert_list.html
@@ -0,0 +1,82 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
+ "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+<head>
+ <title>WYSIWYG</title>
+
+ <style type="text/css" media="screen">
+ iframe {
+ width: 100%;
+ height: 150px;
+ border: 1px solid #999;
+ }
+
+ .editor_toolbar .button {
+ float: left;
+ margin: 2px 5px;
+ }
+
+ .editor_toolbar .selected {
+ color: red !important;
+ }
+
+ #error {
+ font: 18px helvetica, arial, sans-serif;
+ color: red;
+ }
+ </style>
+
+ <script type="text/javascript" src="../dist/prototype.js"></script>
+ <script type="text/javascript" src="../dist/wysihat.js"></script>
+
+ <script type="text/javascript" charset="utf-8">
+ Event.observe(window, 'load', function() {
+ var editor = WysiHat.Editor.attach('content');
+ var toolbar = new WysiHat.Toolbar(editor);
+
+ toolbar.addButton({
+ label: "InsertOrderedList"
+ });
+
+ toolbar.addButton({
+ label: "InsertUnorderedList"
+ });
+
+ // Hide our error message if the editor loads fine
+ $('error').hide();
+ });
+ </script>
+</head>
+
+<body>
+ <p id="error">Oops, you need to build the package before running this example. It's easy: just run <code>rake</code> in the project's directory.</p>
+
+ <p>This example shows you how to create a simple UI for using Undo & Redo functionality</p>
+
+<code><pre>
+ Event.observe(window, 'load', function() {
+ var editor = WysiHat.Editor.attach('content');
+ var toolbar = new WysiHat.Toolbar(editor);
+
+ toolbar.addButton({
+ label: "Undo"
+ });
+
+ toolbar.addButton({
+ label: "Redo"
+ });
+
+ });
+</pre></code>
+
+ <form action="#" method="post" style="width: 500px;">
+ <!-- This HTML will be automatically generated for you by the toolbar class
+ <div class="editor_toolbar">
+ <a class="button undo" href="#"><span>Undo</span></a>
+ <a class="button redo" href="#"><span>Redo</span></a>
+ </div>
+ <iframe id="content_editor" style="display: none;"> -->
+ <textarea id="content"></textarea>
+ </form>
+</body>
+</html>
Please sign in to comment.
Something went wrong with that request. Please try again.