source: trunk/fl5/js/test/examples/almostuniform.html @ 2057

Revision 2057, 3.6 KB checked in by pablo, 17 months ago (diff)

Adds an enhancement where the player stretches the media to fit if the dimensions are close to uniform, but not exactly (1447)
Line 
1<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
2<html>
3    <head>
4        <title>"Almost Uniform" Example</title>
5        <script type="text/javascript" src="../../bin-debug/jwplayer.js">
6        </script>
7        <script type="text/javascript" src="settings.js">
8        </script>
9    </head>
10    <body>
11        <script type="text/javascript">
12            document.write("<h1>" + document.title + "</h1>");
13        </script>
14        <p>
15            This tests an enhancement which locks the media's dimensions to its container's dimensions if it's close (&lt; 5%)
16        </p>
17        <p>Rendering mode:
18            <select id="mode">
19              <option id="mode_html5" value="html5" selected="selected">HTML5</option>
20              <option id="mode_flash" value="flash">Flash</option>
21            </select>
22                        <button id="update" onclick="return setupAll();">Update</button>
23        </p>
24       
25                  <h3>Correct Dimensions</h3>
26        <div id="player_correct">
27                Player should replace this
28        </div>
29                  <h3>Vertical dimension too big (should correct)</h3>
30        <div id="player_off_vert">
31                Player should replace this
32        </div>
33                  <h3>Horizontal dimension too big (should correct)</h3>
34        <div id="player_off_horizontal">
35                Player should replace this
36        </div>
37                  <h3>Vertical dimension way too big (shouldn't correct)</h3>
38        <div id="player_way_off_vert">
39                Player should replace this
40        </div>
41                  <h3>Horizontal dimension way too big (shouldn't correct)</h3>
42        <div id="player_way_off_horizontal">
43                Player should replace this
44        </div>
45        <script type="text/javascript">
46                        setDefault("mode");
47       
48                function setupAll() {
49                var mode = document.getElementById('mode').value;
50
51                jwplayer("player_correct").setup({
52                                players: settings.modes[mode],
53                                                        width: 480,
54                                                        height: 270,
55                                                        stretching: "uniform",
56                                file: "http://content.bitsontherun.com/videos/gSzpo2wh-486405.mp4",
57                                        image: "http://content.bitsontherun.com/thumbs/gSzpo2wh-480.jpg"
58                });
59                jwplayer("player_off_vert").setup({
60                                players: settings.modes[mode],
61                                                        width: 480,
62                                                        height: 280,
63                                                        stretching: "uniform",
64                                file: "http://content.bitsontherun.com/videos/gSzpo2wh-486405.mp4",
65                                        image: "http://content.bitsontherun.com/thumbs/gSzpo2wh-480.jpg"
66                });
67                jwplayer("player_off_horizontal").setup({
68                                players: settings.modes[mode],
69                                                        width: 500,
70                                                        height: 270,
71                                                        stretching: "uniform",
72                                file: "http://content.bitsontherun.com/videos/gSzpo2wh-486405.mp4",
73                                        image: "http://content.bitsontherun.com/thumbs/gSzpo2wh-480.jpg"
74                });
75                jwplayer("player_way_off_vert").setup({
76                                players: settings.modes[mode],
77                                                        width: 480,
78                                                        height: 320,
79                                                        stretching: "uniform",
80                                file: "http://content.bitsontherun.com/videos/gSzpo2wh-486405.mp4",
81                                        image: "http://content.bitsontherun.com/thumbs/gSzpo2wh-480.jpg"
82                });
83                jwplayer("player_way_off_horizontal").setup({
84                                players: settings.modes[mode],
85                                                        width: 530,
86                                                        height: 270,
87                                                        stretching: "uniform",
88                                file: "http://content.bitsontherun.com/videos/gSzpo2wh-486405.mp4",
89                                        image: "http://content.bitsontherun.com/thumbs/gSzpo2wh-480.jpg"
90                });
91                }
92                  setupAll();
93        </script>
94        <h3>HTML code</h3>
95    </body>
96</html>
Note: See TracBrowser for help on using the repository browser.