Bastelstube/Tims-Chat
1
0
Fork 0
mirror of https://github.com/wbbaddons/Tims-Chat.git synced 2024-10-31 14:10:08 +00:00
Code Issues Releases Wiki Activity

Further message template improvements

Browse Source 
- Publish message types to JavaScript
- add message type icons
- style info message properly
This commit is contained in:
Maximilian Mader 2013-06-24 17:45:46 +02:00
parent c3dd2c899b
commit 5fd1e6e7be
4 changed files with 49 additions and 39 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
file/js/be.bastelstu.Chat.litcoffee
View File

@ -420,7 +420,10 @@ Insert the given messages into the chat stream.
if createNewMessage
message.isFollowUp = no
output = v.messageTemplate.fetch message
output = v.messageTemplate.fetch
'message': message
'messageTypes': v.config.messageTypes
li = $ '<li></li>'
li.addClass 'timsChatMessage'
li.addClass "timsChatMessage#{message.type}"
@ -431,7 +434,10 @@ Insert the given messages into the chat stream.
li.appendTo $ '#timsChatMessageContainer > ul'
else
message.isFollowUp = yes
output = v.messageTemplate.fetch message
output = v.messageTemplate.fetch
'message': message
'messageTypes': v.config.messageTypes
$('.timsChatMessage:last-child .text').append $(output).find('.text li:last-child')
lastMessage = message

1
file/lib/page/ChatPage.class.php
View File

