mirror of
https://github.com/mitb-archive/filebot
synced 2024-11-17 23:05:03 -05:00
* simplify and unify getting started pages & js
This commit is contained in:
parent
9745647987
commit
5f3289a7f6
@ -1,58 +1,13 @@
|
|||||||
<!doctype html>
|
|
||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
|
<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
|
||||||
<script src="galleria/galleria-1.4.2.min.js"></script>
|
<script src="galleria/galleria-1.4.2.min.js"></script>
|
||||||
<script src="galleria/themes/classic/galleria.classic.min.js"></script>
|
<script src="galleria/themes/classic/galleria.classic.min.js"></script>
|
||||||
|
<script src="index.js"></script>
|
||||||
<link rel="stylesheet" href="galleria/themes/classic/galleria.classic.css">
|
<link rel="stylesheet" href="galleria/themes/classic/galleria.classic.css">
|
||||||
<style>
|
<link rel="stylesheet" href="index.css">
|
||||||
body{ margin: 0; padding: 0; background: #000; }
|
|
||||||
div.galleria{ width: 100%; height: 100%; background: #000; position: absolute; top: 0; bottom: 0; }
|
|
||||||
div.galleria-thumbnails { margin: auto; }
|
|
||||||
div.galleria-thumbnails-list div.galleria-image { max-height: 20px; }
|
|
||||||
</style>
|
|
||||||
<title>Getting Started</title>
|
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body onload="runGalleria()">
|
||||||
<div class="galleria"></div>
|
<div class="galleria"></div>
|
||||||
<script>
|
|
||||||
var data = [
|
|
||||||
{ link: 'https://www.youtube.com/watch?v=RRq2_Pjyko8&index=1&list=PLdPvEJhzxLMCEJJpb1mJtVkOpS7FfALnd', image: 'images/rename.png', thumb: 'images/rename.thumb.png' },
|
|
||||||
{ link: 'https://www.youtube.com/watch?v=btNSv7AnMMw&index=2&list=PLdPvEJhzxLMCEJJpb1mJtVkOpS7FfALnd', image: 'images/episodes.png', thumb: 'images/episodes.thumb.png' },
|
|
||||||
{ link: 'https://www.youtube.com/watch?v=q-oZ_hovsTY&index=3&list=PLdPvEJhzxLMCEJJpb1mJtVkOpS7FfALnd', image: 'images/subtitle-hash-lookup.png', thumb: 'images/subtitle-hash-lookup.thumb.png' },
|
|
||||||
{ link: 'https://www.youtube.com/watch?v=R80tKtHf4zw&index=4&list=PLdPvEJhzxLMCEJJpb1mJtVkOpS7FfALnd', image: 'images/subtitle-search.png', thumb: 'images/subtitle-search.thumb.png' },
|
|
||||||
{ link: 'https://www.youtube.com/watch?v=4KWkSPr3fQY&index=5&list=PLdPvEJhzxLMCEJJpb1mJtVkOpS7FfALnd', image: 'images/sfv.png', thumb: 'images/sfv.thumb.png' }
|
|
||||||
];
|
|
||||||
|
|
||||||
if (location.hash == '#mas') {
|
|
||||||
data.splice(1, 0, { image: 'images/permissions.png', thumb: 'images/permissions.thumb.png' }) // sandbox permissions
|
|
||||||
} else if (location.hash == '#usc') {
|
|
||||||
data[0].link = 'https://www.youtube.com/watch?v=sEFP3CsntNs&index=6&list=PLdPvEJhzxLMCEJJpb1mJtVkOpS7FfALnd' // ubuntu video
|
|
||||||
}
|
|
||||||
|
|
||||||
Galleria.run('.galleria', {
|
|
||||||
popupLinks: true,
|
|
||||||
dataSource: data,
|
|
||||||
maxScaleRatio: 1,
|
|
||||||
youtube: {
|
|
||||||
VQ: 'HD1080'
|
|
||||||
},
|
|
||||||
thumbnails: 'lazy'
|
|
||||||
});
|
|
||||||
|
|
||||||
var loaded = true
|
|
||||||
Galleria.ready(function() {
|
|
||||||
this.bind("image", function(e) {
|
|
||||||
if (loaded) {
|
|
||||||
loaded = false
|
|
||||||
this.lazyLoadChunks( data.length )
|
|
||||||
}
|
|
||||||
});
|
|
||||||
this.attachKeyboard({
|
|
||||||
left: this.prev,
|
|
||||||
right: this.next
|
|
||||||
});
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
@ -1,33 +0,0 @@
|
|||||||
|
|
||||||
function isFullScreen() {
|
|
||||||
return (document.fullScreenElement && document.fullScreenElement !== null) || document.mozFullScreen || document.webkitIsFullScreen;
|
|
||||||
}
|
|
||||||
|
|
||||||
function requestFullScreen(element) {
|
|
||||||
if (element.requestFullscreen)
|
|
||||||
element.requestFullscreen();
|
|
||||||
else if (element.msRequestFullscreen)
|
|
||||||
element.msRequestFullscreen();
|
|
||||||
else if (element.mozRequestFullScreen)
|
|
||||||
element.mozRequestFullScreen();
|
|
||||||
else if (element.webkitRequestFullscreen)
|
|
||||||
element.webkitRequestFullscreen();
|
|
||||||
}
|
|
||||||
|
|
||||||
function exitFullScreen() {
|
|
||||||
if (document.exitFullscreen)
|
|
||||||
document.exitFullscreen();
|
|
||||||
else if (document.msExitFullscreen)
|
|
||||||
document.msExitFullscreen();
|
|
||||||
else if (document.mozCancelFullScreen)
|
|
||||||
document.mozCancelFullScreen();
|
|
||||||
else if (document.webkitExitFullscreen)
|
|
||||||
document.webkitExitFullscreen();
|
|
||||||
}
|
|
||||||
|
|
||||||
function toggleFullScreen(element) {
|
|
||||||
if (isFullScreen())
|
|
||||||
exitFullScreen();
|
|
||||||
else
|
|
||||||
requestFullScreen(element || document.documentElement);
|
|
||||||
}
|
|
31
website/getting-started/index.css
Normal file
31
website/getting-started/index.css
Normal file
@ -0,0 +1,31 @@
|
|||||||
|
body {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
background: #000;
|
||||||
|
}
|
||||||
|
|
||||||
|
div.galleria {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
background: #000;
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
bottom: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
div.galleria-thumbnails {
|
||||||
|
margin: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
div.galleria-thumbnails-list div.galleria-image {
|
||||||
|
max-height: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
img.fullscreen {
|
||||||
|
position: absolute;
|
||||||
|
top: 5px;
|
||||||
|
right: 5px;
|
||||||
|
z-index: 10;
|
||||||
|
cursor: pointer;
|
||||||
|
opacity: 0.3
|
||||||
|
}
|
@ -1,61 +1,15 @@
|
|||||||
<!doctype html>
|
|
||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
|
<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
|
||||||
<script src="galleria/galleria-1.4.2.min.js"></script>
|
<script src="galleria/galleria-1.4.2.min.js"></script>
|
||||||
<script src="galleria/themes/classic/galleria.classic.min.js"></script>
|
<script src="galleria/themes/classic/galleria.classic.min.js"></script>
|
||||||
<script src="fullscreen.js"></script>
|
<script src="index.js"></script>
|
||||||
<link rel="stylesheet" href="galleria/themes/classic/galleria.classic.css">
|
<link rel="stylesheet" href="galleria/themes/classic/galleria.classic.css">
|
||||||
<style>
|
<link rel="stylesheet" href="index.css">
|
||||||
body{ margin: 0; padding: 0; background: #000; }
|
|
||||||
div.galleria{ width: 100%; height: 100%; background: #000; position: absolute; top: 0; bottom: 0; }
|
|
||||||
div.galleria-thumbnails { margin: auto; }
|
|
||||||
div.galleria-thumbnails-list div.galleria-image { max-height: 20px; }
|
|
||||||
img.fullscreen { position: absolute; top: 5px; right: 5px; z-index: 10; cursor: pointer; opacity: 0.3 }
|
|
||||||
</style>
|
|
||||||
<title>Getting Started</title>
|
<title>Getting Started</title>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body onload="runGalleria()">
|
||||||
<img class="fullscreen" src="fullscreen.png" width="16" height="16" onclick="toggleFullScreen()" />
|
<img class="fullscreen" src="fullscreen.png" width="16" height="16" onclick="toggleFullScreen()" />
|
||||||
<div class="galleria"></div>
|
<div class="galleria"></div>
|
||||||
<script>
|
|
||||||
var data = [
|
|
||||||
{ iframe: 'videos/rename.mp4', image: 'images/rename.png', thumb: 'images/rename.thumb.png' },
|
|
||||||
{ iframe: 'videos/episodes.mp4', image: 'images/episodes.png', thumb: 'images/episodes.thumb.png' },
|
|
||||||
{ iframe: 'videos/subtitle-lookup.mp4', image: 'images/subtitle-hash-lookup.png', thumb: 'images/subtitle-hash-lookup.thumb.png' },
|
|
||||||
{ iframe: 'videos/subtitle-search.mp4', image: 'images/subtitle-search.png', thumb: 'images/subtitle-search.thumb.png' },
|
|
||||||
{ iframe: 'videos/sfv.mp4', image: 'images/sfv.png', thumb: 'images/sfv.thumb.png' },
|
|
||||||
{ image: 'images/rename.screenshot.png', thumb: 'images/rename.screenshot.thumb.png' },
|
|
||||||
{ image: 'images/format.screenshot.png', thumb: 'images/format.screenshot.thumb.png' },
|
|
||||||
{ image: 'images/subtitle-hash-lookup.screenshot.png', thumb: 'images/subtitle-hash-lookup.screenshot.thumb.png' },
|
|
||||||
{ image: 'images/subtitle-search.screenshot.png', thumb: 'images/subtitle-search.screenshot.thumb.png' },
|
|
||||||
{ image: 'images/sfv.screenshot.png', thumb: 'images/sfv.screenshot.thumb.png' },
|
|
||||||
{ image: 'images/cli.screenshot.png', thumb: 'images/cli.screenshot.thumb.png' },
|
|
||||||
{ image: 'images/node.screenshot.png', thumb: 'images/node.screenshot.thumb.png' }
|
|
||||||
];
|
|
||||||
|
|
||||||
Galleria.run('.galleria', {
|
|
||||||
dataSource: data,
|
|
||||||
maxScaleRatio: 1,
|
|
||||||
youtube: {
|
|
||||||
VQ: 'HD1080'
|
|
||||||
},
|
|
||||||
thumbnails: 'lazy'
|
|
||||||
});
|
|
||||||
|
|
||||||
var loaded = true
|
|
||||||
Galleria.ready(function() {
|
|
||||||
this.bind("image", function(e) {
|
|
||||||
if (loaded) {
|
|
||||||
loaded = false
|
|
||||||
this.lazyLoadChunks( data.length )
|
|
||||||
}
|
|
||||||
});
|
|
||||||
this.attachKeyboard({
|
|
||||||
left: this.prev,
|
|
||||||
right: this.next
|
|
||||||
});
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
139
website/getting-started/index.js
Normal file
139
website/getting-started/index.js
Normal file
@ -0,0 +1,139 @@
|
|||||||
|
|
||||||
|
function getData() {
|
||||||
|
var data = [{
|
||||||
|
link: 'https://www.youtube.com/watch?v=RRq2_Pjyko8&index=1&list=PLdPvEJhzxLMCEJJpb1mJtVkOpS7FfALnd',
|
||||||
|
video: 'http://app.filebot.net/getting-started/videos/rename.mp4',
|
||||||
|
image: 'images/rename.png',
|
||||||
|
thumb: 'images/rename.thumb.png'
|
||||||
|
}, {
|
||||||
|
link: 'https://www.youtube.com/watch?v=btNSv7AnMMw&index=2&list=PLdPvEJhzxLMCEJJpb1mJtVkOpS7FfALnd',
|
||||||
|
video: 'http://app.filebot.net/getting-started/videos/episodes.mp4',
|
||||||
|
image: 'images/episodes.png',
|
||||||
|
thumb: 'images/episodes.thumb.png'
|
||||||
|
}, {
|
||||||
|
link: 'https://www.youtube.com/watch?v=q-oZ_hovsTY&index=3&list=PLdPvEJhzxLMCEJJpb1mJtVkOpS7FfALnd',
|
||||||
|
video: 'http://app.filebot.net/getting-started/videos/subtitle-lookup.mp4',
|
||||||
|
image: 'images/subtitle-hash-lookup.png',
|
||||||
|
thumb: 'images/subtitle-hash-lookup.thumb.png'
|
||||||
|
}, {
|
||||||
|
link: 'https://www.youtube.com/watch?v=R80tKtHf4zw&index=4&list=PLdPvEJhzxLMCEJJpb1mJtVkOpS7FfALnd',
|
||||||
|
video: 'http://app.filebot.net/getting-started/videos/subtitle-search.mp4',
|
||||||
|
image: 'images/subtitle-search.png',
|
||||||
|
thumb: 'images/subtitle-search.thumb.png'
|
||||||
|
}, {
|
||||||
|
link: 'https://www.youtube.com/watch?v=4KWkSPr3fQY&index=5&list=PLdPvEJhzxLMCEJJpb1mJtVkOpS7FfALnd',
|
||||||
|
video: 'http://app.filebot.net/getting-started/videos/sfv.mp4',
|
||||||
|
image: 'images/sfv.png',
|
||||||
|
thumb: 'images/sfv.thumb.png'
|
||||||
|
}, {
|
||||||
|
image: 'images/rename.screenshot.png',
|
||||||
|
thumb: 'images/rename.screenshot.thumb.png'
|
||||||
|
}, {
|
||||||
|
image: 'images/format.screenshot.png',
|
||||||
|
thumb: 'images/format.screenshot.thumb.png'
|
||||||
|
}, {
|
||||||
|
image: 'images/subtitle-hash-lookup.screenshot.png',
|
||||||
|
thumb: 'images/subtitle-hash-lookup.screenshot.thumb.png'
|
||||||
|
}, {
|
||||||
|
image: 'images/subtitle-search.screenshot.png',
|
||||||
|
thumb: 'images/subtitle-search.screenshot.thumb.png'
|
||||||
|
}, {
|
||||||
|
image: 'images/sfv.screenshot.png',
|
||||||
|
thumb: 'images/sfv.screenshot.thumb.png'
|
||||||
|
}, {
|
||||||
|
image: 'images/cli.screenshot.png',
|
||||||
|
thumb: 'images/cli.screenshot.thumb.png'
|
||||||
|
}, {
|
||||||
|
image: 'images/node.screenshot.png',
|
||||||
|
thumb: 'images/node.screenshot.thumb.png'
|
||||||
|
}]
|
||||||
|
|
||||||
|
var links = location.hash.length > 0
|
||||||
|
var youtube = navigator.language != 'zh-cn' // YouTube is blocked in China (mainland)
|
||||||
|
|
||||||
|
if (links) {
|
||||||
|
data = data.slice(0, 5) // use only tutorial images
|
||||||
|
|
||||||
|
if (location.hash == '#mas') {
|
||||||
|
data.splice(1, 0, {
|
||||||
|
image: 'images/permissions.png',
|
||||||
|
thumb: 'images/permissions.thumb.png'
|
||||||
|
}) // sandbox permissions
|
||||||
|
} else if (location.hash == '#usc') {
|
||||||
|
data[0].link = 'https://www.youtube.com/watch?v=sEFP3CsntNs&index=6&list=PLdPvEJhzxLMCEJJpb1mJtVkOpS7FfALnd' // ubuntu video
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!links) {
|
||||||
|
data.forEach(function(it) {
|
||||||
|
it.video = it[youtube ? 'link' : 'video']
|
||||||
|
})
|
||||||
|
}
|
||||||
|
if (!youtube) {
|
||||||
|
data.forEach(function(it) {
|
||||||
|
it[links ? 'link' : 'iframe'] = it.video
|
||||||
|
delete it.video
|
||||||
|
})
|
||||||
|
}
|
||||||
|
return data
|
||||||
|
}
|
||||||
|
|
||||||
|
function runGalleria() {
|
||||||
|
var data = getData()
|
||||||
|
|
||||||
|
Galleria.run('.galleria', {
|
||||||
|
dataSource: data,
|
||||||
|
popupLinks: true,
|
||||||
|
maxScaleRatio: 1,
|
||||||
|
youtube: {
|
||||||
|
VQ: 'HD1080'
|
||||||
|
},
|
||||||
|
thumbnails: 'lazy'
|
||||||
|
})
|
||||||
|
|
||||||
|
Galleria.ready(function() {
|
||||||
|
this.bind("image", function(e) {
|
||||||
|
if (this.doLazyLoadChunks !== false) {
|
||||||
|
this.doLazyLoadChunks = false
|
||||||
|
this.lazyLoadChunks(data.length)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
this.attachKeyboard({
|
||||||
|
left: this.prev,
|
||||||
|
right: this.next
|
||||||
|
})
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
function isFullScreen() {
|
||||||
|
return (document.fullScreenElement && document.fullScreenElement !== null) || document.mozFullScreen || document.webkitIsFullScreen
|
||||||
|
}
|
||||||
|
|
||||||
|
function requestFullScreen(element) {
|
||||||
|
if (element.requestFullscreen)
|
||||||
|
element.requestFullscreen()
|
||||||
|
else if (element.msRequestFullscreen)
|
||||||
|
element.msRequestFullscreen()
|
||||||
|
else if (element.mozRequestFullScreen)
|
||||||
|
element.mozRequestFullScreen()
|
||||||
|
else if (element.webkitRequestFullscreen)
|
||||||
|
element.webkitRequestFullscreen()
|
||||||
|
}
|
||||||
|
|
||||||
|
function exitFullScreen() {
|
||||||
|
if (document.exitFullscreen)
|
||||||
|
document.exitFullscreen()
|
||||||
|
else if (document.msExitFullscreen)
|
||||||
|
document.msExitFullscreen()
|
||||||
|
else if (document.mozCancelFullScreen)
|
||||||
|
document.mozCancelFullScreen()
|
||||||
|
else if (document.webkitExitFullscreen)
|
||||||
|
document.webkitExitFullscreen()
|
||||||
|
}
|
||||||
|
|
||||||
|
function toggleFullScreen(element) {
|
||||||
|
if (isFullScreen())
|
||||||
|
exitFullScreen()
|
||||||
|
else
|
||||||
|
requestFullScreen(element || document.documentElement)
|
||||||
|
}
|
Loading…
Reference in New Issue
Block a user