mirror of
https://github.com/Eaglercraft-TeaVM-Fork/eagler-teavm.git
synced 2024-12-22 16:14:10 -08:00
Adds HTML5 Video Demo Application
This commit is contained in:
Junji Takakura
parent
ec4e4a9771
commit
14a6c099d9
|
|
@ -32,5 +32,6 @@
|
||||||
<modules>
|
<modules>
|
||||||
<module>teavm-samples-hello</module>
|
<module>teavm-samples-hello</module>
|
||||||
<module>teavm-samples-benchmark</module>
|
<module>teavm-samples-benchmark</module>
|
||||||
|
<module>teavm-samples-video</module>
|
||||||
</modules>
|
</modules>
|
||||||
</project>
|
</project>
|
||||||
110
teavm-samples/teavm-samples-video/pom.xml
Normal file
110
teavm-samples/teavm-samples-video/pom.xml
Normal file
|
|
@ -0,0 +1,110 @@
|
||||||
|
<!--
|
||||||
|
Copyright 2015 Alexey Andreev.
|
||||||
|
|
||||||
|
Licensed under the Apache License, Version 2.0 (the "License");
|
||||||
|
you may not use this file except in compliance with the License.
|
||||||
|
You may obtain a copy of the License at
|
||||||
|
|
||||||
|
http://www.apache.org/licenses/LICENSE-2.0
|
||||||
|
|
||||||
|
Unless required by applicable law or agreed to in writing, software
|
||||||
|
distributed under the License is distributed on an "AS IS" BASIS,
|
||||||
|
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||||
|
See the License for the specific language governing permissions and
|
||||||
|
limitations under the License.
|
||||||
|
-->
|
||||||
|
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
|
||||||
|
xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
|
||||||
|
<modelVersion>4.0.0</modelVersion>
|
||||||
|
|
||||||
|
<parent>
|
||||||
|
<groupId>org.teavm</groupId>
|
||||||
|
<artifactId>teavm-samples</artifactId>
|
||||||
|
<version>0.3.0-SNAPSHOT</version>
|
||||||
|
</parent>
|
||||||
|
<artifactId>teavm-samples-video</artifactId>
|
||||||
|
|
||||||
|
<packaging>war</packaging>
|
||||||
|
|
||||||
|
<name>TeaVM HTML5 video web application</name>
|
||||||
|
<description>A sample application that shows HTML5 video implementation for TeaVM</description>
|
||||||
|
|
||||||
|
<dependencies>
|
||||||
|
<dependency>
|
||||||
|
<groupId>org.teavm</groupId>
|
||||||
|
<artifactId>teavm-classlib</artifactId>
|
||||||
|
<version>${project.version}</version>
|
||||||
|
</dependency>
|
||||||
|
<dependency>
|
||||||
|
<groupId>org.teavm</groupId>
|
||||||
|
<artifactId>teavm-jso</artifactId>
|
||||||
|
<version>${project.version}</version>
|
||||||
|
</dependency>
|
||||||
|
<dependency>
|
||||||
|
<groupId>org.teavm</groupId>
|
||||||
|
<artifactId>teavm-dom</artifactId>
|
||||||
|
<version>${project.version}</version>
|
||||||
|
</dependency>
|
||||||
|
<dependency>
|
||||||
|
<groupId>javax.servlet</groupId>
|
||||||
|
<artifactId>javax.servlet-api</artifactId>
|
||||||
|
<version>3.1.0</version>
|
||||||
|
<scope>provided</scope>
|
||||||
|
</dependency>
|
||||||
|
</dependencies>
|
||||||
|
|
||||||
|
<build>
|
||||||
|
<plugins>
|
||||||
|
<plugin>
|
||||||
|
<artifactId>maven-war-plugin</artifactId>
|
||||||
|
<version>2.4</version>
|
||||||
|
<configuration>
|
||||||
|
<webResources>
|
||||||
|
<resource>
|
||||||
|
<directory>${project.build.directory}/generated/js</directory>
|
||||||
|
</resource>
|
||||||
|
</webResources>
|
||||||
|
</configuration>
|
||||||
|
</plugin>
|
||||||
|
<plugin>
|
||||||
|
<groupId>org.teavm</groupId>
|
||||||
|
<artifactId>teavm-maven-plugin</artifactId>
|
||||||
|
<version>${project.version}</version>
|
||||||
|
<executions>
|
||||||
|
<execution>
|
||||||
|
<id>web-client</id>
|
||||||
|
<phase>prepare-package</phase>
|
||||||
|
<goals>
|
||||||
|
<goal>build-javascript</goal>
|
||||||
|
</goals>
|
||||||
|
<configuration>
|
||||||
|
<targetDirectory>${project.build.directory}/generated/js/teavm</targetDirectory>
|
||||||
|
<mainClass>org.teavm.samples.video.Player</mainClass>
|
||||||
|
<runtime>SEPARATE</runtime>
|
||||||
|
<minifying>false</minifying>
|
||||||
|
<debugInformationGenerated>true</debugInformationGenerated>
|
||||||
|
<sourceMapsGenerated>true</sourceMapsGenerated>
|
||||||
|
<sourceFilesCopied>true</sourceFilesCopied>
|
||||||
|
</configuration>
|
||||||
|
</execution>
|
||||||
|
</executions>
|
||||||
|
</plugin>
|
||||||
|
<plugin>
|
||||||
|
<groupId>org.apache.maven.plugins</groupId>
|
||||||
|
<artifactId>maven-checkstyle-plugin</artifactId>
|
||||||
|
<configuration>
|
||||||
|
<configLocation>../../checkstyle.xml</configLocation>
|
||||||
|
<propertyExpansion>config_loc=${basedir}/../..</propertyExpansion>
|
||||||
|
</configuration>
|
||||||
|
</plugin>
|
||||||
|
<plugin>
|
||||||
|
<groupId>org.apache.maven.plugins</groupId>
|
||||||
|
<artifactId>maven-source-plugin</artifactId>
|
||||||
|
</plugin>
|
||||||
|
<plugin>
|
||||||
|
<groupId>org.apache.maven.plugins</groupId>
|
||||||
|
<artifactId>maven-javadoc-plugin</artifactId>
|
||||||
|
</plugin>
|
||||||
|
</plugins>
|
||||||
|
</build>
|
||||||
|
</project>
|
||||||
|
|
@ -0,0 +1,221 @@
|
||||||
|
/*
|
||||||
|
* Copyright 2014 Alexey Andreev.
|
||||||
|
*
|
||||||
|
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||||
|
* you may not use this file except in compliance with the License.
|
||||||
|
* You may obtain a copy of the License at
|
||||||
|
*
|
||||||
|
* http://www.apache.org/licenses/LICENSE-2.0
|
||||||
|
*
|
||||||
|
* Unless required by applicable law or agreed to in writing, software
|
||||||
|
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||||
|
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||||
|
* See the License for the specific language governing permissions and
|
||||||
|
* limitations under the License.
|
||||||
|
*/
|
||||||
|
package org.teavm.samples.video;
|
||||||
|
|
||||||
|
import org.teavm.dom.browser.Window;
|
||||||
|
import org.teavm.dom.events.Event;
|
||||||
|
import org.teavm.dom.events.EventListener;
|
||||||
|
import org.teavm.dom.html.HTMLBodyElement;
|
||||||
|
import org.teavm.dom.html.HTMLButtonElement;
|
||||||
|
import org.teavm.dom.html.HTMLDocument;
|
||||||
|
import org.teavm.dom.html.HTMLElement;
|
||||||
|
import org.teavm.dom.html.HTMLSourceElement;
|
||||||
|
import org.teavm.dom.html.HTMLVideoElement;
|
||||||
|
import org.teavm.jso.JS;
|
||||||
|
|
||||||
|
public final class Player {
|
||||||
|
|
||||||
|
private static Window window = (Window)JS.getGlobal();
|
||||||
|
private static HTMLDocument document = window.getDocument();
|
||||||
|
|
||||||
|
private Player() {
|
||||||
|
}
|
||||||
|
|
||||||
|
public static void main(String[] args) {
|
||||||
|
HTMLSourceElement sourceMp4 = (HTMLSourceElement)document.createElement("source");
|
||||||
|
sourceMp4.setAttribute("id", "mp4");
|
||||||
|
sourceMp4.setSrc("http://media.w3.org/2010/05/sintel/trailer.mp4");
|
||||||
|
sourceMp4.setAttribute("type", "video/mp4");
|
||||||
|
|
||||||
|
HTMLSourceElement sourceWebm = (HTMLSourceElement)document.createElement("source");
|
||||||
|
sourceWebm.setAttribute("id", "webm");
|
||||||
|
sourceWebm.setSrc("http://media.w3.org/2010/05/sintel/trailer.webm");
|
||||||
|
sourceWebm.setAttribute("type", "video/webm");
|
||||||
|
|
||||||
|
HTMLSourceElement sourceOgv = (HTMLSourceElement)document.createElement("source");
|
||||||
|
sourceOgv.setAttribute("id", "ogv");
|
||||||
|
sourceOgv.setSrc("http://media.w3.org/2010/05/sintel/trailer.ogv");
|
||||||
|
sourceOgv.setAttribute("type", "video/ogg");
|
||||||
|
|
||||||
|
HTMLElement p = document.createElement("p");
|
||||||
|
p.appendChild(document.createTextNode("Your user agent does not support the HTML5 Video element."));
|
||||||
|
|
||||||
|
final HTMLVideoElement video = (HTMLVideoElement)document.createElement("video");
|
||||||
|
video.setAttribute("id", "video");
|
||||||
|
video.setControls(true);
|
||||||
|
video.setPreload("none");
|
||||||
|
video.setMediaGroup("myVideoGroup");
|
||||||
|
video.setPoster("http://media.w3.org/2010/05/sintel/poster.png");
|
||||||
|
video.appendChild(sourceMp4);
|
||||||
|
video.appendChild(sourceWebm);
|
||||||
|
video.appendChild(sourceOgv);
|
||||||
|
video.appendChild(p);
|
||||||
|
|
||||||
|
HTMLElement divVideo = document.createElement("div");
|
||||||
|
divVideo.appendChild(video);
|
||||||
|
|
||||||
|
HTMLButtonElement loadButton = (HTMLButtonElement)document.createElement("button");
|
||||||
|
loadButton.appendChild(document.createTextNode("load()"));
|
||||||
|
loadButton.addEventListener("click", new EventListener() {
|
||||||
|
@Override
|
||||||
|
public void handleEvent(Event evt) {
|
||||||
|
video.load();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
HTMLButtonElement playButton = (HTMLButtonElement)document.createElement("button");
|
||||||
|
playButton.appendChild(document.createTextNode("play()"));
|
||||||
|
playButton.addEventListener("click", new EventListener() {
|
||||||
|
@Override
|
||||||
|
public void handleEvent(Event evt) {
|
||||||
|
video.play();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
HTMLButtonElement pauseButton = (HTMLButtonElement)document.createElement("button");
|
||||||
|
pauseButton.appendChild(document.createTextNode("pause()"));
|
||||||
|
pauseButton.addEventListener("click", new EventListener() {
|
||||||
|
@Override
|
||||||
|
public void handleEvent(Event evt) {
|
||||||
|
video.pause();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
HTMLButtonElement currentTimePlusButton = (HTMLButtonElement)document.createElement("button");
|
||||||
|
currentTimePlusButton.appendChild(document.createTextNode("currentTime+=10"));
|
||||||
|
currentTimePlusButton.addEventListener("click", new EventListener() {
|
||||||
|
@Override
|
||||||
|
public void handleEvent(Event evt) {
|
||||||
|
video.getController().setCurrentTime(video.getController().getCurrentTime() + 10);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
HTMLButtonElement currentTimeMinusButton = (HTMLButtonElement)document.createElement("button");
|
||||||
|
currentTimeMinusButton.appendChild(document.createTextNode("currentTime-=10"));
|
||||||
|
currentTimeMinusButton.addEventListener("click", new EventListener() {
|
||||||
|
@Override
|
||||||
|
public void handleEvent(Event evt) {
|
||||||
|
video.getController().setCurrentTime(video.getController().getCurrentTime() - 10);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
HTMLButtonElement currentTime50Button = (HTMLButtonElement)document.createElement("button");
|
||||||
|
currentTime50Button.appendChild(document.createTextNode("currentTime=50"));
|
||||||
|
currentTime50Button.addEventListener("click", new EventListener() {
|
||||||
|
@Override
|
||||||
|
public void handleEvent(Event evt) {
|
||||||
|
video.getController().setCurrentTime(50);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
HTMLButtonElement playbackRateIncrementButton = (HTMLButtonElement)document.createElement("button");
|
||||||
|
playbackRateIncrementButton.appendChild(document.createTextNode("playbackRate++"));
|
||||||
|
playbackRateIncrementButton.addEventListener("click", new EventListener() {
|
||||||
|
@Override
|
||||||
|
public void handleEvent(Event evt) {
|
||||||
|
video.getController().setPlaybackRate(video.getController().getPlaybackRate() + 1);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
HTMLButtonElement playbackRateDecrementButton = (HTMLButtonElement)document.createElement("button");
|
||||||
|
playbackRateDecrementButton.appendChild(document.createTextNode("playbackRate--"));
|
||||||
|
playbackRateDecrementButton.addEventListener("click", new EventListener() {
|
||||||
|
@Override
|
||||||
|
public void handleEvent(Event evt) {
|
||||||
|
video.getController().setPlaybackRate(video.getController().getPlaybackRate() - 1);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
HTMLButtonElement playbackRatePlusButton = (HTMLButtonElement)document.createElement("button");
|
||||||
|
playbackRatePlusButton.appendChild(document.createTextNode("playbackRate+=0.1"));
|
||||||
|
playbackRatePlusButton.addEventListener("click", new EventListener() {
|
||||||
|
@Override
|
||||||
|
public void handleEvent(Event evt) {
|
||||||
|
video.getController().setPlaybackRate(video.getController().getPlaybackRate() + 0.1);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
HTMLButtonElement playbackRateMinusButton = (HTMLButtonElement)document.createElement("button");
|
||||||
|
playbackRateMinusButton.appendChild(document.createTextNode("playbackRate-=0.1"));
|
||||||
|
playbackRateMinusButton.addEventListener("click", new EventListener() {
|
||||||
|
@Override
|
||||||
|
public void handleEvent(Event evt) {
|
||||||
|
video.getController().setPlaybackRate(video.getController().getPlaybackRate() - 0.1);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
HTMLButtonElement volumePlusButton = (HTMLButtonElement)document.createElement("button");
|
||||||
|
volumePlusButton.appendChild(document.createTextNode("volume+=0.1"));
|
||||||
|
volumePlusButton.addEventListener("click", new EventListener() {
|
||||||
|
@Override
|
||||||
|
public void handleEvent(Event evt) {
|
||||||
|
video.getController().setVolume(video.getController().getVolume() + 0.1f);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
HTMLButtonElement volumeMinusButton = (HTMLButtonElement)document.createElement("button");
|
||||||
|
volumeMinusButton.appendChild(document.createTextNode("volume-=0.1"));
|
||||||
|
volumeMinusButton.addEventListener("click", new EventListener() {
|
||||||
|
@Override
|
||||||
|
public void handleEvent(Event evt) {
|
||||||
|
video.getController().setVolume(video.getController().getVolume() - 0.1f);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
HTMLButtonElement muteButton = (HTMLButtonElement)document.createElement("button");
|
||||||
|
muteButton.appendChild(document.createTextNode("muted=true"));
|
||||||
|
muteButton.addEventListener("click", new EventListener() {
|
||||||
|
@Override
|
||||||
|
public void handleEvent(Event evt) {
|
||||||
|
video.getController().setMuted(true);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
HTMLButtonElement unmuteButton = (HTMLButtonElement)document.createElement("button");
|
||||||
|
unmuteButton.appendChild(document.createTextNode("muted=false"));
|
||||||
|
unmuteButton.addEventListener("click", new EventListener() {
|
||||||
|
@Override
|
||||||
|
public void handleEvent(Event evt) {
|
||||||
|
video.getController().setMuted(false);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
HTMLElement divButtons = document.createElement("div");
|
||||||
|
divButtons.setAttribute("id", "buttons");
|
||||||
|
divButtons.appendChild(loadButton);
|
||||||
|
divButtons.appendChild(playButton);
|
||||||
|
divButtons.appendChild(pauseButton);
|
||||||
|
divButtons.appendChild(document.createElement("br"));
|
||||||
|
divButtons.appendChild(currentTimePlusButton);
|
||||||
|
divButtons.appendChild(currentTimeMinusButton);
|
||||||
|
divButtons.appendChild(currentTime50Button);
|
||||||
|
divButtons.appendChild(document.createElement("br"));
|
||||||
|
divButtons.appendChild(playbackRateIncrementButton);
|
||||||
|
divButtons.appendChild(playbackRateDecrementButton);
|
||||||
|
divButtons.appendChild(playbackRatePlusButton);
|
||||||
|
divButtons.appendChild(playbackRateMinusButton);
|
||||||
|
divButtons.appendChild(document.createElement("br"));
|
||||||
|
divButtons.appendChild(volumePlusButton);
|
||||||
|
divButtons.appendChild(volumeMinusButton);
|
||||||
|
divButtons.appendChild(muteButton);
|
||||||
|
divButtons.appendChild(unmuteButton);
|
||||||
|
|
||||||
|
HTMLBodyElement body = document.getBody();
|
||||||
|
body.appendChild(divVideo);
|
||||||
|
body.appendChild(divButtons);
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,21 @@
|
||||||
|
<?xml version="1.0" encoding="UTF-8"?>
|
||||||
|
<!--
|
||||||
|
Copyright 2015 Alexey Andreev.
|
||||||
|
|
||||||
|
Licensed under the Apache License, Version 2.0 (the "License");
|
||||||
|
you may not use this file except in compliance with the License.
|
||||||
|
You may obtain a copy of the License at
|
||||||
|
|
||||||
|
http://www.apache.org/licenses/LICENSE-2.0
|
||||||
|
|
||||||
|
Unless required by applicable law or agreed to in writing, software
|
||||||
|
distributed under the License is distributed on an "AS IS" BASIS,
|
||||||
|
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||||
|
See the License for the specific language governing permissions and
|
||||||
|
limitations under the License.
|
||||||
|
-->
|
||||||
|
<web-app xmlns="http://java.sun.com/xml/ns/javaee"
|
||||||
|
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
|
||||||
|
xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd"
|
||||||
|
version="3.0">
|
||||||
|
</web-app>
|
||||||
28
teavm-samples/teavm-samples-video/src/main/webapp/index.html
Normal file
28
teavm-samples/teavm-samples-video/src/main/webapp/index.html
Normal file
|
|
@ -0,0 +1,28 @@
|
||||||
|
<!--
|
||||||
|
Copyright 2015 Alexey Andreev.
|
||||||
|
|
||||||
|
Licensed under the Apache License, Version 2.0 (the "License");
|
||||||
|
you may not use this file except in compliance with the License.
|
||||||
|
You may obtain a copy of the License at
|
||||||
|
|
||||||
|
http://www.apache.org/licenses/LICENSE-2.0
|
||||||
|
|
||||||
|
Unless required by applicable law or agreed to in writing, software
|
||||||
|
distributed under the License is distributed on an "AS IS" BASIS,
|
||||||
|
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||||
|
See the License for the specific language governing permissions and
|
||||||
|
limitations under the License.
|
||||||
|
-->
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<title>HTML5 Video web application</title>
|
||||||
|
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
|
||||||
|
<script type="text/javascript" charset="utf-8" src="teavm/runtime.js"></script>
|
||||||
|
<script type="text/javascript" charset="utf-8" src="teavm/classes.js"></script>
|
||||||
|
<link href="style.css" rel="stylesheet" type="text/css">
|
||||||
|
</head>
|
||||||
|
<body onload="main()">
|
||||||
|
<h1>HTML5 Video web application</h1>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
12
teavm-samples/teavm-samples-video/src/main/webapp/style.css
Normal file
12
teavm-samples/teavm-samples-video/src/main/webapp/style.css
Normal file
|
|
@ -0,0 +1,12 @@
|
||||||
|
video {
|
||||||
|
border: 1px solid black;
|
||||||
|
padding: 0; margin: 0;
|
||||||
|
width: 427px;
|
||||||
|
height: 240px;
|
||||||
|
background-color: black;
|
||||||
|
margin: auto;
|
||||||
|
float: left;
|
||||||
|
}
|
||||||
|
#buttons {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
Loading…
Reference in New Issue
Block a user