1
0
mirror of https://github.com/wbbaddons/Tims-Chat.git synced 2025-01-09 00:20:08 +00:00

Use CSS animations for topic

This commit is contained in:
Tim Düsterhus 2013-01-31 16:03:20 +01:00
parent 5a5a2c9ad1
commit 76191f9476
3 changed files with 23 additions and 22 deletions

View File

@ -178,6 +178,13 @@ window.console ?=
# Refreshes the roomlist # Refreshes the roomlist
$('#timsChatRoomList button').click $.proxy @refreshRoomList, @ $('#timsChatRoomList button').click $.proxy @refreshRoomList, @
# Clears the stream
$('#timsChatClear').click (event) ->
event.preventDefault()
$('.timsChatMessage').remove()
@oldScrollTop = null
$('#timsChatMessageContainer').scrollTop $('#timsChatMessageContainer ul').height()
# Toggle Buttons # Toggle Buttons
$('.timsChatToggle').click (event) -> $('.timsChatToggle').click (event) ->
element = $ @ element = $ @
@ -193,19 +200,6 @@ window.console ?=
$('#timsChatInput').focus() $('#timsChatInput').focus()
# Clears the stream
$('#timsChatClear').click (event) ->
event.preventDefault()
$('.timsChatMessage').remove()
@oldScrollTop = null
$('#timsChatMessageContainer').scrollTop $('#timsChatMessageContainer ul').height()
$('#timsChatSmilies').click (event) ->
if $(@).data 'status'
$('#smilies').removeClass 'disabled'
else
$('#smilies').addClass 'disabled'
# Enable fullscreen-mode # Enable fullscreen-mode
$('#timsChatFullscreen').click (event) -> $('#timsChatFullscreen').click (event) ->
if $(@).data 'status' if $(@).data 'status'
@ -248,14 +242,11 @@ window.console ?=
target.parent().addClass 'activeMenuItem' target.parent().addClass 'activeMenuItem'
# Set new topic # Set new topic
$('#timsChatTopic').text data.topic
if data.topic is '' if data.topic is ''
return if $('#timsChatTopic').text().trim() is '' $('#timsChatTopic').addClass 'empty'
$('#timsChatTopic').wcfBlindOut 'vertical', () ->
$(@).text ''
else else
$('#timsChatTopic').text data.topic $('#timsChatTopic').removeClass 'empty'
$('#timsChatTopic').wcfBlindIn() if $('#timsChatTopic').text().trim() isnt '' and $('#timsChatTopic').is ':hidden'
$('.timsChatMessage').addClass 'unloaded', 800 $('.timsChatMessage').addClass 'unloaded', 800
@handleMessages data.messages @handleMessages data.messages
@ -383,7 +374,7 @@ window.console ?=
element.addClass 'away' element.addClass 'away'
element.attr 'title', user.awayStatus element.attr 'title', user.awayStatus
else else
element.removeClass 'away' element.removeClass 'timsChatAway'
element.removeAttr 'title' element.removeAttr 'title'
element.data 'tooltip', '' element.data 'tooltip', ''
if user.suspended if user.suspended

View File

@ -13,6 +13,16 @@
#timsChatTopic { #timsChatTopic {
padding: 5px; padding: 5px;
.transition(height, .2s);
.transition(padding-top, .2s);
.transition(padding-bottom, .2s);
&.empty {
height: 0px;
overflow: hidden;
border: 0px;
padding: 0px;
}
} }
} }
} }

View File

@ -89,7 +89,7 @@
{include file='header' sandbox=false sidebarOrientation='right'} {include file='header' sandbox=false sidebarOrientation='right'}
<div id="timsChatRoomContent"> <div id="timsChatRoomContent">
<div id="timsChatTopic" class="container"{if $room->topic|language === ''} style="display: none;"{/if}>{$room->topic|language}</div> <div id="timsChatTopic" class="container{if $room->topic|language === ''} empty{/if}">{$room->topic|language}</div>
<fieldset> <fieldset>
<div id="timsChatMessageContainer" class="timsChatMessageContainer container box shadow1"> <div id="timsChatMessageContainer" class="timsChatMessageContainer container box shadow1">
<noscript><p class="error">{lang}chat.general.noJs{/lang}</p></noscript> <noscript><p class="error">{lang}chat.general.noJs{/lang}</p></noscript>