homepage Welcome to WebmasterWorld Guest from 54.163.91.250
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member
Home / Forums Index / Code, Content, and Presentation / Site Graphics and Multimedia Design
Forum Library, Charter, Moderators: not2easy

Site Graphics and Multimedia Design Forum

    
How do I put .mov or .avi to website
newbie04




msg:859259
 6:01 pm on Apr 22, 2004 (gmt 0)

Hi,

I am using HTML, was trying to add the video file .avi to our website, but not working. This is the code I did for it : <img src="../images/install module.avi">
Am I suppose to do anything else rather than this? Which file is better to put on the web (.mov or .avi). Please help.
Thanks

 

hasbeen




msg:859260
 6:31 pm on Apr 22, 2004 (gmt 0)

I'm not an expert in this, but you should be able to simply use an HREF for designating the download for the .avi file. The .mov is a quicktime file, and requires a bit more coding as you'll have to detect a quicktime player prior to serving the file, then have the user download the plugin if they don't already have one installed.

In my opinion (as uneducated as it is) you're looking at the difference between streaming media (the .mov) versus giving people a download link to a file that they play locally (the .avi).

My guess is you'll get an answer from someone who knows more about this than I.

maccer01




msg:859261
 8:03 pm on Apr 22, 2004 (gmt 0)

There are quite a few alternate methods to put the clip in your html. All work, but have pros and cons.

A simple method is:

<a href="http://www.site.com/filename.mov">
Movie file (500K)
</a>

The above method will create a link where the user downloads the file and it is played by the default application.

Another method is to embed the file but this creates issues with default players and browser plugins.


<object width="240" height="196" classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" codebase="http://www.apple.com/qtactivex/qtplugin.cab">
<param name="src" value="shotguns.mov">
<param name="controller" value="true">
<param name="autoplay" value="false">
<embed src="shotguns.mov" pluginspage="http://www.apple.com/quicktime/download/" width="240" height="196" autoplay="false" controller="true">
</embed>
</object>

The above method embeds a file that should be cross browser compatible and play the clip in quicktime. However it uses non-compliant html (the embed tag).

A final method is the w3c standard using the object tag. My example is how to embed flash that will also validate.


<object type="application/x-shockwave-flash" data="flashfile.swf"
width="550"
height="400"
id="flashelement"
title="Flash movie for the test">
<param name="movie" value="flashfile.swf">
<p>
Provide link here to download the player.
</p>
</object>

Hope this helps a bit.

Try this site for more info:

[juicystudio.com ]

newbie04




msg:859262
 8:34 pm on Apr 22, 2004 (gmt 0)

Hello maccer01,

Thanks for your great replied. I tried with your first method (because I just know basic html only), I uploaded that page, that .avi file to the same place, then tested, but not work. It said: "Not Found, the requested URL was not found on this server". Did I did something wrong?

Thanks,
newbie

maccer01




msg:859263
 9:22 am on Apr 23, 2004 (gmt 0)

Treat the avi as if it was an image being placed on your page. Make sure the movies clip is in the same directory as the server.

You may need to change the html code to look like the following:

<a href="movieclip.avi">Play movie</a>

The above will work if both the html document and the movie clip are in the same directory on the server.

newbie04




msg:859264
 2:32 pm on Apr 23, 2004 (gmt 0)

Hi maccer01,

I copied and pasted your code to my site, uploaded that page and the movie file to the server, same location with the page I uploaded. Then I don't see the text that I mentioned people about the movie, instead, the whole first paragraph was link, then I clicked on that link, I got an error. Here is what I add in:
<h1><font size="5">PC/104 DSP/Telecom/Data Acquisition Boards</font></h1>

<a href= "module install.MOV¡¨>
Movie of how to install module to board (1.19 MB) </a>

<break clear="left"></break>

I am missing or did something wrong?

newbie04




msg:859265
 2:34 pm on Apr 23, 2004 (gmt 0)

Hi Nunzio390,

