Changeset 1245


Ignore:
Timestamp:
02/20/10 10:22:59 (5 years ago)
Author:
gogo
Message:

ticket:1502

Add support for attributes being set in MootoolsFileManager? for images.
Split out the "modes" of MootoolsFileManager? into different javascript files.

Location:
trunk
Files:
2 added
13 edited

Legend:

Unmodified
Added
Removed
  • trunk/XinhaCore.js

    r1243 r1245  
    40734073 
    40744074/** Load one or more assets, sequentially, where an asset is a CSS file, or a javascript file. 
    4075  * 
     4075 *   
    40764076 * Example Usage: 
    40774077 * 
     
    40814081 * on your loader object as and when you wish, you can chain the calls if you like. 
    40824082 * 
    4083  * Note whenReady can only have one active callback at a time, but once it's been called you can 
    4084  * issue another whenReady(), if there is nothing waiting to be loaded, it will be executed immediately. 
     4083 * You may add any number of callbacks using .whenReady() multiple times. 
    40854084 * 
    40864085 *   var myAssetLoader = Xinha.includeAssets(); 
     
    40894088 *  
    40904089 */ 
    4091   
     4090 
    40924091Xinha.includeAssets = function() 
    40934092{ 
    4094   var assetLoader = { pendingAssets: [ ], loaderRunning: false }; 
    4095    
    4096   assetLoader.callback = function() { }; 
     4093  var assetLoader = { pendingAssets: [ ], loaderRunning: false, loadedScripts: [ ] }; 
     4094   
     4095  assetLoader.callbacks = [ ]; 
    40974096   
    40984097  assetLoader.loadNext = function() 
     
    41324131  }; 
    41334132   
     4133  assetLoader.loadScriptOnce = function(url, plugin) 
     4134  { 
     4135    for(var i = 0; i < this.loadedScripts.length; i++) 
     4136    { 
     4137      if(this.loadedScripts[i].url == url && this.loadedScripts[i].plugin == plugin) 
     4138        return this; // Already done (or in process) 
     4139    } 
     4140     
     4141    return this.loadScript(url, plugin); 
     4142  } 
     4143   
    41344144  assetLoader.loadStyle = function(url, plugin) 
    41354145  { 
     
    41444154  assetLoader.whenReady = function(callback)  
    41454155  { 
    4146     this.callback = callback;     
     4156    this.callbacks.push(callback);     
    41474157    if(!this.loaderRunning) this.loadNext(); 
    41484158     
     
    41524162  assetLoader.runCallback = function() 
    41534163  { 
    4154     this.callback(); 
    4155     this.callback = null; 
     4164    while(this.callbacks.length) 
     4165    {  
     4166      var _callback = this.callbacks.splice(0,1); 
     4167      _callback[0](); 
     4168      _callback = null; 
     4169    } 
    41564170    return this; 
    41574171  } 
  • trunk/plugins/MootoolsFileManager/MootoolsFileManager.css

    r1239 r1245  
    1 .filemanager-container .filemanager { overflow:hidden; } 
     1.filemanager-container .filemanager { overflow:visible; } 
     2.filemanager-info-area { width:50%; float:left; clear:left; } 
     3.filemanager-preview-area { width:50%; float:left; clear:right; } 
     4div.filemanager-info-area dt, div.filemanager-preview-area dt { width:25%; margin-left:5px; } 
     5div.filemanager-info-area dd, div.filemanager-preview-area dd { width:auto; } 
     6 
     7div.filemanager-preview-area dt { float:left; } 
     8div.filemanager-preview-area h2 { display:none; } 
     9div.filemanager-preview-area img.preview { margin-left:5px; margin-right:5px; margin-top:0px; float:right; clear:right; max-width:140px; } 
     10div.filemanager-preview-area dl { float:left; clear:left; width:auto; } 
     11div.filemanager-preview div.object { margin-left:15%; margin-right:15%; margin-top:0px; float:right; clear:right; } 
     12 
     13div.filemanager td, div.filemanager th, div.filemanager input[type=text] {   
     14  line-height: 20px; 
     15  font-size: 11px; 
     16} 
     17 
     18div.filemanager th 
     19{ 
     20  font-weight:bold; 
     21  text-align:left; 
     22  padding-left:0px; 
     23} 
     24 
     25div.filemanager td.filemanager-f_alt input {width:100%;} 
     26 
     27div.filemanager table.filemanager-extended-options { width:550px; margin-left:5px; margin-right:5px; border-collapse:collapse; } 
     28 
     29 
     30table.filemanager-extended-options .buttonColor { 
     31  width :1em; 
     32  margin-left: 2px; 
     33  cursor: default; 
     34} 
     35 
     36table.filemanager-extended-options .buttonColor .chooser, table.filemanager-extended-options .buttonColor .nocolor { 
     37  height: 0.6em; 
     38  border: 1px solid; 
     39  padding: 0px 1em; 
     40  border-color: ButtonHighlight ButtonShadow ButtonShadow ButtonHighlight; 
     41} 
     42 
     43table.filemanager-extended-options .buttonColor .buttonClick { 
     44  border-color: ButtonShadow ButtonHighlight ButtonHighlight ButtonShadow; 
     45} 
     46table.filemanager-extended-options .buttonColor .buttonColor-hilite { 
     47  border-color: ButtonShadow ButtonHighlight ButtonHighlight ButtonShadow; 
     48} 
     49 
     50table.filemanager-extended-options .buttonColor .nocolor { padding: 0px; } 
     51table.filemanager-extended-options .buttonColor .nocolor-hilite { background-color: #fff; color: #f00; } 
     52 
     53div.filemanager-uploader-area { clear:both; } 
  • trunk/plugins/MootoolsFileManager/MootoolsFileManager.js

    r1243 r1245  
    6161MootoolsFileManager.AssetLoader.loadStyle('MootoolsFileManager.css', 'MootoolsFileManager'); 
    6262 
    63 // Initialise the plugin for an editor instance. 
     63 
    6464function MootoolsFileManager(editor) 
    6565{ 
     
    6868  var cfg = editor.config; 
    6969     
    70   Xinha._postback(editor.config.MootoolsFileManager.backend+'__function=read-config', editor.config.MootoolsFileManager.backend_data, function(phpcfg) { eval ('var f = '+phpcfg+';'); self.hookUpButtons(f); });   
     70  // Do a callback to the PHP backend and get it to "decode" the configuration for us into a  
     71  // javascript object. 
     72  Xinha._postback(editor.config.MootoolsFileManager.backend+'__function=read-config', editor.config.MootoolsFileManager.backend_data,  
     73    function(phpcfg)  
     74    {  
     75      eval ('var f = '+phpcfg+';');  
     76      self.phpcfg = f; self.hookUpButtons();  
     77    });   
     78     
    7179  return;   
    7280}; 
    7381 
    74 // Connect up the plugin to the buttons in the editor, depending on the php configuration. 
    75 MootoolsFileManager.prototype.hookUpButtons = function(phpcfg)  
     82/** Connect up/insert the appropriate buttons and load in the auxillary files. 
     83 * 
     84 *  The different "modes" of this plugin have been split into several auxilliary files 
     85 *  as it's likely you may not want them all (esp if we add more modes later). 
     86 * 
     87 *  Each mode's "include" is loaded as soon as we know it could be needed by the 
     88 *  editor, we don't wait until the button is pressed as that would be slow for 
     89 *  the user to respond. 
     90 *  
     91 */ 
     92  
     93MootoolsFileManager.prototype.hookUpButtons = function()  
    7694{ 
    7795  var self = this;   
     96  var phpcfg = self.phpcfg; 
     97   
    7898  if (phpcfg.files_dir)  
    7999  { 
     100    MootoolsFileManager.AssetLoader.loadScriptOnce('MootoolsFileManager.FileManager.js', 'MootoolsFileManager'); 
     101     
    80102    this.editor.config.registerButton({ 
    81103        id        : "linkfile", 
     
    83105        image     : Xinha.getPluginDir('ExtendedFileManager') + '/img/ed_linkfile.gif', 
    84106        textMode  : false, 
    85         action    : function(editor) { self.OpenFileManager(); } 
     107        action    : function(editor) { MootoolsFileManager.AssetLoader.whenReady(function() { self.OpenFileManager(); }); } 
    86108        }); 
    87109         
     
    90112   
    91113  if(phpcfg.images_dir) 
    92   { 
     114  {      
     115    MootoolsFileManager.AssetLoader.loadScriptOnce('MootoolsFileManager.ImageManager.js', 'MootoolsFileManager'); 
     116     
    93117    // Override our Editors insert image button action.   
    94     this.editor._insertImage = function() 
    95     { 
    96       self.OpenImageManager(); 
    97     } 
     118    self.editor._insertImage = function() 
     119    { 
     120      MootoolsFileManager.AssetLoader.whenReady(function() { self.OpenImageManager(); }); 
     121    }               
    98122  }  
    99123}; 
    100124 
    101 // Open a "files" mode of the plugin to allow to select a file to 
    102 // create a link to. 
    103 MootoolsFileManager.prototype.OpenFileManager = function(link)  
    104 { 
    105     var editor = this.editor; 
    106     var outparam = {"editor" : this.editor, param : null}; 
    107     var self = this; 
    108      
    109     if (typeof link == "undefined")  
    110     { 
    111       link = this.editor.getParentElement(); 
    112       if (link)  
    113       { 
    114         if (/^img$/i.test(link.tagName)) 
    115             link = link.parentNode; 
    116         if (!/^a$/i.test(link.tagName)) 
    117             link = null; 
    118       } 
    119     } 
    120      
    121     // If the link wasn't provided, and no link is currently in focus, 
    122     // make one from the selection. 
    123     if (!link)  
    124     { 
    125       var sel = editor.getSelection(); 
    126       var range = editor.createRange(sel); 
    127       var compare = 0; 
    128        
    129       if (Xinha.is_ie)  
    130       { 
    131         if ( sel.type == "Control" ) 
    132         { 
    133           compare = range.length; 
    134         } 
    135         else 
    136         { 
    137           compare = range.compareEndPoints("StartToEnd", range); 
    138         } 
    139       }  
    140       else  
    141       { 
    142         compare = range.compareBoundaryPoints(range.START_TO_END, range); 
    143       } 
    144        
    145       if (compare == 0)  
    146       { 
    147         alert(Xinha._lc("You must select some text before making a new link.", 'MootoolsFileManager')); 
    148         return; 
    149       } 
    150       outparam.param = { 
    151           f_href : '', 
    152           f_title : '', 
    153           f_target : '', 
    154           f_usetarget : editor.config.makeLinkShowsTarget, 
    155           baseHref: editor.config.baseHref 
    156       }; 
     125/** Helper method to scale (an image typically) to a new constraint. 
     126 * 
     127 * @param origdim object { width: 123,height: 456 } The original dimensions. 
     128 * @param newdim  object { width: 456, height: 123 } The new (maximum) dimensions. 
     129 * @param flexside 'width'|'height' (optional) the side which can be "flexible"  
     130 *   Defaults to the "short" side. 
     131 * @return { width: 789, height: 987 } The scaled dimensions which should be used.  
     132 */ 
     133  
     134MootoolsFileManager.prototype.ScaleImage = function( origdim, newdim, flexside ) 
     135{ 
     136  if(!origdim.height || !origdim.width) return newdim; // No old size, stays new. 
     137  if(!newdim.height && !newdim.width) return origdim; // No new size, stays the same. 
     138     
     139  if(!flexside) 
     140  { 
     141    if(origdim.width > origdim.height) 
     142    { 
     143      flexside = 'height'; // Landscape image, allow the height to flex. 
    157144    } 
    158145    else 
    159146    { 
    160       outparam.param = { 
    161           f_href   : Xinha.is_ie ? link.href : link.getAttribute("href"), 
    162           f_title  : link.title, 
    163           f_target : link.target, 
    164           f_usetarget : editor.config.makeLinkShowsTarget, 
    165           baseHref: editor.config.baseHref 
    166       }; 
    167     } 
    168      
    169     this.current_link = link; 
    170     if(!this.FileManagerWidget) 
    171     {     
    172       this.FileManagerWidget = new FileManager({ 
    173         url:            this.editor.config.MootoolsFileManager.backend +'__function=file-manager&', 
    174         assetBasePath:  Xinha.getPluginDir('MootoolsFileManager')+'/mootools-filemanager/Assets', 
    175         language:       _editor_lang, 
    176         selectable:     true, 
    177         uploadAuthData: this.editor.config.MootoolsFileManager.backend_data, 
    178         onComplete:     function(path, file, params) { self.FileManagerReturn(path,file,params); } 
    179         // @TODO : Add support to pass in the existing href, title etc... 
    180       });        
    181     } 
    182      
    183     this.FileManagerWidget.show();     
    184 }; 
    185  
    186 // Take the values from the file selection and make it (or update) a link 
    187 MootoolsFileManager.prototype.FileManagerReturn = function(path, file, param) 
    188 { 
    189   var editor = this.editor; 
    190   var a      = this.current_link; 
    191    
    192   if (!param) 
    193   { 
    194     param =  { f_href: path, f_title: '', f_target: '' } 
    195   } 
    196    
    197   if (!a) 
    198   { 
    199     try  
    200     { 
    201       editor._doc.execCommand("createlink", false, param.f_href); 
    202       a = editor.getParentElement(); 
    203       var sel = editor.getSelection(); 
    204       var range = editor.createRange(sel); 
    205       if (!Xinha.is_ie)  
    206       { 
    207         a = range.startContainer; 
    208         if (!/^a$/i.test(a.tagName))  
    209         { 
    210           a = a.nextSibling; 
    211           if (a == null) 
    212           { 
    213             a = range.startContainer.parentNode; 
    214           } 
    215         } 
    216       } 
    217     } catch(e) {} 
    218   } 
    219   else  
    220   { 
    221     var href = param.f_href.trim(); 
    222     editor.selectNodeContents(a); 
    223     if (href == "")  
    224     { 
    225       editor._doc.execCommand("unlink", false, null); 
    226       editor.updateToolbar(); 
    227       return false; 
    228     } 
    229     else  
    230     { 
    231       a.href = href; 
    232     } 
    233   } 
    234    
    235   if (!(a && /^a$/i.test(a.tagName))) 
    236   { 
    237     return false; 
    238   } 
    239   // @TODO: Add support to mfm for specifying target and title 
    240   a.target = param.f_target.trim(); 
    241   a.title = param.f_title.trim(); 
    242   editor.selectNodeContents(a); 
    243   editor.updateToolbar(); 
    244 }; 
    245  
    246 // Open an images mode of the plugin for the user to insert an image 
    247 MootoolsFileManager.prototype.OpenImageManager = function(image) 
    248 { 
    249   var editor = this.editor;  // for nested functions 
    250   var self   = this; 
    251   var outparam = null; 
    252   if (typeof image == "undefined")  
    253   { 
    254     image = editor.getParentElement(); 
    255     if (image && !/^img$/i.test(image.tagName)) 
    256     { 
    257       image = null; 
    258     } 
    259   } 
    260  
    261   if ( image ) 
    262   { 
    263     outparam = 
    264       { 
    265         f_url    : Xinha.is_ie ? image.src : image.src, 
    266         f_alt    : image.alt, 
    267         f_border : image.style.borderWidth ? image.style.borderWidth : image.border, 
    268         f_align  : image.align, 
    269         f_padding: image.style.padding, 
    270         f_margin : image.style.margin, 
    271         f_width  : image.width, 
    272         f_height  : image.height, 
    273         f_backgroundColor: image.style.backgroundColor, 
    274         f_borderColor: image.style.borderColor, 
    275         f_hspace:  image.hspace && image.hspace != '-1' ? parseInt(image.hspace) : '', 
    276         f_vspace: image.vspace && image.vspace != '-1' ? parseInt(image.vspace) : '' 
    277       }; 
    278  
    279     outparam.f_border  = this.shortSize(outparam.f_border); 
    280     outparam.f_padding = this.shortSize(outparam.f_padding); 
    281     outparam.f_margin  = this.shortSize(outparam.f_margin); 
    282          
    283     outparam.f_backgroundColor = this.convertToHex(outparam.f_backgroundColor); 
    284     outparam.f_borderColor = this.convertToHex(outparam.f_borderColor); 
    285   }  
    286    
    287   this.current_image = image; 
    288   if(!this.ImageManagerWidget) 
    289   { 
    290     this.ImageManagerWidget = new FileManager({ 
    291       url:            this.editor.config.MootoolsFileManager.backend+'__function=image-manager&', 
    292       assetBasePath:  Xinha.getPluginDir('MootoolsFileManager')+'/mootools-filemanager/Assets', 
    293       language:       _editor_lang, 
    294       selectable:     true, 
    295       uploadAuthData: this.editor.config.MootoolsFileManager.backend_data, 
    296       onComplete:     function(path, file, params) { self.ImageManagerReturn(path,file,params); }, 
    297       extendedAttributes: outparam 
    298       // @TODO : Add support to pass in the existing src, alt etc... 
    299     });      
    300   } 
    301    
    302   this.ImageManagerWidget.show();     
    303 }; 
    304  
    305 // Take the selected image and insert or update an image in the html 
    306 MootoolsFileManager.prototype.ImageManagerReturn = function(path, file, param) 
    307 { 
    308   var editor = this.editor; 
    309   var self   = this; 
    310   var image  = this.current_image; 
    311    
    312   if (!param) 
    313   { 
    314     param =  { f_url: path } 
    315   } 
    316    
    317   var img = image; 
    318   if (!img) { 
    319     if (Xinha.is_ie) { 
    320       var sel = editor._getSelection(); 
    321       var range = editor._createRange(sel); 
    322       editor._doc.execCommand("insertimage", false, param.f_url); 
    323       img = range.parentElement(); 
    324       // wonder if this works... 
    325       if (img.tagName.toLowerCase() != "img") { 
    326         img = img.previousSibling; 
    327       } 
    328     } else { 
    329       img = document.createElement('img'); 
    330       img.src = param.f_url; 
    331       editor.insertNodeAtSelection(img); 
    332     } 
    333   } else {       
    334     img.src = param.f_url; 
    335   } 
    336  
    337   for (field in param) { 
    338     var value = param[field]; 
    339     // @TODO: Add ability to mfm for this to be possible. 
    340     switch (field) { 
    341         case "f_alt"    : img.alt  = value; break; 
    342         case "f_border" : 
    343         if(value.length) 
    344         {            
    345           img.style.borderWidth = /[^0-9]/.test(value) ? value :  (parseInt(value) + 'px'); 
    346           if(img.style.borderWidth && !img.style.borderStyle) 
    347           { 
    348             img.style.borderStyle = 'solid'; 
    349           } 
    350         } 
    351         else 
    352         { 
    353           img.style.borderWidth = ''; 
    354           img.style.borderStyle = ''; 
    355         } 
    356         break; 
    357          
    358         case "f_borderColor": img.style.borderColor = value; break; 
    359         case "f_backgroundColor": img.style.backgroundColor = value; break; 
    360            
    361         case "f_padding":  
    362         { 
    363           if(value.length) 
    364           { 
    365             img.style.padding = /[^0-9]/.test(value) ? value :  (parseInt(value) + 'px');  
    366           } 
    367           else 
    368           { 
    369             img.style.padding = ''; 
    370           } 
    371         } 
    372         break; 
    373          
    374         case "f_margin":  
    375         { 
    376           if(value.length) 
    377           { 
    378             img.style.margin = /[^0-9]/.test(value) ? value :  (parseInt(value) + 'px');  
    379           } 
    380           else 
    381           { 
    382             img.style.margin = ''; 
    383           } 
    384         } 
    385         break; 
    386          
    387         case "f_align"  : img.align  = value; break; 
    388            
    389         case "f_width" :  
    390         { 
    391           if(!isNaN(parseInt(value))) { img.width  = parseInt(value); } else { img.width = ''; } 
    392         } 
    393         break; 
    394          
    395         case "f_height": 
    396         { 
    397           if(!isNaN(parseInt(value))) { img.height = parseInt(value); } else { img.height = ''; } 
    398         } 
    399         break; 
    400          
    401         case "f_hspace" :  
    402         { 
    403           if(!isNaN(parseInt(value))) { img.hspace  = parseInt(value); } else { img.hspace = ''; } 
    404         } 
    405         break; 
    406          
    407         case "f_vspace" :  
    408         { 
    409           if(!isNaN(parseInt(value))) { img.vspace  = parseInt(value); } else { img.vspace = ''; } 
    410         } 
    411         break; 
    412     } 
    413   } 
    414 }; 
    415  
    416 // Take a multi-part CSS size specification (eg sizes for 4 borders) and  
    417 // shrink it into one if possible. 
     147      flexside = 'width'; // Portrait image, allow the width to flex 
     148    } 
     149  } 
     150   
     151  var knownside = null; 
     152  switch(flexside) 
     153  { 
     154    case 'height': knownside = 'width'; break; 
     155    case 'width' : knownside = 'height'; break; 
     156  } 
     157   
     158  // If we DON'T know the known side, we need to flip it. 
     159  if(!newdim[knownside]) 
     160  { 
     161    var t = knownside; 
     162    knownside = flexside; 
     163    flexside = t; 
     164  } 
     165   
     166  var ratio = 0; 
     167  switch(flexside) 
     168  { 
     169    case 'width':  ratio = origdim.width / origdim.height; break; 
     170    case 'height': ratio = origdim.height / origdim.width; break; 
     171  } 
     172   
     173  var rdim = {}; 
     174  rdim[knownside] = newdim[knownside]; 
     175  rdim[flexside]  = Math.floor(newdim[knownside] * ratio); 
     176  if(isNaN(rdim[knownside])) rdim[knownside] = null; 
     177  if(isNaN(rdim[flexside]))  rdim[flexside]  = null; 
     178  return rdim; 
     179} 
     180 
     181/** Take a multi-part CSS size specification (eg sizes for 4 borders) and  
     182 * shrink it into one if possible. 
     183 */ 
     184  
    418185MootoolsFileManager.prototype.shortSize = function(cssSize) 
    419186{ 
     
    435202}; 
    436203 
    437 // Take a colour in rgb(a,b) format and convert to HEX 
    438 // handles multiple colours in same string as well. 
     204/** Take a colour in rgb(a,b) format and convert to HEX 
     205 * handles multiple colours in same string as well. 
     206 */ 
     207  
    439208MootoolsFileManager.prototype.convertToHex = function(color)  
    440209{ 
  • trunk/plugins/MootoolsFileManager/backend.php

    r1242 r1245  
    100100      'suggestedMaxImageDimension' => $IMConfig['suggested_images_image_dimension'], 
    101101             
    102       'destroy'       => $IMConfig['allow_delete'], 
    103      // 'filter'        => $IMConfig['files_filter'], 
     102      'destroy'       => $IMConfig['allow_images_delete'], 
     103      'filter'        => 'image/', 
    104104             
    105105    )); 
     
    122122      'suggestedMaxImageDimension' => $IMConfig['suggested_files_image_dimension'], 
    123123             
    124       'destroy'       => $IMConfig['allow_delete'], 
     124      'destroy'       => $IMConfig['allow_files_delete'], 
    125125     // 'filter'        => $IMConfig['files_filter'], 
    126126             
  • trunk/plugins/MootoolsFileManager/config.php

    r1239 r1245  
    111111 
    112112  $IMConfig['allow_files_upload']     = false; 
     113  $IMConfig['allow_files_delete']     = false; 
    113114  $IMConfig['max_files_upload_size']  = '3M'; 
    114115  $IMConfig['suggested_files_image_dimension']  = array('width' => 2048, 'height' => 1536); 
    115116 
    116   $IMConfig['allow_images_upload']    = false; 
     117  $IMConfig['allow_images_upload']     = false; 
     118  $IMConfig['allow_images_delete']     = false; 
    117119  $IMConfig['max_images_upload_size']  = '3M'; 
    118120  $IMConfig['suggested_images_image_dimension']  = array('width' => 1024, 'height' => 768); 
     
    175177{ 
    176178  $IMConfig = array_merge($IMConfig, $passed_data); 
    177   $IMConfig['backend_url'] .= xinha_passed_data_querystring() . '&';   
    178179} 
    179  
     180@session_write_close(); // Close session now so we don't lock. 
    180181 
    181182?> 
  • trunk/plugins/MootoolsFileManager/mootools-filemanager/Backend/FileManager.php

    r1239 r1245  
    5454                        'dateFormat' => 'j M Y - H:i', 
    5555                        'maxUploadSize' => 1024 * 1024 * 3, 
    56                         'suggestedMaxImageDimension' => array('width' => 800, 'height' => 600), 
    5756                        'upload' => false, 
    5857                        'destroy' => false, 
    5958                        'safe' => true, 
    60                         'filter' => null 
     59                        'filter' => null, 
     60                         
     61                        // Xinha: Allow to specify the "Resize Large Images" tolerance level. 
     62                        'suggestedMaxImageDimension' => array('width' => 800, 'height' => 600), 
    6163                ), $options); 
    6264                 
     
    127129                // Xinha is supplying both the same (eg url = /foo/test and dir = /home/bar/public_html/foo/test ) 
    128130                // so we will rip off the first part of directory, below. 
    129                 $url = $this->options['baseURL'] . '/' . preg_replace('/^[^\/]*\//', '', $this->post['directory'] . '/' . $this->post['file']);//$this->normalize(substr($file, strlen($this->path)+1)); 
     131                $url = $this->options['baseURL'] . '/' . preg_replace('/^[^\/]*\//', '', $this->post['directory'] . '/' . $this->post['file']); 
     132                 
    130133                $mime = $this->getMimeType($file); 
    131134                $content = null; 
    132                 $extra_return_detail = array(); 
     135                 
     136    // Xinha: We want to get some more information about what has been selected in a way 
     137    // we can use it.  Effectively what gets put in here will be passed into the 
     138    // 'onDetails' event handler of your FileManager object (if any). 
     139    $extra_return_detail = array 
     140      ( 
     141        'url'  => $url, 
     142        'mime' => $mime 
     143      ); 
    133144                 
    134145                if (FileManagerUtility::startsWith($mime, 'image/')){ 
     
    140151                                        <dt>${height}</dt><dd>' . $size[1] . 'px</dd> 
    141152                                </dl>'; 
     153                 
     154        // Xinha: Return some information about the image which can be access  
     155        // from the onDetails event handler in FileManager 
    142156                                $extra_return_detail['width']  = $size[0]; 
    143157                                $extra_return_detail['height'] = $size[1]; 
     158                                 
    144159                }elseif (FileManagerUtility::startsWith($mime, 'text/') || $mime == 'application/x-javascript'){ 
    145160                        $filecontent = file_get_contents($file, null, null, 0, 300); 
     
    178193                        'content' => $content ? $content : '<div class="margin"> 
    179194                                ${nopreview}<br/><button value="' . $url . '">${download}</button> 
    180                         </div>', 
    181                         'url'     => $url, 
    182                         'mime'    => $mime, 
     195                        </div>' 
    183196                ), $extra_return_detail)); 
    184197        } 
     
    198211         
    199212        protected function onCreate(){ 
    200     try 
     213    if ($this->options['upload']) 
    201214    { 
    202       if (!$this->options['upload']) 
    203         throw new FileManagerException('disabled'); 
    204          
    205215                if (empty($this->post['directory']) || empty($this->post['file'])) return; 
    206216                 
     
    210220                mkdir($file); 
    211221                } 
    212                 catch(FileManagerException $e){ 
    213                 /* 
    214       echo json_encode(array( 
    215         'status' => 0, 
    216         'error' => '${upload.' . $e->getMessage() . '}' 
    217       )); 
    218      */ 
    219     } 
    220      
     222                 
    221223                $this->onView(); 
    222224        } 
  • trunk/plugins/MootoolsFileManager/mootools-filemanager/Css/FileManager.css

    r1239 r1245  
    322322} 
    323323 
    324 div.filemanager-preview ul, div.filemanager-preview div.textpreview { 
     324div.filemanager-preview ul, div.filemanager-uploader ul, div.filemanager-preview div.textpreview { 
    325325        border: 1px solid #bebebe; 
    326326        background: #fff; 
     
    352352        z-index: 1010; 
    353353} 
    354  
    355354/* UPLOAD */ 
     355 
    356356div.filemanager-container .file span { 
    357357        padding: 0 5px 0 0; 
  • trunk/plugins/MootoolsFileManager/mootools-filemanager/Demos/mootools-more.js

    r1239 r1245  
    5353... 
    5454*/ 
    55 (function(){ 
     55(function(addEvent, removeEvent){ 
    5656         
    5757        var match = /(.*?):relay\(([^)]+)\)$/, 
     
    8080                }; 
    8181 
    82         var oldAddEvent = Element.prototype.addEvent, 
    83                 oldRemoveEvent = Element.prototype.removeEvent; 
    84                  
    8582        Element.implement({ 
    8683 
     
    9592                                        }.bind(this); 
    9693                                        monitors[type] = monitor; 
    97                                         oldAddEvent.call(this, splitted.event, monitor); 
     94                                        addEvent.call(this, splitted.event, monitor); 
    9895                                } 
    9996                        } 
    100                         return oldAddEvent.apply(this, arguments); 
     97                        return addEvent.apply(this, arguments); 
    10198                }, 
    10299 
     
    107104                                if (!events || !events[type] || (fn && !events[type].keys.contains(fn))) return this; 
    108105 
    109                                 if (fn) oldRemoveEvent.apply(this, [type, fn]); 
    110                                 else oldRemoveEvent.apply(this, type); 
     106                                if (fn) removeEvent.apply(this, [type, fn]); 
     107                                else removeEvent.apply(this, type); 
    111108 
    112109                                events = this.retrieve('events'); 
    113                                 if (events && events[type] && events[type].length == 0){ 
     110                                if (events && events[type] && events[type].keys.length == 0){ 
    114111                                        var monitors = this.retrieve('$moo:delegateMonitors', {}); 
    115                                         oldRemoveEvent.apply(this, [splitted.event, monitors[type]]); 
     112                                        removeEvent.apply(this, [splitted.event, monitors[type]]); 
    116113                                        delete monitors[type]; 
    117114                                } 
     
    119116                        } 
    120117 
    121                         return oldRemoveEvent.apply(this, arguments); 
     118                        return removeEvent.apply(this, arguments); 
    122119                }, 
    123120 
     
    133130        }); 
    134131 
    135 })(); 
     132})(Element.prototype.addEvent, Element.prototype.removeEvent); 
    136133 
    137134/* 
     
    357354                        this.container = document.id(this.container.getDocument().body); 
    358355                 
    359                 var styles = element.getStyles('left', 'right', 'position'); 
     356                var styles = element.getStyles('left', 'top', 'position'); 
    360357                if (styles.left == 'auto' || styles.top == 'auto') 
    361358                        element.setPosition(element.getPosition(element.getOffsetParent())); 
     
    750747        }, 
    751748 
    752         fireForParent: function(event, element) { 
     749        fireForParent: function(event, element) {       
    753750                        parentNode = element.getParent(); 
    754751                        if (parentNode == document.body) return; 
    755752                        if (parentNode.retrieve('tip:enter')) parentNode.fireEvent('mouseenter', event); 
    756                         else return this.fireForParent(parentNode, event); 
     753                        else return this.fireForParent(event, parentNode); // Why was this reversed in the original? 
    757754        }, 
    758755 
  • trunk/plugins/MootoolsFileManager/mootools-filemanager/Language/Language.en.js

    r1239 r1245  
    2323        size: 'Size:', 
    2424        dir: 'Path:', 
    25         modified: 'Last modified:', 
     25        modified: 'Created:', 
    2626        preview: 'Preview', 
    2727        close: 'Close', 
  • trunk/plugins/MootoolsFileManager/mootools-filemanager/Source/Additions.js

    r1239 r1245  
    8888                if (this.options.content) this.el.getElement('div').adopt(this.options.content); 
    8989                 
    90                 Array.each(this.options.buttons, function(v){ 
     90                Array.each(this.options.buttons, function(v){            
    9191                        new Element('button', {'class': 'fm-dialog-' + v, text: this.options.language[v]}).addEvent('click', (function(e){ 
    9292                                if (e) e.stop(); 
  • trunk/plugins/MootoolsFileManager/mootools-filemanager/Source/FileManager.js

    r1239 r1245  
    4040  - onHide: event fired when FileManager closes 
    4141  - onPreview: event fired when the user clicks an image in the preview 
     42  - onDetails: event fired when the details are updated after user picking a file 
     43  - onHidePreview: event fired when the "preview" is hidden (usually, user uploading file, or changing directory) 
    4244... 
    4345*/ 
     
    5658                onShow: $empty, 
    5759                onHide: $empty, 
    58                 onPreview: $empty*/ 
     60                onPreview: $empty, 
     61                onDetails: $empty, // Xinha: Fired when an item is picked form the files list, supplied object (eg {width: 123, height:456} ) 
     62                onHidePreview: $empty, // Xinha: Fired when the preview is hidden (eg when uploading) */ 
    5963                directory: '', 
    6064                url: null, 
     
    103107                         
    104108                        if (self.Current) self.Current.removeClass('selected'); 
    105                         self.Current = this.addClass('selected'); 
     109                        self.Current = this.addClass('selected'); // NB: Also sets self.Current 
     110       
     111      // Xinha: We need to have Current assigned before fillInfo because fillInfo adds to it       
    106112      self.fillInfo(file); 
    107113                        self.switchButton(); 
     
    109115                this.browser = new Element('ul', {'class': 'filemanager-browser'}).addEvents({ 
    110116                        click: (function(){ 
    111                                 return self.deselect(); 
     117                                // return self.deselect(); 
    112118                        }), 
    113119                        'click:relay(li span.fi)': this.relayClick 
    114120                }).inject(this.el); 
    115121                 
    116                 this.addMenuButton('create'); 
     122                if (this.options.upload)     this.addMenuButton('create'); // Xinha: Create directory permission = upload 
    117123                if (this.options.selectable) this.addMenuButton('open'); 
    118124                 
     
    124130                ]); 
    125131 
    126                 this.info.adopt([head, new Element('h2', {text: this.language.information})]); 
     132    // Xinha: We need to groupt he headers and lists togethor because we will 
     133    // use some CSS to reorganise a bit.  So we create "infoarea" which  
     134    // will contain the h2 and list for the "Information", that is 
     135    // modification date, size, directory etc... 
     136    var infoarea = new Element('div', {'class': 'filemanager-info-area'}); 
     137 
     138                this.info.adopt([head, infoarea.adopt(new Element('h2', {text: this.language.information}))]); 
    127139 
    128140                new Element('dl').adopt([ 
     
    135147                        new Element('dt', {text: this.language.dir}), 
    136148                        new Element('dd', {'class': 'filemanager-dir'}) 
    137                 ]).inject(this.info); 
     149                ]).inject(infoarea); 
    138150                 
    139151                this.preview = new Element('div', {'class': 'filemanager-preview'}).addEvent('click:relay(img.preview)', function(){ 
    140152                        self.fireEvent('preview', [this.get('src')]); 
    141153                }); 
    142                 this.info.adopt([ 
     154                 
     155        // Xinha: We need to group the headers and lists togethor because we will 
     156    // use some CSS to reorganise a bit.  So we create "filemanager-preview-area" which  
     157    // will contain the h2 for the preview and also the preview content returned from 
     158    // Backend/FileManager.php 
     159                this.info.adopt((new Element('div', {'class': 'filemanager-preview-area'})).adopt([ 
    143160                        new Element('h2', {'class': 'filemanager-headline', text: this.language.preview}), 
    144161                        this.preview 
    145                 ]); 
     162                ])); 
    146163                 
    147164                this.closeIcon = new Element('div', { 
     
    239256                 
    240257                this.fireEvent('complete', [ 
     258      // Xinha: The URL path returned by normal MootoolsFileManager is odd, it includes the last component 
     259      // of the base directory, that is, if your base is /foo/bar/images then we get something like 
     260      // images/narf.jpg. 
     261      // To work around this we take the URL which was worked out by Backend/FileManager.php 
     262      // and return that as the url.        
    241263                        this.normalize(this.Current.file_data ? this.Current.file_data.url : this.Directory + '/' + this.Current.retrieve('file').name), 
    242264                        this.Current.retrieve('file') 
     
    342364        }, 
    343365 
    344         rename: function(e, file){ 
     366        rename: function(e, file){       
    345367                e.stop(); 
    346368                this.tips.hide(); 
     
    439461                        self.relayClick.apply(el); 
    440462                }; 
     463                 
     464                if(0) // This (drag to move into subdirectory) is breaking IE, we don't need it that badly 
     465          // See: http://github.com/cpojer/mootools-filemanager/issues#issue/11 
    441466                $$(els[0]).makeDraggable({ 
    442467                        droppables: $$(this.droppables, els[1]), 
     
    538563                this.fireHooks('cleanup'); 
    539564                this.preview.empty(); 
    540  
     565                     
     566    // Xinha: We need to remove our custom attributes form when the preview is hidden  
     567    this.fireEvent('hidePreview'); 
     568     
    541569                this.info.getElement('h1').set('text', file.name); 
    542570                this.info.getElement('dd.filemanager-modified').set('text', file.date); 
     
    587615                                }); 
    588616                                 
     617                                // Xinha: We need to add in a form for setting the attributes of images etc, 
     618                                // so we add this event and pass it the information we have about the item  
     619                                // as returned by Backend/FileManager.php 
     620                                this.fireEvent('details', [j]); 
     621                                 
     622                                // Xinha: We also want to hold onto the data so we can access it 
     623                                // when selecting the image. 
    589624                                if(this.Current) this.Current.file_data = j; 
    590625                        }).bind(this), 
     
    642677         
    643678        initialize: function(options, filebrowser){ 
     679    // Xinha: We need ALL requests from the FileManager to have our authorisation data on it 
     680    // normal MootoolsFileManager only has the flash send it :-(     
    644681    if(filebrowser) 
    645682    {       
     
    647684    } 
    648685     
     686    // Xinha: We also need to clean up the url because our backend already includes a query string 
     687    // and MootoolsFileManager adds ?event=..... indiscriminately, our query string always 
     688    // ends in an ampersand, so we can just clean up '&?event=' to be '&event=' 
    649689    options.url = options.url.replace(/&\?event=/, '&event='); 
    650690     
  • trunk/plugins/MootoolsFileManager/mootools-filemanager/Source/Uploader.js

    r1239 r1245  
    7676                        }), 
    7777                        list: new Element('ul', {'class': 'filemanager-uploader-list'}), 
    78                         uploader: new Element('div', {opacity: 0}).adopt( 
     78                        uploader: new Element('div', {opacity: 0, 'class': 'filemanager-uploader-area'}).adopt( 
    7979                                new Element('h2', {text: this.language.upload}), 
    8080                                new Element('div', {'class': 'filemanager-uploader'}) 
     
    223223                                self.fillInfo(); 
    224224                                self.info.getElement('h2.filemanager-headline').setStyle('display', 'none'); 
    225                                 self.preview.adopt(self.upload.uploader); 
     225                                self.info.adopt(self.upload.uploader); 
    226226                                self.upload.uploader.fade(1); 
    227227                        }, 
Note: See TracChangeset for help on using the changeset viewer.