FORUMS: list search recent posts

Apple's Stylish Media Browsing as aWeb App

COW Forums : Web Design

<< PREVIOUS   •   FAQ   •   VIEW ALL   •   PRINT   •   NEXT >>
IceCreamMan
Apple's Stylish Media Browsing as aWeb App
on Sep 11, 2007 at 12:05:26 am

Anyone out there familar with Apple's slick browsing system? Like for music it shows the album pictures and let's you scroll through them. I want to make something like this for website purposes with javascript (I don't have access to flash).

Anyways the main thing I was wondering is if anyone knows how to take the pictures and distort them so they look slanted at an angle. And then flip vertically and horizantally positoned beneath the image with some transparency to use it as the reflection.

Any help at all on this project would be much appreciated. I have a feeling I may be in a bit over my head.

The "Ice Cream Man"


Return to posts index

IceCreamMan
Re: Apple's Stylish Media Browsing as aWeb App
on Sep 11, 2007 at 7:54:31 pm

This project is actually going a lot smoother than I thought it would. One question:

What is the best way to go about distorting the images to make them look turned at an agnle?

thanks

The "Ice Cream Man"


Return to posts index

Abraham
Re: Apple's Stylish Media Browsing as aWeb App
on Sep 11, 2007 at 9:04:27 pm

Try something like this in PHP

// filename of the original image
$fileName = "cow.jpg";
// load the original image from the file
$original = imagecreatefromjpeg($fileName);

// degrees to rotate the image (counter clockwise)
$angle = 90.0;
// rotate the image by $angle degrees
$rotated = imagerotate($original, $angle, 0);

// print the appropriate header type
// this tells the browser we're displaying a jpeg image
header('Content-type: image/jpeg');
// use the imagejpeg() method to display the rotated image
imagejpeg($rotated);






This will rotate it 45 Degrees:

// filename of the original image
$fileName = "cow.jpg";
// degrees to rotate the image (counter clockwise)
$angle = 45.0;
// if the resulting image is not rectangular..
// .. what colour will the uncovered bits be?
$bgColour = 0xFFFFFF; // red
// load the original image from the file
$original = imagecreatefromjpeg($fileName);
// rotate the image by $angle degrees
$rotated = imagerotate($original, $angle, $bgColour);
// print the appropriate header type
// this tells the browser we're displaying a jpeg image
header('Content-type: image/jpeg');
// use the imagejpeg() method to display the rotated image
imagejpeg($rotated);


I've never done it but I'm sure it works =)
Found the code at
http://discomoose.org/2006/04/28/rotating-pictures-with-php/

Have fun!

Abraham


Return to posts index


IceCreamMan
Re: Apple's Stylish Media Browsing as aWeb App
on Sep 11, 2007 at 9:27:16 pm

Thanks Abraham. That's really cool.

Sorry - bad communication on my part. What I'm actually trying to do is give the image a 3d perspective like this (which I did in photoshop):



The "Ice Cream Man"


Return to posts index

Abraham
Re: Apple's Stylish Media Browsing as aWeb App
on Sep 11, 2007 at 9:40:48 pm

Yea I kinda understood that in your first post though I can't solve the problem for you - I don't think you're going to accomplish that effectively in javascript though it is possible. I'd say using the PHP image controls is the way to go. I've seen 3D worlds rendered using PHP so anything is possible.

Abraham


Return to posts index

IceCreamMan
Re: Apple's Stylish Media Browsing as aWeb App
on Sep 12, 2007 at 1:53:15 am

Oh ok. Thanks I'll have to check that out. By the way on the code you posted I keep getting this:

Fatal error: Call to undefined function imagecreatefromjpeg() in C:ServerApache2.2htdocspicrotate.php on line 7

Do you know what that's all about?

thanks again.

The "Ice Cream Man"


Return to posts index


Abraham
Re: Apple's Stylish Media Browsing as aWeb App
on Sep 12, 2007 at 3:24:38 am

