Codeigniter image gallery - image

First sorry if its a stupid guestion but im a really big beginner.
I would like to make an image gallyer similar to facebook, but what i dont really understand is te logic.
I made a multi image upload, it saves the image nam and extension to the database with a title .
A folder is created by the title name.
My problem is i dont know how to select them.
What i mean a person uploads 20 images in folder hello, on the page show the hello with one of the thumbnails and when i click it redirects me to the other pictures.
So tihs is the logic what i dont really understand, and i dont want anybody to write this for me, i only would like the opinion or a hint form a more expreienced developer.
Thank you

In your DB, keep track of the cover photo for each album. Since you probably want to allow users to name albums you might as well save that in there, too.
Table::albums
- id
- name
- photo_id //cover photo, or even the link to the image can be saved here directly if you don't like joins
- ...
Table::album_has_photos
- id
- album_id
- name
- url
- ...
To view the album overview: in your album controller extract the album names, cover photo links from table::albums and send those to the view;
In your view set up a link around each of the cover photos to a controller that loads the album contents from table::album_has_photos;
Display photos from one album and add visual effects.
Ooptional: add pagination to the album overview.

The best idea would be to keep the url of the images in the db (full url or relative - doesn't matter) and possibly the gallery id (if you're using more than one gallery). Then, you'd use the Database class to select all the image urls and send that data to the view. In the view, you can use a foreach loop to generate an appropriate tag for each of the selected images. After that, you could possibly add a lightbox plugin of some sort to have a nice popups when you click on thumbnails.

Related

aberezkin/ng2-image-upload how can I prepopulate the image

In angular2 using aberezkin/ng2-image-upload
I have in my template
<image-upload
[max]="1"
[url]="uploadUrl"
[preview]="true"
[buttonCaption]="'Select Images!'"
[dropBoxMessage]="'Drop your images here!'"
(onFileUploadFinish)="imageUploaded($event)"
(onRemove)="imageRemoved($event)"
(isPending)="disableSendButton($event)"
></image-upload>
This is part of a larger form for an e-commerce site's product capture/edit screen including this image upload
It's all great for a new product and a new image but if I have to edit an existing product and thus have the data from the server for that product, including the image, how can I pre-populate image-upload with this image thus allowing a user to keep it or delete it/change it?
Also is there a way to filter file type allowed?
So you want to let user select the image and able to change it befor Uploading
I made a simple example of preview and uploading image I think it will be helpful for you
Preview and uploade image angular2

Creating a Database with html

I am trying to create a Database of all my albums. I have figured out a few things, but I am a novice html writer and I am confused about how to orientate some of my items.
I want to create rows of albums with the album title centered under each picture. Unfortunately; each time I add a album title, the image drops to the next "row"
Screenshot
What I would like to do is move "Get Your Wings (1974)" to the right of "Aerosmith (1973)" and another to the right of that ... and so on across the width of the page.
& Yes ... the album covers are clickable. When clicked, Explorer opens the folder containing the mp3s.
I'm not sure where to post my html code, so I uploaded it here:
http://rg.to/file/4171a1d9d442aa84b472bf9356c48c76/TEST_06.txt.html
Any assistance would be appreciated.
PS: Please be patient, I am just learning.
Thank You !

image display in drupal

