Changeset 447

Timestamp:

01/13/06 13:53:36 (7 years ago)

Author:

gogo

Message:

Enhancements to allow using the manager in a List/Details mode rather than "thumbs". Set $IMConfigViewMode? = 'details'; in the
configuration to try it out. Defaults to thumbs to avoid surprising people :-)

ticket:649

Location:

trunk/plugins/ImageManager

Files:

• Classes/GD.php (modified) (2 diffs)
• Classes/IM.php (modified) (1 diff)
• Classes/NetPBM.php (modified) (1 diff)
• assets/imagelist.css (modified) (1 diff)
• assets/images.js (modified) (1 diff)
• assets/manager.js (modified) (4 diffs)
• config.inc.php (modified) (1 diff)
• images.php (modified) (4 diffs)
• manager.php (modified) (1 diff)

trunk/plugins/ImageManager/Classes/GD.php

@@ -333 +333 @@
     * better result.
     *
-    * @param $new_x int  new width
-    * @param $new_y int  new height
+    * @param int  $new_x new width
+    * @param int  $new_y new height
     *
     * @return true on success or pear error
@@ -438 +438 @@
      * Save the image file
      *
-     * @param $filename string  the name of the file to write to
-     * @param $quality  int     output DPI, default is 85
-     * @param $types    string  define the output format, default
+     * @param string  $filename the name of the file to write to
+     * @param int     $quality  output DPI, default is 85
+     * @param string  $types    define the output format, default
      *                          is the current used format
      *

trunk/plugins/ImageManager/Classes/IM.php

@@ -183 +183 @@
      * Save the image file
      *
-     * @param $filename string  the name of the file to write to
-     * @param $quality  quality image dpi, default=75
-     * @param $type     string  (JPG,PNG...)
+     * @param string  $filename the name of the file to write to
+     * @param quality $quality  image dpi, default=75
+     * @param string  $type     (JPG,PNG...)
      *
      * @return none

trunk/plugins/ImageManager/Classes/NetPBM.php

@@ -206 +206 @@
      * Save the image file
      *
-     * @param $filename string the name of the file to write to
+     * @param string $filename the name of the file to write to
      * @param string $type (jpeg,png...);
      * @param int $quality 75

trunk/plugins/ImageManager/assets/imagelist.css

@@ -41 +41 @@
   border:none;
 }
+.listview { width:100% }
+.listview td, .listview th { text-align:left; font-size:small; }
+.listview td.actions { text-align:right; }
+.listview td.actions img { border:0px; }

trunk/plugins/ImageManager/assets/images.js

@@ -56 +56 @@
                 var obj = topDoc.getElementById('orginal_width'); obj.value = width;
                 var obj = topDoc.getElementById('orginal_height'); obj.value = height;          
+    // Set preview for the selected
+    topDoc.getElementById('f_preview').src = window.parent._backend_url + '__function=thumbs&img=' + filename;
+    
     update_selected();
         }

trunk/plugins/ImageManager/assets/manager.js

@@ -56 +56 @@
                 if (param) 
                 {
-      var image_src = param.f_url;
       var image_regex = new RegExp( '(https?://[^/]*)?' + base_url.replace(/\/$/, '') );
       param.f_url = param.f_url.replace( image_regex, "" );
 
+      // The image URL may reference one of the automatically resized images 
+      // (when the user alters the dimensions in the picker), clean that up
+      // so it looks right and we get back to a normal f_url
+      var rd = _resized_dir.replace(HTMLArea.RE_Specials, '\\$1');
+      var rp = _resized_prefix.replace(HTMLArea.RE_Specials, '\\$1');
+      var dreg = new RegExp('^(.*/)' + rd + '/' + rp + '_([0-9]+)x([0-9]+)_([^/]+)$');
+  
+      if(dreg.test(param.f_url))
+      {
+        param.f_url    = RegExp.$1 + RegExp.$4;
+        param.f_width  = RegExp.$2;
+        param.f_height = RegExp.$3;
+      }
+      
       for (var id in param)
       {
@@ -76 +89 @@
 
       // Locate to the correct directory
-      var rd = _resized_dir.replace(HTMLArea.RE_Specials, '\\$1');
-      var rp = _resized_prefix.replace(HTMLArea.RE_Specials, '\\$1');
-      var dreg = new RegExp('^(.*/)(?:'+rd+')?(?:'+rp+'_[0-9]+x[0-9]+_)?([^/]+)$');
-
+      var dreg = new RegExp('^(.*/)([^/]+)$');
       if(dreg.test(param['f_url']))
       {
@@ -93 +103 @@
         }
       }
+      document.getElementById('f_preview').src = _backend_url + '__function=thumbs&img=' + param.f_url;      
                 }
 