What ever server you are running on doesn't have the PHP imaging package installed on it. Google "site:php.net imagecreatefromjpeg"

Have your server admin install the package that will run these functions.

Abraham


Return to posts index

seandon01
Re: Apple's Stylish Media Browsing as aWeb App
on Sep 12, 2007 at 5:27:57 am

Hey, you might want to check this little script out. Its pretty cool..
http://www.ajaxcompilation.com/reflectionjs/'>
http://www.ajaxcompilation.com/reflectionjs/

Also if you google "Ajax carousel" you can find an ajax example to use for scrolling through the images


Return to posts index

IceCreamMan
Re: Apple's Stylish Media Browsing as aWeb App
on Sep 12, 2007 at 6:56:55 pm

Yeah I'm using a reflection Javascript similar to that - it's really awesome. I'll look into the Ajax carousel. That should be a nice touch. Thank you very much.

Here's one last question [hopefully :)] :

I made this javascript, which is printing a js array, a php variable (took out the "<"s so it would display):

script type='text/javascript'

document.write(photo[0])

/script

I am then inserting that variable into another like this:

$image="$dir/$java";

This is creative the link for the image. And of course it outputs the full javascript code instead of printing the array.

My question is how do I get the array name to show? I'm thinking it must be done with a function() . . .

The "Ice Cream Man"


Return to posts index


seandon01
Re: Apple's Stylish Media Browsing as aWeb App
on Sep 12, 2007 at 8:06:49 pm

Is this what you are attempting?


Return to posts index

IceCreamMan
Re: Apple's Stylish Media Browsing as aWeb App
on Sep 12, 2007 at 8:42:44 pm

Sort of. And that would work except I need the output of the javscript, eg "cow.jpg" to be used in $image so that I can run the image through this:

//Gets the width and height of the image and outputs it as $theimage[0] (width) and $theimage[1]

(height)
$theimage = getimagesize($image);
$width = $theimage[0];
$height = $theimage[1];

like I said I think this can be done with a function() but I don't know - I'm not very experienced with using function()

The "Ice Cream Man"


Return to posts index

seandon01
Re: Apple's Stylish Media Browsing as aWeb App
on Sep 12, 2007 at 9:35:59 pm

So you want to take the javascript variable and set it as a php variable.. Check out the screenshot below.. This will work. **UPDATE** After doing some research, i dont think it is possible to pass a JS variable to PHP variable without a page load, or a ajax call to an external php page which processes the js using the GET.

I searched this: Google Search



Return to posts index


IceCreamMan
Re: Apple's Stylish Media Browsing as aWeb App
on Sep 12, 2007 at 9:49:15 pm

Right - only thing is I don't need to echo $image. I just need to have it appear in another variable like this:

$display_image="$dir/$image";

And oh my God - wouldn't you know it - I've overthought this one way too much. All I need to do is this:

echo "$dir/";
echo $image;

Boy am I stupid. Sorry to have wasted your time with this.

Thank you for taking the time to help me out.

The "Ice Cream Man"


Return to posts index

IceCreamMan
Re: Apple's Stylish Media Browsing as aWeb App
on Sep 12, 2007 at 10:00:51 pm

Ah! Nevermind I was right the first time. I've gone mad.
I can't simply echo it because it needs to go in this:

$theimage = getimagesize($dir/$image);

The "Ice Cream Man"


Return to posts index

IceCreamMan
Re: Apple's Stylish Media Browsing as aWeb App
on Sep 14, 2007 at 11:11:55 pm

Ok I found out that that can't be done.
Hmm... Ok how about this - is there a way I could include a variable in a new variables name?

Example

$number="4";


$image4=$file; //with "4" coming from the variable $number


The "Ice Cream Man"


Return to posts index

<< PREVIOUS   •   VIEW ALL   •   PRINT   •   NEXT >>
© 2017 CreativeCOW.net All Rights Reserved
[TOP]