replace-usage.js

comments in russian - Troex Nevelin, 25.08.2010 17:14

Download (3.2 kB)

 
1
/**
2
 * массивы replace и restore предназначены для хранения пользователских функций обработки данных редактора
3
 * функции из replace вызываются при помещении данных в редактор (до функций замены самого редактора)
4
 * функции из restore вызываются при переносе данных из редактора в textarea (до функций замены самого редактора)
5
 * Все функции из replace и restore выполняются в контексте elRTE.filter (те this внутри функции == объекту filter текущего редактора)
6
 * таким образом функции имеют доступ к редактору и его свойствам.
7
 *
8
 * Пример 1 (пожелание с форума)
9
 * Все теги blockquote должны иметь определенный класс (bq-forum)
10
 */
11
12
13
        var opts = {
14
                // ......
15
                restore : [ function(html) { 
16
                        var self = this; 
17
                        return html.replace(this.tagRegExp, function(t, c, n, a) {
18
                                if (!c && /^blockquote$/i.test(n)) {
19
                                        a = self.parseAttrs(a);
20
                                        window.console.log(a)
21
                                        a['class']['bq-forum'] = 'bq-forum';
22
                                        a = self.serializeAttrs(a);
23
                                        return '<'+n+' '+a+'>'
24
                                }
25
                                return t;
26
                        }); 
27
                }],
28
                
29
                // ....
30
        }
31
        
32
/**
33
 * Если нужно, чтобы цитаты в окне редактора имели этот класс - добавить функцию в replace и добавить класс в elrte-inner.css
34
 * 
35
 */
36
        
37
/**
38
 * Пример 2
39
 * Заменить конструкцию вида "{MY_VAR_NAME}" на нередакируемый элемент в редакторе 
40
 * (типичная задача для динамических блоков в CMS)
41
 * На данный момент нередактируемым элементом в редакторе может быть только изображение с классом elrte-protected
42
 * таким образом задача сводится к нахождению нужного текста регулярным выражением и заменой на хтмл картинки
43
 * необходимые данные можно сохранить в аттрибуте самой картинки или воспользоваться объектом elRTE.filter.scripts 
44
 * для хранения данных в хеше (id данных должен быть уникальным)
45
 * Аналогично можно заменять произвольные хтмл теги
46
 * 
47
 */
48
49
        var opts = {
50
                // ......
51
                replace : [function(html) {
52
                        return html.replace(/\{([a-z_]+)\}/gi, function(t, name) {
53
                                return '<img src="'+this.url+'pixel.gif" width="100" height="100" class="elrte-protected my-placeholder-class" rel="'+name+'" />';
54
                        });
55
                }],
56
                restore : [function(html) {
57
                        var self = this;
58
                        return html.replace(this.serviceClassRegExp, function(t, n, a) {
59
                                a = self.parseAttrs(a);
60
                                if (a.class['my-placeholder-class']) {
61
                                        return '{'+a.rel+'}';
62
                                }
63
                                return t;
64
                        })
65
                }]
66
                //.....
67
        }
68
69
70
71
72
73