@@ -98 +109 @@
 
     // For some reason dialog is not shrinkwrapping correctly in IE so we have to explicitly size it for now.
-    if(HTMLArea.is_ie) window.resizeTo(600, 460);
+    // if(HTMLArea.is_ie) window.resizeTo(600, 460);
         };
 

trunk/plugins/ImageManager/config.inc.php

@@ -271 +271 @@
 
 
+$IMConfig['ViewMode'] = 'thumbs';
 
 

trunk/plugins/ImageManager/images.php

@@ -57 +57 @@
         global $IMConfig;
 
+    switch($IMConfig['ViewMode'])
+    {
+      case 'details':
+      {
+        ?>
+        <script language="Javascript">
+          <!--
+            function showPreview(f_url)
+            {
+              
+              window.parent.document.getElementById('f_preview').src = 
+                window.parent._backend_url + '__function=thumbs&img=' + f_url;
+            }
+          //-->
+        </script>
+        <table class="listview">
+        <thead>
+        <tr><th>Name</th><th>Filesize</th><th>Dimensions</th></tr></thead>
+        <tbody>
+          <?php
+          foreach($list as $entry => $file)
+          {
+            ?>
+            <tr>
+              <th><a href="#" class="thumb" style="cursor: pointer;" onclick="selectImage('<?php echo $file['relative'];?>', '<?php echo $entry; ?>', <?php echo $file['image'][0];?>, <?php echo $file['image'][1]; ?>);return false;" title="<?php echo $entry; ?> - <?php echo Files::formatSize($file['stat']['size']); ?>" onmouseover="showPreview('<?php echo $file['relative'];?>')" onmouseout="showPreview(window.parent.document.getElementById('f_url').value)" ><?php echo $entry ?></a></th>
+              <td><?php echo Files::formatSize($file['stat']['size']); ?></td>
+              <td><?php if($file['image']){ echo $file['image'][0].'x'.$file['image'][1]; } ?>
+              <td class="actions">
+                <a href="<?php print $IMConfig['backend_url']; ?>__function=images&dir=<?php echo $relative; ?>&amp;delf=<?php echo rawurlencode($file['relative']);?>" title="Trash" onclick="return confirmDeleteFile('<?php echo $entry; ?>');"><img src="<?php print $IMConfig['base_url'];?>img/edit_trash.gif" height="15" width="15" alt="Trash" border="0"  /></a>
+        
+                <a href="javascript:;" title="Edit" onclick="editImage('<?php echo rawurlencode($file['relative']);?>');"><img src="<?php print $IMConfig['base_url'];?>img/edit_pencil.gif" height="15" width="15" alt="Edit" border="0" /></a>
+              </td>
+            </tr>
+            <?php        
+          }
+          ?>
+        </tbody>
+        </table>
+        <?php
+      }      
+      break;
+      
+      case 'thumbs':
+      default      :
+      {
         foreach($list as $entry => $file)
         {
@@ -73 +118 @@
     </div>
           <?php
-        }//foreach
+        }
+      }
+    }   
 }//function drawFiles
 
@@ -85 +132 @@
    global $IMConfig;
 
+  switch($IMConfig['ViewMode'])
+  {
+    case 'details':
+    {
+        
+    }
+    break; 
+    
+    case 'thumbs':
+    default      :
+    {
         foreach($list as $path => $dir) 
         { ?>
@@ -97 +155 @@
           <?php 
         } //foreach
+    }
+  }
+  
+        
 }//function drawDirs
 

trunk/plugins/ImageManager/manager.php

@@ -106 +106 @@
 <!-- image properties -->
 
-<table  border="0" cellspacing="0" cellpadding="0">
+<table  border="0" cellspacing="0" cellpadding="0" width="100%">
   <tr>
     <th align="left">Description:</th>
     <td colspan="6">
-      <input type="text" id="f_alt" style="width:100%"/>
+      <input type="text" id="f_alt" style="width:95%"/>
+    </td>
+    <td rowspan="4" width="100" height="100" valign="middle" style="padding:4px;background-color:#CCC;border:1px inset;">
+      <img src="" id="f_preview" />
     </td>
   </tr>