skins/ckeditor/plugins/plinn_image/dialog/embedded_images.html.pt

   1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
   2
   3 <html xmlns="http://www.w3.org/1999/xhtml">
   4
   5         <head>
   6                 <meta http-equiv="content-type" content="text/html;charset=utf-8" />
   7                 <title>Embedded images</title>
   8                 <style type="text/css" media="screen">
   9                   a, a:hover, a:active, a:visited {
  10         text-decoration:none;
  11         color:#369;
  12       }
  13
  14                   #slides {
  15                     margin-top: 1em;
  16                   }
  17
  18                   .lightbox span {
  19           width: 222px;
  20           height: 222px;
  21           display:block;
  22           float:left;
  23           margin-left:1px;
  24           margin-top:1px;
  25       }
  26
  27       .lightbox a.slide {
  28         position:absolute;
  29         display:block;
  30         width: 222px;
  31         height: 222px;
  32         border: 1px solid #ddd;
  33       }
  34
  35       .lightbox .slide img {
  36         position:absolute;
  37         border: 1px solid black;
  38       }
  39
  40       .lightbox span.button {
  41         background:none;
  42         position: relative;
  43       }
  44
  45       .lightbox span[class].button {
  46         visibility:hidden;
  47       }
  48
  49       .lightbox span:hover span.button {
  50         visibility:visible;
  51       }
  52
  53                 </style>
  54                 <script type="text/javascript" language="javascript" charset="utf-8" src="epoz_script_detect.js"></script>
  55                 <script type="text/javascript" language="javascript" charset="utf-8" src="javascript_events_api.js"></script>
  56                 <script type="text/javascript" language="javascript" charset="utf-8" src="sarissa.js"></script>
  57                 <script type="text/javascript" language="javascript" charset="utf-8" src="DHTMLapi.js"></script>
  58                 <script type="text/javascript">
  59                 <!--
  60                 // var FCK = window.parent.FCK;
  61                 // var contentPath = FCK.Config.contentPath;
  62     //
  63                 // var FCKConfig = window.parent.FCKConfig;
  64                 // var connUrl = FCKConfig.AttachmentBrowserConnectorUrl;
  65
  66                 var editor = window.parent.editor;
  67                 var contentPath = editor.contentPath;
  68                 var connUrl = window.parent.editor.config.attachmentBrowserConnectorUrl;
  69
  70                 var slide_size = 222;
  71
  72                 function _initBrowser(){
  73                   var form = document.getElementById('uploadAttachmentForm');
  74                   form.elements['path'].value = contentPath;
  75                   var loc = window.location;
  76                   form.elements['redirUrl'].value = loc.protocol + '//' + loc.host + loc.pathname;
  77                   form.action = connUrl;
  78                   addListener(document.getElementById('slides'), 'click', handleClick)
  79                   importAttachments();
  80                 }
  81
  82                 function importAttachments() {
  83                   var req = new XMLHttpRequest();
  84                         req.open("POST", connUrl, false); // synchrone
  85                         req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded;charset=utf-8");
  86                         req.send("command=ls&path="+escape(contentPath));
  87                         var respDom = req.responseXML.documentElement;
  88
  89                         var rows = respDom.getElementsByTagName('row');
  90                         var row, img, slide, a;
  91                         var slides = document.getElementById('slides');
  92
  93                         for (var i = 0 ; i<rows.length ; i++)
  94                           addControlThumbnail(rows[i], slides);
  95                 }
  96
  97                 function addControlThumbnail(row, dest) {
  98                                 var slide = document.createElement('span');
  99
 100                                 var a = document.createElement('a');
 101                                 a.href = row.getAttribute('url');
 102                                 a.className = 'slide';
 103
 104                                 var img = document.createElement('img');
 105                                 img.src = row.getAttribute('previewUrl');
 106                                 img.width = row.getAttribute('width');
 107                                 img.height = row.getAttribute('height');
 108                                 img.style.marginTop = (slide_size - parseInt(img.height)) / 2 + 'px';
 109                                 img.style.marginLeft = (slide_size - parseInt(img.width)) / 2 + 'px';
 110                                 img.border = 0;
 111
 112                                 a.appendChild(img);
 113                                 slide.appendChild(a);
 114                                 dest.appendChild(slide);
 115
 116                                 var spanButton = document.createElement('span');
 117                                 spanButton.className = 'button';
 118                                 var a = document.createElement('a');
 119                                 a.href = '#';
 120                                 a.text = "Supprimer";
 121                                 a.name = 'suppr';
 122                                 spanButton.appendChild(a);
 123                                 slide.appendChild(spanButton);
 124
 125         var spanButtonWidth = getObjectWidth(a);
 126         var spanButtonHeight = getObjectHeight(a);
 127                                 spanButton.style.width = spanButtonWidth + 'px';
 128                                 spanButton.style.height = spanButtonHeight + 'px';
 129                                 spanButton.style.top = slide_size - spanButtonHeight - 3 + 'px';
 130                                 spanButton.style.left = slide_size - spanButtonWidth - 3 + 'px';
 131                 }
 132
 133                 function handleClick(evt) {
 134                   var target = getTargetedObject(evt);
 135             disableDefault(evt);
 136             disablePropagation(evt);
 137             switch (target.tagName) {
 138               case 'IMG' :
 139                     var a = target.parentNode;
 140                     window.parent.updateOrInsertImage(a.getAttribute('href', 2));
 141                     break;
 142                   case 'A' :
 143                     if (target.name == 'suppr')
 144                       var a = target.parentNode.parentNode.getElementsByTagName('a')[0];
 145                       var href = a.getAttribute('href', 2);
 146                       var imgPath = window.parent.editor.FCKConfig.EditorPath + href;
 147
 148                       var req = new XMLHttpRequest();
 149                         req.open("POST", connUrl, false); // synchrone
 150                         req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded;charset=utf-8");
 151                         req.send("command=rm&path="+escape(imgPath));
 152                   var doc = req.responseXML.documentElement;
 153                   if (doc.tagName == 'done') {
 154                     var slide = target.parentNode.parentNode;
 155                     slide.parentNode.removeChild(slide);
 156                     }
 157                 }
 158
 159                 }
 160
 161                 addListener(window, 'load', _initBrowser);
 162                 // -->
 163                 </script>
 164         </head>
 165
 166         <body i18n:domain="plinn">
 167           <form id="uploadAttachmentForm" action="." method="post" enctype="multipart/form-data">
 168             <input type="file" name="file"/>
 169             <input type="hidden" name="path" value="" />
 170             <input type="hidden" name="command" value="upload" />
 171             <input type="hidden" name="Type" value="Photo" />
 172             <input type="hidden" name="redirUrl" value="">
 173             <input type="submit" name="upload" value="Upload" i18n:attributes="value"/>
 174           </form>
 175           <div id="slides" class="lightbox"></div>
 176   </body>
 177 </html>
 178