@ -89,6 +89,7 @@ public function assignVariables() {
'roomID' => $this->roomID,
'rooms' => $this->rooms,
'commands' => $this->commands,
'messageTypes' => (new \ReflectionClass('\chat\data\message\Message'))->getConstants(),
'defaultSmilies' => $this->defaultSmilies,
'smileyCategories' => $this->smileyCategories,
'sidebarCollapsed' => \wcf\system\user\collapsible\content\UserCollapsibleContentHandler::getInstance()->isCollapsed('com.woltlab.wcf.collapsibleSidebar', 'be.bastelstu.chat.ChatPage'),

26
template/chat.tpl
View File

@ -34,7 +34,8 @@
{
reloadTime: {@CHAT_RELOADTIME},
messageURL: '{link application="chat" controller="NewMessages"}{/link}',
installedCommands: [ {implode from=$commands item='command'}'{$command|encodeJS}'{/implode} ]
installedCommands: [ {implode from=$commands item='command'}'{$command|encodeJS}'{/implode} ],
messageTypes: { {implode from=$messageTypes key='name' item='messageType'}'{$name|substr:5|encodeJS}': {$messageType|encodeJS}{/implode} }
},
new WCF.Template('{literal}{if $newMessageCount}({#$newMessageCount}) {/if}{$title} - {/literal}{"chat.general.title"|language|encodeJS} - {PAGE_TITLE|language|encodeJS}'),
new WCF.Template('{@$messageTemplate|encodeJS}'),
@ -60,27 +61,6 @@
})(jQuery, this);
//]]>
</script>
<!--<style type="text/css">
/*<![CDATA[*/
.timsChatMessage::before {
content: "";
}
{assign var='type' value='\chat\data\message\Message::TYPE_'}
.timsChatMessage{$type|concat:'JOIN'|constant}::before {
content: "\f090";
}
.timsChatMessage{$type|concat:'LEAVE'|constant}::before {
content: "\f08b";
}
.timsChatMessage{$type|concat:'INFORMATION'|constant}::before {
content: "\f05a";
}
/*]]>*/
</style>-->
</head>
<body id="tpl{$templateName|ucfirst}">
@ -112,7 +92,7 @@
{include file='messageFormSmilies' wysiwygSelector=''}
{/if}
<nav id="timsChatOptions" class="marginTop buttonGroupNavigation">
<nav id="timsChatOptions" class="marginTop jsMobileNavigation buttonGroupNavigation">
<span class="invisible">{lang}chat.general.controls{/lang}</span>
<ul class="smallButtons buttonGroup">
<li><a id="timsChatAutoscroll" accesskey="d" class="button active timsChatToggle jsTooltip" title="{lang}chat.general.scroll{/lang}" data-status="1"><span class="icon icon16 icon-arrow-down"></span><span class="invisible">{lang}chat.general.scroll{/lang}</span></a></li>{*

51
template/message.tpl
View File

@ -1,31 +1,54 @@
{literal}
<div class="innerMessageContainer{if $type == 0 || $type == 7} bubble{/if}">
<div class="messageIcon">
{if $message.type == $messageTypes.LEAVE || $message.type == $messageTypes.JOIN}
<span class="icon icon16 icon-{if $message.type == $messageTypes.LEAVE}signout{else}signin{/if}"></span>
{/if}
</div>
<div class="innerMessageContainer{if $message.type == $messageTypes.NORMAL || $message.type == $messageTypes.WHISPER || $message.type == $messageTypes.INFORMATION} bubble{/if}{if $message.type == $messageTypes.WHISPER && $message.sender != $__wcf.User.userID} right{/if}">
<div class="userAvatar framed">
{if $type == 0 || $type == 7}
{@$avatar[32]}
{if $message.type != $messageTypes.INFORMATION}
{if $message.type == $messageTypes.NORMAL || $message.type == $messageTypes.WHISPER}
{@$message.avatar[32]}
{else}
{@$message.avatar[16]}
{/if}
{else}
{@$avatar[16]}
<span class="icon icon32 icon-info-sign"></span>
{/if}
</div>
<div class="innerMessage">
<span class="username">
{@$formattedUsername}
{if $type == 7}
<span class="icon icon16 icon-double-angle-right jsTooltip" title="{/literal}{lang}chat.ui.whispers{/lang}{literal}" onclick="be.bastelstu.Chat.insertText('/whisper {if $receiver == WCF.User.userID}{$username.replace("\\", "\\\\").replace("'", "\\'")}{else}{$additionalData.receiverUsername.replace("\\", "\\\\").replace("'", "\\'")}{/if}, ', { append: false });"></span>
{$additionalData.receiverUsername}
{if ($message.type == $messageTypes.WHISPER && $message.sender == WCF.User.userID) || $message.type != $messageTypes.WHISPER}
{@$message.formattedUsername}
{else}
{$message.additionalData.receiverUsername}
{/if}
{if $message.type == $messageTypes.WHISPER}
<span class="icon icon16 icon-double-angle-{if $message.sender == WCF.User.userID}right{else}left{/if} jsTooltip" title="{/literal}{lang}chat.ui.whispers{/lang}{literal}" onclick="be.bastelstu.Chat.insertText('/whisper {if $message.receiver == WCF.User.userID}{$message.username.replace("\\", "\\\\").replace("'", "\\'")}{else}{$message.additionalData.receiverUsername.replace("\\", "\\\\").replace("'", "\\'")}{/if}, ', { append: false });"></span>
{if ($message.type == $messageTypes.WHISPER && $message.sender == WCF.User.userID) || $message.type != $messageTypes.WHISPER}
{$message.additionalData.receiverUsername}
{else}
{@$message.formattedUsername}
{/if}
{/if}
</span>
<time>{@$formattedTime}</time>
{if $type == 0 || $type == 7}
<ul>
<li class="text">{@$formattedMessage}</li>
<time>{@$message.formattedTime}</time>
{if $message.type == $messageTypes.NORMAL || $message.type == $messageTypes.WHISPER}
<ul class="text">
<li>
{if $message.isFollowUp} <time>{@$message.formattedTime}</time>{/if}
{@$message.formattedMessage}
</li>
</ul>
{else}
<span class="text">{@$formattedMessage}</span>
<span class="text">{@$message.formattedMessage}</span>
{/if}
</div>
<span class="markContainer">
<input type="checkbox" value="{@$messageID}" />
<input type="checkbox" value="{@$message.messageID}" />
</span>
</div>
{/literal}