Thanks alot for your offered. The movie clip on your website is really cool, but right now I just one to add one simple movie clip first, as of I am a brand new to this, so I want to do the simplest thing first, then when I feel more comfortable, I would like to try that. If you could show me to post just one simple movie clip, that will be great.
Thanks

Nunzio390




msg:859266
 4:46 pm on Apr 23, 2004 (gmt 0)

Okay, newbie04
Here are your directions [nunzioweb.com].

If you have any questions or problems with the code, post back here in this thread.

newbie04




msg:859267
 6:51 pm on Apr 23, 2004 (gmt 0)

Hi Nunzio390,

I tried your code, very clear. I got the main page with the movie link working, but when I click on the link, it popped up another square small brower with our company logo instead of the movie. Do you know why?
Please take a lơk at this realquick and let me know you saw that so I can remove it from the web.

<snip>

Thanks,

[edited by: korkus2000 at 1:06 pm (utc) on May 12, 2004]
[edit reason] No site reviews please [/edit]

Nunzio390




msg:859268
 7:18 pm on Apr 23, 2004 (gmt 0)

It appears as if the play_movie.htm document does not exist at <snip>

At least not at that location anyway. Generates a 404 File not found page instead. Where did you upload it to? It is certainly not located in the root directory.... <snip>

If say, you uploaded it to a sub-directory in error, and for arguments sake that sub-directory is named "misc", then you would have to change this code...

<a href="play_movie.htm" onClick="window.open(this.href,'movie','top=50, left=50, width=280, height=257, toolbar=no, menubar=no, location=no, scrollbars=no, resizable=no'); return false;">Click here to play the video clip</a>

to this instead, to reflect the actual location of play_movie.htm ...

<a href="misc/play_movie.htm" onClick="window.open(this.href,'movie','top=50, left=50, width=280, height=257, toolbar=no, menubar=no, location=no, scrollbars=no, resizable=no'); return false;">Click here to play the video clip</a>

[edited by: korkus2000 at 1:07 pm (utc) on May 12, 2004]
[edit reason] No site reviews please [/edit]

newbie04




msg:859269
 7:39 pm on Apr 23, 2004 (gmt 0)

Ok, I got it now. I have to add the play_movie.htm page to the root file which is using Perl, I don't know why the other guy created it this way. And this file usually take up 1 day to appear on the web. I will check back tomorrow and let you know the result. I greatly appreciate your help.

Thanks.

Nunzio390




msg:859270
 7:42 pm on Apr 23, 2004 (gmt 0)

Yer welcome :)
Let me know when it's up and running.

newbie04




msg:859271
 6:26 pm on Apr 26, 2004 (gmt 0)

Hi Nunzio390,

I got that page work, you can take a look at it
<snip>, there is a link under the board picture. But I have one question, do you know it does not show the Play, Stop,... buttons?

Thanks.

[edited by: korkus2000 at 1:08 pm (utc) on May 12, 2004]
[edit reason] No site reviews please [/edit]

newbie04




msg:859272
 6:55 pm on Apr 26, 2004 (gmt 0)

Nunzio390,

Do you know how to convert the .mov to .swf? Because the .mov file I uploaded on the web is big, about 1MB something, and it take about 2-3 minutes to download. I am trying to reduce the size and with good quality image also, if you can help me with this, that will be good.

Thanks.

Nunzio390




msg:859273
 2:19 pm on Apr 27, 2004 (gmt 0)

OK. You've posted twice with 2 entirely different questions. I'll answer one at a time...
But I have one question, do you know it does not show the Play, Stop,... buttons?

You need to change both of the "true" values for the "controller" to "false" instead. I also see that even though we had been speaking about an AVI file, you have instead uploaded a proprietiery Quicktime MOV file and have used Quicktime <object> and <embed> instead of WMP <object> and <embed>. This of courzse has to be done if dealing with a Quicktime MOV file. Any other video format would not have made this necessary.

No problem though. Replace the code you now have with this...

