Skip to content

Commit

Permalink
ade the thumbnails bigger, and prevent caching of them
Browse files Browse the repository at this point in the history 
Signed-off-by: Fabian Vogelsteller <feindura@frozeman.de>
  • Loading branch information
@frozeman
frozeman committed Dec 26, 2010
1 parent 157ff22 commit ea5a36f
Show file tree
Hide file tree
Showing 6 changed files with 39 additions and 18 deletions.
Binary file modified Assets/loader.gif
View file
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
10 changes: 6 additions & 4 deletions Backend/FileManager.php
View file
Expand Up @@ -150,9 +150,11 @@ protected function onDetail(){
$mime = $this->getMimeType($file);
$content = null;
// image
if (FileManagerUtility::startsWith($mime, 'image/')){
if (FileManagerUtility::startsWith($mime, 'image/')) {
// generates a random number to put on the end of the image, to prevent caching
$randomImage = '?'.md5(uniqid(rand(),1));
$size = getimagesize($file);
$content = '<a href="'.$url.'" rel="preview"><img src="' . $this->options['thumbnailPath'] . $this->getThumb($this->normalize($file)) . '" class="preview" alt="preview" /></a>
$content = '<a href="'.$url.'" rel="preview"><img src="' . $this->options['thumbnailPath'] . $this->getThumb($this->normalize($file)).$randomImage.'" class="preview" alt="preview" /></a>
<h2>${more}</h2>
<dl>
<dt>${width}</dt><dd>' . $size[0] . 'px</dd>
Expand Down Expand Up @@ -361,8 +363,8 @@ protected function generateThumb($file,$thumbPath)
{
$img = new Image($file);
$size = $img->getSize();
if ($size['width'] > 70) $img->resize(70)->process('jpeg',$thumbPath);
elseif ($size['height'] > 48) $img->resize(null, 48)->process('jpeg',$thumbPath);
if ($size['width'] > 250) $img->resize(250)->process('jpeg',$thumbPath);
elseif ($size['height'] > 250) $img->resize(null, 250)->process('jpeg',$thumbPath);
else $img->process('jpeg',$thumbPath);
unset($img);
return basename($thumbPath);
Expand Down
7 changes: 6 additions & 1 deletion Backend/Image.php
View file
Expand Up @@ -253,9 +253,14 @@ public function process($ext = null, $file = null){
if(!empty($this->image)) {
if(!$ext) $ext = $this->meta['ext'];

if($ext=='jpg') $ext = 'jpeg';

if($ext=='png') imagesavealpha($this->image, true);
$fn = 'image'.$ext;
$fn($this->image, $file);
if($ext = 'jpeg')
$fn($this->image, $file,100);
else
$fn($this->image, $file);

// If there is a new filename change the internal name too
if($file) $this->file = $file;
Expand Down
25 changes: 16 additions & 9 deletions Css/FileManager.css
View file
Expand Up @@ -136,14 +136,23 @@ div.filemanager-menu label {
font-size: 11px;
}

div.filemanager-menu div.loader {
float: left;
div.loader {
width: 16px;
height: 16px;
margin: 8px 0;
margin-left: 5px;
background: url(../Assets/loader.gif) no-repeat;
}
div.filemanager-header div.loader {
position: absolute;
top: 7px;
right: 30px;
}

div.filemanager-preview div.loader {
position: relative;
left: 50%;
right: auto;
margin-left: -8px;
}

/* filemanager-browserscroll */

Expand All @@ -155,10 +164,10 @@ div.filemanager div.filemanager-browserscroll {
}


div.filemanager div.filemanager-browserscroll li.list{
div.filemanager div.filemanager-browserscroll li.list {
height: 21px;
}
div.filemanager div.filemanager-browserscroll li.thumb{
div.filemanager div.filemanager-browserscroll li.thumb {
height: 54px;
}

Expand Down Expand Up @@ -297,7 +306,6 @@ div.filemanager-container span.thumb img {
display: inline-block;
float: left;
margin: 0 5px 0 0;

}

div.filemanager-container span.file img {
Expand Down Expand Up @@ -469,13 +477,12 @@ div.filemanager-preview {
div.filemanager-preview img.preview {
margin: 0 auto 1em;
display: block;
max-height: 100px;
background: transparent;
border: 2px solid #fff;
}

div.filemanager-preview img.preview:hover {
border: 2px solid #000;
border: 2px solid #666;
}

div.filemanager-engine-trident4 div.filemanager-preview img.preview {
Expand Down
13 changes: 10 additions & 3 deletions Source/FileManager.js
View file
Expand Up @@ -94,7 +94,8 @@ var FileManager = new Class({
this.filemanager = new Element('div', {'class': 'filemanager'}).inject(this.container);
this.header = new Element('div', {'class': 'filemanager-header'}).inject(this.filemanager);
this.menu = new Element('div', {'class': 'filemanager-menu'}).inject(this.filemanager);
this.loader = new Element('div', {'class': 'loader', opacity: 0, tween: {duration: 200}}).inject(this.menu);
this.loader = new Element('div', {'class': 'loader', opacity: 0, tween: {duration: 200}}).inject(this.header);
this.previewLoader = new Element('div', {'class': 'loader', opacity: 1, tween: {duration: 200}});

// switch the path, from clickable to input text
this.clickablePath = new Element('span', {'class': 'filemanager-dir'});
Expand Down Expand Up @@ -141,7 +142,7 @@ var FileManager = new Class({

this.browsercontainer = new Element('div',{'class': 'filemanager-browsercontainer'}).inject(this.filemanager);
this.browserheader = new Element('div',{'class': 'filemanager-browserheader'}).inject(this.browsercontainer);
this.scroll = new Element('div', {'class': 'filemanager-browserscroll'}).inject(this.browsercontainer)
this.scroll = new Element('div', {'class': 'filemanager-browserscroll'}).inject(this.browsercontainer);
this.browserheader.adopt([
new Element('a',{
'id':'togggle_side_boxes',
Expand Down Expand Up @@ -494,7 +495,10 @@ var FileManager = new Class({
file.dir = j.path;
var extraClasses = '';
var largeDir = '';
var icon = new Asset.image(file.thumbnail);
// generate unique id
var newDate = new Date;
uniqueId = newDate.getTime();
var icon = (this.listType == 'thumb') ? new Asset.image(file.thumbnail+'?'+uniqueId,{'style':'width:48px;'}) : new Asset.image(file.thumbnail);

var el = file.element = new Element('span', {'class': 'fi ' + this.listType + ' ' + extraClasses, href: '#'}).adopt(
icon,
Expand Down Expand Up @@ -651,6 +655,9 @@ var FileManager = new Class({

this.Request = new FileManager.Request({
url: this.options.url + '?event=detail',
onRequest: (function(){
this.preview.adopt(this.previewLoader);
}).bind(this),
onSuccess: (function(j) {
var prev = this.preview.removeClass('filemanager-loading').set('html', j && j.content ? j.content.substitute(this.language, /\\?\$\{([^{}]+)\}/g) : '').getElement('img.preview');
if (prev) prev.addEvent('load', function(){
Expand Down
2 changes: 1 addition & 1 deletion Source/Uploader.js
View file
Expand Up @@ -32,7 +32,7 @@ FileManager.implement({

hooks: {
show: {
upload: function(){
upload: function() {
this.startUpload();
}
},
Expand Down

0 comments on commit ea5a36f

Please sign in to comment.