wysihtml5-rails 0.0.1

Sign up to get free protection for your applications and to get access to all the features.
@@ -0,0 +1,17 @@
1
+ *.gem
2
+ *.rbc
3
+ .bundle
4
+ .config
5
+ .yardoc
6
+ Gemfile.lock
7
+ InstalledFiles
8
+ _yardoc
9
+ coverage
10
+ doc/
11
+ lib/bundler/man
12
+ pkg
13
+ rdoc
14
+ spec/reports
15
+ test/tmp
16
+ test/version_tmp
17
+ tmp
data/Gemfile ADDED
@@ -0,0 +1,4 @@
1
+ source 'https://rubygems.org'
2
+
3
+ # Specify your gem's dependencies in wysihtml5-rails.gemspec
4
+ gemspec
@@ -0,0 +1,24 @@
1
+ Copyright (c) 2012 Nihad Abbasov / NARKOZ
2
+ All rights reserved.
3
+
4
+ Redistribution and use in source and binary forms, with or without
5
+ modification, are permitted provided that the following conditions are met:
6
+
7
+ 1. Redistributions of source code must retain the above copyright notice,
8
+ this list of conditions and the following disclaimer.
9
+
10
+ 2. Redistributions in binary form must reproduce the above copyright notice,
11
+ this list of conditions and the following disclaimer in the documentation
12
+ and/or other materials provided with the distribution.
13
+
14
+ THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS"
15
+ AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
16
+ IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE
17
+ ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE
18
+ LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR
19
+ CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
20
+ SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
21
+ INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN
22
+ CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE)
23
+ ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE
24
+ POSSIBILITY OF SUCH DAMAGE.
@@ -0,0 +1,92 @@
1
+ # wysihtml5 for rails
2
+
3
+ A wysiwyg text editor for use in the Rails 3 asset pipeline.
4
+
5
+ ## Installation
6
+
7
+ Add to your Gemfile:
8
+
9
+ ```ruby
10
+ gem 'wysihtml5-rails'
11
+ ```
12
+
13
+ and run:
14
+
15
+ ```sh
16
+ bundle install
17
+ ```
18
+
19
+ ## Usage
20
+
21
+ Require it in your JS manifest's file:
22
+
23
+ ```js
24
+ //= require wysihtml5
25
+ ```
26
+
27
+ Add to your template before closing `body` html tag:
28
+
29
+ ```html
30
+ <script>
31
+ var editor = new wysihtml5.Editor("wysihtml5-textarea", { // id of textarea element
32
+ toolbar: "wysihtml5-toolbar", // id of toolbar element
33
+ stylesheets: "<%= stylesheet_path('wysiwyg') %>", // optional, css to style the editor's content
34
+ parserRules: wysihtml5ParserRules // defined in parser rules set
35
+ });
36
+ </script>
37
+ ```
38
+
39
+ ## Usage example
40
+
41
+ Add to `application.js`
42
+
43
+ ```js
44
+ //= require wysihtml5/parser_rules/simple
45
+ //= require wysihtml5/wysihtml5
46
+ ```
47
+
48
+ Create form with wysihtml5 textarea:
49
+
50
+ ```erb
51
+ <div id="wysihtml5-toolbar" style="display: none;">
52
+ <a data-wysihtml5-command="bold">bold</a>
53
+ <a data-wysihtml5-command="italic">italic</a>
54
+ <a data-wysihtml5-command="underline">underline</a>
55
+
56
+ <a data-wysihtml5-command="insertOrderedList">insert ordered list</a>
57
+ <a data-wysihtml5-command="insertUnorderedList">insert unordered list</a>
58
+
59
+ <a data-wysihtml5-command="foreColor" data-wysihtml5-command-value="red">red</a>
60
+ <a data-wysihtml5-command="foreColor" data-wysihtml5-command-value="green">green</a>
61
+ <a data-wysihtml5-command="foreColor" data-wysihtml5-command-value="blue">blue</a>
62
+
63
+ <a data-wysihtml5-command="createLink">insert link</a>
64
+ <div data-wysihtml5-dialog="createLink" style="display: none;">
65
+ <label>
66
+ Link: <input data-wysihtml5-dialog-field="href" value="http://" class="text">
67
+ </label>
68
+ <a data-wysihtml5-dialog-action="save">OK</a>
69
+ <a data-wysihtml5-dialog-action="cancel">Cancel</a>
70
+ </div>
71
+ </div>
72
+
73
+ <%= form_for @post do |f| %>
74
+ <p><%= f.text_area :content, :id => 'wysihtml5-textarea' %></p>
75
+ <p><%= f.submit %></p>
76
+ <% end %>
77
+
78
+ <script>
79
+ var editor = new wysihtml5.Editor("wysihtml5-textarea", {
80
+ toolbar: "wysihtml5-toolbar",
81
+ stylesheets: "<%= stylesheet_path('wysiwyg') %>",
82
+ parserRules: wysihtml5ParserRules
83
+ });
84
+ </script>
85
+ ```
86
+
87
+ For more information, check out [wysihtml5 wiki](https://github.com/xing/wysihtml5/wiki).
88
+
89
+ ## License
90
+
91
+ wysihtml5 is distributed under the MIT License.
92
+ wysihtml5-rails is licensed under new BSD License.
@@ -0,0 +1,2 @@
1
+ #!/usr/bin/env rake
2
+ require "bundler/gem_tasks"
@@ -0,0 +1,7 @@
1
+ require "wysihtml5-rails/version"
2
+
3
+ module Wysihtml5
4
+ module Rails
5
+ class Engine < ::Rails::Engine; end
6
+ end
7
+ end
@@ -0,0 +1,5 @@
1
+ module Wysihtml5
2
+ module Rails
3
+ VERSION = "0.0.1"
4
+ end
5
+ end
@@ -0,0 +1,2 @@
1
+ //= require ./wysihtml5/parser_rules/advanced
2
+ //= require ./wysihtml5/wysihtml5
@@ -0,0 +1,551 @@
1
+ /**
2
+ * Full HTML5 compatibility rule set
3
+ * These rules define which tags and css classes are supported and which tags should be specially treated.
4
+ *
5
+ * Examples based on this rule set:
6
+ *
7
+ * <a href="http://foobar.com">foo</a>
8
+ * ... becomes ...
9
+ * <a href="http://foobar.com" target="_blank" rel="nofollow">foo</a>
10
+ *
11
+ * <img align="left" src="http://foobar.com/image.png">
12
+ * ... becomes ...
13
+ * <img class="wysiwyg-float-left" src="http://foobar.com/image.png" alt="">
14
+ *
15
+ * <div>foo<script>alert(document.cookie)</script></div>
16
+ * ... becomes ...
17
+ * <div>foo</div>
18
+ *
19
+ * <marquee>foo</marquee>
20
+ * ... becomes ...
21
+ * <span>foo</marquee>
22
+ *
23
+ * foo <br clear="both"> bar
24
+ * ... becomes ...
25
+ * foo <br class="wysiwyg-clear-both"> bar
26
+ *
27
+ * <div>hello <iframe src="http://google.com"></iframe></div>
28
+ * ... becomes ...
29
+ * <div>hello </div>
30
+ *
31
+ * <center>hello</center>
32
+ * ... becomes ...
33
+ * <div class="wysiwyg-text-align-center">hello</div>
34
+ */
35
+ var wysihtml5ParserRules = {
36
+ /**
37
+ * CSS Class white-list
38
+ * Following css classes won't be removed when parsed by the wysihtml5 html parser
39
+ */
40
+ "classes": {
41
+ "wysiwyg-clear-both": 1,
42
+ "wysiwyg-clear-left": 1,
43
+ "wysiwyg-clear-right": 1,
44
+ "wysiwyg-color-aqua": 1,
45
+ "wysiwyg-color-black": 1,
46
+ "wysiwyg-color-blue": 1,
47
+ "wysiwyg-color-fuchsia": 1,
48
+ "wysiwyg-color-gray": 1,
49
+ "wysiwyg-color-green": 1,
50
+ "wysiwyg-color-lime": 1,
51
+ "wysiwyg-color-maroon": 1,
52
+ "wysiwyg-color-navy": 1,
53
+ "wysiwyg-color-olive": 1,
54
+ "wysiwyg-color-purple": 1,
55
+ "wysiwyg-color-red": 1,
56
+ "wysiwyg-color-silver": 1,
57
+ "wysiwyg-color-teal": 1,
58
+ "wysiwyg-color-white": 1,
59
+ "wysiwyg-color-yellow": 1,
60
+ "wysiwyg-float-left": 1,
61
+ "wysiwyg-float-right": 1,
62
+ "wysiwyg-font-size-large": 1,
63
+ "wysiwyg-font-size-larger": 1,
64
+ "wysiwyg-font-size-medium": 1,
65
+ "wysiwyg-font-size-small": 1,
66
+ "wysiwyg-font-size-smaller": 1,
67
+ "wysiwyg-font-size-x-large": 1,
68
+ "wysiwyg-font-size-x-small": 1,
69
+ "wysiwyg-font-size-xx-large": 1,
70
+ "wysiwyg-font-size-xx-small": 1,
71
+ "wysiwyg-text-align-center": 1,
72
+ "wysiwyg-text-align-justify": 1,
73
+ "wysiwyg-text-align-left": 1,
74
+ "wysiwyg-text-align-right": 1
75
+ },
76
+ /**
77
+ * Tag list
78
+ *
79
+ * Following options are available:
80
+ *
81
+ * - add_class: converts and deletes the given HTML4 attribute (align, clear, ...) via the given method to a css class
82
+ * The following methods are implemented in wysihtml5.dom.parse:
83
+ * - align_text: converts align attribute values (right/left/center/justify) to their corresponding css class "wysiwyg-text-align-*")
84
+ <p align="center">foo</p> ... becomes ... <p> class="wysiwyg-text-align-center">foo</p>
85
+ * - clear_br: converts clear attribute values left/right/all/both to their corresponding css class "wysiwyg-clear-*"
86
+ * <br clear="all"> ... becomes ... <br class="wysiwyg-clear-both">
87
+ * - align_img: converts align attribute values (right/left) on <img> to their corresponding css class "wysiwyg-float-*"
88
+ *
89
+ * - remove: removes the element and it's content
90
+ *
91
+ * - rename_tag: renames the element to the given tag
92
+ *
93
+ * - set_class: adds the given class to the element (note: make sure that the class is in the "classes" white list above)
94
+ *
95
+ * - set_attributes: sets/overrides the given attributes
96
+ *
97
+ * - check_attributes: checks the given HTML attribute via the given method
98
+ * - url: checks whether the given string is an url, deletes the attribute if not
99
+ * - alt: strips unwanted characters. if the attribute is not set, then it gets set (to ensure valid and compatible HTML)
100
+ * - numbers: ensures that the attribute only contains numeric characters
101
+ */
102
+ "tags": {
103
+ "tr": {
104
+ "add_class": {
105
+ "align": "align_text"
106
+ }
107
+ },
108
+ "strike": {
109
+ "remove": 1
110
+ },
111
+ "form": {
112
+ "rename_tag": "div"
113
+ },
114
+ "rt": {
115
+ "rename_tag": "span"
116
+ },
117
+ "code": {},
118
+ "acronym": {
119
+ "rename_tag": "span"
120
+ },
121
+ "br": {
122
+ "add_class": {
123
+ "clear": "clear_br"
124
+ }
125
+ },
126
+ "details": {
127
+ "rename_tag": "div"
128
+ },
129
+ "h4": {
130
+ "add_class": {
131
+ "align": "align_text"
132
+ }
133
+ },
134
+ "em": {},
135
+ "title": {
136
+ "remove": 1
137
+ },
138
+ "multicol": {
139
+ "rename_tag": "div"
140
+ },
141
+ "figure": {
142
+ "rename_tag": "div"
143
+ },
144
+ "xmp": {
145
+ "rename_tag": "span"
146
+ },
147
+ "small": {
148
+ "rename_tag": "span",
149
+ "set_class": "wysiwyg-font-size-smaller"
150
+ },
151
+ "area": {
152
+ "remove": 1
153
+ },
154
+ "time": {
155
+ "rename_tag": "span"
156
+ },
157
+ "dir": {
158
+ "rename_tag": "ul"
159
+ },
160
+ "bdi": {
161
+ "rename_tag": "span"
162
+ },
163
+ "command": {
164
+ "remove": 1
165
+ },
166
+ "ul": {},
167
+ "progress": {
168
+ "rename_tag": "span"
169
+ },
170
+ "dfn": {
171
+ "rename_tag": "span"
172
+ },
173
+ "iframe": {
174
+ "remove": 1
175
+ },
176
+ "figcaption": {
177
+ "rename_tag": "div"
178
+ },
179
+ "a": {
180
+ "check_attributes": {
181
+ "href": "url"
182
+ },
183
+ "set_attributes": {
184
+ "rel": "nofollow",
185
+ "target": "_blank"
186
+ }
187
+ },
188
+ "img": {
189
+ "check_attributes": {
190
+ "width": "numbers",
191
+ "alt": "alt",
192
+ "src": "url",
193
+ "height": "numbers"
194
+ },
195
+ "add_class": {
196
+ "align": "align_img"
197
+ }
198
+ },
199
+ "rb": {
200
+ "rename_tag": "span"
201
+ },
202
+ "footer": {
203
+ "rename_tag": "div"
204
+ },
205
+ "noframes": {
206
+ "remove": 1
207
+ },
208
+ "abbr": {
209
+ "rename_tag": "span"
210
+ },
211
+ "u": {},
212
+ "bgsound": {
213
+ "remove": 1
214
+ },
215
+ "sup": {
216
+ "rename_tag": "span"
217
+ },
218
+ "address": {
219
+ "rename_tag": "div"
220
+ },
221
+ "basefont": {
222
+ "remove": 1
223
+ },
224
+ "nav": {
225
+ "rename_tag": "div"
226
+ },
227
+ "h1": {
228
+ "add_class": {
229
+ "align": "align_text"
230
+ }
231
+ },
232
+ "head": {
233
+ "remove": 1
234
+ },
235
+ "tbody": {
236
+ "add_class": {
237
+ "align": "align_text"
238
+ }
239
+ },
240
+ "dd": {
241
+ "rename_tag": "div"
242
+ },
243
+ "s": {
244
+ "rename_tag": "span"
245
+ },
246
+ "li": {},
247
+ "td": {
248
+ "check_attributes": {
249
+ "rowspan": "numbers",
250
+ "colspan": "numbers"
251
+ },
252
+ "add_class": {
253
+ "align": "align_text"
254
+ }
255
+ },
256
+ "object": {
257
+ "remove": 1
258
+ },
259
+ "div": {
260
+ "add_class": {
261
+ "align": "align_text"
262
+ }
263
+ },
264
+ "option": {
265
+ "rename_tag": "span"
266
+ },
267
+ "select": {
268
+ "rename_tag": "span"
269
+ },
270
+ "i": {},
271
+ "track": {
272
+ "remove": 1
273
+ },
274
+ "wbr": {
275
+ "remove": 1
276
+ },
277
+ "fieldset": {
278
+ "rename_tag": "div"
279
+ },
280
+ "big": {
281
+ "rename_tag": "span",
282
+ "set_class": "wysiwyg-font-size-larger"
283
+ },
284
+ "button": {
285
+ "rename_tag": "span"
286
+ },
287
+ "noscript": {
288
+ "remove": 1
289
+ },
290
+ "svg": {
291
+ "remove": 1
292
+ },
293
+ "input": {
294
+ "remove": 1
295
+ },
296
+ "table": {},
297
+ "keygen": {
298
+ "remove": 1
299
+ },
300
+ "h5": {
301
+ "add_class": {
302
+ "align": "align_text"
303
+ }
304
+ },
305
+ "meta": {
306
+ "remove": 1
307
+ },
308
+ "map": {
309
+ "rename_tag": "div"
310
+ },
311
+ "isindex": {
312
+ "remove": 1
313
+ },
314
+ "mark": {
315
+ "rename_tag": "span"
316
+ },
317
+ "caption": {
318
+ "add_class": {
319
+ "align": "align_text"
320
+ }
321
+ },
322
+ "tfoot": {
323
+ "add_class": {
324
+ "align": "align_text"
325
+ }
326
+ },
327
+ "base": {
328
+ "remove": 1
329
+ },
330
+ "video": {
331
+ "remove": 1
332
+ },
333
+ "strong": {},
334
+ "canvas": {
335
+ "remove": 1
336
+ },
337
+ "output": {
338
+ "rename_tag": "span"
339
+ },
340
+ "marquee": {
341
+ "rename_tag": "span"
342
+ },
343
+ "b": {},
344
+ "q": {
345
+ "check_attributes": {
346
+ "cite": "url"
347
+ }
348
+ },
349
+ "applet": {
350
+ "remove": 1
351
+ },
352
+ "span": {},
353
+ "rp": {
354
+ "rename_tag": "span"
355
+ },
356
+ "spacer": {
357
+ "remove": 1
358
+ },
359
+ "source": {
360
+ "remove": 1
361
+ },
362
+ "aside": {
363
+ "rename_tag": "div"
364
+ },
365
+ "frame": {
366
+ "remove": 1
367
+ },
368
+ "section": {
369
+ "rename_tag": "div"
370
+ },
371
+ "body": {
372
+ "rename_tag": "div"
373
+ },
374
+ "ol": {},
375
+ "nobr": {
376
+ "rename_tag": "span"
377
+ },
378
+ "html": {
379
+ "rename_tag": "div"
380
+ },
381
+ "summary": {
382
+ "rename_tag": "span"
383
+ },
384
+ "var": {
385
+ "rename_tag": "span"
386
+ },
387
+ "del": {
388
+ "remove": 1
389
+ },
390
+ "blockquote": {
391
+ "check_attributes": {
392
+ "cite": "url"
393
+ }
394
+ },
395
+ "style": {
396
+ "remove": 1
397
+ },
398
+ "device": {
399
+ "remove": 1
400
+ },
401
+ "meter": {
402
+ "rename_tag": "span"
403
+ },
404
+ "h3": {
405
+ "add_class": {
406
+ "align": "align_text"
407
+ }
408
+ },
409
+ "textarea": {
410
+ "rename_tag": "span"
411
+ },
412
+ "embed": {
413
+ "remove": 1
414
+ },
415
+ "hgroup": {
416
+ "rename_tag": "div"
417
+ },
418
+ "font": {
419
+ "rename_tag": "span",
420
+ "add_class": {
421
+ "size": "size_font"
422
+ }
423
+ },
424
+ "tt": {
425
+ "rename_tag": "span"
426
+ },
427
+ "noembed": {
428
+ "remove": 1
429
+ },
430
+ "thead": {
431
+ "add_class": {
432
+ "align": "align_text"
433
+ }
434
+ },
435
+ "blink": {
436
+ "rename_tag": "span"
437
+ },
438
+ "plaintext": {
439
+ "rename_tag": "span"
440
+ },
441
+ "xml": {
442
+ "remove": 1
443
+ },
444
+ "h6": {
445
+ "add_class": {
446
+ "align": "align_text"
447
+ }
448
+ },
449
+ "param": {
450
+ "remove": 1
451
+ },
452
+ "th": {
453
+ "check_attributes": {
454
+ "rowspan": "numbers",
455
+ "colspan": "numbers"
456
+ },
457
+ "add_class": {
458
+ "align": "align_text"
459
+ }
460
+ },
461
+ "legend": {
462
+ "rename_tag": "span"
463
+ },
464
+ "hr": {},
465
+ "label": {
466
+ "rename_tag": "span"
467
+ },
468
+ "dl": {
469
+ "rename_tag": "div"
470
+ },
471
+ "kbd": {
472
+ "rename_tag": "span"
473
+ },
474
+ "listing": {
475
+ "rename_tag": "div"
476
+ },
477
+ "dt": {
478
+ "rename_tag": "span"
479
+ },
480
+ "nextid": {
481
+ "remove": 1
482
+ },
483
+ "pre": {},
484
+ "center": {
485
+ "rename_tag": "div",
486
+ "set_class": "wysiwyg-text-align-center"
487
+ },
488
+ "audio": {
489
+ "remove": 1
490
+ },
491
+ "datalist": {
492
+ "rename_tag": "span"
493
+ },
494
+ "samp": {
495
+ "rename_tag": "span"
496
+ },
497
+ "col": {
498
+ "remove": 1
499
+ },
500
+ "article": {
501
+ "rename_tag": "div"
502
+ },
503
+ "cite": {},
504
+ "link": {
505
+ "remove": 1
506
+ },
507
+ "script": {
508
+ "remove": 1
509
+ },
510
+ "bdo": {
511
+ "rename_tag": "span"
512
+ },
513
+ "menu": {
514
+ "rename_tag": "ul"
515
+ },
516
+ "colgroup": {
517
+ "remove": 1
518
+ },
519
+ "ruby": {
520
+ "rename_tag": "span"
521
+ },
522
+ "h2": {
523
+ "add_class": {
524
+ "align": "align_text"
525
+ }
526
+ },
527
+ "ins": {
528
+ "rename_tag": "span"
529
+ },
530
+ "p": {
531
+ "add_class": {
532
+ "align": "align_text"
533
+ }
534
+ },
535
+ "sub": {
536
+ "rename_tag": "span"
537
+ },
538
+ "comment": {
539
+ "remove": 1
540
+ },
541
+ "frameset": {
542
+ "remove": 1
543
+ },
544
+ "optgroup": {
545
+ "rename_tag": "span"
546
+ },
547
+ "header": {
548
+ "rename_tag": "div"
549
+ }
550
+ }
551
+ };