<object classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" width="320" height="240"
codebase="http://www.apple.com/qtactivex/qtplugin.cab">
<param name="src" value="http://www.example.com/pages/install_module.mov">
<param name="autoplay" value="true">
<param name="controller" value="[b]false[/b]">
<param name="kioskmode" value="true">
<param name="volume" value="50%">
<embed src="http://www.example.com/pages/install_module.mov"
width="320" height="240" autoplay="true" controller="[b]false[/b]" volume="50%" pluginspage="http://www.apple.com/quicktime/download/" kioskmode="true"></embed>
</object>

The above changed code will eliminate player controls, as you had asked.

OK. Now to your second question...
Do you know how to convert the .mov to .swf?

That's more difficult, but it can be done. I personally know of no way to directly convert a MOV file to an SWF (Flash) file, but other video formats can be directly converted. So, to do what you want would involve a 2-step procedure.

1. Convert the MOV file to another less proprietary video format (eg: AVI) by downloading and installing one of these software choices...

a) WinMPG Video Convert [winmpg.com] (trial)
b) RAD Video Tools [videohelp.com] (free)

2. Convert the outputted AVI file to SWF (Flash) using one of the appropriate MOV converter tools listed on this page [soft411.com]. Some are pay-for. Some are trial. Some are free. You decide.

[edited by: korkus2000 at 1:09 pm (utc) on May 12, 2004]
[edit reason] examplified URLs [/edit]

Nunzio390




msg:859274
 5:31 pm on Apr 27, 2004 (gmt 0)

Woops! I completely misunderstood your 1st question. I thought you were asking how to get it NOT to show the player controls. You were instead saying that the player controls do NOT show, and were wondering why. Right?

If that's the case then do not change the controller values to "false" and instead leave those values as "true". The reason you do not see the player controls is because they are obscured by the Sygnagolic Logo, which doesn't even belong on that "play_movie.htm" page. There should be nothing generated on that page at all other than zero margin and padding plus the <object> and <embed> coding. Nothing more. Nothing at all.

Just look at the page generated by clicking or visiting [example.com...]

You will notice that Perl at the company server "takes over" and actually sends you to [example.com...]

It gets parsed by Perl and a bunch of unneeded junk is displayed on that page, as you can see. The unnecessary junk includes the Logo, appearing directly below and also partially obscuring the player controls for the movie. More unneeded stuff that gets displayed also includes a repetition of the company navigation area on the left, the company footer info, and even worse yet, a repetition of the movie itself.

All the above is no good. A bunch of superfluous company stuff is being parsed into the page output.

Keep it simple, dude. You've got to only include HTML for zero margin and padding plus the <object> and <embed> coding. Nothing more.

When the "play_movie.htm" page is generated it should contain this code and this code only...

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Video Clip</title>
<style type="text/css">
body {
padding-top:0;
padding-bottom:0;
padding-left:0;
padding-right:0;
margin-top:0;
margin-bottom:0;
margin-left:0;
margin-right:0;
background-color: #000;
}
</style>
</head>
<body>

<object classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" width="320" height="240"
codebase="http://www.apple.com/qtactivex/qtplugin.cab">
<param name="src" value="http://www.example.com/pages/install_module.mov">
<param name="autoplay" value="true">
<param name="controller" value="true">
<param name="kioskmode" value="true">
<param name="volume" value="50%">
<embed src="http://www.example.com/pages/install_module.mov"
width="320" height="240" autoplay="true" controller="true" volume="50%" pluginspage="http://www.apple.com/quicktime/download/" kioskmode="true"></embed>
</object>

</body>
</html>

You must somehow get "play_movie.htm" to contain ONLY the above code. Your Perl file appears to parse every link to include whatever page the link points to as part of index.pl and that just won't cut it. You need to simply call a separate page in your link that will open the pop-up window that includes ONLY the above page code and nothing more. If this cannot be done, you will always encounter problems. Do not have the resulting pop-up containing "play_movie.htm" generated by Perl and instead have it just generate a pop-up containing "play_movie.htm" itself, by using this link within the "PC/104 DSP/Telecom/Data Acquisition Boards" page...

