git commit -m "Adding the initial files"
This commit is contained in:
parent
624b21bded
commit
e8fd275db3
|
|
@ -0,0 +1 @@
|
|||
{"testMessage":"Test Message","showTopDegrade":"none","showBottonDegrade":"none","msgBorderColorUser":"nao","msgBorderColor":"rgba(1, 1, 1, 0)","msgBackgroundColor":"rgb(0, 0, 0)","badgeBackgroundColor":"rgba(255, 254, 254, 0)","msgBorderPaddingX":5,"msgBorderPaddingY":10,"backgroundColor":"rgba(1, 1, 1, 0)","carimboHora":"nao","font":"Montserrat","messageColor":"#ffffff","userColor":"#fff","usernameFontSize":"500","textShadow":"rgb(0, 0, 0) 0px 0px 0px","badgeSize":25,"usernameSize":20,"messageFontSize":"900","emoteSize":30,"alignMessages":"position: absolute","hideCommands":"true","messagesLimit":0,"hideAfter":0,"ignoredUsers":"StreamElements,StreamLabs,NightBot","animationIn":"fadeIn","animationOut":"fadeOutDownBig","widgetName":"Bloody Chat","widgetAuthor":"doublerainbowoverlay","messageSize":20,"fontSize":"400"}
|
||||
|
|
@ -0,0 +1,302 @@
|
|||
{
|
||||
"testMessage": {
|
||||
"type": "button",
|
||||
"label": "Test Message",
|
||||
"value": "Test Message",
|
||||
"group": "Test"
|
||||
},
|
||||
"showTopDegrade": {
|
||||
"label": "Show Upper Gradient:",
|
||||
"type": "dropdown",
|
||||
"value": "inline-block",
|
||||
"options": {
|
||||
"none": "No",
|
||||
"inline-block": "Yes"
|
||||
},
|
||||
"group": "Customization"
|
||||
},
|
||||
"showBottonDegrade": {
|
||||
"label": "Show Botton Gradient:",
|
||||
"type": "dropdown",
|
||||
"value": "inline-block",
|
||||
"options": {
|
||||
"none": "No",
|
||||
"inline-block": "Yes"
|
||||
},
|
||||
"group": "Customization"
|
||||
},
|
||||
"msgBorderColorUser": {
|
||||
"label": "Border Color Based on User:",
|
||||
"type": "dropdown",
|
||||
"value": "nao",
|
||||
"options": {
|
||||
"nao": "No",
|
||||
"sim": "Yes"
|
||||
},
|
||||
"group": "Customization"
|
||||
},
|
||||
"msgBorderColor": {
|
||||
"type": "colorpicker",
|
||||
"label": "Message Border Color:",
|
||||
"value": "#ffd539",
|
||||
"group": "Customization"
|
||||
},
|
||||
"msgBorderPaddingX": {
|
||||
"type": "slider",
|
||||
"label": "Border Padding Size (X Axis):",
|
||||
"value": 8,
|
||||
"min": 2,
|
||||
"max": 24,
|
||||
"step": 1,
|
||||
"group": "Font"
|
||||
},
|
||||
"msgBorderPaddingY": {
|
||||
"type": "slider",
|
||||
"label": "Border Padding Size (Y Axis):",
|
||||
"value": 8,
|
||||
"min": 2,
|
||||
"max": 24,
|
||||
"step": 1,
|
||||
"group": "Font"
|
||||
},
|
||||
"msgBackgroundColor": {
|
||||
"type": "colorpicker",
|
||||
"label": "Message Background Color:",
|
||||
"value": "rgba(0,0,0,0)",
|
||||
"group": "Customization"
|
||||
},
|
||||
"badgeBackgroundColor": {
|
||||
"type": "colorpicker",
|
||||
"label": "Badge Background Color:",
|
||||
"value": "rgba(0,0,0,0)",
|
||||
"group": "Customization"
|
||||
},
|
||||
"backgroundColor": {
|
||||
"type": "colorpicker",
|
||||
"label": "Chat Background Color:",
|
||||
"value": "rgba(17,11,44,1)",
|
||||
"group": "Customization"
|
||||
},
|
||||
"carimboHora": {
|
||||
"label": "Show Time Date Stamp:",
|
||||
"type": "dropdown",
|
||||
"value": "nao",
|
||||
"options": {
|
||||
"nao": "No",
|
||||
"sim": "Yes"
|
||||
},
|
||||
"group": "Customization"
|
||||
},
|
||||
"font": {
|
||||
"type": "googleFont",
|
||||
"label": "Font:",
|
||||
"value": "Roboto",
|
||||
"group": "Font"
|
||||
},
|
||||
"messageColor": {
|
||||
"type": "colorpicker",
|
||||
"label": "Message Color:",
|
||||
"value": "#fff",
|
||||
"group": "Font"
|
||||
},
|
||||
"userColor": {
|
||||
"type": "colorpicker",
|
||||
"label": "User Color:",
|
||||
"value": "#fff",
|
||||
"group": "Font"
|
||||
},
|
||||
"fontSize": {
|
||||
"label": "Font Size:",
|
||||
"type": "dropdown",
|
||||
"value": "700",
|
||||
"options": {
|
||||
"100": "Fine (100)",
|
||||
"300": "Soft (300)",
|
||||
"400": "Regular (400)",
|
||||
"500": "Medium (500)",
|
||||
"700": "Bold (700)",
|
||||
"900": "Bold Black (900)"
|
||||
},
|
||||
"group": "Font"
|
||||
},
|
||||
"textShadow": {
|
||||
"type": "text",
|
||||
"label": "Text Shadow:",
|
||||
"value": "rgb(0, 0, 0) 0px 0px 0px",
|
||||
"group": "Font"
|
||||
},
|
||||
"badgeSize": {
|
||||
"type": "slider",
|
||||
"label": "Badges Size:",
|
||||
"value": 24,
|
||||
"min": 16,
|
||||
"max": 36,
|
||||
"step": 1,
|
||||
"group": "Font"
|
||||
},
|
||||
"usernameSize": {
|
||||
"type": "slider",
|
||||
"label": "Username Size:",
|
||||
"value": 24,
|
||||
"min": 16,
|
||||
"max": 30,
|
||||
"step": 1,
|
||||
"group": "Font"
|
||||
},
|
||||
"messageSize": {
|
||||
"type": "slider",
|
||||
"label": "Message Size:",
|
||||
"value": 24,
|
||||
"min": 16,
|
||||
"max": 30,
|
||||
"step": 1,
|
||||
"group": "Font"
|
||||
},
|
||||
"emoteSize": {
|
||||
"type": "slider",
|
||||
"label": "Emotes Size:",
|
||||
"value": 24,
|
||||
"min": 16,
|
||||
"max": 60,
|
||||
"step": 1,
|
||||
"group": "Font"
|
||||
},
|
||||
"alignMessages": {
|
||||
"label": "Messages Direction:",
|
||||
"type": "dropdown",
|
||||
"value": "position: absolute",
|
||||
"options": {
|
||||
"display: block": "Up to Down",
|
||||
"position: absolute": "Down to Up"
|
||||
},
|
||||
"group": "Configurations"
|
||||
},
|
||||
"hideCommands": {
|
||||
"label": "Ignore Commands:",
|
||||
"type": "dropdown",
|
||||
"group": "Configurations",
|
||||
"value": "true",
|
||||
"options": {
|
||||
"true": "Yes",
|
||||
"false": "No"
|
||||
},
|
||||
"group": "Configurations"
|
||||
},
|
||||
"messagesLimit":{
|
||||
"type": "slider",
|
||||
"label": "Messages Limit:",
|
||||
"value": 0,
|
||||
"min": 0,
|
||||
"max": 50,
|
||||
"step": 1,
|
||||
"group": "Configurations"
|
||||
},
|
||||
"hideAfter": {
|
||||
"type": "slider",
|
||||
"label": "Remove msg (0 to disable):",
|
||||
"value": 0,
|
||||
"min": 0,
|
||||
"max": 60,
|
||||
"step": 1,
|
||||
"group": "Configurations"
|
||||
},
|
||||
"ignoredUsers": {
|
||||
"label": "Ignored Users (by commas):",
|
||||
"type": "text",
|
||||
"value": "StreamElements,StreamLabs,NightBot",
|
||||
"group": "Configurations"
|
||||
},
|
||||
"animationIn": {
|
||||
"type": "dropdown",
|
||||
"label": "In Animation:",
|
||||
"value": "bounceInUp",
|
||||
"options": {
|
||||
"none": "None",
|
||||
"bounceIn": "bounceIn",
|
||||
"bounceInDown": "bounceInDown",
|
||||
"bounceInLeft": "bounceInLeft",
|
||||
"bounceInRight": "bounceInRight",
|
||||
"bounceInUp": "bounceInUp",
|
||||
"fadeIn": "fadeIn",
|
||||
"fadeInDown": "fadeInDown",
|
||||
"fadeInDownBig": "fadeInDownBig",
|
||||
"fadeInLeft": "fadeInLeft",
|
||||
"fadeInLeftBig": "fadeInLeftBig",
|
||||
"fadeInRight": "fadeInRight",
|
||||
"fadeInRightBig": "fadeInRightBig",
|
||||
"fadeInUp": "fadeInUp",
|
||||
"fadeInUpBig": "fadeInUpBig",
|
||||
"flipInX": "flipInX",
|
||||
"flipInY": "flipInY",
|
||||
"lightSpeedIn": "lightSpeedIn",
|
||||
"rotateIn": "rotateIn",
|
||||
"rotateInDownLeft": "rotateInDownLeft",
|
||||
"rotateInDownRight": "rotateInDownRight",
|
||||
"rotateInUpLeft": "rotateInUpLeft",
|
||||
"rotateInUpRight": "rotateInUpRight",
|
||||
"slideInUp": "slideInUp",
|
||||
"slideInDown": "slideInDown",
|
||||
"slideInLeft": "slideInLeft",
|
||||
"slideInRight": "slideInRight",
|
||||
"zoomIn": "zoomIn",
|
||||
"zoomInDown": "zoomInDown",
|
||||
"zoomInLeft": "zoomInLeft",
|
||||
"zoomInRight": "zoomInRight",
|
||||
"zoomInUp": "zoomInUp",
|
||||
"jackInTheBox": "jackInTheBox",
|
||||
"rollIn": "rollIn"
|
||||
},
|
||||
"group": "Configurations"
|
||||
},
|
||||
"animationOut": {
|
||||
"type": "dropdown",
|
||||
"label": "Out Animation:",
|
||||
"value": "none",
|
||||
"options": {
|
||||
"none": "None",
|
||||
"bounceOut": "bounceOut",
|
||||
"bounceOutDown": "bounceOutDown",
|
||||
"bounceOutLeft": "bounceOutLeft",
|
||||
"bounceOutRight": "bounceOutRight",
|
||||
"bounceOutUp": "bounceOutUp",
|
||||
"fadeOut": "fadeOut",
|
||||
"fadeOutDown": "fadeOutDown",
|
||||
"fadeOutDownBig": "fadeOutDownBig",
|
||||
"fadeOutLeft": "fadeOutLeft",
|
||||
"fadeOutLeftBig": "fadeOutLeftBig",
|
||||
"fadeOutRight": "fadeOutRight",
|
||||
"fadeOutRightBig": "fadeOutRightBig",
|
||||
"fadeOutUp": "fadeOutUp",
|
||||
"fadeOutUpBig": "fadeOutUpBig",
|
||||
"flipOutX": "flipOutX",
|
||||
"flipOutY": "flipOutY",
|
||||
"lightSpeedOut": "lightSpeedOut",
|
||||
"rotateOut": "rotateOut",
|
||||
"rotateOutDownLeft": "rotateOutDownLeft",
|
||||
"rotateOutDownRight": "rotateOutDownRight",
|
||||
"rotateOutUpLeft": "rotateOutUpLeft",
|
||||
"rotateOutUpRight": "rotateOutUpRight",
|
||||
"slideOutUp": "slideOutUp",
|
||||
"slideOutDown": "slideOutDown",
|
||||
"slideOutLeft": "slideOutLeft",
|
||||
"slideOutRight": "slideOutRight",
|
||||
"zoomOut": "zoomOut",
|
||||
"zoomOutDown": "zoomOutDown",
|
||||
"zoomOutLeft": "zoomOutLeft",
|
||||
"zoomOutRight": "zoomOutRight",
|
||||
"zoomOutUp": "zoomOutUp",
|
||||
"rollOut": "rollOut"
|
||||
},
|
||||
"group": "Configurations"
|
||||
},
|
||||
"widgetName": {
|
||||
"type": "hidden",
|
||||
"value": "Custom Chat",
|
||||
"group": "Configurations"
|
||||
},
|
||||
"widgetAuthor": {
|
||||
"type": "hidden",
|
||||
"value": "OVERKLOC",
|
||||
"group": "Configurations"
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,70 @@
|
|||
@import url(https://fonts.googleapis.com/css?family={{font}}:{{fontSize}});
|
||||
@import url('https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.5.2/animate.min.css');
|
||||
|
||||
* { box-sizing: border-box; }
|
||||
|
||||
html, body { height: 100%; overflow: hidden; }
|
||||
|
||||
body { background: {{backgroundColor}} !important; line-height: 1.5em; }
|
||||
|
||||
.top-degrade {display: {{showTopDegrade}}; position: absolute; width: 100%; height: 50px; top: 0; left: 0;
|
||||
background: rgb(17,11,44);
|
||||
background: linear-gradient(180deg, rgba(17,11,44,1) 0%, rgba(17,11,44,0) 100%); z-index: 2;}
|
||||
|
||||
.bottom-degrade {display: {{showBottonDegrade}}; position: absolute; width: 100%; height: 25px;
|
||||
bottom: 0; left: 0; background: rgb(17,11,44);
|
||||
background: linear-gradient(180deg, rgba(17,11,44,0) 0%, rgba(17,11,44,1) 100%); z-index: 2;}
|
||||
|
||||
#log>div { position: relative; padding-top: 22px; margin-bottom: 60px; }
|
||||
|
||||
.colon { display: none; }
|
||||
.action { font-style: italic; }
|
||||
|
||||
#log { {{alignMessages}}; box-sizing: border-box; width: 100%; bottom: 0; left: 0; padding: 10px 10px; }
|
||||
#log>div.deleted { visibility: hidden; }
|
||||
|
||||
/* ===== BLOOD ===== */
|
||||
#log .message .container-message:before {
|
||||
content: "";
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
right: 0px;
|
||||
width: 200px;
|
||||
height: 100px;
|
||||
background-image: url('https://i.gifer.com/5362.gif');
|
||||
background-size: cover;
|
||||
border-radius: 5%;
|
||||
z-index: 3;
|
||||
}
|
||||
|
||||
|
||||
/* ===== USERNAME ===== */
|
||||
#log .meta {position: absolute; top: -30px; left: 0px; padding: 7px 12px; line-height: 15px;
|
||||
border-radius: 20px; z-index: 1;
|
||||
font-family: {{font}}; font-size: {{usernameSize}}px; font-weight: {{fontSize}};}
|
||||
#log .meta .name {float: left; line-height: 21px; color: {{userColor}};}
|
||||
|
||||
/* ===== USERNAME2 ===== */
|
||||
#log .meta1 {position: absolute; top: -30px; left: 0px; padding: 0px 12px; line-height: 0px;
|
||||
border-radius: 20px; z-index: 0;
|
||||
font-family: {{font}}; font-size: {{usernameSize}}px; font-weight: {{fontSize}}; background-color: {{badgeBackgroundColor}}; }
|
||||
#log .meta1 .badges {float: right; margin-left: 30px; margin-top: 0px; margin-bottom: 6px;}
|
||||
#log .meta1 .badges > img { width: {{badgeSize}}px; height: {{badgeSize}}px; margin-right: 1px; border-radius: 20px; }
|
||||
#log .meta1 .badges > img:last-child {margin-right: 0;}
|
||||
#log .meta1 .name {float: left; line-height: 21px; color: {{userColor}};}
|
||||
|
||||
/* ===== USERMESSAGE ===== */
|
||||
#log .message {position: relative; min-height: 20px;}
|
||||
#log .message .container-message {color: {{messageColor}}; background: {{msgBackgroundColor}};
|
||||
text-shadow:{{textShadow}}; padding: {{msgBorderPaddingY}}px {{msgBorderPaddingX}}px;
|
||||
border-radius: 10px 10px 10px 10px; display: inline-block;
|
||||
font-family: {{font}}; font-size: {{messageSize}}px; font-weight: {{fontSize}}; word-break: break-word; width: 100%;}
|
||||
#log .message .container-message .emote { height: {{emoteSize}}px; vertical-align: middle; }
|
||||
#log .message .container-message .time { float: right; padding: 10px 0px 0px 0px; }
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
<script src="//cdnjs.cloudflare.com/ajax/libs/blueimp-md5/2.12.0/js/md5.min.js"></script>
|
||||
<div class="top-degrade"></div>
|
||||
|
||||
<div id="log"></div>
|
||||
|
||||
<div class="bottom-degrade"></div>
|
||||
|
|
@ -0,0 +1,310 @@
|
|||
let totalMessages = 0, messagesLimit = 0, channelName, provider, addition, removeSelector;
|
||||
let hideCommands = "true";
|
||||
let messageSize = 24;
|
||||
let hideAfter = 60;
|
||||
let ignoredUsers = [];
|
||||
let animationIn = 'bounceIn';
|
||||
let animationOut = 'bounceOut';
|
||||
let borderMessage = '#000000';
|
||||
let carimboHora = "nao";
|
||||
|
||||
window.addEventListener("onEventReceived", function (obj) {
|
||||
// Deletar mensagens
|
||||
if (obj.detail.listener === "delete-message") {
|
||||
const msgId = obj.detail.event.msgId;
|
||||
$(`.message-row[data-id=${msgId}]`).remove();
|
||||
return;
|
||||
} else if (obj.detail.listener === "delete-messages") {
|
||||
const userId = obj.detail.event.userId;
|
||||
$(`.message-row[data-from=${userId}]`).remove();
|
||||
return;
|
||||
}
|
||||
|
||||
// Testar chat
|
||||
if (obj.detail.event.listener === "widget-button") {
|
||||
if (obj.detail.event.field === "testMessage") {
|
||||
let emulated = new CustomEvent("onEventReceived", {
|
||||
detail: {
|
||||
listener: "message",
|
||||
event: {
|
||||
service: "twitch",
|
||||
data: {
|
||||
time: Date.now(),
|
||||
tags: {
|
||||
"badge-info": "",
|
||||
badges: "moderator/1,partner/1",
|
||||
color: "#5B99FF",
|
||||
"display-name": "StreamElements",
|
||||
emotes: "25:46-50",
|
||||
flags: "",
|
||||
id: "43285909-412c-4eee-b80d-89f72ba53142",
|
||||
mod: "1",
|
||||
"room-id": "85827806",
|
||||
subscriber: "0",
|
||||
"tmi-sent-ts": "1579444549265",
|
||||
turbo: "0",
|
||||
"user-id": "100135110",
|
||||
"user-type": "mod",
|
||||
},
|
||||
nick: channelName,
|
||||
userId: "100135110",
|
||||
displayName: channelName,
|
||||
displayColor: "#5B99FF",
|
||||
badges: [
|
||||
{
|
||||
type: "moderator",
|
||||
version: "1",
|
||||
url:
|
||||
"https://static-cdn.jtvnw.net/badges/v1/3267646d-33f0-4b17-b3df-f923a41db1d0/3",
|
||||
description: "Moderator",
|
||||
},
|
||||
{
|
||||
type: "partner",
|
||||
version: "1",
|
||||
url:
|
||||
"https://static-cdn.jtvnw.net/badges/v1/d12a2e27-16f6-41d0-ab77-b780518f00a3/3",
|
||||
description: "Verified",
|
||||
},
|
||||
],
|
||||
channel: channelName,
|
||||
text: "Boo! This is a test message. The bloody chat widget is working.",
|
||||
isAction: !1,
|
||||
emotes: [
|
||||
{
|
||||
type: "twitch",
|
||||
name: "Kappa",
|
||||
id: "25",
|
||||
gif: !1,
|
||||
urls: {
|
||||
1: "https://static-cdn.jtvnw.net/emoticons/v1/25/1.0",
|
||||
2: "https://static-cdn.jtvnw.net/emoticons/v1/25/1.0",
|
||||
4: "https://static-cdn.jtvnw.net/emoticons/v1/25/3.0",
|
||||
},
|
||||
start: 46,
|
||||
end: 50,
|
||||
},
|
||||
],
|
||||
msgId: "43285909-412c-4eee-b80d-89f72ba53142",
|
||||
},
|
||||
renderedText:
|
||||
'Boo! This is a test message. The bloody chat widget is working <img src="https://static-cdn.jtvnw.net/emoticons/v1/25/1.0" srcset="https://static-cdn.jtvnw.net/emoticons/v1/25/1.0 1x, https://static-cdn.jtvnw.net/emoticons/v1/25/1.0 2x, https://static-cdn.jtvnw.net/emoticons/v1/25/3.0 4x" title="Kappa" class="emote">',
|
||||
},
|
||||
},
|
||||
});
|
||||
window.dispatchEvent(emulated);
|
||||
}
|
||||
return;
|
||||
}
|
||||
|
||||
// Tratar mensagem
|
||||
if (obj.detail.listener !== "message") return;
|
||||
let data = obj.detail.event.data;
|
||||
|
||||
if (data.text.startsWith("!") && hideCommands === "true") return;
|
||||
|
||||
if (ignoredUsers.indexOf(data.nick) !== -1) return;
|
||||
|
||||
let message = attachEmotes(data);
|
||||
let badges = "",
|
||||
badge;
|
||||
for (let i = 0; i < data.badges.length; i++) {
|
||||
badge = data.badges[i];
|
||||
badges += `<img alt="" src="${badge.url}" class="badge"> `;
|
||||
}
|
||||
|
||||
let color = data.tags.color;
|
||||
if (color === "") {
|
||||
const username = data.displayName;
|
||||
color = data.displayColor !== "" ? data.displayColor : "#" + (md5(username).substr(26));
|
||||
}
|
||||
|
||||
addMessage(obj.detail.event.data.displayName,
|
||||
message,
|
||||
badges,
|
||||
data.userId,
|
||||
data.msgId,
|
||||
color,
|
||||
data.isAction);
|
||||
});
|
||||
|
||||
window.addEventListener("onWidgetLoad", function (obj) {
|
||||
const fieldData = obj.detail.fieldData;
|
||||
messagesLimit = fieldData.messagesLimit;
|
||||
topDegrade = fieldData.topDegrade;
|
||||
hideCommands = fieldData.hideCommands;
|
||||
hideAfter = fieldData.hideAfter;
|
||||
animationIn = fieldData.animationIn;
|
||||
animationOut = fieldData.animationOut;
|
||||
borderMessage = fieldData.msgBorderColor;
|
||||
carimboHora = fieldData.carimboHora;
|
||||
channelName = obj.detail.channel.username;
|
||||
messageSize = fieldData.messageSize;
|
||||
borderColorUser = fieldData.msgBorderColorUser;
|
||||
ignoredUsers = fieldData.ignoredUsers
|
||||
.toLowerCase()
|
||||
.replace(" ", "")
|
||||
.split(",");
|
||||
fetch('https://api.streamelements.com/kappa/v2/channels/' + obj.detail.channel.id + '/').then(response => response.json()).then((profile) => {
|
||||
provider = profile.provider;
|
||||
});
|
||||
|
||||
if (fieldData.alignMessages === "display: block") {
|
||||
addition = "prepend";
|
||||
removeSelector = ".message-row:nth-child(n+" + (messagesLimit + 1) + ")"
|
||||
} else {
|
||||
addition = "append";
|
||||
removeSelector = ".message-row:nth-last-child(n+" + (messagesLimit + 1) + ")"
|
||||
}
|
||||
});
|
||||
|
||||
function addMessage(username, message, badges, userId, msgId, color, isAction) {
|
||||
totalMessages += 1;
|
||||
let actionClass = "";
|
||||
if (isAction) {
|
||||
actionClass = "action";
|
||||
}
|
||||
|
||||
if (borderColorUser === "sim") {
|
||||
borderMessage = color;
|
||||
}
|
||||
|
||||
let hora = "";
|
||||
if (carimboHora === "sim") {
|
||||
let d = new Date();
|
||||
let messageSizeTime = messageSize-(messageSize/4);
|
||||
hora = `
|
||||
<br>
|
||||
<div class="time" style="font-size: ${messageSizeTime}px;">
|
||||
${('0' + d.getHours()).slice(-2)}:${('0' + d.getMinutes()).slice(-2)}:${('0' + d.getSeconds()).slice(-2)}
|
||||
</div>
|
||||
`
|
||||
}
|
||||
|
||||
const element = $.parseHTML(`
|
||||
<div data-from="${userId}" data-id="${msgId}" class="message-row {animationIn} animated" id="msg-${totalMessages}">
|
||||
<div class="meta" style="background-color: ${color};">
|
||||
<div class="name">${username}</div>
|
||||
</div>
|
||||
|
||||
<div class="meta1">
|
||||
<div class="badges">${badges}</div>
|
||||
<div class="name">${username}</div>
|
||||
</div>
|
||||
|
||||
<div class="message">
|
||||
<div class="container-message ${actionClass}" style="border: 2px solid ${borderMessage};">
|
||||
${message}
|
||||
${hora}
|
||||
</div>
|
||||
</div>
|
||||
</div>`);
|
||||
|
||||
if (addition === "append") {
|
||||
if (hideAfter !== 0) {
|
||||
$(element)
|
||||
.appendTo('#log')
|
||||
.delay(hideAfter * 1000)
|
||||
.queue(function () {
|
||||
$(this).removeClass(animationIn).addClass(animationOut).delay(1000).queue(function () {
|
||||
$(this).remove()
|
||||
}).dequeue();
|
||||
});
|
||||
} else {
|
||||
$(element)
|
||||
.appendTo('#log');
|
||||
}
|
||||
} else {
|
||||
if (hideAfter !== 0) {
|
||||
$(element)
|
||||
.prependTo('#log')
|
||||
.delay(hideAfter * 1000)
|
||||
.queue(function () {
|
||||
$(this).removeClass(animationIn).addClass(animationOut).delay(1000).queue(function () {
|
||||
$(this).remove()
|
||||
}).dequeue();
|
||||
});
|
||||
} else {
|
||||
$(element)
|
||||
.prependTo('#log');
|
||||
}
|
||||
}
|
||||
|
||||
if (messagesLimit > 0 && totalMessages > messagesLimit) {
|
||||
removeRow();
|
||||
}
|
||||
}
|
||||
|
||||
function attachEmotes(message) {
|
||||
let text = html_encode(message.text);
|
||||
let data = message.emotes;
|
||||
if (typeof message.attachment !== "undefined") {
|
||||
if (typeof message.attachment.media !== "undefined") {
|
||||
if (typeof message.attachment.media.image !== "undefined") {
|
||||
text = `${message.text}<img src="${message.attachment.media.image.src}">`;
|
||||
}
|
||||
}
|
||||
}
|
||||
return text.replace(/([^\s]*)/gi, function (m, key) {
|
||||
let result = data.filter((emote) => {
|
||||
return emote.name === key;
|
||||
});
|
||||
if (typeof result[0] !== "undefined") {
|
||||
let msgSize = messageSize + 5;
|
||||
let url = result[0]["urls"][4];
|
||||
if (provider === "twitch") {
|
||||
return `<img width="${msgSize}" class="emote" src="${url}"/>`;
|
||||
} else {
|
||||
if (typeof result[0].coords === "undefined") {
|
||||
result[0].coords = { x: 0, y: 0 };
|
||||
}
|
||||
let x = parseInt(result[0].coords.x);
|
||||
let y = parseInt(result[0].coords.y);
|
||||
|
||||
let width = "auto";
|
||||
let height = "auto";
|
||||
|
||||
if (provider === "mixer") {
|
||||
console.log(result[0]);
|
||||
if (result[0].coords.width) {
|
||||
width = `${result[0].coords.width}px`;
|
||||
}
|
||||
if (result[0].coords.height) {
|
||||
height = `${result[0].coords.height}px`;
|
||||
}
|
||||
}
|
||||
return `<div class="emote" style="width: ${width}; height:${height}; display: inline-block; background-image: url(${url}); background-position: -${x}px -${y}px;"></div>`;
|
||||
}
|
||||
} else return key;
|
||||
});
|
||||
}
|
||||
|
||||
function html_encode(e) {
|
||||
return e.replace(/[<>"^]/g, function (e) {
|
||||
return "&#" + e.charCodeAt(0) + ";";
|
||||
});
|
||||
}
|
||||
|
||||
function removeRow() {
|
||||
if (!$(removeSelector).length) {
|
||||
return;
|
||||
}
|
||||
if (animationOut !== "none" || !$(removeSelector).hasClass(animationOut)) {
|
||||
if (hideAfter !== 0) {
|
||||
$(removeSelector).dequeue();
|
||||
} else {
|
||||
$(removeSelector).addClass(animationOut).delay(1000).queue(function () {
|
||||
$(this).remove().dequeue()
|
||||
});
|
||||
|
||||
}
|
||||
return;
|
||||
}
|
||||
|
||||
$(removeSelector).animate({
|
||||
height: 0,
|
||||
opacity: 0
|
||||
}, 'slow', function () {
|
||||
$(removeSelector).remove();
|
||||
});
|
||||
}
|
||||
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 25 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 505 KiB |
Loading…
Reference in New Issue