From d2f23cb5a73d12a8ec4b64ba6167ec0a3bb27986 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Tim=20D=C3=BCsterhus?= Date: Wed, 9 Jan 2013 19:59:32 +0100 Subject: [PATCH] Show Chatlog inline --- file/js/be.bastelstu.WCF.Chat.Log.coffee | 108 ++++------------------ file/js/be.bastelstu.WCF.Chat.coffee | 33 ++++--- file/style/be.bastelstu.wcf.chat.less | 69 +++++++------- template/chat.tpl | 40 ++++---- template/chatJavascriptInclude.tpl | 4 +- template/chatLog.tpl | 112 ++--------------------- template/chatLogSidebar.tpl | 0 template/chatNavigationInclude.tpl | 2 +- 8 files changed, 102 insertions(+), 266 deletions(-) delete mode 100644 template/chatLogSidebar.tpl diff --git a/file/js/be.bastelstu.WCF.Chat.Log.coffee b/file/js/be.bastelstu.WCF.Chat.Log.coffee index d168b04..1515b58 100644 --- a/file/js/be.bastelstu.WCF.Chat.Log.coffee +++ b/file/js/be.bastelstu.WCF.Chat.Log.coffee @@ -7,104 +7,28 @@ # @package be.bastelstu.wcf.chat ### -(($, window, _console) -> - be.bastelstu.WCF.Chat.Log = $.extend true, { }, be.bastelstu.WCF.Chat, - init: () -> - console.log 'Initializing' - @bindEvents() - console.log 'Finished initializing - Shields at 104 percent' - ### - # Binds all the events needed for Tims Chat. - ### - bindEvents: () -> - # Switch sidebar tab - $('.timsChatSidebarTabs li').click $.proxy (event) -> - event.preventDefault() - @toggleSidebarContents $ event.target - , @ - - # Refreshes the roomlist - $('#timsChatRoomList button').click $.proxy(@refreshRoomList, @) - - # Toggle Buttons - $('.timsChatToggle').click (event) -> - element = $ @ - icon = element.find 'img' - if element.data('status') is 1 - element.data 'status', 0 - icon.attr 'src', icon.attr('src').replace /enabled(Inverse)?.([a-z]{3})$/, 'disabled$1.$2' - element.attr 'title', element.data 'enableMessage' - else - element.data 'status', 1 - icon.attr 'src', icon.attr('src').replace /disabled(Inverse)?.([a-z]{3})$/, 'enabled$1.$2' - element.attr 'title', element.data 'disableMessage' - - $('#timsChatInput').focus() - - # Enable fullscreen-mode - $('#timsChatFullscreen').click (event) -> - if $(@).data 'status' - $('html').addClass 'fullscreen' - else - $('html').removeClass 'fullscreen' - ### - # Inserts the new messages. - # - # @param array messages - ### +(($, window) -> + be.bastelstu.WCF.Chat.Log = be.bastelstu.WCF.Chat.extend + init: (@chat) -> handleMessages: (messages) -> # Insert the messages for message in messages - continue if $.wcfIsset 'timsChatMessage' + message.messageID # Prevent problems with race condition + @events.newMessage.fire message - output = @messageTemplate.fetch message + output = @chat.messageTemplate.fetch message li = $ '
  • ' - li.attr 'id', 'timsChatMessage'+message.messageID li.addClass 'timsChatMessage timsChatMessage'+message.type + li.addClass 'ownMessage' if message.sender is WCF.User.userID li.append output - li.appendTo $ '.timsChatMessageContainer > ul' - ### - # Refreshes the room-list. - ### - refreshRoomList: () -> - console.log 'Refreshing the roomlist' - $('#toggleRooms a').addClass 'ajaxLoad' - - $.ajax $('#toggleRooms a').data('refreshUrl'), - dataType: 'json' - type: 'POST' - success: $.proxy((data, textStatus, jqXHR) -> - $('#timsChatRoomList li').remove() - $('#toggleRooms a').removeClass 'ajaxLoad' - $('#toggleRooms .badge').text data.length - - for room in data - li = $ '
  • ' - li.addClass 'activeMenuItem' if room.active - $('' + room.title + '').addClass('timsChatRoom').appendTo li - $('#timsChatRoomList ul').append li - - console.log 'Found ' + data.length + ' rooms' - , @) - ### - # Toggles between user- and room-list. - # - # @param jQuery-object target - ### - toggleSidebarContents: (target) -> - return if target.parents('li').hasClass 'active' - - if target.parents('li').attr('id') is 'toggleUsers' - $('#toggleUsers').addClass 'active' - $('#toggleRooms').removeClass 'active' + li.appendTo $ '#timsChatLog .timsChatMessageContainer > ul' - $('#timsChatRoomList').hide() - $('#timsChatUserList').show() - else if target.parents('li').attr('id') is 'toggleRooms' - $('#toggleRooms').addClass 'active' - $('#toggleUsers').removeClass 'active' - - $('#timsChatUserList').hide() - $('#timsChatRoomList').show() -)(jQuery, @, console) + be.bastelstu.WCF.Chat.Log.loadOverlay = () -> + if !$.wcfIsset 'timsChatLogDialog' + container = $ '
    ' + $('#content').append container + + $('#timsChatLogDialog').load 'http://127.0.0.1/wbb/wbb4/index.php/Chat/Log/1-Hauptchat/', () -> + WCF.showDialog 'timsChatLogDialog', + title: 'Log' +)(jQuery, @) diff --git a/file/js/be.bastelstu.WCF.Chat.coffee b/file/js/be.bastelstu.WCF.Chat.coffee index a38e1dc..9e1788f 100644 --- a/file/js/be.bastelstu.WCF.Chat.coffee +++ b/file/js/be.bastelstu.WCF.Chat.coffee @@ -26,7 +26,7 @@ window.console ?= _console.error '[be.bastelstu.WCF.Chat] '+message - be.bastelstu.WCF.Chat = + be.bastelstu.WCF.Chat = Class.extend # Tims Chat stops loading when this reaches zero # TODO: We need an explosion animation shields: 3 @@ -63,7 +63,7 @@ window.console ?= getMessages: null refreshRoomList: null fish: null - init: () -> + init: (@config, @titleTemplate, @messageTemplate) -> console.log 'Initializing' @bindEvents() @events.newMessage.add $.proxy @notify, @ @@ -178,7 +178,7 @@ window.console ?= event.preventDefault() $('.timsChatMessage').remove() @oldScrollTop = null - $('.timsChatMessageContainer').scrollTop $('.timsChatMessageContainer ul').height() + $('#timsChatMessageContainer').scrollTop $('#timsChatMessageContainer ul').height() # Toggle Buttons $('.timsChatToggle').click (event) -> @@ -206,7 +206,7 @@ window.console ?= $('#timsChatAutoscroll').click (event) -> $(@).removeClass 'active' if $(@).data 'status' - $('.timsChatMessageContainer').scrollTop $('.timsChatMessageContainer ul').height() + $('#timsChatMessageContainer').scrollTop $('#timsChatMessageContainer ul').height() @oldScrollTop = $('.timsChatMessageContainer').scrollTop() # Desktop Notifications @@ -299,13 +299,13 @@ window.console ?= $.ajax @config.messageURL, dataType: 'json' type: 'POST' - success: $.proxy((data, textStatus, jqXHR) -> + success: $.proxy (data, textStatus, jqXHR) -> WCF.DOMNodeInsertedHandler.enable() @handleMessages(data.messages) @handleUsers(data.users) WCF.DOMNodeInsertedHandler.disable() - , @) - error: $.proxy((jqXHR, textStatus, errorThrown) -> + , @ + error: $.proxy (jqXHR, textStatus, errorThrown) -> console.error 'Battle Station hit - shields at ' + (--@shields / 3 * 104) + ' percent' if @shields is 0 @pe.refreshRoomList.stop() @@ -313,15 +313,15 @@ window.console ?= @freeTheFish() console.error 'We got destroyed, but could free our friend the fish before he was killed as well. Have a nice life in freedom!' alert 'herp i cannot load messages' - , @), - complete: $.proxy(() -> + , @ + complete: $.proxy () -> @loading = false - , @) - beforeSend: $.proxy(() -> + , @ + beforeSend: $.proxy () -> return false if @loading @loading = true - , @) + , @ ### # Inserts the new messages. # @@ -330,7 +330,7 @@ window.console ?= handleMessages: (messages) -> # Disable scrolling automagically when user manually scrolled unless @oldScrollTop is null - if $('.timsChatMessageContainer').scrollTop() < @oldScrollTop + if $('#timsChatMessageContainer').scrollTop() < @oldScrollTop if $('#timsChatAutoscroll').data('status') is 1 $('#timsChatAutoscroll').click() $('#timsChatAutoscroll').addClass 'active' @@ -348,12 +348,11 @@ window.console ?= li.addClass 'ownMessage' if message.sender is WCF.User.userID li.append output - li.appendTo $ '.timsChatMessageContainer > ul' + li.appendTo $ '#timsChatMessageContainer > ul' # Autoscroll down - if $('#timsChatAutoscroll').data('status') is 1 - $('.timsChatMessageContainer').scrollTop $('.timsChatMessageContainer ul').height() - @oldScrollTop = $('.timsChatMessageContainer').scrollTop() + $('#timsChatMessageContainer').scrollTop $('#timsChatMessageContainer ul').height() if $('#timsChatAutoscroll').data('status') is 1 + @oldScrollTop = $('#timsChatMessageContainer').scrollTop() ### # Builds the userlist. # diff --git a/file/style/be.bastelstu.wcf.chat.less b/file/style/be.bastelstu.wcf.chat.less index 53ffdf1..3d608d1 100644 --- a/file/style/be.bastelstu.wcf.chat.less +++ b/file/style/be.bastelstu.wcf.chat.less @@ -7,7 +7,7 @@ * @package be.bastelstu.wcf.chat */ -#tplChat, #tplChatLog { +#tplChat { #content { #timsChatRoomContent { text-align: left; @@ -15,43 +15,48 @@ #timsChatTopic { padding: 5px; } + } + } + + .timsChatMessageContainer { + height: 200px; + overflow-y: scroll; + overflow-x: hidden; + padding-left: 7px !important; + + .timsChatMessage { + padding-left: 16px; + min-height: 16px; + clear: both; - .timsChatMessageContainer { - height: 200px; - overflow-y: scroll; - overflow-x: hidden; - padding-left: 7px !important; - - .timsChatMessage { - padding-left: 16px; - min-height: 16px; - clear: both; - - time:first-child { - font-size: .8em; - &::before, &::after { - font-size: .8em; - } - &::before { - content: "["; - } - &::after { - content: "]"; - } - } - - .username { - font-weight: bold; - } - - &.unloaded { - opacity: 0.4; - } + time:first-child { + font-size: .8em; + &::before, &::after { + font-size: .8em; + } + &::before { + content: "["; + } + &::after { + content: "]"; } } + + .username { + font-weight: bold; + } + + &.unloaded { + opacity: 0.4; + } } } + #timsChatLog .timsChatMessageContainer { + height: auto; + overflow: visible; + } + .sidebar { margin-bottom: -20px !important; padding: 0; diff --git a/template/chat.tpl b/template/chat.tpl index 3398e6f..d853775 100644 --- a/template/chat.tpl +++ b/template/chat.tpl @@ -43,7 +43,7 @@
    topic|language === ''} style="display: none;"{/if}>{$room->topic|language}
    -
    +
    • {lang}wcf.chat.noJs{/lang}
    @@ -123,22 +123,11 @@ {include file='chatJavascriptInclude'} diff --git a/template/chatJavascriptInclude.tpl b/template/chatJavascriptInclude.tpl index bfc7b31..9745f56 100644 --- a/template/chatJavascriptInclude.tpl +++ b/template/chatJavascriptInclude.tpl @@ -1,7 +1,5 @@ {if CHAT_SOCKET_IO_PATH}{/if} -{if $templateName == 'chatLog'} - -{/if} + {event name='javascript'} \ No newline at end of file diff --git a/template/chatLog.tpl b/template/chatLog.tpl index 9aa89fe..6c66d71 100644 --- a/template/chatLog.tpl +++ b/template/chatLog.tpl @@ -1,108 +1,16 @@ -{include file='documentHeader'} - - - {$room} - {lang}wcf.chat.log.title{/lang} - {PAGE_TITLE|language} - - {include file='headInclude' sandbox=false} - - - - -{capture assign='sidebar'}{include file='chatLogSidebar'}{/capture} -{capture assign='headerNavigation'}{include file='chatNavigationInclude'}{/capture} -{include file='header' sandbox=false sidebarOrientation='right'} - -
    -
    -
    -
      -
    • {lang}wcf.chat.noJs{/lang}
      • -
    -
    -
    - -
    - +
    +
    +
      +
    - {include file='chatCopyright'}
    -{include file='chatJavascriptInclude'} - -{include file='footer' sandbox=false} - - \ No newline at end of file diff --git a/template/chatLogSidebar.tpl b/template/chatLogSidebar.tpl deleted file mode 100644 index e69de29..0000000 diff --git a/template/chatNavigationInclude.tpl b/template/chatNavigationInclude.tpl index a59843b..32a611e 100644 --- a/template/chatNavigationInclude.tpl +++ b/template/chatNavigationInclude.tpl @@ -1,5 +1,5 @@
  • - + {lang}wcf.chat.protocol{/lang}