oss/FrankerFaceZ
oss/FrankerFaceZ
1
0
Fork 0
mirror of https://github.com/FrankerFaceZ/FrankerFaceZ.git synced 2025-10-04 02:10:46 +00:00
Code Wiki Activity

More style tweaking. Did a bit of work on the Chat Room Management menu (still disabled). Added server history to moderation cards. Fixed gulpfile to actually work with the new styles that are compiled into the script.

Browse source
This commit is contained in:
SirStendec 2015-11-11 16:03:27 -05:00
parent 3958a37f38
commit 0cabebdf19
15 changed files with 336 additions and 222 deletions
Download patch file Download diff file Expand all files Collapse all files

2
src/badges.js
View file

@ -88,6 +88,7 @@ FFZ.settings_info.transparent_badges = {
this.toggle_style('badges-blank', val === 3 || val === 4);
this.toggle_style('badges-circular-small', val === 4);
this.toggle_style('badges-transparent', val === 5);
document.body.classList.toggle('ffz-transparent-badges', val === 5);
}
};
@ -104,6 +105,7 @@ FFZ.prototype.setup_badges = function() {
this.toggle_style('badges-blank', val === 3 || val === 4);
this.toggle_style('badges-circular-small', val === 4);
this.toggle_style('badges-transparent', val === 5);
document.body.classList.toggle('ffz-transparent-badges', val === 5);
}
this.toggle_style('badges-legacy', this.settings.legacy_badges === 3);

10
src/ember/chatview.js
View file

