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