skins/ckeditor/filemanager/browser/mac_finder/browser.html.dtml

   1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
   2         "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
   3 <html>
   4         <head>
   5                 <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
   6                 <title>Site browser</title>
   7                 <link rel="stylesheet" href="browser.css" type="text/css" media="screen" title="Browser style" charset="utf-8" />
   8                 <script type="text/javascript" language="javascript" charset="utf-8" src="epoz_script_detect.js"></script>
   9                 <script type="text/javascript" language="javascript" charset="utf-8" src="javascript_events_api.js"></script>
  10                 <script type="text/javascript" language="javascript" charset="utf-8" src="sarissa.js"></script>
  11                 <script type="text/javascript" language="javascript" charset="utf-8">
  12                 // <![CDATA[
  13                 /* keyboard keycodes */
  14                 var keyLeft = 37, keyUp = 38, keyRight = 39, keyDown = 40, keyEnter = 13;
  15
  16                 /* globals variables */
  17                 var finder, finderContent, cellWidth, currentColumn;
  18                 var scrollbarPlaceholder_offset = 0;
  19                 var scrollXStep = 25, scrollTimeStep = 10;
  20                 var ressourceType = GetUrlParam('Type');
  21                 var sConnUrl = GetUrlParam( 'Connector' ) ;
  22                 var baseDepth = 0;
  23                 if ( sConnUrl.substr(0,1) != '/' && sConnUrl.indexOf( '://' ) < 0 )
  24                         sConnUrl = window.location.href.replace( /browser.html.*$/, '' ) + sConnUrl ;
  25                 var getWindowWidth = (window.innerWidth != undefined) ? function(){return window.innerWidth;} : function(){return document.body.parentElement.clientWidth;};
  26                 var getWindowHeight = (window.innerHeight != undefined) ? function(){return window.innerHeight;} : function(){return document.body.parentElement.clientHeight;};
  27
  28
  29                 function _initBrowser(){
  30                         finder = document.getElementById('finder');
  31                         finder.colCpt = 3; // column counter;
  32                         finderContent = document.getElementById('finderContent');
  33                         cellWidth = Math.floor(getWindowWidth() / 3);
  34
  35                         addListener(window, 'resize', resizeBrowser);
  36                         addListener(finder, 'click', onClickHandler);
  37                         addListener(finder, 'dblclick', onDblClickHandler);
  38                         var path = GetUrlParam('path');
  39                         path = (path) ? path : '/';
  40                         var level = -1;
  41                         for (var i = 0 ; i<path.length ; i++){
  42                                 if (path.charAt(i) == '/')
  43                                         level += 1;
  44                         }
  45                         baseDepth = level;
  46
  47                         populateBrowser('ls', path);
  48
  49                         if (browser.isGecko)
  50                                 document.body.style.overflowX = 'scroll';
  51                         resizeBrowser();
  52                         scrollbarPlaceholder_offset = (window.scrollMaxY) ? window.scrollMaxY : document.body.offsetHeight - document.body.clientHeight;
  53                         resizeBrowser();
  54                         finder.style.width = cellWidth * 3 + "px";
  55                 }
  56                 addListener(window, 'load', _initBrowser);
  57                 addListener(document, 'keydown', onKeydownHandler);
  58
  59                 function onClickHandler(evt) {
  60                         var li = getTargetedObject(evt);
  61                         switch (li.tagName) {
  62                                 case 'IMG':
  63                                         if (li.width != 16) // this img is a preview thumbnail.
  64                                                 return;
  65                                         li = li.parentNode;
  66                                 case 'LI':
  67                                   // click on the current selected row
  68                                   if (currentColumn == li.parentNode && currentColumn.currentRow == li)
  69                                     return;
  70
  71                                         currentColumn = li.parentNode;
  72                                         // hightlight row
  73                                         if (currentColumn.currentRow) {
  74                                                 currentColumn.currentRow.className = currentColumn.currentRow.className.replace('-selected', '');
  75                                         }
  76                                         var command = li.className == 'folderish' ? 'ls' : 'info';
  77                                         li.className += '-selected';
  78                                         currentColumn.currentRow = li;
  79
  80                                         populateBrowser(command, li.path);
  81                         }
  82                 }
  83
  84                 function onDblClickHandler(evt) {
  85                   var li = getTargetedObject(evt);
  86
  87                   if(li.tagName != 'LI') {
  88                       if (li.tagName == 'IMG' && li.parentNode.tagName == 'LI')
  89                         li = t.parentNode;
  90                       else
  91                         return;
  92                   }
  93                   switch(window.parent.name) {
  94                 case 'FCKeditorDialog_PlinnImage' :
  95                     if (li.className == 'contentish-selected') {
  96                                                 window.parent.updateOrInsertImage(li.link);
  97                                                 window.close();
  98                                       }
  99                                             break;
 100                                   case '' :
 101                                       var funcNum = GetUrlParam('CKEditorFuncNum');
 102                                       window.opener.CKEDITOR.tools.callFunction(funcNum, li.link);
 103                                                         window.close();
 104                                                         break;
 105             }
 106                 }
 107
 108                 function onKeydownHandler(evt) {
 109                         evt = (evt) ? evt : window.event;
 110                         if(!currentColumn) currentColumn = finder.getElementsByTagName('ul')[0];
 111                         if(!currentColumn.currentRow) {
 112                                 raiseMouseEvent(currentColumn.firstChild,'click');
 113                                 return;
 114                         }
 115
 116                         var ob, evtType='click';
 117                         switch (evt.keyCode) {
 118                                 case keyUp :
 119                                         ob = currentColumn.currentRow.previousSibling;
 120                                         break;
 121                                 case keyDown :
 122                                         ob = currentColumn.currentRow.nextSibling;
 123                                         break;
 124                                 case keyLeft :
 125                                         var currentLevel = parseInt(currentColumn.parentNode.id.slice(6));
 126                                         if (currentLevel) {
 127                                                 ob = document.getElementById('level-' + (currentLevel - 1)).firstChild;
 128                                                 if (ob.nodeType == 3) // text node
 129                                                         ob = ob.nextSibling
 130                                                 ob = ob.currentRow;
 131                                         }
 132                                         break;
 133                                 case keyRight :
 134                                         if(currentColumn.currentRow.className != 'folderish-selected')
 135                                                 return;
 136                                         ob = document.getElementById('level-' + (parseInt(currentColumn.parentNode.id.slice(6)) + 1)).firstChild.firstChild;
 137                                         break;
 138                                 case keyEnter :
 139                                   ob = currentColumn.currentRow;
 140                                   evtType = 'dblclick'
 141                                   break;
 142                         };
 143                         if (ob)
 144                                 raiseMouseEvent(ob, evtType);
 145                 }
 146
 147                 function resizeBrowser() {
 148                         var columns = finder.getElementsByTagName('ul');
 149                         var col;
 150                         for (var i=0 ; i<columns.length ; i++) {
 151                                 col = columns[i];
 152                                 col.style.height = getWindowHeight() - scrollbarPlaceholder_offset + "px";;
 153
 154                         }
 155                         //document.body.style.width = getWindowWidth();
 156                 }
 157
 158                 /* from fck default browser */
 159                 function GetUrlParam( paramName )
 160                 {
 161                         var oRegex = new RegExp( '[\?&]' + paramName + '=([^&]+)', 'i' ) ;
 162                         var oMatch = oRegex.exec( window.location.search ) ;
 163
 164                         if ( oMatch && oMatch.length > 1 )
 165                                 return unescape(oMatch[1]) ;
 166                         else
 167                                 return '' ;
 168                 }
 169
 170
 171
 172                 function populateBrowser(command, path) {
 173                         var prevColNum = finder.colCpt;
 174                         var level = -1;
 175                         for (var i = 0 ; i<path.length ; i++){
 176                                 if (path.charAt(i) == '/')
 177                                         level += 1;
 178                         }
 179                         level = level - baseDepth;
 180
 181                         // prepare / cleanup columns
 182                         var cellLevel, startCleanup = 3;
 183                         switch (level) {
 184                                 case 0 : // initialization case
 185                                         startCleanup = 0;
 186                                         cellLevel = document.getElementById('level-0');
 187                                         cellLevel.style.width = cellWidth + "px";
 188                                         // remove default content
 189                                         cellLevel.removeChild(cellLevel.firstChild);
 190
 191                                         // cosmetic: display the second col with a scrollbar
 192                                         var c1 = document.createElement('td');
 193                                         c1.id = "level-1";
 194                                         c1.style.width = cellWidth + "px";
 195                                         c1.appendChild(document.createElement('ul'));
 196                                         finderContent.appendChild(c1);
 197
 198                                         // cosmetic: display the third col without scrollbar
 199                                         var c2 = document.createElement('td');
 200                                         c2.id = "level-2";
 201                                         c2.style.width = cellWidth + "px";
 202                                         finderContent.appendChild(c2);
 203                                         break;
 204
 205                                 case 1 :
 206                                         cellLevel = document.getElementById("level-1");
 207                                         cellLevel.removeChild(cellLevel.firstChild);
 208                                         var c2 = document.getElementById("level-2");
 209                                         var ul = c2.firstChild;
 210                                         if (ul)
 211                                                 c2.removeChild(ul);
 212                                         break;
 213
 214                                 case 2 :
 215                                         cellLevel = document.getElementById("level-2");
 216                                         var ul = cellLevel.firstChild;
 217                                         if (ul) {
 218                                                 cellLevel.removeChild(ul);
 219                                         }
 220                                         break;
 221
 222                                 default :
 223                                         cellLevel = document.getElementById("level-" + level);
 224                                         if (!cellLevel) {
 225                                                 cellLevel = document.createElement('td');
 226                                                 cellLevel.id = "level-" + level;
 227                                                 cellLevel.style.width = cellWidth + "px";
 228                                                 finderContent.appendChild(cellLevel);
 229                                                 startCleanup = 0;
 230                                                 finder.colCpt += 1;
 231                                         }
 232                                         else {
 233                                                 cellLevel.removeChild(cellLevel.firstChild);
 234                                                 startCleanup = level + 1
 235                                         }
 236                         }
 237                         if (startCleanup) {
 238                                 var nextColumn = document.getElementById("level-" + startCleanup);
 239                                 while (nextColumn) {
 240                                         finderContent.removeChild(nextColumn);
 241                                         finder.colCpt -= 1;
 242                                         nextColumn = document.getElementById("level-" + ++startCleanup);
 243                                 }
 244                         }
 245
 246                         // request
 247                         var req = new XMLHttpRequest();
 248                         req.open("POST", sConnUrl, false); // synchrone
 249                         req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded;charset=utf-8");
 250                         req.send("command=" + command + "&path="+escape(path) + "&Type=" + ressourceType);
 251                         var respDom = req.responseXML.documentElement;
 252
 253
 254                         var list = document.createElement('UL');
 255                         list.style.height= getWindowHeight() - scrollbarPlaceholder_offset + "px";
 256                         cellLevel.appendChild(list);
 257
 258                         switch (respDom.tagName) {
 259                                 case 'ls' :
 260                                         // import listing
 261                                         var rows = respDom.getElementsByTagName('row');
 262                                         var row, listItem, icon;
 263
 264                                         for (var i = 0 ; i<rows.length ; i++){
 265                                                 row = rows[i];
 266                                                 listItem = document.createElement('li');
 267                                                 if (row.getAttribute('folderish') != "0")
 268                                                         listItem.className = 'folderish';
 269                                                 else
 270                                                         listItem.className = 'contentish';
 271
 272                                                 icon = document.createElement('img');
 273                                                 with (icon) {
 274                                                         src = row.getAttribute('icon');
 275                                                         width = "16";
 276                                                         height = "16";
 277                                                         border = "0";
 278                                                 }
 279
 280                                                 listItem.path = row.getAttribute('path');
 281                                                 listItem.link = row.getAttribute('link');
 282                                                 listItem.appendChild(icon);
 283                                                 listItem.appendChild(document.createTextNode(row.firstChild.nodeValue));
 284                                                 list.appendChild(listItem);
 285                                         }
 286                                         break;
 287                                 case 'info' :
 288                                         var li = document.createElement('li');
 289                                         list.appendChild(li);
 290                                         li.innerHTML = respDom.firstChild.nodeValue;
 291
 292                                         // add create link button
 293                                         li = document.createElement('li');
 294                                         li.style.textAlign = 'center';
 295                                         var createLinkBtn = document.createElement('button');
 296                                         var text = (ressourceType == 'Image') ? 'Insert' : 'Create link';
 297                                         createLinkBtn.appendChild(document.createTextNode(text));
 298
 299                                         createLinkBtn.onclick = function(){
 300                                             var url = respDom.lastChild.firstChild.nodeValue;
 301                                             switch(window.parent.name) {
 302                                                 case 'FCKeditorDialog_PlinnImage' :
 303                                                             window.parent.updateOrInsertImage(url);
 304                                                               break;
 305                                                   case 'FCKBrowseWindow' :
 306                                                   default:
 307                                                       var funcNum = GetUrlParam('CKEditorFuncNum');
 308                                                       window.opener.CKEDITOR.tools.callFunction(funcNum, url);
 309                                                                 break;
 310                                             }
 311                                             window.close();
 312                                         };
 313
 314                                         list.appendChild(li);
 315                                         li.appendChild(createLinkBtn);
 316                                         break;
 317                         }
 318
 319                         if (prevColNum != finder.colCpt) {
 320                                 var finderWidth = finder.colCpt * cellWidth;
 321                                 finder.style.width = finderWidth + "px";
 322                                 if (finder.colCpt - prevColNum > 0) {
 323                                         var start = (window.scrollX) ? window.scrollX : document.body.scrollLeft;
 324                                         var stop = finder.colCpt * cellWidth - getWindowWidth();
 325                                         smoothScroll(start, stop);
 326                                 }
 327                         }
 328                 }
 329
 330                 function smoothScroll(start, stop) {
 331                         start += scrollXStep;
 332                         window.scroll(start, 0);
 333                         if (start < stop) {
 334                                 setTimeout('smoothScroll(' + start + ', ' + stop + ')', scrollTimeStep);
 335                         }
 336                 }
 337
 338
 339                 // ]]>
 340                 </script>
 341         </head>
 342         <body>
 343         <table  id="finder" cellspacing="0">
 344         <tr id="finderContent">
 345         <td id="level-0"><ul>
 346                         <li class="folderish">Folder</li>
 347                         <li class="contentish">Content</li>
 348                 </ul>
 349         </td>
 350         </tr>
 351         </table>
 352   </body>
 353 </html>