@ -716,10 +716,10 @@ FFZ.prototype._modify_cview = function(view) {
tabs.innerHTML = "";
var link = document.createElement('a'),
view = this,
total_unread = 0;
view = this;
//total_unread = 0;
for(var room_id in f.rooms) {
/*for(var room_id in f.rooms) {
var room = f.rooms[room_id] && f.rooms[room_id].room,
is_unread = room && room.get('unreadCount') > 0;
@ -728,11 +728,11 @@ FFZ.prototype._modify_cview = function(view) {
total_unread++;
} else if ( room )
room._ffz_was_unread = false;
}
}*/
link.className = 'button glyph-only tooltip';
link.title = "Chat Room Management";
link.innerHTML = constants.ROOMS + '<span class="notifications">' + (total_unread || '') + '</span>';
link.innerHTML = constants.ROOMS; // + '<span class="notifications">' + (total_unread || '') + '</span>';
link.addEventListener('click', function() {
var controller = view.get('controller');

111
src/ember/moderation-card.js
View file

@ -724,38 +724,82 @@ FFZ.prototype.setup_mod_card = function() {
if ( f.settings.mod_card_history ) {
var Chat = App.__container__.lookup('controller:chat'),
room = Chat && Chat.get('currentRoom'),
ffz_room = room && f.rooms && f.rooms[room.get('id')],
user_history = ffz_room && ffz_room.user_history && ffz_room.user_history[controller.get('cardInfo.user.id')];
tmiSession = room.tmiSession || (window.TMI && TMI._sessions && TMI._sessions[0]),
room_id = room.get('id'),
user_id = controller.get('cardInfo.user.id'),
ffz_room = room && f.rooms && f.rooms[room_id],
user_history = ffz_room && ffz_room.user_history && ffz_room.user_history[user_id] || [],
if ( user_history && user_history.length ) {
var history = document.createElement('ul');
history.className = 'interface clearfix chat-history';
history = document.createElement('ul');
for(var i=0; i < user_history.length; i++) {
var line = user_history[i],
l_el = document.createElement('li');
history.className = 'interface clearfix chat-history';
l_el.className = 'message-line chat-line clearfix';
if ( user_history.length < 20 ) {
var before = user_history.length > 0 ? user_history[0].date.getTime() : Date.now();
f.ws_send("user_history", [room_id, user_id, 50 - user_history.length], function(success, data) {
if ( ! success )
return;
if ( line.style )
l_el.classList.add(line.style);
var i = data.length,
was_at_top = history && history.scrollTop >= (history.scrollHeight - history.clientHeight),
first = true;
l_el.innerHTML = (helpers ? '<span class="timestamp float-left">' + helpers.getTime(line.date) + '</span> ' : '') + '<span class="message">' + (line.style === 'action' ? '*' + line.from + ' ' : '') + f.render_tokens(line.cachedTokens) + '</span>';
while(i--) {
var msg = data[i];
if ( ! msg )
continue;
// Interactivity
jQuery('a.deleted-link', l_el).click(f._deleted_link_click);
jQuery('img.emoticon', l_el).click(function(e) { f._click_emote(this, e) });
jQuery('.html-tooltip', l_el).tipsy({html:true});
if ( typeof msg.date === "string" || typeof msg.date === "number" )
msg.date = utils.parse_date(msg.date);
// Append
history.appendChild(l_el);
}
if ( ! msg.date || msg.date.getTime() >= before )
continue;
el.appendChild(history);
if ( first ) {
first = false;
history.insertBefore(f._build_mod_card_history({
date: msg.date,
from: "jtv",
style: "admin",
cachedTokens: ["(Server History Above)"]
}), history.firstElementChild);
}
// Lazy scroll-to-bottom
history.scrollTop = history.scrollHeight;
if ( ! msg.style ) {
if ( msg.from === "jtv" )
msg.style = "admin";
else if ( msg.from === "twitchnotify" )
msg.style = "notification";
}
if ( msg.tags && typeof msg.tags.emotes === "string" )
try {
msg.tags.emotes = JSON.parse(msg.tags.emotes);
} catch(err) {
f.log("Error Parsing JSON Emotes: " + err);
msg.tags.emotes = {};
}
if ( ! msg.cachedTokens || ! msg.cachedTokens.length )
f.tokenize_chat_line(msg, true, room.get('roomProperties.hide_chat_links'));
history.insertBefore(f._build_mod_card_history(msg), history.firstElementChild);
if ( history.childElementCount >= 50 )
break;
}
if ( was_at_top )
setTimeout(function() { history.scrollTop = history.scrollHeight; });
});
}
for(var i=0; i < user_history.length; i++)
history.appendChild(f._build_mod_card_history(user_history[i]));
el.appendChild(history);
// Lazy scroll-to-bottom
history.scrollTop = history.scrollHeight;
}
// Reposition the menu if it's off-screen.
@ -785,6 +829,29 @@ FFZ.prototype.setup_mod_card = function() {
}
FFZ.prototype._build_mod_card_history = function(line) {
var l_el = document.createElement('li'),
f = this;
l_el.className = 'message-line chat-line clearfix';
if ( line.ffz_has_mention )
l_el.classList.add('ffz-mentioned');
if ( line.style )
l_el.classList.add(line.style);
l_el.innerHTML = (helpers ? '<span class="timestamp float-left">' + helpers.getTime(line.date) + '</span> ' : '') + '<span class="message">' + (line.style === 'action' ? '*' + line.from + ' ' : '') + f.render_tokens(line.cachedTokens) + '</span>';
// Interactivity
jQuery('a.deleted-link', l_el).click(f._deleted_link_click);
jQuery('img.emoticon', l_el).click(function(e) { f._click_emote(this, e) });
jQuery('.html-tooltip', l_el).tipsy({html:true});
return l_el;
}
// ----------------
// Aliases
// ----------------

15
src/ember/room.js
View file

@ -1201,20 +1201,7 @@ FFZ.prototype._modify_room = function(room) {
was_at_top = history && history.scrollTop >= (history.scrollHeight - history.clientHeight);
if ( history ) {
var l_el = document.createElement('li');
l_el.className = 'message-line chat-line clearfix';
if ( msg.style )
l_el.classList.add(msg.style);
l_el.innerHTML = (helpers ? '<span class="timestamp float-left">' + helpers.getTime(msg.date) + '</span> ' : '') + '<span class="message">' + (msg.style === 'action' ? '*' + msg.from + ' ' : '') + f.render_tokens(msg.cachedTokens) + '</span>';
// Interactivity
jQuery('a.deleted-link', l_el).click(f._deleted_link_click);
jQuery('img.emoticon', l_el).click(function(e) { f._click_emote(this, e) });
jQuery('.html-tooltip', l_el).tipsy({html:true});
history.appendChild(l_el);
history.appendChild(f._build_mod_card_history(msg));
if ( was_at_top )
setTimeout(function() { history.scrollTop = history.scrollHeight; })

1
src/ext/betterttv.js
View file

@ -77,6 +77,7 @@ FFZ.prototype.setup_bttv = function(delay) {
this.toggle_style('badges-transparent');
// Disable other features too.
document.body.classList.remove('ffz-transparent-badges');
document.body.classList.remove("ffz-sidebar-swap");
document.body.classList.remove("ffz-portrait");
document.body.classList.remove("ffz-flip-dashboard");

2
src/main.js
View file

@ -22,7 +22,7 @@ FFZ.get = function() { return FFZ.instance; }
// Version
var VER = FFZ.version_info = {
major: 3, minor: 5, revision: 63,
major: 3, minor: 5, revision: 65,
toString: function() {
return [VER.major, VER.minor, VER.revision].join(".") + (VER.extra || "");
}

39
src/styles/chat-background.css
View file

@ -14,10 +14,10 @@
.theatre .chat-history .chat-line:nth-child(2n+0):before,
.theatre .ember-chat .chat-lines > div:nth-child(2n+0) .chat-line:before,
.chat-container.dark .chat-lines > div:nth-child(2n+0) .chat-line:before,
.ember-chat-container.dark .chat-lines > div:nth-child(2n+0) .chat-line:before,
.chat-container.force-dark .chat-lines > div:nth-child(2n+0) .chat-line:before,
.ember-chat-container.force-dark .chat-lines > div:nth-child(2n+0) .chat-line:before {
.dark .chat-history .chat-line:nth-child(2n+0):before,
.force-dark .chat-history .chat-line:nth-child(2n+0):before,
.dark .chat-lines > div:nth-child(2n+0) .chat-line:before,
.force-dark .chat-lines > div:nth-child(2n+0) .chat-line:before {
background-color: rgba(255,255,255, 0.05);
}
@ -38,21 +38,20 @@
/* DEPRECIATED: DARK THEME: Mention Backgrounds */
.ffz-dark .chat-history .chat-line.ffz-mentioned:before,
.theatre .ember-chat .chat-line.ffz-mentioned:before,
.chat-container.dark .chat-line.ffz-mentioned:before,
.chat-container.force-dark .chat-line.ffz-mentioned:before,
.ember-chat-container.dark .chat-line.ffz-mentioned:before,
.ember-chat-container.force-dark .chat-line.ffz-mentioned:before {
.theatre .chat-line.ffz-mentioned:before,
.dark .chat-line.ffz-mentioned:before,
.force-dark .chat-line.ffz-mentioned:before {
background-color: rgba(255,0,0, 0.2) !important;
}
.theatre .chat-lines > div:nth-child(2n+0) .chat-line.ffz-mentioned:before,
.chat-container.dark .chat-lines > div:nth-child(2n+0) .chat-line.ffz-mentioned:before,
.ember-chat-container.dark .chat-lines > div:nth-child(2n+0) .chat-line.ffz-mentioned:before,
.chat-container.force-dark .chat-lines > div:nth-child(2n+0) .chat-line.ffz-mentioned:before,
.ember-chat-container.force-dark .chat-lines > div:nth-child(2n+0) .chat-line.ffz-mentioned:before {
.dark .chat-history .chat-line.ffz-mentioned:nth-child(2n+0):before,
.force-dark .chat-history .chat-line.ffz-mentioned:nth-child(2n+0):before,
.dark .chat-lines > div:nth-child(2n+0) .chat-line.ffz-mentioned:before,
.force-dark .chat-lines > div:nth-child(2n+0) .chat-line.ffz-mentioned:before {
background-color: rgba(255,0,0, 0.3) !important;
}
@ -61,17 +60,13 @@
/* Chat Mentions */
/* TODO: Move this by itself */
.ember-chat .mentioned:empty,
.ember-chat .mentioning:empty,
.chat-history .mentioned:empty,
.chat-history .mentioning:empty {
.mentioned:empty,
.mentioning:empty {
display: none;
}
.ember-chat .chat-line .mentioned,
.ember-chat .chat-line .mentioning,
.chat-history .chat-line .mentioned,
.chat-history .chat-line .mentioning {
.chat-line .mentioned,
.chat-line .mentioning {
border-radius: 10px;
padding: 3px 7px;
font-weight: bold;
@ -83,6 +78,8 @@
.ffz-dark .chat-history .mentioned,
.ffz-dark .chat-history .mentioning,
.app-main.theatre .chat-container .chat-line .mentioned,
.app-main.theatre .chat-container .chat-line .mentioning,
.chat-container.dark .chat-line .mentioned,
.chat-container.dark .chat-line .mentioning,
.chat-container.force-dark .chat-line .mentioned,

6
src/styles/chat-separator-3d-inset.css
View file

@ -10,10 +10,8 @@
.theatre .conversation-chat-lines > div:before,
.theatre .chat-line:before,
.chat-container.dark .chat-line:before,
.chat-container.force-dark .chat-line:before,
.ember-chat-container.dark .chat-line:before,
.ember-chat-container.force-dark .chat-line:before {
.dark .chat-line:before,
.force-dark .chat-line:before {
border-top-color: #000;
border-bottom-color: rgba(255,255,255, 0.1);
}

6
src/styles/chat-separator-3d.css
View file

@ -9,9 +9,7 @@
.theatre .conversation-chat-lines > div:before,
.theatre .chat-line:before,
.chat-container.dark .chat-line:before,
.chat-container.force-dark .chat-line:before,
.ember-chat-container.dark .chat-line:before,
.ember-chat-container.force-dark .chat-line:before {
.dark .chat-line:before,
.force-dark .chat-line:before {
border-top-color: rgba(255,255,255, 0.1);
}

6
src/styles/chat-separator-wide.css
View file

@ -9,9 +9,7 @@
.theatre .conversation-chat-lines > div:before,
.theatre .chat-line:before,
.chat-container.dark .chat-line:before,
.chat-container.force-dark .chat-line:before,
.ember-chat-container.dark .chat-line:before,
.ember-chat-container.force-dark .chat-line:before {
.dark .chat-line:before,
.force-dark .chat-line:before {
border-top-color: #000;
}

6
src/styles/chat-separator.css
View file

@ -9,10 +9,8 @@
.theatre .conversation-chat-lines > div:before,
.theatre .chat-line:before,
.chat-container.dark .chat-line:before,
.chat-container.force-dark .chat-line:before,
.ember-chat-container.dark .chat-line:before,
.ember-chat-container.force-dark .chat-line:before {
.dark .chat-line:before,
.force-dark .chat-line:before {
border-bottom-color: #000;
}

4
src/ui/styles.js
View file

@ -1,7 +1,7 @@
var FFZ = window.FrankerFaceZ,
utils = require('../utils'),
constants = require('../constants');
styles = require('../styles');
styles = require('../compiled_styles');
FFZ.prototype.setup_css = function() {
document.body.classList.toggle('ffz-flip-dashboard', this.settings.flip_dashboard);
@ -49,6 +49,6 @@ FFZ.prototype.toggle_style = function(key, enabled) {
return;
this._toggle_style_state[key] = enabled;
utils.update_css(this._toggle_style, key, enabled ? styles[key] || null : null);
}