<a href="play_movie.htm" onClick="window.open(this.href,'movie','top=50, left=50, width=280, height=257, toolbar=no, menubar=no, location=no, scrollbars=no, resizable=no'); return false;">Click here to play the video clip</a>

You have that above linkage code correctly right now, but you must prevent the Perl script from adding all the superflouous nonsense, and instead pop-up the new window that ONLY contains the page code I quoted above.

[edited by: korkus2000 at 1:11 pm (utc) on May 12, 2004]
[edit reason] examplified URLs [/edit]

Nunzio390




msg:859275
 5:36 pm on Apr 27, 2004 (gmt 0)

I made a mistake in my above post. Seems I can't edit my post at this board for some reason. Anyway, I said this....

Just look at the page generated by clicking or visiting [example.com...]

You will notice that Perl at the company server "takes over" and actually sends you to [example.com...]

I meant to say this instead...

Just look at the page generated by clicking or visiting [example.com...]

You will notice that Perl at the company server "takes over" and actually sends you to [example.com...]

But the rest of everything else I said in my previous post needs no changing/editing.

[edited by: korkus2000 at 1:12 pm (utc) on May 12, 2004]
[edit reason] Examplified URLs [/edit]

newbie04




msg:859276
 8:22 pm on Apr 28, 2004 (gmt 0)

Nunzio390,

First, sorry for post another title, I thought this is not related to my recent title so I created another one.

Second, I am really appreciate your replied. I sent your replied to my boss, he was impressed, he said that you are a really smart guy. He assigned other people to help me with the Perl code since I don't know that. I will get back to you after they fixed the problem for me.

Thanks.

muesli




msg:859277
 7:09 am on Apr 30, 2004 (gmt 0)

1. Convert the MOV file to another less proprietary video format (eg: AVI) by downloading and installing one of these software choices...

a) WinMPG Video Convert (trial)
b) RAD Video Tools (free)

2. Convert the outputted AVI file to SWF (Flash) using one of the appropriate MOV converter tools listed on this page. Some are pay-for. Some are trial. Some are free. You decide.

there's a lot easier way to convert mov to swf: use macromedia flash MX, file> import. (MX trial is free for 30 days, in case you need it only once).

just did it that way, result at: <snip>

[edited by: korkus2000 at 1:13 pm (utc) on May 12, 2004]
[edit reason] No personal URLs please [/edit]

newbie04




msg:859278
 2:20 pm on May 5, 2004 (gmt 0)

Hello Nunzio390,

I got the page working, you can view at <snip>.
Now, my boss wanted the file up there is .swf instead of .mov. I followed Muesli instruction, used Flash Macromedia and converted the movie file to .swf, it gave me .html also, I got the source from html page and created another page called flash_movie.htm. Somehow, I replaced the play_movie page to flash_movie page in pc104 page, uploaded pc104 page and flash_movie page, when i clicked on the link, it popup a white window with our logo only, I know that there are something with the pearl like you said before, but I am not sure do I have to change any code in the flash_movie page. I attached the code for the flash_movie file down here so you can see what I did wrong.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>install_module</title>
</head>
<body bgcolor="#ffffff">
<!--url's used in the movie-->
<!--text used in the movie-->
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0" width="550" height="400" id="install_module" align="middle">
<param name="allowScriptAccess" value="sameDomain" />
<param name="movie" value="install_module.swf" />
<param name="quality" value="high" />
<param name="bgcolor" value="#ffffff" />
<embed src="install_module.swf" quality="high" bgcolor="#ffffff" width="550" height="400" name="install_module" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />
</object>
</body>
</html>

Thanks alot for your help.

[edited by: korkus2000 at 1:14 pm (utc) on May 12, 2004]
[edit reason] No site reviews please [/edit]

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / Site Graphics and Multimedia Design
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved