From 3fe5016c9acb16cc38dde9d9bdfc91c90b499028 Mon Sep 17 00:00:00 2001 From: Maximilian Mader Date: Sat, 2 Nov 2013 23:08:12 +0100 Subject: [PATCH] Improve attachments in UI --- file/lib/data/message/Message.class.php | 33 ++++----------- file/style/be.bastelstu.chat.less | 29 +++++++++---- template/message.tpl | 55 +++++++++++-------------- 3 files changed, 51 insertions(+), 66 deletions(-) diff --git a/file/lib/data/message/Message.class.php b/file/lib/data/message/Message.class.php index 5f13b84..634f2d0 100644 --- a/file/lib/data/message/Message.class.php +++ b/file/lib/data/message/Message.class.php @@ -69,7 +69,7 @@ public function __toString() { * @param string $outputType outputtype for messageparser * @return string */ - public function getFormattedMessage($type = 'text/html', $attachmentList = null) { + public function getFormattedMessage($type = 'text/html') { $message = $this->message; $messageParser = \wcf\system\bbcode\MessageParser::getInstance(); $messageParser->setOutputType($type); @@ -90,11 +90,9 @@ public function getFormattedMessage($type = 'text/html', $attachmentList = null) $message = $messageParser->parse($message, false, false, true, false); break; case self::TYPE_ATTACHMENT: - if ($attachmentList === null) { - $attachmentList = new \wcf\data\attachment\GroupedAttachmentList('be.bastelstu.chat.message'); - $attachmentList->getConditionBuilder()->add('attachment.objectID IN (?)', array($this->messageID)); - $attachmentList->readObjects(); - } + $attachmentList = new \wcf\data\attachment\GroupedAttachmentList('be.bastelstu.chat.message'); + $attachmentList->getConditionBuilder()->add('attachment.objectID IN (?)', array($this->messageID)); + $attachmentList->readObjects(); AttachmentBBCode::setAttachmentList($attachmentList); AttachmentBBCode::setObjectID($this->messageID); @@ -149,28 +147,12 @@ public function jsonify($raw = false) { break; } - $attachment = null; - $attachmentList = null; - - if ($this->attachmentID !== 0) { - $attachmentList = new \wcf\data\attachment\GroupedAttachmentList('be.bastelstu.chat.message'); - $attachmentList->getConditionBuilder()->add('attachment.attachmentID = ?', array($this->attachmentID)); - $attachmentList->getConditionBuilder()->add('attachment.objectID = ?', array($this->messageID)); - $attachmentList->readObjects(); - - if (isset($attachmentList->objectIDs[0]) && $attachmentList->objectIDs[0] != 0) { - $attachment = $attachmentList->objects[$attachmentList->objectIDs[0]]; - $attachment->data['imageinfo'] = WCF::getLanguage()->getDynamicVariable('wcf.attachment.image.info', array('attachment' => $attachment)); - $attachment = $attachment->data; - } - } - $array = array( 'formattedUsername' => $this->getUsername(true), - 'formattedMessage' => $this->getFormattedMessage('text/html', ($attachmentList !== null) ? $attachmentList : null), + 'formattedMessage' => $this->getFormattedMessage('text/html'), 'formattedTime' => \wcf\util\DateUtil::format(\wcf\util\DateUtil::getDateTimeByTimestamp($this->time), 'H:i:s'), 'separator' => $separator, - 'message' => $this->getFormattedMessage('text/plain', ($attachmentList !== null) ? $attachmentList : null), + 'message' => $this->getFormattedMessage('text/plain'), 'sender' => (int) $this->sender, 'username' => $this->getUsername(), 'time' => (int) $this->time, @@ -178,8 +160,7 @@ public function jsonify($raw = false) { 'type' => (int) $this->type, 'roomID' => (int) $this->roomID, 'messageID' => (int) $this->messageID, - 'additionalData' => $this->additionalData, - 'attachment' => $attachment + 'additionalData' => $this->additionalData ); if ($raw) return $array; diff --git a/file/style/be.bastelstu.chat.less b/file/style/be.bastelstu.chat.less index 32030b1..821bd24 100644 --- a/file/style/be.bastelstu.chat.less +++ b/file/style/be.bastelstu.chat.less @@ -192,9 +192,24 @@ padding: 5px 20px 5px 5px; position: relative; - .userAvatar { - float: left; - margin-left: 16px; + > div.avatarContainer { + position: absolute; + width: 40px; + height: 38px; + + > .userAvatar { + float: left; + margin-left: 16px; + } + + > .avatarExtra { + box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.3); + position: absolute; + left: 24px; + bottom: -2px; + width: 16px; + height: 16px; + } } .innerMessage { @@ -219,11 +234,9 @@ } &.bubble { - .userAvatar { - margin-left: 0; - - .icon { - padding: 2px; + > div.avatarContainer { + .userAvatar { + margin-left: 0; } } diff --git a/template/message.tpl b/template/message.tpl index 2d768b4..d96a253 100644 --- a/template/message.tpl +++ b/template/message.tpl @@ -1,19 +1,26 @@ {literal} -
- {if $message.type == $messageTypes.LEAVE || $message.type == $messageTypes.JOIN || $message.type == $messageTypes.ATTACHMENT} - - {/if} -
-
-
- {if $message.type != $messageTypes.INFORMATION} - {if $message.type == $messageTypes.NORMAL || $message.type == $messageTypes.WHISPER} - {@$message.avatar[32]} + {if $message.type == $messageTypes.LEAVE || $message.type == $messageTypes.JOIN} +
+ +
+ {/if} +
+
+
+ {if $message.type != $messageTypes.INFORMATION} + {if $message.type == $messageTypes.NORMAL || $message.type == $messageTypes.WHISPER || $message.type == $messageTypes.ATTACHMENT} + {@$message.avatar[32]} + {else} + {@$message.avatar[16]} + {/if} {else} - {@$message.avatar[16]} + {/if} - {else} - +
+ {if $message.type == $messageTypes.ATTACHMENT} + + + {/if}
@@ -36,7 +43,8 @@ - {if $message.type == $messageTypes.NORMAL || $message.type == $messageTypes.WHISPER} + {if $message.type == $messageTypes.NORMAL || $message.type == $messageTypes.WHISPER || $message.type == $messageTypes.ATTACHMENT} + {if $message.type == $messageTypes.ATTACHMENT}{lang}chat.message.{$messageTypes.ATTACHMENT}{/lang}{/if}
  • {if $message.isFollowUp} {/if} @@ -44,24 +52,7 @@
{else} - {if $message.type == $messageTypes.ATTACHMENT && $message.attachment != null} - {if parseInt($message.attachment.isImage) == 1} - {lang}chat.message.{$messageTypes.ATTACHMENT}{/lang} -
    -
  • - {@$message.formattedMessage} -
    -

    {$message.attachment.filename}

    - {$message.attachment.imageinfo} -
    -
    • -
- {else} - {lang}chat.message.{$messageTypes.ATTACHMENT}{/lang} {@$message.formattedMessage} - {/if} - {else} - {@$message.formattedMessage} - {/if} + {@$message.formattedMessage} {/if}