1 | /** |
---|
2 | * File Name: serverpreview\plugin.js |
---|
3 | * |
---|
4 | * Licensed under the terms of the GNU Lesser General Public License: |
---|
5 | * http://www.opensource.org/licenses/lgpl-license.php |
---|
6 | * |
---|
7 | * Plugin for CKeditor 3 to send the current data to the server so it can be previewed in a custom way |
---|
8 | * Extended from the FCK plugin with the same name, by Alfonso Martínez de Lizarrondo |
---|
9 | * |
---|
10 | * version |
---|
11 | * 0.1 15/02/2006 |
---|
12 | * 0.2 02/09/2007 Replace the 'Preview' command instead of creating a custom one. |
---|
13 | * 0.3 14/07/2010 No longer replaces the Preview button, adds another one instead. |
---|
14 | * |
---|
15 | * File Author: |
---|
16 | * Vlad Fratila |
---|
17 | * vlad.fratila@gmail.com |
---|
18 | * |
---|
19 | * == How to Use: == |
---|
20 | * |
---|
21 | * Add the plugin in your config.js like other plugins: |
---|
22 | * config.extraPlugins = 'serverpreview'; |
---|
23 | * |
---|
24 | * You will also need to specify the full URL of your server-side script like this: |
---|
25 | * config.serverPreviewURL = 'http://www.mydomain.com/myfile.php'; |
---|
26 | * In this file, you need to stripslashes and display the post variable "htmlData" |
---|
27 | * |
---|
28 | * To get an icon for the button, you will need to change your skin's CSS file |
---|
29 | * (e.g. if you're using the default: change /ckeditor/skins/kama/editor.css) |
---|
30 | * I just disabled the Preview plugin and did a Search/Replace to replace 'preview' with 'serverpreview'. |
---|
31 | * |
---|
32 | * Lastly, don't forget to add the button 'ServerPreview' to your toolbars! |
---|
33 | * |
---|
34 | */ |
---|
35 | |
---|
36 | |
---|
37 | (function(){ |
---|
38 | |
---|
39 | var pluginName = 'serverpreview'; |
---|
40 | |
---|
41 | var serverpreviewCmd = |
---|
42 | { |
---|
43 | modes : { wysiwyg:1, source:1 }, |
---|
44 | canUndo : false, |
---|
45 | exec : function( editor ) |
---|
46 | { |
---|
47 | var theForm = document.getElementById('serverPreviewForm') ; |
---|
48 | if (!theForm) { |
---|
49 | //it doesn't exist still, we create it here |
---|
50 | theForm = document.createElement('FORM') ; |
---|
51 | theForm.method = 'POST' ; |
---|
52 | theForm.name = 'serverPreviewForm' ; |
---|
53 | theForm.id=theForm.name ; |
---|
54 | theForm.style.display = 'none' ; |
---|
55 | |
---|
56 | theForm.action = editor.config.serverPreviewURL; |
---|
57 | |
---|
58 | //new window please |
---|
59 | theForm.target='_blank'; |
---|
60 | document.body.appendChild( theForm ); |
---|
61 | } |
---|
62 | |
---|
63 | //clear previous data |
---|
64 | theForm.innerHTML = '' ; |
---|
65 | //set the new content |
---|
66 | var input = document.createElement('INPUT') ; |
---|
67 | input.type = 'hidden'; |
---|
68 | //change the name as needed --> |
---|
69 | input.name = 'htmlData' ; |
---|
70 | //set the data |
---|
71 | input.value = editor.getData(); |
---|
72 | //append the new input to the form |
---|
73 | theForm.appendChild( input ); |
---|
74 | |
---|
75 | //that's all, append additional fields as needed, or set the variables in the previewPath |
---|
76 | |
---|
77 | //send the data to the server |
---|
78 | theForm.submit(); |
---|
79 | } |
---|
80 | } |
---|
81 | |
---|
82 | |
---|
83 | CKEDITOR.plugins.add( pluginName, |
---|
84 | { |
---|
85 | init : function( editor ) |
---|
86 | { |
---|
87 | editor.addCommand( pluginName, serverpreviewCmd ); |
---|
88 | editor.ui.addButton( 'ServerPreview', |
---|
89 | { |
---|
90 | label : 'Server Preview', |
---|
91 | command : pluginName |
---|
92 | }); |
---|
93 | } |
---|
94 | }); |
---|
95 | |
---|
96 | })(); |
---|