My (somewhat advanced) Image Viewer

[Rasper]

Hi

I've been working on this image viewer for the last couple of weeks as an assignment for my internship. It's the first time I've looked into and used some OOP programming for this, and it seems to work but I need a lot more practice. This what I came up with:

sample1 (http://www.pixilated.be/imageviewer/sample1.html)
sample2 (http://www.pixilated.be/imageviewer/sample2.html)
sample3 (http://www.pixilated.be/imageviewer/sample3.html)

All of these samples use the exact same .swf file. The only thing that changes are the parameters (flashvars). The settings for the layout are stored in an xml-file (see here (http://www.pixilated.be/imageviewer/ivsettings1.xml)). The data for the images can both be passed through as a .txt or a .xml. (But I'm a bit lazy and haven't typed out a whole xml-file for 40 images to prove it) Inside flash I check the extension and call the correct function to load the data.


Some more details about what it can do:

- Set the dimension of the flash movie (content is automatically positioned and scaled within)
- Set the colors about almost everything you see
- Choose between a scroller or a grid
- Set the number of columns and rows for the grid
- Set the type of transition that is preferred (4-5 options)
- Set a background image for the movie
- Set a background color for the different areas

Besides that, the images are preloaded while the image viewer is running (as you can see if you look at the thumbnails). Also, there's a border around the thumbnail of the image that's selected and the scroller and grid should keep that thumbnail in sight when it's selected.

It has an automatic slideshow function that can be paused + the user has the option to go forward an backward to other images. You can set the time that an images is shown, and follow it in the corner with the little clock.


I know it's not flawless, but it shouldn't have any major bugs.
I hope you like it


Grts,
Rasper

[Search-This.com]

looks pretty nice, I like sample2, I like that transition best. I don't like the boxes transitions. I know they me be harder to make, but that doesn't make them better.

[Rasper]

looks pretty nice, I like sample2, I like that transition best. I don't like the boxes transitions. I know they me be harder to make, but that doesn't make them better.

I know, I'm more of a fan of the second one myself. I've also noticed a bug in the boxes animations so I'll have to take care of that.

[=guinness=]

when you click on the pic of the purple side panel of the car it screws up the placement on the page. after that all other images loaded are masked wrong.

[Rasper]

when you click on the pic of the purple side panel of the car it screws up the placement on the page. after that all other images loaded are masked wrong.

What sample are you talking about? What do you mean by masked wrong? I can't seem to find the problem. I know that there's a flaw in the masking, so I'll take care of that, but I'm not sure what you mean when you say that all the other images are masked wrong. Ar you sure it's that particular picture?

[JoshuaJonah]

#2 doesn't load in Safari 2.0 with FP8:)

[Rasper]

#2 doesn't load in Safari 2.0 with FP8:)

Should be fixed.

[JoshuaJonah]

yup works now,.... nice response time

[deucescorner]

i have to agree that #2 transitions are better. very nice work, maybe you could set up a nice tutorial :D

[RevoGiant]

pretty cool. You should post an FLA and share it with the source/exp guys. :)

[Rasper]

pretty cool. You should post an FLA and share it with the source/exp guys. :)

yeah I thought about it but I don't think they'll agree to that here at the company I made this for. Also, I'm not too proud of the code, it's a bit messy to my liking. There's room for a lot of improvement on my part. Maybe in the future.

[RevoGiant]

cool cool...I also like the tweens but want to suggest that when the boxes bring the new image in they also fade out a little quicker and smoother...goog work though. :)

[Rasper]

cool cool...I also like the tweens but want to suggest that when the boxes bring the new image in they also fade out a little quicker and smoother...goog work though. :)

Thanks.

My initial thought was to fade out the mask, but I had to keep in mind that it should be playable in the oldest possible version of flash. 6 was too old for some of the functions I use, so it's compatible for Flash Player 7. But fading masks is only possible in 8 :(
Transition 2 is probably te most popular anyway so it wasn't a priority. There's also a blur-transition available (commented atm) but that's also only if it's published as a flash 8 file. (Damn the people who don't have the latest flash player :p)

[hybrid101]

get the blur transition up asap:)
i'm liking the second one the most too, btw:)

[icio]

The placement of the image seems to be messing up, little bug there.
Pretty nice, though.

[Rasper]

The placement of the image seems to be messing up, little bug there.
Pretty nice, though.

I did a little update.
Is the bug still there? What placement are you talking about? The Images are alined to the top of the thumbnail grid and centered in the viewing area.

[theflash]

When you are loading images in the background seems a nice feature but I dont know if everybody might like that... because when you are loading images in background bandwidth is taken up totally... my other things went slow and I was just surpriced for once....

otherwise neat try.. good one...

[Rasper]

When you are loading images in the background seems a nice feature but I dont know if everybody might like that... because when you are loading images in background bandwidth is taken up totally... my other things went slow and I was just surpriced for once....

otherwise neat try.. good one...

I know, I feel the same about it. It's a nice feature, but you force people to load a lot more than they even want. If it were op to me I'd dump the preloading of all the images. It's not up to me though :)

[pixi]

Erm - nice work, I definately see elemtns of ImageVuex gallery, and simpleViewer gallery in there. Did you create this from scratch?

Nice job though, loving the "white-out" transistion of 2. :)

[Zimmermann]

When you're scrolling through the thumbnails and your arrow leaves the .swf (downwards) it keeps scrolling.

Other than that it's really nice - and my favourite is #2 too ;)

[Rasper]

Erm - nice work, I definately see elemtns of ImageVuex gallery, and simpleViewer gallery in there. Did you create this from scratch?

Nice job though, loving the "white-out" transistion of 2. :)

I did create it from scratch, but used the simpleviewer as inspiration for the grid and preloading of the images.


When you're scrolling through the thumbnails and your arrow leaves the .swf (downwards) it keeps scrolling.

Other than that it's really nice - and my favourite is #2 too ;)

I'm aware of this flaw, but I can't solve it! If any one can PLEASE help me. I do the mouseover-scroller with a hittest. But the problem is that when you move your mouse outside the stage, flash can't detect this and keeps returning true on the hittest. That way it keeps scrolling :(

[haldol]

I agree with the majority...sample 2 is my favorite. I am relatively new to Flash and do it as a hobby in my free time. For the life of me I cannot figure out how to do transitions to unload the old image. What am i missing??? Is there somewhere I can find a tutorial on this subject?

[colombianking]

i can only see sample 3 in ff
the first two i only see the side bars

[AppleSauce]

i can only see sample 3 in ff
the first two i only see the side bars

same here :(

[pavanshinde]

Hi

Your links not working now.

[haam]

The page cannot be found
The page you are looking for might have been removed, had its name changed, or is temporarily unavailable.

Please try the following:

* Make sure that the Web site address displayed in the address bar of your browser is spelled and formatted correctly.
* If you reached this page by clicking a link, contact the Web site administrator to alert them that the link is incorrectly formatted.
* Click the Back button to try another link.

HTTP Error 404 - File or directory not found.
Internet Information Services (IIS)

Technical Information (for support personnel)

* Go to Microsoft Product Support Services and perform a title search for the words HTTP and 404.
* Open IIS Help, which is accessible in IIS Manager (inetmgr), and search for topics titled Web Site Setup, Common Administrative Tasks, and About Custom Error Messages.


that's what i got for all three pages.

[theflash]

This is some months old... author might have removed the contents..

[rkalexander]

This thread is rendered useless if the poster removes the content. Man that bugs me.

[evildrummer]

^ Even though this thread is really old and you shouldn't be bumping it, here are the new links... found with simple logic: http://www.pixilated.be/temp/projects/imageviewer/