liquid_feedback_frontend

annotate static/wysihtml/example.html @ 1597:631f6311a9eb

find changesets by author, revision, files, or words in the commit message
Updated german translation
author bsw
date Sun Jan 31 20:37:22 2021 +0100 (2021-01-31)
parents 32cc544d5a5b
children
rev   line source
bsw/jbe@1309 1 <!DOCTYPE html>
bsw/jbe@1309 2
bsw/jbe@1309 3 <meta http-equiv="X-UA-Compatible" content="IE=Edge">
bsw/jbe@1309 4 <meta charset="utf-8">
bsw/jbe@1309 5
bsw/jbe@1309 6 <title>wysihtml - Advanced Demo</title>
bsw/jbe@1309 7
bsw/jbe@1309 8 <style>
bsw/jbe@1309 9 body {
bsw/jbe@1309 10 font-family: Verdana;
bsw/jbe@1309 11 font-size: 11px;
bsw/jbe@1309 12 }
bsw/jbe@1309 13
bsw/jbe@1309 14 h2 {
bsw/jbe@1309 15 margin-bottom: 0;
bsw/jbe@1309 16 }
bsw/jbe@1309 17
bsw/jbe@1309 18 small {
bsw/jbe@1309 19 display: block;
bsw/jbe@1309 20 margin-top: 40px;
bsw/jbe@1309 21 font-size: 9px;
bsw/jbe@1309 22 }
bsw/jbe@1309 23
bsw/jbe@1309 24 small,
bsw/jbe@1309 25 small a {
bsw/jbe@1309 26 color: #666;
bsw/jbe@1309 27 }
bsw/jbe@1309 28
bsw/jbe@1309 29 a {
bsw/jbe@1309 30 color: #000;
bsw/jbe@1309 31 text-decoration: underline;
bsw/jbe@1309 32 cursor: pointer;
bsw/jbe@1309 33 }
bsw/jbe@1309 34
bsw/jbe@1309 35 #toolbar [data-wysihtml-action] {
bsw/jbe@1309 36 float: right;
bsw/jbe@1309 37 }
bsw/jbe@1309 38
bsw/jbe@1309 39 #toolbar,
bsw/jbe@1309 40 textarea {
bsw/jbe@1309 41 width: 920px;
bsw/jbe@1309 42 padding: 5px;
bsw/jbe@1309 43 -webkit-box-sizing: border-box;
bsw/jbe@1309 44 -ms-box-sizing: border-box;
bsw/jbe@1309 45 -moz-box-sizing: border-box;
bsw/jbe@1309 46 box-sizing: border-box;
bsw/jbe@1309 47 }
bsw/jbe@1309 48
bsw/jbe@1309 49 textarea {
bsw/jbe@1309 50 height: 280px;
bsw/jbe@1309 51 border: 2px solid green;
bsw/jbe@1309 52 font-family: Verdana;
bsw/jbe@1309 53 font-size: 11px;
bsw/jbe@1309 54 }
bsw/jbe@1309 55
bsw/jbe@1309 56 textarea:focus {
bsw/jbe@1309 57 color: black;
bsw/jbe@1309 58 border: 2px solid black;
bsw/jbe@1309 59 }
bsw/jbe@1309 60
bsw/jbe@1309 61 .wysihtml-command-active {
bsw/jbe@1309 62 font-weight: bold;
bsw/jbe@1309 63 }
bsw/jbe@1309 64
bsw/jbe@1309 65 [data-wysihtml-dialog] {
bsw/jbe@1309 66 margin: 5px 0 0;
bsw/jbe@1309 67 padding: 5px;
bsw/jbe@1309 68 border: 1px solid #666;
bsw/jbe@1309 69 }
bsw/jbe@1309 70
bsw/jbe@1309 71 a[data-wysihtml-command-value="red"] {
bsw/jbe@1309 72 color: red;
bsw/jbe@1309 73 }
bsw/jbe@1309 74
bsw/jbe@1309 75 a[data-wysihtml-command-value="green"] {
bsw/jbe@1309 76 color: green;
bsw/jbe@1309 77 }
bsw/jbe@1309 78
bsw/jbe@1309 79 a[data-wysihtml-command-value="blue"] {
bsw/jbe@1309 80 color: blue;
bsw/jbe@1309 81 }
bsw/jbe@1309 82
bsw/jbe@1309 83 div.editable {
bsw/jbe@1309 84 border: 1px dashed gray;
bsw/jbe@1309 85 padding: 10px;
bsw/jbe@1309 86 }
bsw/jbe@1309 87 </style>
bsw/jbe@1309 88
bsw/jbe@1309 89 <h1>wysihtml - Advanced Editor Example</h1>
bsw/jbe@1309 90
bsw/jbe@1309 91 <h2>Example of editor with iframe wrapper and as textarea replacement</h2>
bsw/jbe@1309 92 <br>
bsw/jbe@1309 93 <form class="ewrapper">
bsw/jbe@1309 94 <div class="toolbar" style="display: none;">
bsw/jbe@1309 95 <a data-wysihtml-command="bold" title="CTRL+B">bold</a> |
bsw/jbe@1309 96 <a data-wysihtml-command="italic" title="CTRL+I">italic</a> |
bsw/jbe@1309 97 <a data-wysihtml-command="superscript" title="sup">superscript</a> |
bsw/jbe@1309 98 <a data-wysihtml-command="subscript" title="sub">subscript</a> |
bsw/jbe@1309 99 <a data-wysihtml-command="createLink">link</a> |
bsw/jbe@1309 100 <a data-wysihtml-command="removeLink"><s>link</s></a> |
bsw/jbe@1309 101 <a data-wysihtml-command="formatBlock" data-wysihtml-command-value="h1">h1</a> |
bsw/jbe@1309 102 <a data-wysihtml-command="formatBlock" data-wysihtml-command-value="h2">h2</a> |
bsw/jbe@1309 103 <a data-wysihtml-command="formatBlock" data-wysihtml-command-blank-value="true">plaintext</a> |
bsw/jbe@1309 104 <a data-wysihtml-command="insertUnorderedList">insertUnorderedList</a> |
bsw/jbe@1309 105 <a data-wysihtml-command="insertOrderedList">insertOrderedList</a> |
bsw/jbe@1309 106 <a data-wysihtml-command="formatCode" data-wysihtml-command-value="language-html">Code</a> |
bsw/jbe@1309 107 <a data-wysihtml-command="undo">undo</a> |
bsw/jbe@1309 108 <a data-wysihtml-command="redo">redo</a> |
bsw/jbe@1309 109 <a data-wysihtml-command="insertSpeech">speech</a>
bsw/jbe@1309 110 <a data-wysihtml-action="change_view">switch to html view</a>
bsw/jbe@1309 111
bsw/jbe@1309 112 <div data-wysihtml-dialog="createLink" style="display: none;">
bsw/jbe@1309 113 <label>
bsw/jbe@1309 114 Link:
bsw/jbe@1309 115 <input data-wysihtml-dialog-field="href" value="http://">
bsw/jbe@1309 116 </label>
bsw/jbe@1309 117 <a data-wysihtml-dialog-action="save">OK</a>&nbsp;<a data-wysihtml-dialog-action="cancel">Cancel</a>
bsw/jbe@1309 118 </div>
bsw/jbe@1309 119
bsw/jbe@1309 120 </div>
bsw/jbe@1309 121 <br>
bsw/jbe@1309 122 <textarea class="editable" placeholder="Enter text ..."></textarea>
bsw/jbe@1309 123 <br><input type="reset" value="Reset form!">
bsw/jbe@1309 124 </form>
bsw/jbe@1309 125
bsw/jbe@1309 126 <br/><br><h2>Example of editor without iframe wrapper</h2><br/>
bsw/jbe@1309 127 <form class="ewrapper">
bsw/jbe@1309 128 <div class="toolbar" style="display: none;">
bsw/jbe@1309 129 <a data-wysihtml-command="bold" title="CTRL+B">bold</a> |
bsw/jbe@1309 130 <a data-wysihtml-command="italic" title="CTRL+I">italic</a> |
bsw/jbe@1309 131 <a data-wysihtml-command="createLink">link</a> |
bsw/jbe@1309 132 <a data-wysihtml-command="removeLink"><s>link</s></a> |
bsw/jbe@1309 133 <a data-wysihtml-command="formatBlock" data-wysihtml-command-value="h1">h1</a> |
bsw/jbe@1309 134 <a data-wysihtml-command="formatBlock" data-wysihtml-command-value="h2">h2</a> |
bsw/jbe@1309 135 <a data-wysihtml-command="formatBlock" data-wysihtml-command-blank-value="true">plaintext</a> |
bsw/jbe@1309 136 <a data-wysihtml-command="insertUnorderedList">insertUnorderedList</a> |
bsw/jbe@1309 137 <a data-wysihtml-command="insertOrderedList">insertOrderedList</a> |
bsw/jbe@1309 138 <a data-wysihtml-command="undo">undo</a> |
bsw/jbe@1309 139 <a data-wysihtml-command="redo">redo</a> |
bsw/jbe@1309 140 <a data-wysihtml-command="insertSpeech">speech</a>
bsw/jbe@1309 141 <a data-wysihtml-action="change_view">switch to html view</a>
bsw/jbe@1309 142
bsw/jbe@1309 143 <div data-wysihtml-dialog="createLink" style="display: none;">
bsw/jbe@1309 144 <label>
bsw/jbe@1309 145 Link:
bsw/jbe@1309 146 <input data-wysihtml-dialog-field="href" value="http://">
bsw/jbe@1309 147 </label>
bsw/jbe@1309 148 <a data-wysihtml-dialog-action="save">OK</a>&nbsp;<a data-wysihtml-dialog-action="cancel">Cancel</a>
bsw/jbe@1309 149 </div>
bsw/jbe@1309 150
bsw/jbe@1309 151 </div>
bsw/jbe@1309 152 <br>
bsw/jbe@1309 153 <div class="editable" data-placeholder="Enter text ..."></div>
bsw/jbe@1309 154 <br><input type="reset" value="Reset form!">
bsw/jbe@1309 155 </form>
bsw/jbe@1309 156
bsw/jbe@1309 157 <h2>Events:</h2>
bsw/jbe@1309 158 <div id="log"></div>
bsw/jbe@1309 159
bsw/jbe@1309 160 <small>powered by <a href="https://github.com/Voog/wysihtml" target="_blank">wysihtml</a>.</small>
bsw/jbe@1309 161
bsw/jbe@1309 162 <script src="jquery.1.10.2.js"></script>
bsw/jbe@1309 163
bsw/jbe@1309 164 <script src="wysihtml.js"></script>
bsw/jbe@1309 165 <script src="wysihtml.all-commands.js"></script>
bsw/jbe@1309 166 <!--<script src="wysihtml.table_editing.js"></script>-->
bsw/jbe@1309 167 <script src="wysihtml.toolbar.js"></script>
bsw/jbe@1309 168
bsw/jbe@1309 169 <script src="wysihtml_liquidfeedback_rules.js"></script>
bsw/jbe@1309 170
bsw/jbe@1309 171 <script>
bsw/jbe@1309 172 var editors = [];
bsw/jbe@1309 173 $('.ewrapper').each(function(idx, wrapper) {
bsw/jbe@1309 174 var e = new wysihtml.Editor($(wrapper).find('.editable').get(0), {
bsw/jbe@1309 175 toolbar: $(wrapper).find('.toolbar').get(0),
bsw/jbe@1309 176 parserRules: wysihtmlParserRules,
bsw/jbe@1309 177 stylesheets: "css/stylesheet.css",
bsw/jbe@1309 178 useLineBreaks: true
bsw/jbe@1309 179 //showToolbarAfterInit: false
bsw/jbe@1309 180 });
bsw/jbe@1309 181 editors.push(e);
bsw/jbe@1309 182 });
bsw/jbe@1309 183 </script>

Impressum / About Us