mirror of
https://github.com/the1812/Bilibili-Evolved.git
synced 2025-11-04 21:22:45 +08:00
Update README, add original script
This commit is contained in:
parent
410685c73b
commit
f8132a21f5
@ -1,3 +1,4 @@
|
|||||||
# Bilibili-Evolved
|
# Bilibili-Evolved
|
||||||
增强哔哩哔哩Web端体验的油猴脚本.
|
增强哔哩哔哩Web端体验的油猴脚本.
|
||||||
(未完成)
|
|
||||||
|
作为[原脚本](bilibili-touch.js)的工程化形式,工程化目前未完成,完成之前可直接以使用原脚本.
|
||||||
|
|||||||
@ -8,6 +8,7 @@
|
|||||||
// @match *://*.bilibili.com
|
// @match *://*.bilibili.com
|
||||||
// @grant unsafeWindow
|
// @grant unsafeWindow
|
||||||
// @require https://static.hdslb.com/js/jquery.min.js
|
// @require https://static.hdslb.com/js/jquery.min.js
|
||||||
|
// @require https://raw.githubusercontent.com/the1812/Bilibili-Evolved/master/utils/common.min.js
|
||||||
// ==/UserScript==
|
// ==/UserScript==
|
||||||
|
|
||||||
(self$ =>
|
(self$ =>
|
||||||
@ -71,386 +72,17 @@
|
|||||||
// [New Styles -> Override Nav Bar]
|
// [New Styles -> Override Nav Bar]
|
||||||
// show top banner
|
// show top banner
|
||||||
showBanner: true
|
showBanner: true
|
||||||
// [Not used]
|
|
||||||
// (Experimental) use dominant color of banner image
|
|
||||||
// useDominantColor: false
|
|
||||||
};
|
};
|
||||||
for (const key in userSettings)
|
for (const key in userSettings)
|
||||||
{
|
{
|
||||||
settings[key] = userSettings[key];
|
settings[key] = userSettings[key];
|
||||||
}
|
}
|
||||||
|
|
||||||
const $ = unsafeWindow.$ || self$;
|
const $ = unsafeWindow.$ || self$;
|
||||||
const waitForQuery = () =>
|
|
||||||
{
|
|
||||||
const MaxRetry = settings.maxQueryRetry;
|
|
||||||
let retry = 0;
|
|
||||||
const tryQuery = (query, condition, action, failed) =>
|
|
||||||
{
|
|
||||||
if (retry >= MaxRetry)
|
|
||||||
{
|
|
||||||
if (failed)
|
|
||||||
{
|
|
||||||
failed();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
else
|
|
||||||
{
|
|
||||||
const result = query();
|
|
||||||
if (condition(result))
|
|
||||||
{
|
|
||||||
action(result);
|
|
||||||
}
|
|
||||||
else
|
|
||||||
{
|
|
||||||
retry++;
|
|
||||||
setTimeout(() => tryQuery(query, condition, action, failed), settings.queryInterval);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
return tryQuery;
|
|
||||||
};
|
|
||||||
const getEventHandler = (element, event) =>
|
const getEventHandler = (element, event) =>
|
||||||
{
|
{
|
||||||
return element.data("events")[event][0].handler;
|
return element.data("events")[event][0].handler;
|
||||||
};
|
};
|
||||||
const getPosition = element =>
|
|
||||||
{
|
|
||||||
let x = 0;
|
|
||||||
let y = 0;
|
|
||||||
while (element && !isNaN(element.offsetLeft) && !isNaN(element.offsetTop))
|
|
||||||
{
|
|
||||||
x += element.offsetLeft - element.scrollLeft;
|
|
||||||
y += element.offsetTop - element.scrollTop;
|
|
||||||
element = element.offsetParent;
|
|
||||||
}
|
|
||||||
return { x: x, y: y };
|
|
||||||
};
|
|
||||||
class Swiper
|
|
||||||
{
|
|
||||||
constructor(element)
|
|
||||||
{
|
|
||||||
this.action = new SwipeAction(element);
|
|
||||||
this.onTouchStart = undefined;
|
|
||||||
this.onTouchEnd = undefined;
|
|
||||||
this._direction = null;
|
|
||||||
|
|
||||||
element.addEventListener("touchstart", e =>
|
|
||||||
{
|
|
||||||
this._xDown = e.touches[0].clientX;
|
|
||||||
this._yDown = e.touches[0].clientY;
|
|
||||||
if (this.onTouchStart)
|
|
||||||
{
|
|
||||||
this.onTouchStart(e);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
element.addEventListener("touchmove", e =>
|
|
||||||
{
|
|
||||||
if (!this._xDown || !this._yDown)
|
|
||||||
{
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
const xUp = e.touches[0].clientX;
|
|
||||||
const yUp = e.touches[0].clientY;
|
|
||||||
const elementPosition = getPosition(element);
|
|
||||||
const position = {
|
|
||||||
x: (e.touches[0].pageX - elementPosition.x) / element.clientWidth,
|
|
||||||
y: (e.touches[0].pageY - elementPosition.y) / element.clientHeight,
|
|
||||||
width: element.clientWidth,
|
|
||||||
height: element.clientHeight
|
|
||||||
};
|
|
||||||
|
|
||||||
const xDiff = this._xDown - xUp;
|
|
||||||
const yDiff = this._yDown - yUp;
|
|
||||||
|
|
||||||
if (!this._direction)
|
|
||||||
{
|
|
||||||
let direction = "";
|
|
||||||
if (Math.abs(xDiff) > Math.abs(yDiff))
|
|
||||||
{
|
|
||||||
direction = "horizontal";
|
|
||||||
}
|
|
||||||
else
|
|
||||||
{
|
|
||||||
direction = "vertical";
|
|
||||||
}
|
|
||||||
this._direction = direction;
|
|
||||||
e.preventDefault();
|
|
||||||
}
|
|
||||||
else
|
|
||||||
{
|
|
||||||
if (this._direction === "vertical")
|
|
||||||
{
|
|
||||||
this.action.startAction(this._direction, yDiff, position);
|
|
||||||
}
|
|
||||||
else if (this._direction === "horizontal")
|
|
||||||
{
|
|
||||||
this.action.startAction(this._direction, -xDiff, position);
|
|
||||||
}
|
|
||||||
e.preventDefault();
|
|
||||||
}
|
|
||||||
|
|
||||||
});
|
|
||||||
element.addEventListener("touchend", e =>
|
|
||||||
{
|
|
||||||
this._xDown = null;
|
|
||||||
this._yDown = null;
|
|
||||||
this._direction = null;
|
|
||||||
if (this.onTouchEnd)
|
|
||||||
{
|
|
||||||
this.onTouchEnd(e);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
class SwipeAction
|
|
||||||
{
|
|
||||||
constructor(element)
|
|
||||||
{
|
|
||||||
this.lowSpeedForward = undefined;
|
|
||||||
this.lowSpeedBackward = undefined;
|
|
||||||
this.mediumSpeedForward = undefined;
|
|
||||||
this.mediumSpeedBackward = undefined;
|
|
||||||
this.highSpeedForward = undefined;
|
|
||||||
this.highSpeedBackward = undefined;
|
|
||||||
|
|
||||||
this.lowVolumeUp = undefined;
|
|
||||||
this.lowVolumeDown = undefined;
|
|
||||||
this.mediumVolumeUp = undefined;
|
|
||||||
this.mediumVolumeDown = undefined;
|
|
||||||
this.highVolumeUp = undefined;
|
|
||||||
this.highVolumeDown = undefined;
|
|
||||||
|
|
||||||
this.speedCancel = undefined;
|
|
||||||
this.volumeCancel = undefined;
|
|
||||||
this.minSwipeDistance = 20;
|
|
||||||
this.onActionStart = undefined;
|
|
||||||
this.onActionEnd = undefined;
|
|
||||||
|
|
||||||
this._element = element;
|
|
||||||
this._touchStart = false;
|
|
||||||
this._startPosition = null;
|
|
||||||
this._lastAction = null;
|
|
||||||
element.addEventListener("touchstart", () =>
|
|
||||||
{
|
|
||||||
this._touchStart = true;
|
|
||||||
});
|
|
||||||
element.addEventListener("touchend", () =>
|
|
||||||
{
|
|
||||||
this._startPosition = null;
|
|
||||||
this.onActionEnd && this.onActionEnd(this._lastAction);
|
|
||||||
this._lastAction = null;
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
startAction(direction, distance, position)
|
|
||||||
{
|
|
||||||
if (this._touchStart)
|
|
||||||
{
|
|
||||||
this.onActionStart && this.onActionStart();
|
|
||||||
this._startPosition = position;
|
|
||||||
this._touchStart = false;
|
|
||||||
}
|
|
||||||
if (direction === "vertical")
|
|
||||||
{
|
|
||||||
if (Math.abs(distance) < this.minSwipeDistance)
|
|
||||||
{
|
|
||||||
this.volumeCancel && this.volumeCancel();
|
|
||||||
this._lastAction = null;
|
|
||||||
}
|
|
||||||
else
|
|
||||||
{
|
|
||||||
let volumeFactor = 0;
|
|
||||||
let upHandler = undefined;
|
|
||||||
let downHandler = undefined;
|
|
||||||
if (this._startPosition.x < 1 / 3)
|
|
||||||
{
|
|
||||||
volumeFactor = 0.4;
|
|
||||||
upHandler = this.lowVolumeUp;
|
|
||||||
downHandler = this.lowVolumeDown;
|
|
||||||
}
|
|
||||||
else if (this._startPosition.x >= 1 / 3 && this._startPosition.x <= 2 / 3)
|
|
||||||
{
|
|
||||||
volumeFactor = 1;
|
|
||||||
upHandler = this.mediumVolumeUp;
|
|
||||||
downHandler = this.mediumVolumeDown;
|
|
||||||
}
|
|
||||||
else
|
|
||||||
{
|
|
||||||
volumeFactor = 2;
|
|
||||||
upHandler = this.highVolumeUp;
|
|
||||||
downHandler = this.highVolumeDown;
|
|
||||||
}
|
|
||||||
|
|
||||||
if (distance > 0)
|
|
||||||
{
|
|
||||||
const volumeChange = Math.round(
|
|
||||||
volumeFactor * 100 * (distance - this.minSwipeDistance) / (1.5 * position.height)
|
|
||||||
);
|
|
||||||
upHandler && upHandler(volumeChange);
|
|
||||||
this._lastAction = {
|
|
||||||
type: "volume",
|
|
||||||
volume: volumeChange
|
|
||||||
};
|
|
||||||
}
|
|
||||||
else
|
|
||||||
{
|
|
||||||
const volumeChange = Math.round(
|
|
||||||
volumeFactor * 100 * (distance + this.minSwipeDistance) / (1.5 * position.height)
|
|
||||||
);
|
|
||||||
downHandler && downHandler(volumeChange);
|
|
||||||
this._lastAction = {
|
|
||||||
type: "volume",
|
|
||||||
volume: volumeChange
|
|
||||||
};
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
else if (direction === "horizontal")
|
|
||||||
{
|
|
||||||
if (position.y < 1 / 3 && (position.x < 0.1 || position.x > 0.9) ||
|
|
||||||
Math.abs(distance) < this.minSwipeDistance)
|
|
||||||
{
|
|
||||||
this.speedCancel && this.speedCancel();
|
|
||||||
this._lastAction = null;
|
|
||||||
}
|
|
||||||
else
|
|
||||||
{
|
|
||||||
let speedFactor = 0;
|
|
||||||
let forwardHandler = undefined;
|
|
||||||
let backwardHandler = undefined;
|
|
||||||
if (this._startPosition.y < 1 / 3)
|
|
||||||
{
|
|
||||||
speedFactor = 0.05;
|
|
||||||
forwardHandler = this.lowSpeedForward;
|
|
||||||
backwardHandler = this.lowSpeedBackward;
|
|
||||||
}
|
|
||||||
else if (this._startPosition.y >= 1 / 3 && this._startPosition.y <= 2 / 3)
|
|
||||||
{
|
|
||||||
speedFactor = 0.2;
|
|
||||||
forwardHandler = this.mediumSpeedForward;
|
|
||||||
backwardHandler = this.mediumSpeedBackward;
|
|
||||||
}
|
|
||||||
else
|
|
||||||
{
|
|
||||||
speedFactor = 1;
|
|
||||||
forwardHandler = this.highSpeedForward;
|
|
||||||
backwardHandler = this.highSpeedBackward;
|
|
||||||
}
|
|
||||||
|
|
||||||
if (distance > 0)
|
|
||||||
{
|
|
||||||
const seconds = (distance - this.minSwipeDistance) * speedFactor;
|
|
||||||
forwardHandler && forwardHandler(seconds);
|
|
||||||
this._lastAction = {
|
|
||||||
type: "playback",
|
|
||||||
seconds: seconds
|
|
||||||
};
|
|
||||||
}
|
|
||||||
else
|
|
||||||
{
|
|
||||||
const seconds = (distance + this.minSwipeDistance) * speedFactor;
|
|
||||||
backwardHandler && backwardHandler(seconds);
|
|
||||||
this._lastAction = {
|
|
||||||
type: "playback",
|
|
||||||
seconds: seconds
|
|
||||||
};
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
class VideoShot
|
|
||||||
{
|
|
||||||
constructor(totalTime)
|
|
||||||
{
|
|
||||||
this.interval = totalTime < 5 * 100 ? 5 : totalTime / 100;
|
|
||||||
this.firstShot = {
|
|
||||||
css: {
|
|
||||||
backgroundPosition: "-160px 0px"
|
|
||||||
},
|
|
||||||
x: -160,
|
|
||||||
y: 0,
|
|
||||||
position: 2
|
|
||||||
};
|
|
||||||
this.lastShot = {
|
|
||||||
css: {
|
|
||||||
backgroundPosition: "-1440px -810px"
|
|
||||||
},
|
|
||||||
x: -1440,
|
|
||||||
y: -810,
|
|
||||||
position: 100
|
|
||||||
};
|
|
||||||
|
|
||||||
this.imageXLength = 10;
|
|
||||||
this.imageYLength = 10;
|
|
||||||
this.imageXSize = 160;
|
|
||||||
this.imageYSize = 90;
|
|
||||||
this.imageUrl = null;
|
|
||||||
this.imageIndex = [];
|
|
||||||
}
|
|
||||||
init(input)
|
|
||||||
{
|
|
||||||
const matches = input.prop("value").match(/aid=([\d]+)&cid=([\d]+)/);
|
|
||||||
const aid = matches[1];
|
|
||||||
const cid = matches[2];
|
|
||||||
$.ajax({
|
|
||||||
type: "GET",
|
|
||||||
url: `https://api.bilibili.com/x/player/videoshot?aid=${aid}&cid=${cid}&index=1`,
|
|
||||||
success: obj =>
|
|
||||||
{
|
|
||||||
const data = obj.data;
|
|
||||||
this.imageXLength = data.img_x_len;
|
|
||||||
this.imageYLength = data.img_y_len;
|
|
||||||
this.imageXSize = data.img_x_size;
|
|
||||||
this.imageYSize = data.img_y_size;
|
|
||||||
this.imageIndex = data.index;
|
|
||||||
this.imageUrl = data.image[0];
|
|
||||||
|
|
||||||
this.firstShot = {
|
|
||||||
css: {},
|
|
||||||
x: -this.imageXSize,
|
|
||||||
y: 0,
|
|
||||||
position: 1
|
|
||||||
};
|
|
||||||
this.firstShot.css.backgroundPosition = `${this.firstShot.x}px ${this.firstShot.y}px`;
|
|
||||||
this.lastShot = {
|
|
||||||
css: {},
|
|
||||||
x: -this.imageXSize * (this.imageXLength - 1),
|
|
||||||
y: -this.imageYSize * (this.imageYLength - 1),
|
|
||||||
position: 99
|
|
||||||
};
|
|
||||||
this.lastShot.css.backgroundPosition = `${this.lastShot.x}px ${this.lastShot.y}px`;
|
|
||||||
|
|
||||||
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
_getStyle(position)
|
|
||||||
{
|
|
||||||
if (position <= this.firstShot.position)
|
|
||||||
{
|
|
||||||
return this.firstShot.css;
|
|
||||||
}
|
|
||||||
else if (position >= this.lastShot.position)
|
|
||||||
{
|
|
||||||
return this.lastShot.css;
|
|
||||||
}
|
|
||||||
else
|
|
||||||
{
|
|
||||||
const x = -160 * (position % 10 - 1);
|
|
||||||
const y = -90 * (position >= 100 ? 9 : Math.trunc(position / 10));
|
|
||||||
return {
|
|
||||||
backgroundPosition: `${x}px ${y}px`
|
|
||||||
};
|
|
||||||
}
|
|
||||||
}
|
|
||||||
getStyle(time)
|
|
||||||
{
|
|
||||||
const position = Math.round(time / interval);
|
|
||||||
return this._getStyle(position);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
$(document).ready(() =>
|
$(document).ready(() =>
|
||||||
{
|
{
|
||||||
|
|||||||
3039
bilibili-touch.js
Normal file
3039
bilibili-touch.js
Normal file
File diff suppressed because one or more lines are too long
@ -0,0 +1,246 @@
|
|||||||
|
const getPosition = element =>
|
||||||
|
{
|
||||||
|
let x = 0;
|
||||||
|
let y = 0;
|
||||||
|
while (element && !isNaN(element.offsetLeft) && !isNaN(element.offsetTop))
|
||||||
|
{
|
||||||
|
x += element.offsetLeft - element.scrollLeft;
|
||||||
|
y += element.offsetTop - element.scrollTop;
|
||||||
|
element = element.offsetParent;
|
||||||
|
}
|
||||||
|
return { x: x, y: y };
|
||||||
|
};
|
||||||
|
class Swiper
|
||||||
|
{
|
||||||
|
constructor(element)
|
||||||
|
{
|
||||||
|
this.action = new SwipeAction(element);
|
||||||
|
this.onTouchStart = undefined;
|
||||||
|
this.onTouchEnd = undefined;
|
||||||
|
this._direction = null;
|
||||||
|
|
||||||
|
element.addEventListener("touchstart", e =>
|
||||||
|
{
|
||||||
|
this._xDown = e.touches[0].clientX;
|
||||||
|
this._yDown = e.touches[0].clientY;
|
||||||
|
if (this.onTouchStart)
|
||||||
|
{
|
||||||
|
this.onTouchStart(e);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
element.addEventListener("touchmove", e =>
|
||||||
|
{
|
||||||
|
if (!this._xDown || !this._yDown)
|
||||||
|
{
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
const xUp = e.touches[0].clientX;
|
||||||
|
const yUp = e.touches[0].clientY;
|
||||||
|
const elementPosition = getPosition(element);
|
||||||
|
const position = {
|
||||||
|
x: (e.touches[0].pageX - elementPosition.x) / element.clientWidth,
|
||||||
|
y: (e.touches[0].pageY - elementPosition.y) / element.clientHeight,
|
||||||
|
width: element.clientWidth,
|
||||||
|
height: element.clientHeight
|
||||||
|
};
|
||||||
|
|
||||||
|
const xDiff = this._xDown - xUp;
|
||||||
|
const yDiff = this._yDown - yUp;
|
||||||
|
|
||||||
|
if (!this._direction)
|
||||||
|
{
|
||||||
|
let direction = "";
|
||||||
|
if (Math.abs(xDiff) > Math.abs(yDiff))
|
||||||
|
{
|
||||||
|
direction = "horizontal";
|
||||||
|
}
|
||||||
|
else
|
||||||
|
{
|
||||||
|
direction = "vertical";
|
||||||
|
}
|
||||||
|
this._direction = direction;
|
||||||
|
e.preventDefault();
|
||||||
|
}
|
||||||
|
else
|
||||||
|
{
|
||||||
|
if (this._direction === "vertical")
|
||||||
|
{
|
||||||
|
this.action.startAction(this._direction, yDiff, position);
|
||||||
|
}
|
||||||
|
else if (this._direction === "horizontal")
|
||||||
|
{
|
||||||
|
this.action.startAction(this._direction, -xDiff, position);
|
||||||
|
}
|
||||||
|
e.preventDefault();
|
||||||
|
}
|
||||||
|
|
||||||
|
});
|
||||||
|
element.addEventListener("touchend", e =>
|
||||||
|
{
|
||||||
|
this._xDown = null;
|
||||||
|
this._yDown = null;
|
||||||
|
this._direction = null;
|
||||||
|
if (this.onTouchEnd)
|
||||||
|
{
|
||||||
|
this.onTouchEnd(e);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
class SwipeAction
|
||||||
|
{
|
||||||
|
constructor(element)
|
||||||
|
{
|
||||||
|
this.lowSpeedForward = undefined;
|
||||||
|
this.lowSpeedBackward = undefined;
|
||||||
|
this.mediumSpeedForward = undefined;
|
||||||
|
this.mediumSpeedBackward = undefined;
|
||||||
|
this.highSpeedForward = undefined;
|
||||||
|
this.highSpeedBackward = undefined;
|
||||||
|
|
||||||
|
this.lowVolumeUp = undefined;
|
||||||
|
this.lowVolumeDown = undefined;
|
||||||
|
this.mediumVolumeUp = undefined;
|
||||||
|
this.mediumVolumeDown = undefined;
|
||||||
|
this.highVolumeUp = undefined;
|
||||||
|
this.highVolumeDown = undefined;
|
||||||
|
|
||||||
|
this.speedCancel = undefined;
|
||||||
|
this.volumeCancel = undefined;
|
||||||
|
this.minSwipeDistance = 20;
|
||||||
|
this.onActionStart = undefined;
|
||||||
|
this.onActionEnd = undefined;
|
||||||
|
|
||||||
|
this._element = element;
|
||||||
|
this._touchStart = false;
|
||||||
|
this._startPosition = null;
|
||||||
|
this._lastAction = null;
|
||||||
|
element.addEventListener("touchstart", () =>
|
||||||
|
{
|
||||||
|
this._touchStart = true;
|
||||||
|
});
|
||||||
|
element.addEventListener("touchend", () =>
|
||||||
|
{
|
||||||
|
this._startPosition = null;
|
||||||
|
this.onActionEnd && this.onActionEnd(this._lastAction);
|
||||||
|
this._lastAction = null;
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
startAction(direction, distance, position)
|
||||||
|
{
|
||||||
|
if (this._touchStart)
|
||||||
|
{
|
||||||
|
this.onActionStart && this.onActionStart();
|
||||||
|
this._startPosition = position;
|
||||||
|
this._touchStart = false;
|
||||||
|
}
|
||||||
|
if (direction === "vertical")
|
||||||
|
{
|
||||||
|
if (Math.abs(distance) < this.minSwipeDistance)
|
||||||
|
{
|
||||||
|
this.volumeCancel && this.volumeCancel();
|
||||||
|
this._lastAction = null;
|
||||||
|
}
|
||||||
|
else
|
||||||
|
{
|
||||||
|
let volumeFactor = 0;
|
||||||
|
let upHandler = undefined;
|
||||||
|
let downHandler = undefined;
|
||||||
|
if (this._startPosition.x < 1 / 3)
|
||||||
|
{
|
||||||
|
volumeFactor = 0.4;
|
||||||
|
upHandler = this.lowVolumeUp;
|
||||||
|
downHandler = this.lowVolumeDown;
|
||||||
|
}
|
||||||
|
else if (this._startPosition.x >= 1 / 3 && this._startPosition.x <= 2 / 3)
|
||||||
|
{
|
||||||
|
volumeFactor = 1;
|
||||||
|
upHandler = this.mediumVolumeUp;
|
||||||
|
downHandler = this.mediumVolumeDown;
|
||||||
|
}
|
||||||
|
else
|
||||||
|
{
|
||||||
|
volumeFactor = 2;
|
||||||
|
upHandler = this.highVolumeUp;
|
||||||
|
downHandler = this.highVolumeDown;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (distance > 0)
|
||||||
|
{
|
||||||
|
const volumeChange = Math.round(
|
||||||
|
volumeFactor * 100 * (distance - this.minSwipeDistance) / (1.5 * position.height)
|
||||||
|
);
|
||||||
|
upHandler && upHandler(volumeChange);
|
||||||
|
this._lastAction = {
|
||||||
|
type: "volume",
|
||||||
|
volume: volumeChange
|
||||||
|
};
|
||||||
|
}
|
||||||
|
else
|
||||||
|
{
|
||||||
|
const volumeChange = Math.round(
|
||||||
|
volumeFactor * 100 * (distance + this.minSwipeDistance) / (1.5 * position.height)
|
||||||
|
);
|
||||||
|
downHandler && downHandler(volumeChange);
|
||||||
|
this._lastAction = {
|
||||||
|
type: "volume",
|
||||||
|
volume: volumeChange
|
||||||
|
};
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
else if (direction === "horizontal")
|
||||||
|
{
|
||||||
|
if (position.y < 1 / 3 && (position.x < 0.1 || position.x > 0.9) ||
|
||||||
|
Math.abs(distance) < this.minSwipeDistance)
|
||||||
|
{
|
||||||
|
this.speedCancel && this.speedCancel();
|
||||||
|
this._lastAction = null;
|
||||||
|
}
|
||||||
|
else
|
||||||
|
{
|
||||||
|
let speedFactor = 0;
|
||||||
|
let forwardHandler = undefined;
|
||||||
|
let backwardHandler = undefined;
|
||||||
|
if (this._startPosition.y < 1 / 3)
|
||||||
|
{
|
||||||
|
speedFactor = 0.05;
|
||||||
|
forwardHandler = this.lowSpeedForward;
|
||||||
|
backwardHandler = this.lowSpeedBackward;
|
||||||
|
}
|
||||||
|
else if (this._startPosition.y >= 1 / 3 && this._startPosition.y <= 2 / 3)
|
||||||
|
{
|
||||||
|
speedFactor = 0.2;
|
||||||
|
forwardHandler = this.mediumSpeedForward;
|
||||||
|
backwardHandler = this.mediumSpeedBackward;
|
||||||
|
}
|
||||||
|
else
|
||||||
|
{
|
||||||
|
speedFactor = 1;
|
||||||
|
forwardHandler = this.highSpeedForward;
|
||||||
|
backwardHandler = this.highSpeedBackward;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (distance > 0)
|
||||||
|
{
|
||||||
|
const seconds = (distance - this.minSwipeDistance) * speedFactor;
|
||||||
|
forwardHandler && forwardHandler(seconds);
|
||||||
|
this._lastAction = {
|
||||||
|
type: "playback",
|
||||||
|
seconds: seconds
|
||||||
|
};
|
||||||
|
}
|
||||||
|
else
|
||||||
|
{
|
||||||
|
const seconds = (distance + this.minSwipeDistance) * speedFactor;
|
||||||
|
backwardHandler && backwardHandler(seconds);
|
||||||
|
this._lastAction = {
|
||||||
|
type: "playback",
|
||||||
|
seconds: seconds
|
||||||
|
};
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
1
touch/touch-player.min.js
vendored
Normal file
1
touch/touch-player.min.js
vendored
Normal file
@ -0,0 +1 @@
|
|||||||
|
const getPosition=element=>{let x=0,y=0;for(;element&&!isNaN(element.offsetLeft)&&!isNaN(element.offsetTop);)x+=element.offsetLeft-element.scrollLeft,y+=element.offsetTop-element.scrollTop,element=element.offsetParent;return{x:x,y:y}};class Swiper{constructor(element){this.action=new SwipeAction(element),this.onTouchStart=void 0,this.onTouchEnd=void 0,this._direction=null,element.addEventListener("touchstart",e=>{this._xDown=e.touches[0].clientX,this._yDown=e.touches[0].clientY,this.onTouchStart&&this.onTouchStart(e)}),element.addEventListener("touchmove",e=>{if(!this._xDown||!this._yDown)return;const xUp=e.touches[0].clientX,yUp=e.touches[0].clientY,elementPosition=getPosition(element),position={x:(e.touches[0].pageX-elementPosition.x)/element.clientWidth,y:(e.touches[0].pageY-elementPosition.y)/element.clientHeight,width:element.clientWidth,height:element.clientHeight},xDiff=this._xDown-xUp,yDiff=this._yDown-yUp;if(this._direction)"vertical"===this._direction?this.action.startAction(this._direction,yDiff,position):"horizontal"===this._direction&&this.action.startAction(this._direction,-xDiff,position),e.preventDefault();else{let direction="";direction=Math.abs(xDiff)>Math.abs(yDiff)?"horizontal":"vertical",this._direction=direction,e.preventDefault()}}),element.addEventListener("touchend",e=>{this._xDown=null,this._yDown=null,this._direction=null,this.onTouchEnd&&this.onTouchEnd(e)})}}class SwipeAction{constructor(element){this.lowSpeedForward=void 0,this.lowSpeedBackward=void 0,this.mediumSpeedForward=void 0,this.mediumSpeedBackward=void 0,this.highSpeedForward=void 0,this.highSpeedBackward=void 0,this.lowVolumeUp=void 0,this.lowVolumeDown=void 0,this.mediumVolumeUp=void 0,this.mediumVolumeDown=void 0,this.highVolumeUp=void 0,this.highVolumeDown=void 0,this.speedCancel=void 0,this.volumeCancel=void 0,this.minSwipeDistance=20,this.onActionStart=void 0,this.onActionEnd=void 0,this._element=element,this._touchStart=!1,this._startPosition=null,this._lastAction=null,element.addEventListener("touchstart",()=>{this._touchStart=!0}),element.addEventListener("touchend",()=>{this._startPosition=null,this.onActionEnd&&this.onActionEnd(this._lastAction),this._lastAction=null})}startAction(direction,distance,position){if(this._touchStart&&(this.onActionStart&&this.onActionStart(),this._startPosition=position,this._touchStart=!1),"vertical"===direction)if(Math.abs(distance)<this.minSwipeDistance)this.volumeCancel&&this.volumeCancel(),this._lastAction=null;else{let volumeFactor=0,upHandler=void 0,downHandler=void 0;if(this._startPosition.x<1/3?(volumeFactor=.4,upHandler=this.lowVolumeUp,downHandler=this.lowVolumeDown):this._startPosition.x>=1/3&&this._startPosition.x<=2/3?(volumeFactor=1,upHandler=this.mediumVolumeUp,downHandler=this.mediumVolumeDown):(volumeFactor=2,upHandler=this.highVolumeUp,downHandler=this.highVolumeDown),distance>0){const volumeChange=Math.round(100*volumeFactor*(distance-this.minSwipeDistance)/(1.5*position.height));upHandler&&upHandler(volumeChange),this._lastAction={type:"volume",volume:volumeChange}}else{const volumeChange=Math.round(100*volumeFactor*(distance+this.minSwipeDistance)/(1.5*position.height));downHandler&&downHandler(volumeChange),this._lastAction={type:"volume",volume:volumeChange}}}else if("horizontal"===direction)if(position.y<1/3&&(position.x<.1||position.x>.9)||Math.abs(distance)<this.minSwipeDistance)this.speedCancel&&this.speedCancel(),this._lastAction=null;else{let speedFactor=0,forwardHandler=void 0,backwardHandler=void 0;if(this._startPosition.y<1/3?(speedFactor=.05,forwardHandler=this.lowSpeedForward,backwardHandler=this.lowSpeedBackward):this._startPosition.y>=1/3&&this._startPosition.y<=2/3?(speedFactor=.2,forwardHandler=this.mediumSpeedForward,backwardHandler=this.mediumSpeedBackward):(speedFactor=1,forwardHandler=this.highSpeedForward,backwardHandler=this.highSpeedBackward),distance>0){const seconds=(distance-this.minSwipeDistance)*speedFactor;forwardHandler&&forwardHandler(seconds),this._lastAction={type:"playback",seconds:seconds}}else{const seconds=(distance+this.minSwipeDistance)*speedFactor;backwardHandler&&backwardHandler(seconds),this._lastAction={type:"playback",seconds:seconds}}}}}
|
||||||
2
utils/common.min.js
vendored
2
utils/common.min.js
vendored
@ -1 +1 @@
|
|||||||
const waitForQuery=settings=>{const MaxRetry=settings.maxQueryRetry;let retry=0;const tryQuery=(query,condition,action,failed)=>{if(retry>=MaxRetry)failed&&failed();else{const result=query();condition(result)?action(result):(retry++,setTimeout(()=>tryQuery(query,condition,action,failed),settings.queryInterval))}};return tryQuery};
|
const waitForQuery=settings=>{const MaxRetry=settings.maxQueryRetry;let retry=0;const tryQuery=(query,condition,action,failed)=>{if(retry>=MaxRetry){if(failed){failed()}}else{const result=query();if(condition(result)){action(result)}else{retry++;setTimeout(()=>tryQuery(query,condition,action,failed),settings.queryInterval)}}};return tryQuery};
|
||||||
Loading…
Reference in New Issue
Block a user