HackerOne users: Testing against this community violates our program's Terms of Service and will result in your bounty being denied.
Options

A possible FileUpload 2?

2»

Comments

  • Options
    vrijvlindervrijvlinder Papillon-Sauvage MVP

    The only other option I can think of is a plugin for fileupload that would convert all files into medium or high quality jpg

  • Options
    vrijvlindervrijvlinder Papillon-Sauvage MVP

    Maybe you can lower the image quality using this config.php to lessen the weight of images as they go into the DB.

    $Configuration['Garden']['UploadImage']['Quality']=65;

  • Options
    phreakphreak Vanilla*APP (White Label) & Vanilla*Skins Shop MVP
    edited January 2014

    Hi @vrijvlinder: Do you mean DB as Database? They images are not stored in the Database. confused

    • VanillaAPP | iOS & Android App for Vanilla - White label app for Vanilla Forums OS
    • VanillaSkins | Plugins, Themes, Graphics and Custom Development for Vanilla
  • Options
    vrijvlindervrijvlinder Papillon-Sauvage MVP
    edited January 2014

    Your images no matter where they are uploaded. I meant that this would reduce their weight upon being saved.

    So let's say someone uploads a 3megabyte image , this will drop the weight to 65%. They are not being limited so they can upload a big file, this makes it smaller upon upload.

    One way to test this, upload a large image then after posting download the image and see if the size is the same as the original before upload.

  • Options

    I have come accros this http://stackoverflow.com/questions/12757005/php-resize-image-on-or-before-upload, if implemented with FileUpload, that should solve the issue for a set of users, a config option to setup the height and width would be good.

  • Options
    vrijvlindervrijvlinder Papillon-Sauvage MVP

    What he wants is to make the images weigh less. You can have a 500px by 500px image weigh 5mega . It is about image quality . Just like when you save a pic in photoshop, you can choose the quality and that in turn affects the weight of the image file.

    $Configuration['Garden']['UploadImage']['Quality']=65;

    The code from that link only resizes the images and that is already possible in FileUpload. And there are plugins to further control the sizes.

    what he need is to make the images weigh less so they load faster.

    You can have a large image that does not weigh much.

    You can also set the max image size for upload in bytes. But he does not want to limit people and force them to upload a smaller file.

    he wants the image to be saved not to weigh too much.

  • Options
    hgtonighthgtonight ∞ · New Moderator

    @vrijvlinder When talking about photographs, resolution (width and height) are far more important than the quality of the jpeg. You can also save a lot of space by pushing the quality down.

    At least that is my understanding.

    Search first

    Check out the Documentation! We are always looking for new content and pull requests.

    Click on insightful, awesome, and funny reactions to thank community volunteers for their valuable posts.

  • Options
    vrijvlindervrijvlinder Papillon-Sauvage MVP
    edited January 2014

    @hgtonight said:
    vrijvlinder When talking about photographs, resolution (width and height) are far more important than the quality of the jpeg. You can also save a lot of space by pushing the quality down.

    At least that is my understanding.

    resolution applies to pixels per square centimeter/inch . You can have an image 1000px by 1000px (dimentions) and have a resolution that has 75px of resolution or you can have 350px resolution. That means that you can pack more pixels in a square inch or less by making the pixels smaller and finer. The amount of resolution pixels is what gives you the weight.

    http://en.wikipedia.org/wiki/Image_resolution

  • Options

    why not just put a imagelimiter in the fileupload

    convert image using height and quality conversion parameters (I'm not talking about thumnbnails.)

    that is set by config

    so the original image is stored as usual in the uploads/FileUpload

    however the one tweak is (similar to thumbnails but effected on the original).

    convert image
    test conversion
    remove original

    analogous to the way the zip was created here.

    http://vanillaforums.org/discussion/comment/200116/#Comment_200116

    except you test for image - convert to thumbnail, convert it to spec, and delete the original

    I may not provide the completed solution you might desire, but I do try to provide honest suggestions to help you solve your issue.

  • Options
    vrijvlindervrijvlinder Papillon-Sauvage MVP
    edited January 2014

    In my Galleries plugin I do that with the images. this what I have, but this is different than affecting the resolution. These work the same as with file upload. You can change the size and the weight in bytes but to affect the resolution you need to affect the quality .
    I would have to add

    $quality=C('Garden.UploadImage.Quality','65'); or something like it

    function uploadNresizeGallery($file, $dir){
        global $PATH2IM;
        $Lwidth =1000;
        $Lheight =1000;
        $maxSize = 6656000; // KBs in size
        $mode = 0666;
        $countinue = true;
        if(!is_dir($dir)){
            return 'Cannot save because the folder wasnt found.';
        }
    
        if($countinue == true){
            if($file['image']['error']){ $errors[] = "Sorry nothing was uploaded..or"; echo '<h21>Sorry nothing was uploaded</h21>'; }
            if($file['image']['size'] > $maxSize) $errors[] = "The image size you uploaded was too big .... or";
            if($file['image']['type'] != "image/jpeg" && $file['image']['type'] != "image/pjpeg" && $file['image']['type'] != "image/gif" && $file['image']['type'] != "image/png" && $file['image']['type'] != 'image/x-png') $errors[] = "Invalid Image format, supported image types are .jpg (.jpeg), .gif, and .png. -- ".$file['image']['type'];
            if(empty($errors)){
                $nr = 0;
                switch($file['image']['type']){
                    case "image/jpeg": $ext = '.jpg'; break;
                    case "image/jpg": $ext = '.jpg'; break;
                    case "image/pjpeg": $ext = '.jpg'; break;
                    case "image/gif": $ext = '.gif'; break;
                    case "image/png": $ext = '.png'; break;
                    case "image/x-png": $ext = '.png'; break;
                }
                for(;;){
                    $nr++;
                    if(!file_exists($dir.'image'.$nr.$ext))
                    break; 
                }
                $SfilePath = $dir."/th/".$nr.$ext;
                $filePath = $dir."/image".$nr.$ext;
    
                $file = $_FILES['image']['tmp_name'];
                move_uploaded_file($file, $filePath);
                chmod ($filePath, octdec(666));
                $blah = getimagesize($filePath);
                if($blah[0] > $Lwidth || $blah[1] > $Lheight){
                    $cmp = $PATH2IM."convert ".$filePath." -resize ".$Lwidth."x".$Lheight." ".$filePath;
                    $resized = system($cmp);
                    $cmp2 = $PATH2IM."convert ".$filePath." -resize 200x200 ".$SfilePath;
                    $resized = system($cmp2);
                } else {
                    $copy1 = copy($filePath, $SfilePath); // /usr/local/bin/
                    if($blah[0] > 150 || $blah[1] > 150) $resized = system($PATH2IM."convert ".$SfilePath." -resize 200x200 ".$SfilePath);
                }
                $files['small'] = $SfilePath;
                $files['large'] = $filePath;
                return $files;
            } else { $errors[] = "Image error"; }
        } else { $errors[] = "something happened to the directories permission"; }
        return $errors;
    }
    
  • Options
    hgtonighthgtonight ∞ · New Moderator

    @vrijvlinder Sorry for being confusing. Resolution has many meanings, but I was referring to the image's pixel dimensions (width and height in pixels) not the image's dimensions (width and height of display in pixels). When read in this light, my statement still stands.

    Fewer pixels in the image will reduce file size more than reducing quality. That is, taking a 1000px x 1000px and resizing it to 500px x 500px which will halve the resolution will save more than keeping it at 1000px x 1000px and reducing the quality.

    Search first

    Check out the Documentation! We are always looking for new content and pull requests.

    Click on insightful, awesome, and funny reactions to thank community volunteers for their valuable posts.

  • Options
    vrijvlindervrijvlinder Papillon-Sauvage MVP

    Yes I understand, an image that is 1000px dimensionally regardless of resolution will weigh less if made of smaller dimensions . That is logical and true.

    But you can also make it weigh less by reducing the quality. You can do this without substantially affecting the image.

    You can test this by saving images in photoshop. Make a png that weighs 2megabyte, then save it as a jpeg and choose the quality which affects the original the least.

    You can reduce the weight of an image by simply converting it to a lesser quality jpg.

    What is needed is to save the file as a jpg. To convert all uploading images to jpg of a certain quality.

  • Options
    vrijvlindervrijvlinder Papillon-Sauvage MVP
    edited January 2014

    @hgtonight this is what I mean about converting all uploads to jpg and setting the quality. This could cut your storage in half. And also discourages people from stealing the HD version of images.

    you would call this function instead of move_uploaded_file , I am still uncertain but this sounds like the approach no?

    function convertImage($originalImage, $outputImage, $quality)
    {
        // jpg, png, gif or bmp?
        $exploded = explode('.',$originalImage);
        $ext = $exploded[count($exploded) - 1]; 
    
        if (preg_match('/jpg|jpeg/i',$ext))
            $imageTmp=imagecreatefromjpeg($originalImage);
        else if (preg_match('/png/i',$ext))
            $imageTmp=imagecreatefrompng($originalImage);
        else if (preg_match('/gif/i',$ext))
            $imageTmp=imagecreatefromgif($originalImage);
        else if (preg_match('/bmp/i',$ext))
            $imageTmp=imagecreatefrombmp($originalImage);
        else
            return 0;
    
        // quality is a value from 0 (worst) to 100 (best)
        imagejpeg($imageTmp, $outputImage, $quality);
        imagedestroy($imageTmp);
    
        return 1;
    }
    

    Also this could prove handy

    http://php.net/manual/en/imagick.setimageformat.php

  • Options
    phreakphreak Vanilla*APP (White Label) & Vanilla*Skins Shop MVP
    edited January 2014

    Hey great what you put up here.

    As you said a smart process should one that allows resizing of the image and re-compression. It's important to know that JPG is an already compressed file, when users use their smartphone to upload pictures. From there it might be smart to have some settings as different communities have different needs.

    For example the concept art forum relies on huge pictures as other painters there pick it up and overpaint them digitally. Other communities can work out pretty good with a 500x500 resolution. Important though is, that only resizing is made proprotional. So on orientation to the longer side for example.

    Something like this?

    `
    var $image;
    var $image_type;

       function load($filename) {
          $image_info = getimagesize($filename);
          $this->image_type = $image_info[2];
          if( $this->image_type == IMAGETYPE_JPEG ) {
             $this->image = imagecreatefromjpeg($filename);
          } elseif( $this->image_type == IMAGETYPE_GIF ) {
             $this->image = imagecreatefromgif($filename);
          } elseif( $this->image_type == IMAGETYPE_PNG ) {
             $this->image = imagecreatefrompng($filename);
          }
       }
       function save($filename, $image_type=IMAGETYPE_JPEG, $compression=75, $permissions=null) {
          if( $image_type == IMAGETYPE_JPEG ) {
             imagejpeg($this->image,$filename,$compression);
          } elseif( $image_type == IMAGETYPE_GIF ) {
             imagegif($this->image,$filename);
          } elseif( $image_type == IMAGETYPE_PNG ) {
             imagepng($this->image,$filename);
          }
          if( $permissions != null) {
             chmod($filename,$permissions);
          }
       }
       function output($image_type=IMAGETYPE_JPEG) {
          if( $image_type == IMAGETYPE_JPEG ) {
             imagejpeg($this->image);
          } elseif( $image_type == IMAGETYPE_GIF ) {
             imagegif($this->image);
          } elseif( $image_type == IMAGETYPE_PNG ) {
             imagepng($this->image);
          }
       }
       function getWidth() {
          return imagesx($this->image);
       }
       function getHeight() {
          return imagesy($this->image);
       }
       function resizeToHeight($height) {
          $ratio = $height / $this->getHeight();
          $width = $this->getWidth() * $ratio;
          $this->resize($width,$height);
       }
       function resizeToWidth($width) {
          $ratio = $width / $this->getWidth();
          $height = $this->getheight() * $ratio;
          $this->resize($width,$height);
       }
       function scale($scale) {
          $width = $this->getWidth() * $scale/100;
          $height = $this->getheight() * $scale/100;
          $this->resize($width,$height);
       }
       function resize($width,$height) {
          $new_image = imagecreatetruecolor($width, $height);
          imagecopyresampled($new_image, $this->image, 0, 0, 0, 0, $width, $height, $this->getWidth(), $this->getHeight());
          $this->image = $new_image;
       }
    

    `

    Also a save and path routine would be needed afterwards.

    Code taken of a script i use.

    • VanillaAPP | iOS & Android App for Vanilla - White label app for Vanilla Forums OS
    • VanillaSkins | Plugins, Themes, Graphics and Custom Development for Vanilla
Sign In or Register to comment.