update
This commit is contained in:
user
BIN
audio.opus
Normal file
BIN
audio.opus
Normal file
Binary file not shown.
BIN
audio2.ogg
Normal file
BIN
audio2.ogg
Normal file
Binary file not shown.
132
css/style.css
Normal file
132
css/style.css
Normal file
@@ -0,0 +1,132 @@
|
|||||||
|
/* ************** ALLGEMEIN ****************************************
|
||||||
|
*****************************************************************/
|
||||||
|
|
||||||
|
*{
|
||||||
|
margin: 0px;
|
||||||
|
padding: 0px;
|
||||||
|
font-family: Arial, sans-serif;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
html body{
|
||||||
|
background: #FFF;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ************** LAYOUT ****************************************
|
||||||
|
*****************************************************************/
|
||||||
|
|
||||||
|
#wrapper {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
background:linear-gradient(to bottom, rgba(0,0,0,0) 80%,rgba(0,0,0,0.65) 100%);
|
||||||
|
}
|
||||||
|
|
||||||
|
#mlibheader{
|
||||||
|
width: 100%;
|
||||||
|
height: 20%;
|
||||||
|
max-height: 100px;
|
||||||
|
min-height: 50px;
|
||||||
|
line-height: 100px;
|
||||||
|
float: left;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 48px;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #FFF;
|
||||||
|
background: linear-gradient(to right, rgba(207,231,250,1) 0%,rgba(99,147,193,1) 100%);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
#breadcrumb{
|
||||||
|
height:10%;
|
||||||
|
width: 100%;
|
||||||
|
max-height:30px;
|
||||||
|
min-height: 10px;
|
||||||
|
float:left;
|
||||||
|
border-top: 1px solid #ccc;
|
||||||
|
border-bottom: 1px solid #ccc;
|
||||||
|
background: rgba(155,155,155,1);
|
||||||
|
}
|
||||||
|
|
||||||
|
#contentwrapper {
|
||||||
|
padding-top: 1%;
|
||||||
|
width: 100%;
|
||||||
|
height:50%;
|
||||||
|
float:left;
|
||||||
|
}
|
||||||
|
|
||||||
|
#sidenav {
|
||||||
|
width: 29%;
|
||||||
|
float:left;
|
||||||
|
height:49%;
|
||||||
|
}
|
||||||
|
|
||||||
|
#playersec {
|
||||||
|
width: 40%;
|
||||||
|
float:left;
|
||||||
|
margin-left: 1%;
|
||||||
|
margin-right : 1%;
|
||||||
|
margin-bottom: auto;
|
||||||
|
background: linear-gradient(to bottom, rgba(155,155,155,1) 0%,rgba(14,14,14,1) 100%);
|
||||||
|
vertical-align: bottom;
|
||||||
|
}
|
||||||
|
#timeline {
|
||||||
|
height: 90%;
|
||||||
|
}
|
||||||
|
#player {
|
||||||
|
height: 10%;
|
||||||
|
}
|
||||||
|
#playerlistsec {
|
||||||
|
width: 29%;
|
||||||
|
float:left;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
footer{
|
||||||
|
height: 20%;
|
||||||
|
width: 100%;
|
||||||
|
float:left;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ************** NAV ****************************************
|
||||||
|
*****************************************************************/
|
||||||
|
#playerlistsec.menu {
|
||||||
|
list-style-type: none;
|
||||||
|
width: 97%;
|
||||||
|
}
|
||||||
|
#playerlistsec .menu li {
|
||||||
|
height: 5%;
|
||||||
|
min-height: 50px;
|
||||||
|
line-height: 50px;
|
||||||
|
list-style-type: none;
|
||||||
|
text-align: center;
|
||||||
|
vertical-align: middle;
|
||||||
|
margin-bottom: 1%;
|
||||||
|
background: linear-gradient(to bottom, rgba(207,231,250,1) 0%,rgba(99,147,193,1) 100%);
|
||||||
|
cursor: pointer;
|
||||||
|
float: left;
|
||||||
|
|
||||||
|
}
|
||||||
|
#playerlistsec .menu li.subli{
|
||||||
|
width: auto;
|
||||||
|
height: 3%;
|
||||||
|
min-height: 30px;
|
||||||
|
line-height: 30px;
|
||||||
|
margin: 1%;
|
||||||
|
padding-left: 5px;
|
||||||
|
padding-right: 5px;
|
||||||
|
float: left;
|
||||||
|
background: linear-gradient(to left, rgba(207,231,250,1) 0%,rgba(99,147,193,1) 100%);
|
||||||
|
}
|
||||||
|
|
||||||
|
#sidenav li {
|
||||||
|
height: 50px;
|
||||||
|
width: 100px;
|
||||||
|
|
||||||
|
}
|
||||||
|
#sidenav ul {
|
||||||
|
margin-left: 50px;
|
||||||
|
}
|
||||||
|
|
||||||
80
index.html
Normal file
80
index.html
Normal file
@@ -0,0 +1,80 @@
|
|||||||
|
<!doctype html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<title>Mlib5</title>
|
||||||
|
<meta name="robots" content="noindex, nofollow">
|
||||||
|
<meta name="creator" content="stubbfel">
|
||||||
|
<meta http-equiv="content-type" content="text/html; charset=UTF-8" >
|
||||||
|
|
||||||
|
<link rel="stylesheet" type="text/css" href="css/style.css" title="style">
|
||||||
|
</head>
|
||||||
|
<body onload="pageLoad();">
|
||||||
|
<div id="wrapper">
|
||||||
|
<header id="mlibheader">
|
||||||
|
mlib5
|
||||||
|
</header>
|
||||||
|
<div id="breadcrumb"></div>
|
||||||
|
<div id="contentwrapper">
|
||||||
|
<nav id="sidenav">
|
||||||
|
<ul>
|
||||||
|
<li>item1</li>
|
||||||
|
<li>item2</li>
|
||||||
|
<li>item3</li>
|
||||||
|
<li>subitem1</li>
|
||||||
|
<li>subitem2</li>
|
||||||
|
<li>item4</li>
|
||||||
|
</ul>
|
||||||
|
</nav>
|
||||||
|
|
||||||
|
<section id="playersec">
|
||||||
|
<div id="timeline">test</div>
|
||||||
|
<audio controls autoplay id="player">
|
||||||
|
<source id ="playersource" src="audio.ogg">;
|
||||||
|
</audio>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<nav id="playerlistsec">
|
||||||
|
<ul class="menu">
|
||||||
|
<li onclick="jump('audio.ogg#t=3000','Kapitel1')">Kapitel1</li>
|
||||||
|
<li class="subli" onclick="jump('audio.ogg#t=3000','Kapitel1')">UnterKapitel1</li>
|
||||||
|
<li class="subli" onclick="jump('audio.ogg#t=6000','Kapitel2')">UnterKapitel2</li>
|
||||||
|
<li class="subli" onclick="jump('audio.ogg#t=9000','Kapitel3')">UnterKapitel3</li>
|
||||||
|
<li onclick="jump('audio2.ogg#t=5000','Kapitel4')">Kapitel4</li>
|
||||||
|
</ul>
|
||||||
|
</nav>
|
||||||
|
</div>
|
||||||
|
<footer></footer>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
var actTitle = "start";
|
||||||
|
var bread = document.getElementById('breadcrumb');
|
||||||
|
var player = document.getElementById('player');
|
||||||
|
var mediaSource = document.getElementById('playersource');
|
||||||
|
|
||||||
|
function pageLoad() {
|
||||||
|
player.addEventListener('timeupdate', timeUpdate);
|
||||||
|
player.addEventListener('onended', trackEndet);
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
function jump(newSrc,newTitle) {
|
||||||
|
mediaSource.src = newSrc;
|
||||||
|
actTitle = newTitle;
|
||||||
|
player.load();
|
||||||
|
}
|
||||||
|
|
||||||
|
function timeUpdate() {
|
||||||
|
|
||||||
|
if (player.currentTime > 9000) {
|
||||||
|
actTitle = 'Kapitelbread2';
|
||||||
|
}
|
||||||
|
bread.innerHTML = actTitle;
|
||||||
|
}
|
||||||
|
|
||||||
|
function trackEndet() {
|
||||||
|
bread.innerHTML = actTitle;
|
||||||
|
}
|
||||||
|
</script>
|
||||||
13
js/cheapter.js
Normal file
13
js/cheapter.js
Normal file
@@ -0,0 +1,13 @@
|
|||||||
|
/*
|
||||||
|
* To change this template, choose Tools | Templates
|
||||||
|
* and open the template in the editor.
|
||||||
|
*/
|
||||||
|
|
||||||
|
|
||||||
|
function Cheapter() {
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
function isCurrentCheapter(id, time) {
|
||||||
|
|
||||||
|
}
|
||||||
13
js/episode.js
Normal file
13
js/episode.js
Normal file
@@ -0,0 +1,13 @@
|
|||||||
|
/*
|
||||||
|
* To change this template, choose Tools | Templates
|
||||||
|
* and open the template in the editor.
|
||||||
|
*/
|
||||||
|
|
||||||
|
|
||||||
|
function Episiode(name) {
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
function getnextTrack() {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
3
js/newjson.json
Normal file
3
js/newjson.json
Normal file
@@ -0,0 +1,3 @@
|
|||||||
|
{
|
||||||
|
"name": "user"
|
||||||
|
}
|
||||||
6
js/season.js
Normal file
6
js/season.js
Normal file
@@ -0,0 +1,6 @@
|
|||||||
|
/*
|
||||||
|
* To change this template, choose Tools | Templates
|
||||||
|
* and open the template in the editor.
|
||||||
|
*/
|
||||||
|
|
||||||
|
|
||||||
6
js/title.js
Normal file
6
js/title.js
Normal file
@@ -0,0 +1,6 @@
|
|||||||
|
/*
|
||||||
|
* To change this template, choose Tools | Templates
|
||||||
|
* and open the template in the editor.
|
||||||
|
*/
|
||||||
|
|
||||||
|
|
||||||
16
js/track.js
Normal file
16
js/track.js
Normal file
@@ -0,0 +1,16 @@
|
|||||||
|
/*
|
||||||
|
* To change this template, choose Tools | Templates
|
||||||
|
* and open the template in the editor.
|
||||||
|
*/
|
||||||
|
|
||||||
|
function Track() {
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
function getnextCheapter() {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
|
||||||
|
function isCurrentTrack(id) {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
5
nbproject/project.properties
Normal file
5
nbproject/project.properties
Normal file
@@ -0,0 +1,5 @@
|
|||||||
|
config.folder=
|
||||||
|
file.reference.html5-mlib5=.
|
||||||
|
files.encoding=UTF-8
|
||||||
|
site.root.folder=${file.reference.html5-mlib5}
|
||||||
|
test.folder=
|
||||||
9
nbproject/project.xml
Normal file
9
nbproject/project.xml
Normal file
@@ -0,0 +1,9 @@
|
|||||||
|
<?xml version="1.0" encoding="UTF-8"?>
|
||||||
|
<project xmlns="http://www.netbeans.org/ns/project/1">
|
||||||
|
<type>org.netbeans.modules.web.clientproject</type>
|
||||||
|
<configuration>
|
||||||
|
<data xmlns="http://www.netbeans.org/ns/clientside-project/1">
|
||||||
|
<name>mlib5</name>
|
||||||
|
</data>
|
||||||
|
</configuration>
|
||||||
|
</project>
|
||||||
Reference in New Issue
Block a user