Embedding a flash player in javascript file

Hello,

I’m trying to put an image/video gallery together for a college project.

To create the gallery I’m using: http://www.logicbox.net/jquery/simplyscroll/ , but when the user hovers over an image a small video appears on the mouse over (similar to the tutorial thumbnails on: http://www.videocopilot.net/)

I’ve copied and combined the relevant codes to create this prototype: http://www.samuelmcwilliam.co.uk

I see the image trail is working, but I don’t know how to get a flash player working on the mouse over. I’ve got an old open source player in my root folder, but can’t figure out how to use it to play the videos. I’m completely clueless on this section and not even sure if it’s the right approach.

In case you haven’t detected, I’m a novice and trying to learn in my spare time. It would be great if someone could tell me where it’s going wrong and how easy it would be to get it working!

Thanks in advance!

Sam

Hi Sam,

Welcome to the forums!

Using Google Chrome, when I go to the page you link to, I see scrolling set of images.
If I hover over any on the images for any length of time, then a video player pops out at me.
The problem is, I cannot play the video, as it follows the mouse around and I cannot click on the play button.

Maybe if you explain a little more what you are trying to do, we can help.

A quick tip: one thing I wouldn’t do, is to have the video player follow the mouse. It would be much nicer if it loaded in a Lightbox or something.

Hi Pullo,

Thanks so much for your response and advice. It’s my first post on a forum so perhaps it isn’t articulated that well…

I want the video to appear and play automatically on the mouse over. Here’s a link to the video copilot tutorial page for an idea of what I mean: http://www.videocopilot.net/tutorials/ . I like how instaneous the small video is, and it’s good to have a really fast relationship between the image and the video because the images are composed of layering the frames of the videos. I think the controls on the flash player you saw are just the default controls seen on the skin of the open source player I put in there before. I’ve used the flash player “player.swf” now that I found in the video copilot root folder, but it still isn’t functioning on my test page.

This is what the videocopilot javascript looks like when it comes to embedding the flash player:

temp += extra1+‘<embed’;
temp += ’ type=“application/x-shockwave-flash”‘;
temp += ’ src="http://’+asset_host+‘/assets/public/flash/player.swf"’;
temp += ’ width=“‘+width+’”‘;
temp += ’ height="’+height+‘"’;
temp += ’ allowscriptaccess=“sameDomain”‘;
temp += ’ allowfullscreen=“false”’;
temp += ’ flashvars=autostart=true&repeat=true&height=‘+height+’&width=‘+width+’&file=‘+imagename+’&searchbar=false&showicons=false&shownavigation=false&showdigits=false&usefullscreen=false"‘;
temp += ’ />’+extra2;
}

As opposed to mine:

temp += extra1+‘<embed’;
temp += ’ type=“application/x-shockwave-flash”‘;
temp += ’ src=“flash/player.swf”’;
temp += ’ width=“‘+width+’”‘;
temp += ’ height="’+height+‘"’;
temp += ’ allowscriptaccess=“sameDomain”‘;
temp += ’ allowfullscreen=“false”’;
temp += ’ flashvars=autostart=true&repeat=true&height=‘+height+’&width=‘+width+’&file=‘+imagename+’&searchbar=false&showicons=false&shownavigation=false&showdigits=false&usefullscreen=false"‘;
temp += ’ />’+extra2;
}

I haven’t dismissed the idea of having a Lightbox or a kind of video tooltip as a solution, and I think that will work too. I just want to see if I can get this video copilot effect working first.

What do you think?

Thanks a lot

Sam

Hi there,

I’ve just had a more in-depth look at your site.
It seems that the problem is that the script cannot find any of your films to play.
To see what I mean, open your page in Chrome (if possible).
Then hit F12, which will open Chrome’s dev tools.
Then make sure “Console” is selected.
Now hover over any of the scrolling images until the video player appears. You will see something like:

GET http://www.samuelmcwilliam.co.uk/flash/images/clip1.flv 404 (Not Found)

For this to work properly, you need to make sure that your video clips are in the right place and tha the script can access them.

Does that help at all?

Hi Pullo,

Yeah, It was as simple as me putting them in the wrong folder! The site is functioning now (albeit with a little lag on the flash player). Thanks so much for your help on this! I’m very grateful.

Happy New Year.

Hey Sam,

I just had a look at the site from my PC and didn’t experience any kind of lag on the player.
It’s probably a network issue.

Anyway, I’m glad you got it sorted out.
Happy New Year to you, too.