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                 var imagesPath = 'images/';
  66
  67                 var slide_size = 222;
  68
  69                 function _initBrowser(){
  70                   var form = document.getElementById('uploadAttachmentForm');
  71                   form.elements['path'].value = contentPath;
  72                   var loc = window.location;
  73                   form.elements['redirUrl'].value = loc.protocol + '//' + loc.host + loc.pathname;
  74                   form.action = connUrl;
  75                   addListener(document.getElementById('slides'), 'click', handleClick)
  76                   importAttachments();
  77                 }
  78
  79                 function importAttachments() {
  80                   var req = new XMLHttpRequest();
  81                         req.open("POST", connUrl, false); // synchrone
  82                         req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded;charset=utf-8");
  83                         req.send("command=ls&path="+escape(contentPath));
  84                         var respDom = req.responseXML.documentElement;
  85
  86                         var rows = respDom.getElementsByTagName('row');
  87                         var row, img, slide, a;
  88                         var slides = document.getElementById('slides');
  89
  90                         for (var i = 0 ; i<rows.length ; i++)
  91                           addControlThumbnail(rows[i], slides);
  92                 }
  93
  94                 function addControlThumbnail(row, dest) {
  95                                 var slide = document.createElement('span');
  96
  97                                 var a = document.createElement('a');
  98                                 a.href = row.getAttribute('url');
  99                                 a.className = 'slide';
 100
 101                                 var img = document.createElement('img');
 102                                 img.src = row.getAttribute('previewUrl');
 103                                 img.width = row.getAttribute('width');
 104                                 img.height = row.getAttribute('height');
 105                                 img.style.marginTop = (slide_size - parseInt(img.height)) / 2 + 'px';
 106                                 img.style.marginLeft = (slide_size - parseInt(img.width)) / 2 + 'px';
 107                                 img.border = 0;
 108
 109                                 a.appendChild(img);
 110                                 slide.appendChild(a);
 111                                 dest.appendChild(slide);
 112
 113                                 var spanButton = document.createElement('span');
 114                                 spanButton.className = 'button';
 115                                 var a = document.createElement('a');
 116                                 a.href = '#';
 117                                 a.text = "Supprimer";
 118                                 a.name = 'suppr';
 119                                 spanButton.appendChild(a);
 120                                 slide.appendChild(spanButton);
 121
 122         var spanButtonWidth = getObjectWidth(a);
 123         var spanButtonHeight = getObjectHeight(a);
 124                                 spanButton.style.width = spanButtonWidth + 'px';
 125                                 spanButton.style.height = spanButtonHeight + 'px';
 126                                 spanButton.style.top = slide_size - spanButtonHeight - 3 + 'px';
 127                                 spanButton.style.left = slide_size - spanButtonWidth - 3 + 'px';
 128                 }
 129
 130                 function handleClick(evt) {
 131                   var target = getTargetedObject(evt);
 132             disableDefault(evt);
 133             disablePropagation(evt);
 134             switch (target.tagName) {
 135               case 'IMG' :
 136                     var a = target.parentNode;
 137                     window.parent.updateOrInsertImage(a.getAttribute('href', 2));
 138                     break;
 139                   case 'A' :
 140                     if (target.name == 'suppr')
 141                       var a = target.parentNode.parentNode.getElementsByTagName('a')[0];
 142                       var href = a.getAttribute('href', 2);
 143                       var imgPath = window.parent.editor.FCKConfig.EditorPath + href;
 144
 145                       var req = new XMLHttpRequest();
 146                         req.open("POST", connUrl, false); // synchrone
 147                         req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded;charset=utf-8");
 148                         req.send("command=rm&path="+escape(imgPath));
 149                   var doc = req.responseXML.documentElement;
 150                   if (doc.tagName == 'done') {
 151                     var slide = target.parentNode.parentNode;
 152                     slide.parentNode.removeChild(slide);
 153                     }
 154                 }
 155
 156                 }
 157
 158                 addListener(window, 'load', _initBrowser);
 159                 // -->
 160                 </script>
 161         </head>
 162
 163         <body i18n:domain="plinn">
 164           <form id="uploadAttachmentForm" action="." method="post" enctype="multipart/form-data">
 165             <input type="file" name="file"/>
 166             <input type="hidden" name="path" value="" />
 167             <input type="hidden" name="command" value="upload" />
 168             <input type="hidden" name="Type" value="Photo" />
 169             <input type="hidden" name="redirUrl" value="">
 170             <input type="submit" name="upload" value="Upload" i18n:attributes="value"/>
 171           </form>
 172           <div id="slides" class="lightbox"></div>
 173   </body>
 174 </html>
 175