Mercurial Hosting > sceditor

annotate src/examples/modified.html @ 12:933a459aa182

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
allow selector for textarea
author Franklin Schmidt <fschmidt@gmail.com>
date Sun, 07 Aug 2022 13:58:27 -0600
parents 2606bfb75529
children 0cb206904499
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
rev   line source
0
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
1 <!DOCTYPE html>
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
2 <html>
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
3 <head>
7
df1e18048d97 add examples/min.html and better defaults
Franklin Schmidt <fschmidt@gmail.com>
parents: 6
diff changeset
4 <meta name="viewport" content="width=device-width, initial-scale=1">
0
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
5 <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
6
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
7 <title>SCEditor Demo</title>
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
8
4
b7725dab7482 move /development/* to /
Franklin Schmidt <fschmidt@gmail.com>
parents: 2
diff changeset
9 <link rel="stylesheet" href="/themes/default.css" id="theme-style" />
0
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
10
4
b7725dab7482 move /development/* to /
Franklin Schmidt <fschmidt@gmail.com>
parents: 2
diff changeset
11 <script src="/sceditor.js"></script>
10
2606bfb75529 CSS cleanup
Franklin Schmidt <fschmidt@gmail.com>
parents: 9
diff changeset
12 <script src="/icons/monocons.js"></script>
4
b7725dab7482 move /development/* to /
Franklin Schmidt <fschmidt@gmail.com>
parents: 2
diff changeset
13 <script src="/formats/bbcode.js"></script>
0
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
14
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
15 <style>
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
16 html {
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
17 font-family: Arial, Helvetica, sans-serif;
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
18 font-size: 13px;
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
19 }
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
20 form div {
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
21 padding: .5em;
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
22 }
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
23 code:before {
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
24 position: absolute;
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
25 content: 'Code:';
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
26 top: -1.35em;
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
27 left: 0;
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
28 }
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
29 code {
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
30 margin-top: 1.5em;
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
31 position: relative;
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
32 background: #eee;
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
33 border: 1px solid #aaa;
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
34 white-space: pre;
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
35 padding: .25em;
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
36 min-height: 1.25em;
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
37 }
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
38 code:before, code {
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
39 display: block;
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
40 text-align: left;
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
41 }
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
42 </style>
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
43 </head>
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
44 <body>
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
45 <form action="" method="post">
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
46 <div>
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
47 <textarea id="example" style="height:300px;width:600px;">[center][size=3][b]BBCode SCEditor[/b][/size][/center]
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
48
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
49 Give it a try! :)
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
50
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
51 [color=#ff00]Red text! [/color][color=#3399ff]Blue?[/color]
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
52
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
53 [ul][li]A simple list[/li][li]list item 2[/li][/ul]
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
54
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
55 Just type [b]:[/b]) and it should be converted into :) as you type.</textarea>
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
56
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
57 </div>
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
58
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
59 <div>
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
60 <label for="theme">Theme:</label>
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
61 <select id="theme">
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
62 <option value="default">Default</option>
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
63 <option value="defaultdark">Default dark</option>
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
64 <option value="modern">Modern</option>
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
65 <option value="office-toolbar">Office Toolbar</option>
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
66 <option value="office">Office</option>
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
67 <option value="square">Square</option>
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
68 </select>
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
69 </div>
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
70 </form>
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
71
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
72
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
73 <script>
12
933a459aa182 allow selector for textarea
Franklin Schmidt <fschmidt@gmail.com>
parents: 10
diff changeset
74 sceditor.create('#example', {
0
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
75 format: 'bbcode',
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
76 });
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
77
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
78
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
79 var themeInput = document.getElementById('theme');
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
80 themeInput.onchange = function() {
4
b7725dab7482 move /development/* to /
Franklin Schmidt <fschmidt@gmail.com>
parents: 2
diff changeset
81 var theme = '/themes/' + themeInput.value + '.css';
0
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
82
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
83 document.getElementById('theme-style').href = theme;
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
84 };
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
85 </script>
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
86
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
87 <p>SCEditor is licensed under the <a href="http://www.opensource.org/licenses/mit-license.php">MIT</a></p>
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
88 </body>
4c4fc447baea start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
89 </html>