Solved

How to make windows media player or real player play a mpeg file in a window without the controls, etc. showing

Posted on 2004-11-01
3,552 Views
Last Modified: 2011-09-20
This question is about making a web page on my hard drive, not on the internet. OS: Windows 98SE on an IBM Thinkpad 600x laptop Pentium  3 processor (244? not sure).

I want a webpage that has two frames (the frames part I can handle!)

The left frame has links to mpeg slideshows  and when you click on a slideshow link I want  either Windows Media Player of Real Player to open in the right frame and only show the slideshow images, ie. not show the player controls; I only want the slideshow image showing while it plays.

If this is way out of the question for this kind of forum then I guess I'm just showing my  extensive ignorance about web design, which I certainly can live with.

For the solution that works on my laptop  I wanted to give 1000 points for this but the system would only let me give 500.  I'm not signing up for premium services, which seems what is necessary to offer more than 500 points,   but we can make arrangements  for an additonal 500 points to come your way for your successful solution.
0
Question by:Harimogura
    18 Comments
     
    LVL 2

    Expert Comment

    by:phpisthefuture
    Do you have to use Windows Media Player or Real Player ? How about just create a DHTML or Java slide show such as the one here: http://www.scriptocean.com/slideshow/index.html (very easy to setup, and use), and embed it into your webpage. You can set a page which has a table with two columns, left side column will have links to your slideshow files, and right column will display the slideshows which you've created with this dhtml tool?
    On this link you can also find tens of dynamic slideshow generators: http://www.dynamicdrive.com/dynamicindex14/index.html
    If you don't have to do this with mpeg slideshows in Windows Media Player or Real player you can use one of the options I gave above, but if you have to go with mpeg's let me know, then I will think about another solution.
    Good luck.
    0
     

    Author Comment

    by:Harimogura
    I'm afraid that Javascript slideshows won't work in this case because I wanted the images to have really long cross-dissolves (20 seconds and longer) and  a synched audio track, so I had to use video to get the right result.  
    0
     
    LVL 2

    Expert Comment

    by:phpisthefuture
    Almost all of the slideshow scripts have time setup, which you can set how many seconds will an image stay before the next one comes in. Are you planning to use one song/track during the whole slide show or do you want the music change with each slide? If you are going to use one track, you can easily add the music to the bod onload, and play it until the slide show ends. Just a suggestion? Please clarify my questions when you have time, then I will try to help further.
    0
     

    Author Comment

    by:Harimogura
    In a cross-dissolve one image is fading out at the same time that the next one is fading in--an overlap. Lets say there are two images, A and B. Both have a duration of 25 seconds.   Image A is on screen for 5 seconds then it starts very slowly fading out and Image B starts very slowly fading in. It takes 20 seconds for A to fade out completely and B to fade in completely ( and then B is on screen for 5 seconds after A has faded out completely and after that 5 seconds the next fade out/fade in sequence begins).  Can you do this with javascript slideshows? I didn't think so.

     For the audio, I am using a soundtrack I put together myself, and since I am using Premiere I can have a specific section of the soundtrack occur at a specific point in the crossdissolve, say when part of image B first becomes visible as it fades in. Syncing like this in Premiere is a snap but I wonder if it would be possible with a javascript slideshow without lots of trial and error.

    This is why the final product is video and needs to be played in a media player of some sort. For aesthetic purposes I want it to play just in an image window, without the controls showing.
    0
     
    LVL 26

    Expert Comment

    by:rdcpro
    No, you're right; video is the way to go here.  You turn off the UI controls by setting the uiMode parameter to none:

    <HTML>
    <!-- Preload BG color. -->
    <BODY bgcolor = "black">

    <OBJECT id="WMP" height = 32 width = 32
       classid = "CLSID:6BF52A52-394A-11d3-B153-00C04F79FAA6">
       <PARAM name = "AutoStart"  value = "True">
       <PARAM name = "uiMode" value = "none">
       <PARAM name = "windowlessVideo" value = "true">
    </OBJECT>

    <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="320" HEIGHT="240" id="Flash" ALIGN="">
       <PARAM NAME=movie VALUE="myFlashShow.swf">
       <PARAM NAME=quality VALUE=high>
       <PARAM NAME=bgcolor VALUE=#000000>
       <EMBED src="myFlashShow.swf" quality=high
        bgcolor=#000000  WIDTH="320" HEIGHT="240"
          NAME="Flash" ALIGN=""
          TYPE="application/x-shockwave-flash"
          PLUGINSPAGE="http://www.macromedia.com/go/getflashplayer">
       </EMBED>
    </OBJECT>

    </BODY>
    </HTML>


    Regards,
    Mike Sharp
    0
     
    LVL 26

    Expert Comment

    by:rdcpro
    Oh, I wanted to add, 1000 points isn't allowed per the terms of service, premier or otherwise.  500 maximum.  Though frankly, they're worth about the same to me.  I've got over 660,000 under the XML TA, and I still can't buy a cup of coffee with them!  ;^)

    Regards,
    Mike Sharp
    0
     

    Author Comment

    by:Harimogura
    Thanks, Mike, but I'm afraid I couldn't make your code work on two different machines.  I added a link for a video file (only-no other additons) to the code you provided and saved it as an html file. On my w98 laptop with IE6 clicking on the link  opens  a "Media" panel on the left of the browser with a tiny little video window at the bottom of it.  Not workable at all. On my XP desktop it just opens WMP in its full glory, i.e. controls, menus and all.
    0
     
    LVL 26

    Expert Comment

    by:rdcpro
    When you click a link, the browser will take an action based on the MIME type it detects for the link.  If there is no MIME type (ie: no server setting an HTTP Content-Type header), the browser will attempt to figure out what to do based on the file extension.  In XP, in particular, you can opt to have WMP play multimedia links within the browser or not.  I don't believe this is something you can control from a web page.  I believe that Win98 works the same way.  This is a function of Windows Media Player.  But that's not what I was showing you to do.

    You can't add a link to a video file, and expect the activeX control to play it.  The two have no connection to each other.  I'm not really sure what your link is intended to do, but if it's navigation, your left frame will have links to load a series of HTML pages with the ActiveX controls embedded in them.  The ActiveX controls themselves will load the video files.

    The above code snippet is an edited version of an example on the Windows Media Player site.  I use a somewhat different way  on a large and well-known public web site.  On the site, there are actually a set of Javascript files that create a DHTML object that represents the player.  I implement the player controls myself with images tied to the player API.  This code is quite complex, but allows me to play video clips at either 56k or 220k in either WMP or RealPlayer (as the visitor chooses), and is supported on a wide variety of browsers (netscape 4.x and up, IE 4 and up, and a raft of other standards compliant browsers).   Unfortunately, I can't share this code with you, but there is plenty of information out there on creating this sort of thing.  Macromedia has a lot of info on their site, and Windows Media Player has a lot of info on theirs as well.

    Regards,
    Mike Sharp
    0
     

    Author Comment

    by:Harimogura
    Thank you for explaining all that. I basically understand what you are saying, but I don't know how to implement it, it's way beyond my knowledge level, and I don't have the time to delve into it right now. The idea for the slideshows was to have them play on an old laptop in a corner at a photography exhibit I am having in a couple of weeks. I will just have to leave them as is, playing in WMP full mode,  and figure out the details of how to do what I wanted to do someday when I can devote some time to it.

    Because I didn't get the result I hoped for and have no actual solution I can implement right now, I'm not going to give points, not that I think you care about points given your second comment on   11/02, but if that is not acceptable then you should let me know.

    Mark
    0
     
    LVL 26

    Accepted Solution

    by:
    Well, you do have a solution that produces the results you wanted...in fact, I tested it.  I think you're just missing a piece or two here.  Flash is ideal for this, especially since you have long dissolve times.  But you can use MPEG movies as well, of course.  Here's what you need:

    You need a frameset.  The frameset has a left nav with some links in it.  Each link points to an HTML page similar to the one I posted, and opens it in the right frame where you want it to play.    

    Each HTML page will have the exact same code I have, though you may need to modify the size of the ActiveX control, and you'll need to modify some of the parameters to match whatever movie you're playing, but you basically have one HTML page for each movie.  You don't provide a link to the movie file, just to the HTML page.  Remember, the links in the left frame open *html* pages, not movies.  Post your frameset code, plus the code for the left nav, and I'll set up a more complete example.  Make sure the frameset code shows the pixel sizes of the frames.  If your movie is a different size, post the dimension of that as well.  Finally list out the names of a couple of your movies.

    As far as the points go, if the question was answered, the points should be awarded.  My primary motivation is some sort of strange desire to help other developers, but the points system keeps everyone honest.  I don't think the moderators would refund your points in this case.

    Regards,
    Mike Sharp
    0
     

    Author Comment

    by:Harimogura
    OK. I appreciate the time you've put in explaining. Perhaps I will be able to make this work. I will give in another shot.
    0
     

    Author Comment

    by:Harimogura

    If you can show me how to make this work it would be great. If you've had enough, I can understand that, too.  

    This is the kind of frameset I was intending to use. It is just adapted from the one I use for images on my website.

    According to the properties of the mpeg files I made in Premiere,  the size of the video is 720 x 480.  I may have to make the movies smaller to fit in  the target frame on the laptop screen but this is OK for now.

    I've used the names movie 1, movie 2, etc. to name the movies.

    --------------------------------------------------------------------------------

    Code for index.html, which has the frameset info:

    <html>
    <head>
    <title>Movies</title>
    </head>
    <frameset cols="200,*">
    <frame src="0.html" name="menu" scrolling=auto noresize>
    <frame src="00.html" name="00">
    </frameset>
    </frameset>
    <noframes>
    <body>
    <h2>Sorry, but this set of images,<br>
      requires frames and your browser<br>
    doesn't support them.<br>I hope to make a non-frame version of this<br>
    site eventually.Sorry for the inconvenience.</h2>
    </body>
    </noframes>
    </html>

    ----------------------------------------------------------

    Code for 0.html, the left nav frame:

    <html>
    <head>
    <style type="text/css">
    <!--
    a:link {text-decoration: none}
    a:visited {text-decoration: none}
    a:active {text-decoration: none}
    a:hover {color="CCFFFF"}
    -->
    </style>
    </head>
    <body>
    <body bgcolor="#1c1c1c" text="#FFCC99" link="#FFCC99" alink="#FFCC99" vlink="#FFCC99">
    <table border=0 width=100%  height=50% cellspacing=0 cellpadding=0>
    <tr><td align=center valign="bottom"><font size="2">
    <a href="movie1.html" target="00">Movie 1</a><br><br>
    <a href="movie2.html" target="00">Movie 2</a><br><br>
    <a href="movie3.html" target="00">Movie 3</a>
    </td></tr></font>
    </table>
    </body>
    </html>

    ---------------------------------

    Code for 00.html, the target frame:

    <html>
    <head>
    </head>
    <body bgcolor="#000000" text="#FFCC99">
    <table border=0 height="50%">
    <tr valign=bottom><td><h3><b><<<</b>Click on any Movie link to view it</h3></td></tr>
    </table>
    </body>
    </html>
    0
     
    LVL 26

    Expert Comment

    by:rdcpro
    Ok, I'll hunt around for a couple sample MPEGs and set something up, probably tomorrow.  Do you have any of your MPEGs online?

    What you have so far looks pretty good though--I'm surprised you had problems with it.

    Mike
    0
     

    Author Comment

    by:Harimogura

    Well, my problem is that I don't know how to make the  movie file activate when you click on an html link in the left nav frame. What do you put in the html page that references the  movie you want to play when that page is loaded in the frame?  I didn't see a place for that in the code you  initially posted. This is just because I have a very basic grasp of web page coding and cannot devote the time to becoming as proficient as I would like to be.

    Anyway, I emailed you a link to a small size mpeg  movie on my site at  the hotmail address listed on your profile page. Take your time doing anything with this. I feel that you have already put a lot of time into this question as it is, and I appreciate it very much.

    The email subject line is:   "Experts Exchange Question Movie file"
    0
     
    LVL 26

    Expert Comment

    by:rdcpro
    Ok, I've set up an example that works with your MPEG movie.  I can turn on or off the controls, status bar and a display info pane (this code has them all set off).  Using the exact same framesets posted above, create three HTML pages called Movie1.html, Movie2.html and Movie3.html.  Each of these pages has this exact code:

    <HTML>
    <!-- Preload BG color. -->
    <BODY bgcolor = "black">

    <OBJECT
       ID="SlideShow"
       CLASSID="CLSID:22d6f312-b0f6-11d0-94ab-0080c74c7e95"
       WIDTH="720"
       HEIGHT="480">
       <PARAM NAME="FileName" VALUE="Movie1.mpeg">
       <PARAM NAME="AutoStart" VALUE="True">
       <PARAM NAME="TransparentAtStart" VALUE="True">
       <PARAM NAME="ShowControls" VALUE="0">
       <PARAM NAME="ShowDisplay" VALUE="0">
       <PARAM NAME="ShowStatusBar" VALUE="0">
       <PARAM NAME="AutoSize" VALUE="1">
    </OBJECT>

    </BODY>
    </HTML>

    Change the FileName parameter tag to whatever the movie file actually is:

       <PARAM NAME="FileName" VALUE="MyReallyCoolMovie.mpeg">

    I've tested this in XP, and it works as it should.  Note the example there doesn't have the embed tag, which is only necessary if you're going to run this in browsers other than IE.

    The movie autosizes, since I don't know what your target screen resolution will be.  

    I emailed you a zip file containing the files, so you can just unpack them and try it out.  In this zipped archive, Movie1 is the one that I posted here.  Movie2 is the same thing with all the controls turned on, and Movie3 is no controls, and no resize (native resolution).

    Regards,
    Mike Sharp
    0
     

    Author Comment

    by:Harimogura
    Mike, I've just taken a look and it works GREAT. Thank you very much for all of your effort and expertise.  

    I am VERY happy with the results and am content to use the files just as they are, so if the following questions seem like I'm pushing your goodwill then feel free to ignore them without any concerns--I won't mind;   but if there is a simple way to do the following I would like to know:

    a) make a slideshow repeat continuously  without clicking on its left nav frame link again
    b) center the image window in the target frame.

    Again, though, I am very happy with it the current result--it's just what I had wanted to do. Thank you again.
    0
     
    LVL 26

    Expert Comment

    by:rdcpro
    Which version of WMP are you going to be using?  I think the code example I sent was for 6, not knowing which one you were going to use.  If you have time to go over some of the MSDN information on the WMP site, you can probably improve on what I posted.

    Version 7 and later have more features, but the object tag is a little different.  In Version 7 or later, you can use loop mode to endlessly loop the movie.  For loop and shuffle modes, Windows Media Player version 7.0 or later is required. For autoRewind and showFrame modes, Windows Media Player 9 Series or later is required.

    To set it to loop endlessly, add this PARAM tag:

       <PARAM NAME="Loop" VALUE="1">


    To center the tag, although you can use CSS on the OBJECT tag itself, creating a TABLE is probably easier for you.


    Anyway, there are a variety of parameters you can set for these things.  Here is a link that describes some of them:
    http://www.msdn.microsoft.com/library/en-us/wmplay10/mmp_sdk/paramtags.asp

    There is a playcount parameter that you can have a media item play any number of times; the default value is 1.  This is for Windows Media Player 7 or higher.  

    You can set the

    In fact, you can create your own images, and tie click events on them to control the player.  You can even create DHTML sliders (basically an image that the user drags) to adjust Volume, if you had audio in the movies.

    Here's some links for further reading, when you have time:

    A Jukebox:
    http://www.webreference.com/js/column51/index.html

    This article shows you how to detect whether WMP version 7 is installed.  In your case, you'll be using whatever version of the player you want:
    http://support.microsoft.com/default.aspx?scid=kb;EN-US;q279022

    This one is cool.  It shows you how to add external captions to your movie:
    http://cita.rehab.uiuc.edu/mediaplayer/sami-web.html


    Regards,
    Mike Sharp
    0
     

    Author Comment

    by:Harimogura
    Thanks Mike.  I have 7 on the laptop and 10 on my desktop. The basic slidshow worked for both of them. I will try out that "loop" tag later. I put the object in a table when I had some time and that worked. I will be checking out those links, for sure.

    Thank you again very much for your great help.
    0

    Write Comment

    Please enter a first name

    Please enter a last name

    We will never share this with anyone.

    Featured Post

    What Should I Do With This Threat Intelligence?

    Are you wondering if you actually need threat intelligence? The answer is yes. We explain the basics for creating useful threat intelligence.

    This article covers the basics of the Sass, which is a CSS extension language. You will learn about variables, mixins, and nesting.
    Styling your websites can become very complex. Here I'll show how SASS can help you better organize, maintain and reuse your CSS code.
    The viewer will learn how to look for a specific file type in a local or remote server directory using PHP.
    The viewer will receive an overview of the basics of CSS showing inline styles. In the head tags set up your style tags: (CODE) Reference the nav tag and set your properties.: (CODE) Set the reference for the UL element and styles for it to ensu…

    884 members asked questions and received personalized solutions in the past 7 days.

    Join the community of 500,000 technology professionals and ask your questions.

    Join & Ask a Question

    Need Help in Real-Time?

    Connect with top rated Experts

    22 Experts available now in Live!

    Get 1:1 Help Now