Ignore:
Timestamp:
03/28/11 23:08:39 (9 years ago)
Author:
gogo
Message:

See ticket #1502

Update to enhance reliability and functionality of MootoolsFileManager?.

  1. A couple of race type conditions caused various issues with loading the MFM.
  2. Add preselection of current image
  3. Add documentation for HSpace/VSpace in config.php

Also snuck in a couple of other bugfixes/additions:

  1. add support for having attribute "onxinhaready" on a textarea
  2. add a Xinha._posturlcontent as an analog to _geturlcontent, synchronouse post
  3. some PHP deprecation issues in the old ExtendedFileManager? and ImageManager?
  4. add a skin.xml to blue-look skin

Note: This is an older version of MFM, I am about to create a branch to work on bringing in a large update to MFM in a couple of stages.

Location:
trunk/plugins/MootoolsFileManager
Files:
7 edited

Legend:

Unmodified
Added
Removed
  • trunk/plugins/MootoolsFileManager/MootoolsFileManager.ImageManager.js

    r1247 r1297  
    3737    outparam = 
    3838      { 
    39         f_url    : Xinha.is_ie ? image.src : image.src, 
     39        f_url    : image.getAttribute('src'), //Xinha.is_ie ? image.src : image.src, 
    4040        f_alt    : image.alt, 
    4141        f_border : image.style.borderWidth ? image.style.borderWidth : image.border, 
     
    7373      onComplete:     function(path, file) { self.ImageManagerReturn(path,file); }, 
    7474      onHide:         function() { if(this.swf && this.swf.box) this.swf.box.style.display = 'none'; }, 
    75       onShow:         function() { if(this.swf && this.swf.box) this.swf.box.style.display = ''; }, 
     75      onShow:         function() {         
     76        if(this.swf && this.swf.box) this.swf.box.style.display = '';  
     77        if(self.current_image) 
     78        { 
     79            var src  = self.current_image.getAttribute('src'); 
     80            if(!src.match(/^(([a-z]+:)|\/)/i)) 
     81            { 
     82                src = self.editor.config.baseHref.replace(/\/[^\/]*$/, '') + '/' + src; 
     83                if(src.match(/^[a-z]+:/i) && !self.phpcfg.images_url.match(/^[a-z]:/i)) 
     84                { 
     85                  src = src.replace(/^[a-z]+:(\/\/?)[^/]*/i, ''); 
     86                } 
     87            } 
     88            var path = src.replace(self.phpcfg.images_url+'/', '').split('/'); 
     89            var base = path.pop(); 
     90            path     = self.phpcfg.images_url.split('/').pop() + (path.length ? ('/' + path.join('/')) : '');   
     91            this.load(path, true, (function() { this.fillInfo(base); }).bind(this));             
     92        } 
     93      }, 
    7694      onDetails:      function(details)  
    7795                      {                                                  
     
    178196           
    179197          var img   = div.appendChild(document.createElement('img')); 
    180           img.src   = '/plugins/ImageManager/img/locked.gif'; 
     198          img.src   =  Xinha.getPluginDir("ImageManager") + '/img/locked.gif'; 
    181199          img.width = 25; 
    182200          img.height = 32; 
     
    201219        { // HSPACE/VSPACE         
    202220          var th    = tr.appendChild(document.createElement('th')); 
    203           var label = th.appendChild(document.createTextNode('Margin:')); 
     221          var label = th.appendChild(document.createTextNode('L/R Margin:')); 
    204222           
    205223          var td    = tr.appendChild(document.createElement('td')); 
     
    208226          input.size = 3;     
    209227          input.type = 'text'; 
    210            
    211           td.appendChild(document.createTextNode(' x '));         
     228          td.appendChild(document.createTextNode(' px '));                
     229          th.className = td.className = 'filemanager-f_hspace';       
     230           
     231          var th    = tr.appendChild(document.createElement('th')); 
     232          var label = th.appendChild(document.createTextNode('T/B Margin:')); 
     233          var td    = tr.appendChild(document.createElement('td')); 
    212234          var input = td.appendChild(document.createElement('input')); 
    213235          input.name   = 'f_vspace'; 
     
    215237          input.type = 'text'; 
    216238          td.appendChild(document.createTextNode(' px '));                
    217           th.className = td.className = 'filemanager-f_hspace filemanager-f_vspace';       
     239          th.className = td.className = 'filemanager-f_vspace';       
    218240        } 
    219241        else 
     
    291313          input.title = 'Positioning of this image'; 
    292314          input.options[0] = new Option('', true, true); 
    293           input.options[1] = new Option('Left'); 
    294           input.options[2] = new Option('Right'); 
    295           input.options[3] = new Option('Top'); 
    296           input.options[4] = new Option('Middle'); 
    297           input.options[5] = new Option('Bottom'); 
     315          input.options[1] = new Option('Left', 'left'); 
     316          input.options[2] = new Option('Right', 'right'); 
     317          input.options[3] = new Option('Top', 'top'); 
     318          input.options[4] = new Option('Middle', 'middle'); 
     319          input.options[5] = new Option('Bottom', 'bottom'); 
    298320           
    299321          // @TODO Constrain Ratio 
     
    420442       
    421443      table: this._ImageManagerAttributesTable 
    422     } 
    423      
     444    }  
    424445    return details; 
    425446  } 
     
    427448  // If details were supplied, we set the appropriate ones.   
    428449  if( 
    429       (f('f_width').value  && f('f_width').value  != details.width)    
    430    || (f('f_height').value && f('f_height').value != details.height)    
     450   (   (f('f_width').value  && f('f_width').value  != details.width)    
     451    || (f('f_height').value && f('f_height').value != details.height)  ) 
     452   &&  
     453    (!details.url || !this.current_image || this.current_image.getAttribute('src') != details.url) 
    431454  ) 
    432455  { 
    433     new Dialog('This image is a different size, would you like to use the new size?', { 
    434       language: {         
    435         confirm: 'Shrink/Grow To Fit',         
    436         decline: 'Fullsize' 
    437       }, 
    438          
    439       buttons: [ 
    440         'confirm', 
    441         'decline' 
    442       ], 
     456    // Check if this is the same image 
     457    var warn = function() {       
     458      new Dialog('This image is a different size, would you like to use the new size?', { 
     459        language: {         
     460          confirm: 'Shrink/Grow To Fit',         
     461          decline: 'Fullsize' 
     462        }, 
     463           
     464        buttons: [ 
     465          'confirm', 
     466          'decline' 
     467        ], 
     468         
     469        onConfirm: function(){ 
     470          if(f('f_constrain').checked) 
     471          { 
     472            var new_size = self.ScaleImage(details, {width: f('f_width').value, height: f('f_height').value}); 
     473             
     474            f('f_width').value = f('f_width').value   ? new_size.width : ''; 
     475            f('f_height').value = f('f_height').value ? new_size.height : ''; 
     476          } 
     477        }, 
     478         
     479        onDecline: function(){ 
     480          f('f_width').value = ''; 
     481          f('f_height').value = ''; 
     482        } 
     483      }); 
     484    } 
    443485       
    444       onConfirm: function(){ 
    445         if(f('f_constrain').checked) 
    446         { 
    447           var new_size = self.ScaleImage(details, {width: f('f_width').value, height: f('f_height').value}); 
    448            
    449           f('f_width').value = f('f_width').value   ? new_size.width : ''; 
    450           f('f_height').value = f('f_height').value ? new_size.height : ''; 
    451         } 
    452       }, 
    453        
    454       onDecline: function(){ 
    455         f('f_width').value = ''; 
    456         f('f_height').value = ''; 
    457       } 
    458     }); 
     486      if(!details.url) warn(); 
     487      else if(!this.current_image) warn(); 
     488      else 
     489      { 
     490          var src  = self.current_image.getAttribute('src'); 
     491          if(!src.match(/^(([a-z]+:)|\/)/i)) 
     492          { 
     493              src = self.editor.config.baseHref.replace(/\/[^\/]*$/, '') + '/' + src; 
     494              if(src.match(/^[a-z]+:/i) && !self.phpcfg.images_url.match(/^[a-z]:/i)) 
     495              { 
     496                src = src.replace(/^[a-z]+:(\/\/?)[^/]*/i, ''); 
     497              } 
     498          } 
     499          if(details.url != src) warn(); 
     500      } 
     501     
    459502  } 
    460503   
     
    537580        case "f_margin":  
    538581        { 
    539           if(value.length) 
     582          if(value && value.length) 
    540583          { 
    541584            img.style.margin = /[^0-9]/.test(value) ? value :  (parseInt(value) + 'px');  
     
    548591        break; 
    549592         
    550         case "f_align"  : if(img.align && img.align !== true) { img.align  = value; } else { img.removeAttribute('align'); } break; 
     593        case "f_align"  : if(value && value !== true) { img.align  = value; } else { img.removeAttribute('align'); } break; 
    551594           
    552595        case "f_width" :  
  • trunk/plugins/MootoolsFileManager/MootoolsFileManager.js

    r1245 r1297  
    5252    .loadStyle('mootools-filemanager/Css/FileManager.css', 'MootoolsFileManager') 
    5353    .loadStyle('mootools-filemanager/Css/Additions.css', 'MootoolsFileManager') 
    54     .loadScript('mootools-filemanager/Source/FileManager.js', 'MootoolsFileManager') 
    55     .loadScript('mootools-filemanager/Language/Language.en.js', 'MootoolsFileManager') 
    56     .loadScript('mootools-filemanager/Source/Additions.js', 'MootoolsFileManager') 
     54    .loadScript('mootools-filemanager/Source/Additions.js', 'MootoolsFileManager')         
    5755    .loadScript('mootools-filemanager/Source/Uploader/Fx.ProgressBar.js', 'MootoolsFileManager') 
    5856    .loadScript('mootools-filemanager/Source/Uploader/Swiff.Uploader.js', 'MootoolsFileManager') 
    59     .loadScript('mootools-filemanager/Source/Uploader.js', 'MootoolsFileManager'); 
     57    .loadScript('mootools-filemanager/Source/FileManager.js', 'MootoolsFileManager') 
     58    .loadScript('mootools-filemanager/Source/Uploader.js', 'MootoolsFileManager') 
     59    .loadScript('mootools-filemanager/Language/Language.en.js', 'MootoolsFileManager'); 
    6060} 
    6161MootoolsFileManager.AssetLoader.loadStyle('MootoolsFileManager.css', 'MootoolsFileManager'); 
     
    6363 
    6464function MootoolsFileManager(editor) 
    65 { 
     65{   
    6666  this.editor = editor; 
    6767  var self = this; 
     
    6969     
    7070  // 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     });   
     71  // javascript object.   
     72   
     73  // IMPORTANT: we need to do this synchronously to ensure that the buttons are added to the toolbar 
     74  //  before the toolbar is drawn. 
     75   
     76  var phpcfg = Xinha._posturlcontent(editor.config.MootoolsFileManager.backend+'__function=read-config', editor.config.MootoolsFileManager.backend_data); 
     77 
     78  eval ('var f = '+phpcfg+';');  
     79  self.phpcfg = f;  
     80  self.hookUpButtons();  
    7881     
    7982  return;   
     
    116119     
    117120    // Override our Editors insert image button action.   
    118     self.editor._insertImage = function() 
    119     { 
    120       MootoolsFileManager.AssetLoader.whenReady(function() { self.OpenImageManager(); }); 
     121    self.editor._insertImage = function(image) 
     122    { 
     123      MootoolsFileManager.AssetLoader.whenReady(function() { self.OpenImageManager(image); }); 
    121124    }               
    122125  }  
  • trunk/plugins/MootoolsFileManager/backend.php

    r1245 r1297  
    3131 
    3232// Strip slashes if MQGPC is on 
    33 set_magic_quotes_runtime(0); 
    34 if(get_magic_quotes_gpc()) 
     33if(function_exists('set_magic_quotes_runtime')) @set_magic_quotes_runtime(0); 
     34if(function_exists('get_magic_quotes_gpc') && @get_magic_quotes_gpc()) 
    3535{ 
    3636  $to_clean = array(&$_GET, &$_POST, &$_REQUEST, &$_COOKIE); 
     
    5757  if(preg_match('/([0-9\.])+([a-zA-Z]+)/', $s, $M)) 
    5858  { 
    59     switch(strtolower($M)) 
     59    switch(strtolower($M[2])) 
    6060    {       
    6161      case 'm': 
  • trunk/plugins/MootoolsFileManager/config.php

    r1245 r1297  
    137137$IMConfig['base_url'] = preg_replace('/\/backend\.php.*/', '', $_SERVER['REQUEST_URI']); 
    138138 
     139/** 
     140 
     141== HTML Compatability == 
     142 
     143 For most people the default of using CSS will be fine, but if the HTML you are editing 
     144 in Xinha is destined for an email you will probably want to use hspace and vspace 
     145 instead of CSS margins because of poor Email support for CSS. 
     146  
     147*/ 
     148 
     149$IMConfig['UseHSpaceVSpace'] = TRUE; 
    139150 
    140151 /** 
  • trunk/plugins/MootoolsFileManager/mootools-filemanager/Backend/Upload.php

    r1269 r1297  
    9393                        'extension' => strtolower(pathinfo($file, PATHINFO_EXTENSION)), 
    9494                ), $options); 
    95                  
     95                $options['extension'] = strtolower($options['extension']); 
    9696                $mime = null; 
    9797                $ini = error_reporting(0); 
  • trunk/plugins/MootoolsFileManager/mootools-filemanager/Source/FileManager.js

    r1245 r1297  
    310310        }, 
    311311 
    312         load: function(dir, nofade){ 
     312        /* XINHA: We add a callback capability which will be called whe the loading is completed.  
     313    *  NOTE: For some reason, MFM wants the dir to include the last component of the prefix 
     314    *  eg if your images_dir is /fancy/images and you want to load /fancy/images/foo/bar you must pass 
     315    *   images/foo/bar -- crazy annoying 
     316    */ 
     317 
     318        load: function(dir, nofade, callback){ 
    313319                this.deselect(); 
    314320                if (!nofade) this.info.fade(0); 
     
    320326                        onSuccess: (function(j){ 
    321327                                this.fill(j, nofade); 
     328        if(callback) callback(j); 
    322329                        }).bind(this), 
    323330                        data: { 
     
    444451                        icons = $$(icons.map(function(icon){ return icon.appearOn(icon, [1, 0.7]); })).appearOn(el.getParent('li'), 0.7); 
    445452                }, this); 
    446  
     453       this.CurrentFiles = j.files;  // XINHA - fillInfo() will use this to find a pre-selected file 
     454     
    447455                var self = this, revert = function(el){ 
    448456                        el.set('opacity', 1).store('block', true).removeClass('drag').removeClass('move').setStyles({ 
     
    454462                                top: 0 
    455463                        }).inject(el.retrieve('parent')); 
    456                         el.getElements('img.browser-icon').set('opacity', 0); 
     464                //      el.getElements('img.browser-icon').set('opacity', 0); // XINHA - NOT REQUIRED? 
    457465                         
    458466                        document.removeEvents('keydown', self.bound.keydown).removeEvents('keyup', self.bound.keydown); 
     
    552560                if (!file) file = this.CurrentDir; 
    553561                if (!path) path = this.Directory; 
    554  
     562   
    555563                if (!file) return; 
     564        
     565       /* XINHA: In order to facilitate pre-selecting an image/file for modification, we can pass in a filename (just the basename) 
     566           as file and we will search in the current files for it.  You must have done a load first, and call the fillInfo as a result of the load. 
     567           YourImageManager.load('path/to/dir', true, function() { YourImageManager.fillInfo('file.jpg'); }); 
     568        */ 
     569       var self = this; 
     570        if(typeof file == 'string') 
     571    { 
     572        if(this.CurrentFiles) 
     573        { 
     574          this.CurrentFiles.each(function(f) 
     575          { 
     576            if(typeof file != 'string') return; 
     577            if(f.name == file)  
     578            { 
     579                file = f; 
     580                if(file.element)  
     581                { 
     582                  self.Current = file.element.addClass('selected'); 
     583                  self.switchButton(); 
     584                } 
     585                
     586            } 
     587          }); 
     588        } 
     589    } 
     590     
    556591                var size = this.size(file.size); 
    557592 
Note: See TracChangeset for help on using the changeset viewer.