WebController - Utility メソッド¶
このセクションには、サンプルに役立つすべての関数が含まれていますが、Genvid API の関数は含まれていません。
In This Section
popularityToText¶
popularityToText(popularity)
popularityToText メソッドは popularity 値をテキスト値に変換します。
// Converts popularity value to popularity text
popularityToText(popularity) {
const hearts = ["💔", "♡", "♥", "💕"];
const levels = [0.1, 1.0, 5.0];
for (let i = 0; i < hearts.length; ++i) {
if (popularity < levels[i]) {
return hearts[i];
}
}
return hearts[levels.length];
}
centerAt¶
centerAt(htmlElement, pos_2d, offsetPixels)
centerAt メソッドは、送信された 2D 位置で中心におかれた HTML 要素の位置を変更します。このメソッドは、各オブジェクト上に表示された名前 div 要素を移動させるために使用します。
// Changes the HTML element position to be at the center of the pos 2d sent
centerAt(htmlElement, pos2d, offsetPixels) {
// Converts from [-1, 1] range to [0, 1].
let vh = genvidMath.vec2(0.5, 0.5);
let pos2dN = genvidMath.mad2D(pos2d, vh, vh);
// Converts from [0, 1] range to [0, w].
let p = htmlElement.parentElement;
let pSize = genvidMath.vec2(p.clientWidth, p.clientHeight);
let posInParent = genvidMath.mul2D(pos2dN, pSize);
// Adjusts for centering element.
let eSize = genvidMath.vec2(
htmlElement.clientWidth,
htmlElement.clientHeight
);
let eOffset = genvidMath.muls2D(eSize, -0.5);
let posCentered = genvidMath.add2D(posInParent, eOffset);
// Applies user offset.
const posFinal = genvidMath.sub2D(posCentered, offsetPixels);
Object.assign(htmlElement.style, {
left: posFinal.x + "px",
bottom: posFinal.y + "px",
position: "absolute",
zIndex: "1100",
});
}
preN¶
preN(str, n, c)
preN メソッドは、文字列に空白を追加します。このメソッドは、Genvid オーバーレイ上のデータを適切に表示するために使用します。
// Widens a string to at least n characters, prefixing with spaces.
preN(str, n, c) {
let s = str.length;
if (s < n) {
str = c.repeat(n - s) + str;
}
return str;
}
msToDuration¶
msToDuration(duration)
msToDuration メソッドは、ミリ秒を日、時間、分、秒に変換します。
// Method used to convert ms to specific duration
msToDuration(duration) {
const msInADay = 1000 * 60 * 60 * 24;
const date = new Date(duration);
const days = (duration - (duration % msInADay)) / msInADay;
return `${days ? `${days}:` : ""}${date.toLocaleTimeString(undefined, {
hour12: false,
timeZone: "GMT",
})}:${this.preN(date.getMilliseconds().toFixed(0), 3, "0")}`;
}
checkFullScreen¶
checkFullScreen()
checkFullScreen メソッドは、現在の全画面ステータスを戻します。
checkFullScreen() {
return (
document.fullscreenElement ||
document.webkitFullscreenElement ||
document.mozFullScreenElement ||
document.msFullscreenElement
);
}