Ferrari: Improve Image Download Speeds, Part 1

[Harmonickey]

(BRANCH): ferrari/images/62

(DESCRIPTION):I'd like a Fullsize Image slideshow and for the Thumbnails to load quickly.

What you Need to Get Started:

1. Install RMagick (go through Bluehost to do it)
2. Include the following code to the require list at the top of create_listing.rb and update_listing.rb
   require 'rmagick'
3. There is a complicated loop inside of both of those files that check for updates to the pictures array, and decides accordingly what to do about new files, missing files, or no files. You need to integrate with this loop to create/delete your thumbnails with rmagick.
4. You don't need a thumbnail parameter in the functions themselves, but you do need to insert them into the queryObj. Please insert them the same way as the Pictures array.

(ACCEPTANCE CRITERIA):

1. When images save, they are saved as Interlaced.
2. Create a second Thumbnail-sized image(200x300) that is also interlaced.
3. Save images in a Special Directory Tree: server/imagesaveddir/ListingID/ImageNumber/Thumbnail.jpg or Full.jpg

(PARENT TICKET): none

(DEPENDENT TICKETS):none

[Saurutobi]

so 'forced height/width' is not a thumbnail. You're just telling a 4000x3000 image to shrink but you're still required to download the entire thing. We need to convert the image on the serverside into a thumbnail version that is only 300x200

[Harmonickey]

ah gotcha, that makes sense. Can you see if you can figure this ticket out? You are pretty knowledgeable about this sort of thing.

The endpoints you want to worry about are dropzone.js on dev.lbkstudios.net/Libraries/Javascript and upload_file.php on images.lbkstudios.net/enhabit

[Saurutobi]

also that 'bitmapping' just means Interlacing the image.
http://php.net/manual/en/function.imageinterlace.php

[Harmonickey]

It still might be helpful though to do that, what do you think?

[Saurutobi]

sure, I'll dig into it tonight

[Saurutobi]

the key here is to map images properly. I'm thinking: don't give the user the ability to edit imagename on the frontend, and force it to be something we like on the backend("[ListingID]x[imagenumber]"). Then create a folder with that name. Within the folder there will be 2 images saved: Full.jpg and Thumbnail.jpg. For all intents and purposes, the only one we'll use(except for the big slideshow), is [server][imagesavedir][ImageName]\Thumbnail.jpg.

[Harmonickey]

I HIGHLY recommend you use the Dropzone.js already built in functions to create Thumbnails. They have a .createThumbnailFromUrl() function. Look up some documentation and then just add it to the existing code within the create_listing/update_listing sections.

[Harmonickey]

I also HIGHLY recommend looking into this method to sort of do it in the backend and then you don't have to learn the dropzone.js stuff. http://davidwalsh.name/create-image-thumbnail-php

Then I can just provide the create_listing and update_listing with the thumbnails in Part 2. I will then be able to grab only the Thumbnail array object from ruby to list on the frontpage and listings view.

[Harmonickey]

I am thinking about the process of how all of the uploads and stuff flows, these methods won't work, and they won't be easy to implement due to some technicalities. What will likely work best is to create the thumbnails on the fly with Ruby. http://ruby.bastardsbook.com/chapters/image-manipulation/ RMagik should be good. This way, if the write to the database fails, I can still delete the files that were uploaded, including the thumbnails. If we were to do it through dropzone or php, then we would never know which files to delete if the write to the database failed.

[Saurutobi]

I was actually thinking of doing it in PHP if that was there. I thought
there was a php file and there's a thing in php that let's you save an
image as interlaced, and also save it with different sizes and such. That
was my plan

On Tue, Aug 18, 2015 at 11:06 AM, Alex Ayerdi notifications@github.com
wrote:

I am thinking about the process of how all of the uploads and stuff flows,
these methods won't work, and they won't be easy to implement due to some
technicalities. What will likely work best is to create the thumbnails on
the fly with Ruby.
http://ruby.bastardsbook.com/chapters/image-manipulation/ RMagik should
be good. This way, if the write to the database fails, I can still delete
the files that were uploaded, including the thumbnails. If we were to do it
through dropzone or php, then we would never know which files to delete if
the write to the database failed.

—
Reply to this email directly or view it on GitHub
#62 (comment).

[Harmonickey]

Well sure, but what happens if the write to the database fails? Then the files that just got uploaded are hanging on the filesystem without being attached to a listing. This is why I want it in Ruby.

[Saurutobi]

good thinking. I will attempt to do it with Ruby

On Tue, Aug 18, 2015 at 2:26 PM, Alex Ayerdi notifications@github.com
wrote:

We sure, but what happens if the write to the database fails? Then the
files that just got uploaded are hanging on the filesystem without being
attached to a listing. This is why I want it in Ruby.

—
Reply to this email directly or view it on GitHub
#62 (comment).

[Harmonickey]

I have left comments in OP on what you need to get started.