[Flash Pascal] Vidéo et comparatif

En ce qui concerne les vidéos, vive flash... On choisit une seule extension de fichier video pour construire son code sans être obligé d'en mettre 36.

J'ai repris l'exemple vidéo flashpascal pour lire une video mp4:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
 
program Video;
 
uses
  Flash8;
 
{$FRAME_WIDTH 640}
{$FRAME_HEIGHT 368}
{$BACKGROUND 0}
{$VIDEO name="my_video" depth="1" left="0" top="0" width="640" height="368"}
 
type
  MyNetStream = class(NetStream)
    procedure onStatus(infoObject: TInfoObject); override;
  end;
 
var
  nc: NetConnection;
  ns: MyNetStream;
  vo: Video external 'my_video';
 
procedure MyNetStream.onStatus(infoObject: TInfoObject);
begin
  if infoObject.code = 'NetStream.Buffer.Empty' then
    ns.play('vid.mp4');
end;
 
begin
  nc := NetConnection.Create;
  nc.connect(nil);
  ns := MyNetStream.Create(nc);
  vo.attachVideo(ns);
  ns.play('vid.mp4');
end.

et voici l'équivalent html5+javascript dans la balise canvas.
On pourrait sans doute utiliser window.requestAnimationFrame ici aussi...

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
 
<!DOCTYPE html>
<head>
 
<style>
body {
    background: black;
}
 
#cancan {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}
 
#vid {
    visibility:hidden;
}
</style>
 
</head>
 
<body>
 <canvas id=cancan></canvas>
 <video id=vid controls>
    <source src=vid.mp4 type=video/mp4> //à mettre un .ogv aussi
 </video>
 
<script>
    var myvideo = document.getElementById('vid');
    var canvas = document.getElementById('cancan');
    var cxt = canvas.getContext('2d');
    var h=canvas.height; //ce qui limite, c'est toujours la hauteur du navigateur
    var w=Math.floor(640*h/368);      //video 640x368 ici
    var x=Math.floor((canvas.width-w)/2);
 
function draw() {
    myvideo.play();  
    cxt.drawImage(myvideo,x,0,w,h);
}
 
 setInterval(draw, 10);
 
</script>
</body>
</html>