forked from leftypol/leftypol
Merge branch 'master' of github.com:vichan-devel/Tinyboard into br-integration
This commit is contained in:
commit
bfc4df8276
106 changed files with 36269 additions and 10914 deletions
|
@ -2,7 +2,7 @@ $(document).ready(function(){
|
|||
$("#attention_bar").click(function(eO){ $("#attention_bar").css("display","none");
|
||||
$("#attention_bar_form").css("display","block"); });
|
||||
$.get(configRoot + "attentionbar.txt", function(data) {
|
||||
$("#attention_bar").text(data);
|
||||
$("#attention_bar_input").val(data);
|
||||
$("#attention_bar").html(data);
|
||||
$("#attention_bar_input").val($("#attention_bar").text());
|
||||
});
|
||||
});
|
||||
|
|
242
js/expand-video.js
Normal file
242
js/expand-video.js
Normal file
|
@ -0,0 +1,242 @@
|
|||
/* This file is dedicated to the public domain; you may do as you wish with it. */
|
||||
/* Note: This code expects the global variable configRoot to be set. */
|
||||
|
||||
if (typeof _ == 'undefined') {
|
||||
var _ = function(a) { return a; };
|
||||
}
|
||||
|
||||
function setupVideo(thumb, url) {
|
||||
if (thumb.videoAlreadySetUp) return;
|
||||
thumb.videoAlreadySetUp = true;
|
||||
|
||||
var video = null;
|
||||
var videoContainer, videoHide;
|
||||
var expanded = false;
|
||||
var hovering = false;
|
||||
var loop = true;
|
||||
var loopControls = [document.createElement("span"), document.createElement("span")];
|
||||
var fileInfo = thumb.parentNode.querySelector(".fileinfo");
|
||||
var mouseDown = false;
|
||||
|
||||
function unexpand() {
|
||||
if (expanded) {
|
||||
expanded = false;
|
||||
if (video.pause) video.pause();
|
||||
videoContainer.style.display = "none";
|
||||
thumb.style.display = "inline";
|
||||
video.style.maxWidth = "inherit";
|
||||
video.style.maxHeight = "inherit";
|
||||
}
|
||||
}
|
||||
|
||||
function unhover() {
|
||||
if (hovering) {
|
||||
hovering = false;
|
||||
if (video.pause) video.pause();
|
||||
videoContainer.style.display = "none";
|
||||
video.style.maxWidth = "inherit";
|
||||
video.style.maxHeight = "inherit";
|
||||
}
|
||||
}
|
||||
|
||||
// Create video element if does not exist yet
|
||||
function getVideo() {
|
||||
if (video == null) {
|
||||
video = document.createElement("video");
|
||||
video.src = url;
|
||||
video.loop = loop;
|
||||
video.innerText = _("Your browser does not support HTML5 video.");
|
||||
|
||||
videoHide = document.createElement("img");
|
||||
videoHide.src = configRoot + "static/collapse.gif";
|
||||
videoHide.alt = "[ - ]";
|
||||
videoHide.title = "Collapse video";
|
||||
videoHide.style.marginLeft = "-15px";
|
||||
videoHide.style.cssFloat = "left";
|
||||
videoHide.addEventListener("click", unexpand, false);
|
||||
|
||||
videoContainer = document.createElement("div");
|
||||
videoContainer.style.paddingLeft = "15px";
|
||||
videoContainer.style.display = "none";
|
||||
videoContainer.appendChild(videoHide);
|
||||
videoContainer.appendChild(video);
|
||||
thumb.parentNode.insertBefore(videoContainer, thumb.nextSibling);
|
||||
|
||||
// Dragging to the left collapses the video
|
||||
video.addEventListener("mousedown", function(e) {
|
||||
if (e.button == 0) mouseDown = true;
|
||||
}, false);
|
||||
video.addEventListener("mouseup", function(e) {
|
||||
if (e.button == 0) mouseDown = false;
|
||||
}, false);
|
||||
video.addEventListener("mouseenter", function(e) {
|
||||
mouseDown = false;
|
||||
}, false);
|
||||
video.addEventListener("mouseout", function(e) {
|
||||
if (mouseDown && e.clientX - video.getBoundingClientRect().left <= 0) {
|
||||
unexpand();
|
||||
}
|
||||
mouseDown = false;
|
||||
}, false);
|
||||
}
|
||||
}
|
||||
|
||||
// Clicking on thumbnail expands video
|
||||
thumb.addEventListener("click", function(e) {
|
||||
if (setting("videoexpand") && !e.shiftKey && !e.ctrlKey && !e.altKey && !e.metaKey) {
|
||||
getVideo();
|
||||
expanded = true;
|
||||
hovering = false;
|
||||
|
||||
video.style.position = "static";
|
||||
video.style.pointerEvents = "inherit";
|
||||
video.style.display = "inline";
|
||||
videoHide.style.display = "inline";
|
||||
videoContainer.style.display = "block";
|
||||
videoContainer.style.position = "static";
|
||||
thumb.style.display = "none";
|
||||
|
||||
video.muted = (setting("videovolume") == 0);
|
||||
video.volume = setting("videovolume");
|
||||
video.controls = true;
|
||||
if (video.readyState == 0) {
|
||||
video.addEventListener("loadedmetadata", expand2, false);
|
||||
} else {
|
||||
setTimeout(expand2, 0);
|
||||
}
|
||||
video.play();
|
||||
e.preventDefault();
|
||||
}
|
||||
}, false);
|
||||
|
||||
function expand2() {
|
||||
video.style.maxWidth = "100%";
|
||||
video.style.maxHeight = window.innerHeight + "px";
|
||||
var bottom = video.getBoundingClientRect().bottom;
|
||||
if (bottom > window.innerHeight) {
|
||||
window.scrollBy(0, bottom - window.innerHeight);
|
||||
}
|
||||
// work around Firefox volume control bug
|
||||
video.volume = Math.max(setting("videovolume") - 0.001, 0);
|
||||
video.volume = setting("videovolume");
|
||||
}
|
||||
|
||||
// Hovering over thumbnail displays video
|
||||
thumb.addEventListener("mouseover", function(e) {
|
||||
if (setting("videohover")) {
|
||||
getVideo();
|
||||
expanded = false;
|
||||
hovering = true;
|
||||
|
||||
var docRight = document.documentElement.getBoundingClientRect().right;
|
||||
var thumbRight = thumb.querySelector("img, video").getBoundingClientRect().right;
|
||||
var maxWidth = docRight - thumbRight - 20;
|
||||
if (maxWidth < 250) maxWidth = 250;
|
||||
|
||||
video.style.position = "fixed";
|
||||
video.style.right = "0px";
|
||||
video.style.top = "0px";
|
||||
var docRight = document.documentElement.getBoundingClientRect().right;
|
||||
var thumbRight = thumb.querySelector("img, video").getBoundingClientRect().right;
|
||||
video.style.maxWidth = maxWidth + "px";
|
||||
video.style.maxHeight = "100%";
|
||||
video.style.pointerEvents = "none";
|
||||
|
||||
video.style.display = "inline";
|
||||
videoHide.style.display = "none";
|
||||
videoContainer.style.display = "inline";
|
||||
videoContainer.style.position = "fixed";
|
||||
|
||||
video.muted = (setting("videovolume") == 0);
|
||||
video.volume = setting("videovolume");
|
||||
video.controls = false;
|
||||
video.play();
|
||||
}
|
||||
}, false);
|
||||
|
||||
thumb.addEventListener("mouseout", unhover, false);
|
||||
|
||||
// Scroll wheel on thumbnail adjusts default volume
|
||||
thumb.addEventListener("wheel", function(e) {
|
||||
if (setting("videohover")) {
|
||||
var volume = setting("videovolume");
|
||||
if (e.deltaY > 0) volume -= 0.1;
|
||||
if (e.deltaY < 0) volume += 0.1;
|
||||
if (volume < 0) volume = 0;
|
||||
if (volume > 1) volume = 1;
|
||||
if (video != null) {
|
||||
video.muted = (volume == 0);
|
||||
video.volume = volume;
|
||||
}
|
||||
changeSetting("videovolume", volume);
|
||||
e.preventDefault();
|
||||
}
|
||||
}, false);
|
||||
|
||||
// [play once] vs [loop] controls
|
||||
function setupLoopControl(i) {
|
||||
loopControls[i].addEventListener("click", function(e) {
|
||||
loop = (i != 0);
|
||||
thumb.href = thumb.href.replace(/([\?&])loop=\d+/, "$1loop=" + i);
|
||||
if (video != null) {
|
||||
video.loop = loop;
|
||||
if (loop && video.currentTime >= video.duration) {
|
||||
video.currentTime = 0;
|
||||
}
|
||||
}
|
||||
loopControls[i].style.fontWeight = "bold";
|
||||
loopControls[1-i].style.fontWeight = "inherit";
|
||||
}, false);
|
||||
}
|
||||
|
||||
loopControls[0].textContent = _("[play once]");
|
||||
loopControls[1].textContent = _("[loop]");
|
||||
loopControls[1].style.fontWeight = "bold";
|
||||
for (var i = 0; i < 2; i++) {
|
||||
setupLoopControl(i);
|
||||
loopControls[i].style.whiteSpace = "nowrap";
|
||||
fileInfo.appendChild(document.createTextNode(" "));
|
||||
fileInfo.appendChild(loopControls[i]);
|
||||
}
|
||||
}
|
||||
|
||||
function setupVideosIn(element) {
|
||||
var thumbs = element.querySelectorAll("a.file");
|
||||
for (var i = 0; i < thumbs.length; i++) {
|
||||
if (/\.webm$/.test(thumbs[i].pathname)) {
|
||||
setupVideo(thumbs[i], thumbs[i].href);
|
||||
} else {
|
||||
var m = thumbs[i].search.match(/\bv=([^&]*)/);
|
||||
if (m != null) {
|
||||
var url = decodeURIComponent(m[1]);
|
||||
if (/\.webm$/.test(url)) setupVideo(thumbs[i], url);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
onready(function(){
|
||||
// Insert menu from settings.js
|
||||
if (typeof settingsMenu != "undefined") document.body.insertBefore(settingsMenu, document.getElementsByTagName("hr")[0]);
|
||||
|
||||
// Setup Javascript events for videos in document now
|
||||
setupVideosIn(document);
|
||||
|
||||
// Setup Javascript events for videos added by updater
|
||||
if (window.MutationObserver) {
|
||||
var observer = new MutationObserver(function(mutations) {
|
||||
for (var i = 0; i < mutations.length; i++) {
|
||||
var additions = mutations[i].addedNodes;
|
||||
if (additions == null) continue;
|
||||
for (var j = 0; j < additions.length; j++) {
|
||||
var node = additions[j];
|
||||
if (node.nodeType == 1) {
|
||||
setupVideosIn(node);
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
observer.observe(document.body, {childList: true, subtree: true});
|
||||
}
|
||||
});
|
||||
|
|
@ -35,6 +35,8 @@ $(document).ready(function(){
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
var fields_to_hide = 'div.post,div.video-container,video,img,p.fileinfo,a.hide-thread-link,br';
|
||||
|
||||
var do_hide_threads = function() {
|
||||
var id = $(this).children('p.intro').children('a.post_no:eq(1)').text();
|
||||
|
@ -52,7 +54,7 @@ $(document).ready(function(){
|
|||
hidden_data[board][id] = Math.round(Date.now() / 1000);
|
||||
store_data();
|
||||
|
||||
thread_container.find('div.post,div.video-container,img,p.fileinfo,a.hide-thread-link,br').hide();
|
||||
thread_container.find(fields_to_hide).hide();
|
||||
|
||||
var hidden_div = thread_container.find('div.post.op > p.intro').clone();
|
||||
hidden_div.addClass('thread-hidden');
|
||||
|
@ -65,7 +67,8 @@ $(document).ready(function(){
|
|||
.click(function() {
|
||||
delete hidden_data[board][id];
|
||||
store_data();
|
||||
thread_container.find('div.post,div.video-container,img,p.fileinfo,a.hide-thread-link,br').show();
|
||||
thread_container.find(fields_to_hide).show();
|
||||
thread_container.find(".hidden").hide();
|
||||
$(this).remove();
|
||||
hidden_div.remove();
|
||||
});
|
||||
|
|
|
@ -36,6 +36,7 @@
|
|||
display: block;\
|
||||
padding: 0 0 0 0;\
|
||||
width: 300px;\
|
||||
z-index: 100;\
|
||||
}\
|
||||
#quick-reply table {\
|
||||
border-collapse: collapse;\
|
||||
|
|
87
js/webm-settings.js
Normal file
87
js/webm-settings.js
Normal file
|
@ -0,0 +1,87 @@
|
|||
/* This file is dedicated to the public domain; you may do as you wish with it. */
|
||||
|
||||
if (typeof _ == 'undefined') {
|
||||
var _ = function(a) { return a; };
|
||||
}
|
||||
|
||||
// Default settings
|
||||
var defaultSettings = {
|
||||
"videoexpand": true,
|
||||
"videohover": false,
|
||||
"videovolume": 1.0
|
||||
};
|
||||
|
||||
// Non-persistent settings for when localStorage is absent/disabled
|
||||
var tempSettings = {};
|
||||
|
||||
// Scripts obtain settings by calling this function
|
||||
function setting(name) {
|
||||
if (localStorage) {
|
||||
if (localStorage[name] === undefined) return defaultSettings[name];
|
||||
return JSON.parse(localStorage[name]);
|
||||
} else {
|
||||
if (tempSettings[name] === undefined) return defaultSettings[name];
|
||||
return tempSettings[name];
|
||||
}
|
||||
}
|
||||
|
||||
// Settings should be changed with this function
|
||||
function changeSetting(name, value) {
|
||||
if (localStorage) {
|
||||
localStorage[name] = JSON.stringify(value);
|
||||
} else {
|
||||
tempSettings[name] = value;
|
||||
}
|
||||
}
|
||||
|
||||
// Create settings menu
|
||||
var settingsMenu = document.createElement("div");
|
||||
settingsMenu.style.textAlign = "right";
|
||||
settingsMenu.style.background = "inherit";
|
||||
|
||||
settingsMenu.innerHTML = '<a class="unimportant" href="javascript:void(0)"><span>'+_('WebM Settings')+'</span></a>'
|
||||
+ '<div style="display: none; text-align: left; position: absolute; right: 1em; margin-left: -999em; margin-top: -1px; padding-top: 1px; background: inherit;">'
|
||||
+ '<label><input type="checkbox" name="videoexpand">'+_('Expand videos inline')+'</label><br>'
|
||||
+ '<label><input type="checkbox" name="videohover">'+_('Play videos on hover')+'</label><br>'
|
||||
+ '<label><input type="range" name="videovolume" min="0" max="1" step="0.01" style="width: 4em; height: 1ex; vertical-align: middle; margin: 0px;">'+_('Default volume')+'</label><br>'
|
||||
+ '</div>';
|
||||
|
||||
function refreshSettings() {
|
||||
var settingsItems = settingsMenu.getElementsByTagName("input");
|
||||
for (var i = 0; i < settingsItems.length; i++) {
|
||||
var control = settingsItems[i];
|
||||
if (control.type == "checkbox") {
|
||||
control.checked = setting(control.name);
|
||||
} else if (control.type == "range") {
|
||||
control.value = setting(control.name);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function setupControl(control) {
|
||||
if (control.addEventListener) control.addEventListener("change", function(e) {
|
||||
if (control.type == "checkbox") {
|
||||
changeSetting(control.name, control.checked);
|
||||
} else if (control.type == "range") {
|
||||
changeSetting(control.name, control.value);
|
||||
}
|
||||
}, false);
|
||||
}
|
||||
|
||||
refreshSettings();
|
||||
var settingsItems = settingsMenu.getElementsByTagName("input");
|
||||
for (var i = 0; i < settingsItems.length; i++) {
|
||||
setupControl(settingsItems[i]);
|
||||
}
|
||||
|
||||
if (settingsMenu.addEventListener) {
|
||||
settingsMenu.addEventListener("mouseover", function(e) {
|
||||
refreshSettings();
|
||||
settingsMenu.getElementsByTagName("span")[0].style.fontWeight = "bold";
|
||||
settingsMenu.getElementsByTagName("div")[0].style.display = "block";
|
||||
}, false);
|
||||
settingsMenu.addEventListener("mouseout", function(e) {
|
||||
settingsMenu.getElementsByTagName("span")[0].style.fontWeight = "normal";
|
||||
settingsMenu.getElementsByTagName("div")[0].style.display = "none";
|
||||
}, false);
|
||||
}
|
28
js/webm/playersettings.js
Normal file
28
js/webm/playersettings.js
Normal file
|
@ -0,0 +1,28 @@
|
|||
/* This file is dedicated to the public domain; you may do as you wish with it. */
|
||||
if (window.addEventListener) window.addEventListener("load", function(e) {
|
||||
document.getElementById("playerheader").appendChild(settingsMenu);
|
||||
|
||||
var video = document.getElementsByTagName("video")[0];
|
||||
|
||||
var loopLinks = [document.getElementById("loop0"), document.getElementById("loop1")];
|
||||
function setupLoopLink(i) {
|
||||
loopLinks[i].addEventListener("click", function(e) {
|
||||
if (!e.shiftKey && !e.ctrlKey && !e.altKey && !e.metaKey) {
|
||||
video.loop = (i != 0);
|
||||
if (i != 0 && video.currentTime >= video.duration) {
|
||||
video.currentTime = 0;
|
||||
}
|
||||
loopLinks[i].style.fontWeight = "bold";
|
||||
loopLinks[1-i].style.fontWeight = "inherit";
|
||||
e.preventDefault();
|
||||
}
|
||||
}, false);
|
||||
}
|
||||
for (var i = 0; i < 2; i++) {
|
||||
setupLoopLink(i);
|
||||
}
|
||||
|
||||
video.muted = (setting("videovolume") == 0);
|
||||
video.volume = setting("videovolume");
|
||||
video.play();
|
||||
}, false);
|
Loading…
Add table
Add a link
Reference in a new issue