i would like to create an image gallery on my homepage in drupal. Each image will have been uploaded by the user, and, as i understand it, will be saved in some image directory folder in drupal. My question concerns a recent tip i picked up in response to the general debate whether or not it is good to store images as blob in mysql. The tip was to store the filenames of the images in mysql so you can essentially still sort the files. I was wondering whether this would be possible even if the files url is in drupal so to speak. It should be possible shouldn't it? I new to programming you see and want to the images on my homepage to be periodically refreshed according to a define sorting function. I would greatly appreciate any response to this question. Cheers.
You can using content types and views module for create gallery in Drupal 7.
First create new content type with gallery name(admin/structure/types/add).
Then add a image field to gallery content type and save it.
If you want have thumbnail of image you should create a image style. for example create a image style with thumbnail_custom name and add suitable effect(admin/config/media/image-styles/add). You will use of this image style in views in the next step.
Then create a new view with gallery-view name. uncheck create a page, check create a block, enter block title and item per page you want(admin/structure/views/add).
In Filter criteria from block details add content type gallery.
In Fields add Content image that appears in node:gallery and select and select thumbnail_custom for image style option.
Save view.
This view block appears in Blocks section and you select region for it.
If you want this block appears only in the front page, in configuration of this block in the section pages of visibility settings check "Only the listed pages" option and then enter "<front>" phrase in textarea.

ASP.Net MVC. Making Dynamic Images SEO Friendly

I have a website made to provide free web-based tools for making indie games. Currently, it only supports artists contributing to games. The features for helping artists consist of a set of artist community tools that allow artists to upload images based on a description, then we post that image in a gallery page. Other artists can upload their images and each image can have several revisions.
The way I chose to implement the image upload and display feature is by serializing uploaded images to a byte array and storing it in the database. When I need to display the image in the UI I just call a controller action I named "GetScaledGalleryImage" and pass in the image ID. That controller action takes the binary from the database and converts it back into an image, returning the requested image back.
This works very well functionally, but the problem I realized later is that the google crawler thinks all of my images are named "GetScaledGalleryImage" so if someone searches for "sylph" on google images, nothing comes up from my site, but if someone searches for site:watermintstudios.com getscaledgalleryimage, all of my images come up.
Here is an example of the URL that is being output in my HTML http://watermintstudios.com/EarnAMint/GetScaledMedia/68?scale=128
In the past, pre-MVC I would handle 404 errors and return content based on what was requested even if the page didn't actually exist. This would of course allow me to have the images pulled back by the image name (or description).
Is that the best way to do this? Or is there a better option? Something simpler would be better like if I could just do http://watermintstudios.com/EarnAMint/GetScaledMedia/Iris%20Doll?id=68&scale=128, but based on how google indexes images, would that give me what I need? Or do I need to provide image file extensions for maximum indexability?
Thanks all
It is important when doing Search Engine Optimization to always use alt="this is a crazy robot" for your images. This will help the crawler identify them. Note: always use alt, don't always name your images this is a crazy robot.

any tutorials/blogs regarding uploading more than one db images

I have exhausting goggle looking for a way to upload more than one db images.
I had a look at
http://www.mikesdotnetting.com/Article/125/ASP.NET-MVC-Uploading-and-Downloading-Files or http://mattias-jakobsson.net/post/2009/11/19/Handling-image-uploads-with-AspNet-Mvc.aspx or http://www.johnpscott.co.uk/devnotes/picpick/default.aspx or http://rusanu.com/2010/12/28/download-and-upload-images-from-sql-server-with-asp-net-mvc/ and so on. I no luck.
Does anyone has a tutorial or recommend a book that demostrate how to upload more than one db images. I am using vs 2010, asp.net mvc3 in C# with SQL Server 2008R2. All I am trying to do is to have couple db images for each product.
Thanks
The first link you provided is a good start for what you need.
Store all images for a product change....
It shows how to upload multiple files. From this you could modify the table where the images are inserted to add a key for the record relation back to your product.
Retrieve all images for a product change...
To pull them back from the database you would call the code in the same article (GetFile), modifying the select statement to include your product key INSTEAD of the ID of the individual image.
Display all images for a product change...
This is where it changes quite a bit. The author of the first article still returns one file as a FileContentResult. Obviously, this won't work for your situation.
Have a look at this article. It uses an XML file to load up multiple images BUT you would replace this code with the code in GetFiles to create the Image List. It shows how to create a controller, model and view for this. You could create a partial view to have the images on the same page as the product view.
This sample shows how to get an image list out of the DB into a view. (To help with modifying GetFiles to better work for this...)

Resources