Bouton d'insertion d'image raccord avec le thème ckeditor4.
[ckeditor.git] / skins / ckeditor / plugins / plinn_image / plugin.js
index 442a2be..ebce6a9 100644 (file)
@@ -23,6 +23,21 @@ function updateImageSizeUrlParameters(img) {
        }
 }
 
+function openPlinnImageDialog(path, editor) {
+       var winOptions  = "location=no,menubar=no,toolbar=no,dependent=yes,dialog=yes,minimizable=no,modal=yes,alwaysRaised=yes" +
+               ",resizable=yes"  +
+               ",width=801"  +
+               ",height=600";
+               //",top="  + iTop +
+               //",left=" + iLeft ;
+       
+       var win = open(path + 'dialog/plinn_image.html', 'PlinnImageDialog', winOptions);
+       win.dialogArguments = new Object();
+       win.dialogArguments.editor = editor;
+       win.dialogArguments.pluginPath = path;
+       win.dialogArguments.CKEDITOR = CKEDITOR;
+}
+
 
 CKEDITOR.plugins.add( 'plinn_image',
 {
@@ -34,30 +49,34 @@ CKEDITOR.plugins.add( 'plinn_image',
                editor.on('instanceReady', function(){
                        editor.on('getData',
                                function(evt) {
-                                       var body = evt.editor.document.$.body;
-                                       var images = body.getElementsByTagName('IMG');
+                                       var tmpDiv = document.createElement('div');
+                                       tmpDiv.innerHTML = evt.data.dataValue;
+                                       var images = tmpDiv.getElementsByTagName('IMG');
                                        for (var i = 0 ; i < images.length ; i++)
                                                updateImageSizeUrlParameters(images[i]);
-                                       evt.data.dataValue = evt.editor.document.$.body.innerHTML;
+                                       evt.data.dataValue = tmpDiv.innerHTML;
                                }
                        );
                });
-               
+               var pluginPath = this.path;
+               var allowed = 'img[alt,!src]{border-style,border-width,float,height,margin,margin-bottom,margin-left,margin-right,margin-top,width}';
+               var required = 'img[alt,src]';
                var command = editor.addCommand('plinn_image',
                        {
-                               exec : function(editor) {
-                                       alert('Bonjour la France !');
-                               }
-                       });
+                               exec : function(editor){openPlinnImageDialog(pluginPath, editor);},
+                               allowedContent: allowed,
+                               requiredContent: required
+                       }
+               );
                
                editor.ui.addButton('PlinnImage',
                        {
                                label : editor.lang.common.image,
-                               icon : this.path + 'dialog/plinn_image.gif',
+                               icon : pluginPath + 'dialog/plinn_image.png',
                                command : 'plinn_image'
                        });
-               console.log(this.path);
        }
+       
 });
 
 })();