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