zhaojs
2023-06-09 d3407c808586b8a52e8a8ade9864e8834302d3d1
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
/*******************************************************************************
* KindEditor - WYSIWYG HTML Editor for Internet
* Copyright (C) 2006-2011 kindsoft.net
*
* @author Roddy <luolonghao@gmail.com>
* @site http://www.kindsoft.net/
* @licence http://www.kindsoft.net/license.php
*******************************************************************************/
 
KindEditor.plugin('preview', function(K) {
    var self = this, name = 'preview', undefined;
    self.clickToolbar(name, function() {
        var lang = self.lang(name + '.'),
            width = document.documentElement.clientWidth * 0.9,
            height = document.documentElement.clientHeight - 160,
            html = '<div style="padding:10px 20px;">' +
                '<iframe class="ke-textarea" frameborder="0" style="width:'+(width-42)+'px;height:'+height+'px;"></iframe>' +
                '</div>',
            dialog = self.createDialog({
                name : name,
                width : width,
                title : self.lang(name),
                body : html
            }),
            iframe = K('iframe', dialog.div),
            doc = K.iframeDoc(iframe);
        doc.open();
 
        var cssPath = self.options.cssPath;
        var jsPath = self.options.jsPath;
        var arr = [
            '<html lang="en">',
            '<head><meta charset="utf-8" /><title></title>',
            //'<link href="http://localhost/editor/nkeditor/plugins/code/prettify.css" rel="stylesheet">',
            '<style>',
            'html {margin:0;padding:0;}',
            'body {margin:0;padding:5px;}',
            'body, td {font:12px/1.5 "sans serif",tahoma,verdana,helvetica;}',
            'body, p, div {word-wrap: break-word;}',
            'p {margin:5px 0;}',
            'table {border-collapse:collapse;}',
            'img {border:0;}',
            'noscript {display:none;}',
            'table.ke-zeroborder td {border:1px dotted #AAA;}',
            'img.ke-flash {',
            '    border:1px solid #AAA;',
            '    background-image:url(' + self.options.themesPath + 'common/flash.svg);',
            '    *background-image:url(' + self.options.themesPath + 'common/flash.png);',
            '    background-size:64px 64px;',
            '    background-position:center center;',
            '    background-repeat:no-repeat;',
            '    width:100px;',
            '    height:100px;',
            '}',
            'img.ke-rm {',
            '    border:1px solid #AAA;',
            '    background-image:url(' + self.options.themesPath + 'common/rm.gif);',
            '    background-position:center center;',
            '    background-repeat:no-repeat;',
            '    width:100px;',
            '    height:100px;',
            '}',
            'img.ke-media {',
            '    border:1px solid #AAA;',
            '    background-image:url(' + self.options.themesPath + 'common/play.svg);',
            '    *background-image:url(' + self.options.themesPath + 'common/play.png);',
            '    background-position:center center;',
            '    background-size:64px 64px;',
            '    background-repeat:no-repeat;',
            '    width:100px;',
            '    height:100px;',
            '}',
            'img.ke-anchor {',
            '    border:1px dashed #666;',
            '    width:16px;',
            '    height:16px;',
            '}',
            '.ke-script, .ke-noscript, .ke-display-none {',
            '    display:none;',
            '    font-size:0;',
            '    width:0;',
            '    height:0;',
            '}',
            '.ke-pagebreak {',
            '    border:1px dotted #AAA;',
            '    font-size:0;',
            '    height:2px;',
            '}'
        ];
 
        if (self.options.showHelpGrid) {
            arr.push('p,ul,ol,li,div{border: 1px dashed #c1c1c1;}');
            arr.push('li{margin:5px 0px}');
            arr.push('div,ul,ol{margin-bottom:10px}');
        }
        arr.push('</style>');
        // 加载 css
        if (!K.isArray(cssPath)) {
            cssPath = [cssPath];
        }
        if (K.inArray(self.options.pluginsPath+'code/prism.css', cssPath) < 0) {
            cssPath.push(self.options.pluginsPath+'code/prism.css');
        }
        K.each(cssPath, function(i, path) {
            if (path) {
                arr.push('<link href="' + path + '" rel="stylesheet" />');
            }
        });
        if (self.options.cssData) {
            arr.push('<style>' + self.options.cssData + '</style>');
        }
        arr.push('</head><body ' + (self.options.bodyClass ? 'class="' + self.options.bodyClass + '"' : '') + '>');
        // 获取编辑器内容
        arr.push(self.fullHtml());
        // 加载脚本
        if (!K.isArray(jsPath)) {
            jsPath = [jsPath];
        }
        // 加载代码高亮的脚本
        if (K.inArray(self.options.pluginsPath+'code/prism.js', jsPath) < 0) {
            jsPath.push(self.options.pluginsPath+'code/prism.js');
        }
        K.each(jsPath, function(i, path) {
            if (path) {
                arr.push('<script type="text/javascript" src="' + path + '"></script>');
            }
        });
        arr.push('</body></html>');
        doc.write(arr.join('\n'));
        doc.close();
        K(doc.body).css('background-color', '#FFF');
        iframe[0].contentWindow.focus();
    });
});