Merge branch 'MDL-22937_message_html2' of git://github.com/andyjdavis/moodle
authorAparup Banerjee <aparup@moodle.com>
Mon, 6 Aug 2012 08:23:05 +0000 (16:23 +0800)
committerAparup Banerjee <aparup@moodle.com>
Mon, 6 Aug 2012 08:23:05 +0000 (16:23 +0800)
12 files changed:
comment/lib.php
message/lib.php
mod/chat/gui_ajax/theme/bubble/chat.css
mod/chat/gui_ajax/theme/bubble/config.php
mod/chat/gui_ajax/theme/compact/config.php
mod/chat/lib.php
mod/chat/locallib.php
mod/chat/renderer.php [new file with mode: 0644]
mod/chat/styles.css
theme/base/style/core.css
theme/base/style/message.css
theme/standard/style/modules.css

index dbf1058..9bf2653 100644 (file)
@@ -201,12 +201,19 @@ class comment {
         $this->check_permissions();
 
         // load template
-        $this->template  = html_writer::tag('div', '___picture___', array('class' => 'comment-userpicture'));
-        $this->template .= html_writer::start_tag('div', array('class' => 'comment-content'));
-        $this->template .= '___name___ - ';
-        $this->template .= html_writer::tag('span', '___time___');
-        $this->template .= html_writer::tag('div', '___content___');
-        $this->template .= html_writer::end_tag('div'); // .comment-content
+        $this->template = html_writer::start_tag('div', array('class' => 'comment-message'));
+
+        $this->template .= html_writer::start_tag('div', array('class' => 'comment-message-meta'));
+
+        $this->template .= html_writer::tag('span', '___picture___', array('class' => 'picture'));
+        $this->template .= html_writer::tag('span', '___name___', array('class' => 'user')) . ' - ';
+        $this->template .= html_writer::tag('span', '___time___', array('class' => 'time'));
+
+        $this->template .= html_writer::end_tag('div'); // .comment-message-meta
+        $this->template .= html_writer::tag('div', '___content___', array('class' => 'text'));
+
+        $this->template .= html_writer::end_tag('div'); // .comment-message
+
         if (!empty($this->plugintype)) {
             $this->template = plugin_callback($this->plugintype, $this->pluginname, 'comment', 'template', array($this->comment_param), $this->template);
         }
index feb364b..4703d1a 100644 (file)
@@ -1969,7 +1969,12 @@ function message_format_message($message, $format='', $keywords='', $class='othe
         $messagetext = highlight($keywords, $messagetext);
     }
 
-    return '<div class="message '.$class.'"><a name="m'.$message->id.'"></a> <span class="time">'.$time.'</span>: <span class="content">'.$messagetext.'</span></div>';
+    return <<<TEMPLATE
+<div class='message $class'>
+    <a name="m'.{$message->id}.'"></a>
+    <span class="message-meta"><span class="time">$time</span></span>: <span class="text">$messagetext</span>
+</div>
+TEMPLATE;
 }
 
 /**
index 163cbcb..07bc312 100644 (file)
 #input-message {background:#FFFFFF url(input.png) repeat-x scroll 0 0;padding:0 9px;border: 1px solid #999;border-radius: 9px;-moz-border-radius: 9px;}
 .mdl-chat-entry,
 .mdl-chat-my-entry {clear:both;}
-.chat-message td {padding: 0;}
-
-.mdl-chat-entry .topleft {background:transparent url(bubbles.png) no-repeat scroll left top; height:9px; width:18px;}
-.mdl-chat-entry .top {background:transparent url(horizontal.png) repeat-x scroll center top; font-size:1px; height:9px;}
-.mdl-chat-entry .topright {background:transparent url(bubbles.png) no-repeat scroll -18px top; height:9px; width:11px;}
-.mdl-chat-entry .left {background:transparent url(vertical.png) repeat-y scroll left center; width:18px;}
-.mdl-chat-entry .conmts {background:#DCDCDC none repeat scroll 0 0; color:#000000; text-shadow:0 1px 0 #EEEEEE;}
-.mdl-chat-entry .right {background:transparent url(vertical.png) repeat-y scroll -18px 0; width:11px;}
-.mdl-chat-entry .bottomleft {background:transparent url(bubbles.png) no-repeat scroll left -9px; height:12px; width:18px;}
-.mdl-chat-entry .bottomright {background:transparent url(bubbles.png) no-repeat scroll right -9px; height:12px; width:11px;}
-.mdl-chat-entry .bottom {background:transparent url(horizontal.png) repeat-x scroll 0 -9px; height:12px;}
-
-.mdl-chat-my-entry .topleft {background:url(bubbles.png) no-repeat 0 -21px;height:9px;width:11px;}
-.mdl-chat-my-entry .topright {background:url(bubbles.png) no-repeat -11px -21px;height:9px;width:18px;}
-.mdl-chat-my-entry .bottomleft {background:url(bubbles.png) no-repeat 0 bottom;width:11px;height:12px;}
-.mdl-chat-my-entry .bottomright {background:url(bubbles.png) no-repeat right bottom;width:18px;height:12px;}
-.mdl-chat-my-entry .top {background:url(horizontal.png) repeat-x 0 -21px;font-size:1px;height:9px;}
-.mdl-chat-my-entry .bottom {background:url(horizontal.png) repeat-x bottom;height:12px;}
-.mdl-chat-my-entry .left {background:url(vertical.png) repeat-y -29px 0;width:11px;}
-.mdl-chat-my-entry .right {background:url(vertical.png) repeat-y right;width:18px;}
-.mdl-chat-my-entry .conmts {background:#C0E668;color:#000;}
+
+.chat-message .chat-message-meta {padding-top:15px;}
+.chat-message .picture {vertical-align:middle;}
+.chat-message .right {text-align:right;}
+.chat-message .left {text-align:left;}
 
 #chat-input-area,
 #chat-input-area table.generaltable,
 #chat-input-area table.generaltable td.cell {background: #92B3E8;border: 0;}
 #chat-userlist {background: #E3E8F0;height: 100%;}
 
-.dir-rtl .mdl-chat-entry .topleft {background-position: -18px 0;width:11px;}
-.dir-rtl .mdl-chat-entry .topright {background-position: 0 0;width:18px;}
-.dir-rtl .mdl-chat-entry .bottomleft {background-position: -18px -9px;width:11px;}
-.dir-rtl .mdl-chat-entry .bottomright {background-position: 0 -9px;width:18px;}
-.dir-rtl .mdl-chat-entry .right {background-position: 0 0;width:18px;}
-.dir-rtl .mdl-chat-entry .left {background-position: -18px 0;width:11px;}
-
-.dir-rtl .mdl-chat-my-entry .topleft {background-position: -13px -21px;width:18px;}
-.dir-rtl .mdl-chat-my-entry .topright {background-position: 0 -21px;width:11px;}
-.dir-rtl .mdl-chat-my-entry .bottomleft {background-position: -13px -30px;width:18px;}
-.dir-rtl .mdl-chat-my-entry .bottomright {background-position: 0 -30px;width:11px;}
-.dir-rtl .mdl-chat-my-entry .right {background-position: -29px 0;width:11px;}
-.dir-rtl .mdl-chat-my-entry .left {background-position: -42px 0;width:18px;}
\ No newline at end of file
+/**
+ * The following CSS has been minified to reduce its size
+ * The original unminified version is available at http://nicolasgallagher.com/pure-css-speech-bubbles/
+ */
+
+/* ------------------------------------------
+PURE CSS SPEECH BUBBLES
+by Nicolas Gallagher
+- http://nicolasgallagher.com/pure-css-speech-bubbles/
+
+http://nicolasgallagher.com
+http://twitter.com/necolas
+
+Created: 02 March 2010
+Version: 1.2 (03 March 2011)
+
+Dual licensed under MIT and GNU GPLv2 © Nicolas Gallagher 
+------------------------------------------ */
+
+body{padding:0;margin:0;font:1em/1.4 Cambria,Georgia,sans-serif;color:#333;background:#fff}a:link,a:visited{border-bottom:1px solid #c55500;text-decoration:none;color:#c55500}a:visited{border-bottom:1px solid #730800;color:#730800}a:hover,a:focus,a:active{border:0;color:#fff;background:#c55500}a:visited:hover,a:visited:focus,a:visited:active{color:#fff;background:#730800}#container{width:500px;padding:0 0 50px;margin:0 auto}h1{margin:1em 0 0;font-size:2.5em;font-weight:normal;line-height:1.2;text-align:center}h2{margin:.5em 0 1.5em;font-size:1.25em;font-weight:normal;font-style:italic;text-align:center}p{margin:1em 0}.content h2{margin:2em 0 .75em;font-size:2em;font-weight:bold;font-style:normal;text-align:left}blockquote{margin:1em 0}blockquote p{margin:0;font-size:2em}.follow{clear:both;margin-top:2em;font-size:1.125em}.follow span{font-weight:bold}.content{position:relative;z-index:1}.triangle-isosceles{position:relative;padding:15px;margin:1em 0 3em;color:#000;background:#f3961c;background:-webkit-gradient(linear,0 0,0 100%,from(#f9d835),to(#f3961c));background:-moz-linear-gradient(#f9d835,#f3961c);background:-o-linear-gradient(#f9d835,#f3961c);background:linear-gradient(#f9d835,#f3961c);-webkit-border-radius:10px;-moz-border-radius:10px;border-radius:10px}.triangle-isosceles.top{background:-webkit-gradient(linear,0 0,0 100%,from(#f3961c),to(#f9d835));background:-moz-linear-gradient(#f3961c,#f9d835);background:-o-linear-gradient(#f3961c,#f9d835);background:linear-gradient(#f3961c,#f9d835)}.triangle-isosceles.left{margin-left:50px;background:#f3961c}.triangle-isosceles.right{margin-right:50px;background:#f3961c}.triangle-isosceles:after{content:"";position:absolute;bottom:-15px;left:50px;border-width:15px 15px 0;border-style:solid;border-color:#f3961c transparent;display:block;width:0}.triangle-isosceles.top:after{top:-15px;right:50px;bottom:auto;left:auto;border-width:0 15px 15px;border-color:#f3961c transparent}.triangle-isosceles.left:after{top:16px;left:-50px;bottom:auto;border-width:10px 50px 10px 0;border-color:transparent #f3961c}.triangle-isosceles.right:after{top:16px;right:-50px;bottom:auto;left:auto;border-width:10px 0 10px 50px;border-color:transparent #f3961c}.triangle-right{position:relative;padding:15px;margin:1em 0 3em;color:#fff;background:#075698;background:-webkit-gradient(linear,0 0,0 100%,from(#2e88c4),to(#075698));background:-moz-linear-gradient(#2e88c4,#075698);background:-o-linear-gradient(#2e88c4,#075698);background:linear-gradient(#2e88c4,#075698);-webkit-border-radius:10px;-moz-border-radius:10px;border-radius:10px}.triangle-right.top{background:-webkit-gradient(linear,0 0,0 100%,from(#075698),to(#2e88c4));background:-moz-linear-gradient(#075698,#2e88c4);background:-o-linear-gradient(#075698,#2e88c4);background:linear-gradient(#075698,#2e88c4)}.triangle-right.left{margin-left:40px;background:#075698}.triangle-right.right{margin-right:40px;background:#075698}.triangle-right:after{content:"";position:absolute;bottom:-20px;left:50px;border-width:20px 0 0 20px;border-style:solid;border-color:#075698 transparent;display:block;width:0}.triangle-right.top:after{top:-20px;right:50px;bottom:auto;left:auto;border-width:20px 20px 0 0;border-color:transparent #075698}.triangle-right.left:after{top:16px;left:-40px;bottom:auto;border-width:15px 40px 0 0;border-color:transparent #075698}.triangle-right.right:after{top:16px;right:-40px;bottom:auto;left:auto;border-width:15px 0 0 40px;border-color:transparent #075698}.triangle-obtuse{position:relative;padding:15px;margin:1em 0 3em;color:#fff;background:#c81e2b;background:-webkit-gradient(linear,0 0,0 100%,from(#f04349),to(#c81e2b));background:-moz-linear-gradient(#f04349,#c81e2b);background:-o-linear-gradient(#f04349,#c81e2b);background:linear-gradient(#f04349,#c81e2b);-webkit-border-radius:10px;-moz-border-radius:10px;border-radius:10px}.triangle-obtuse.top{background:-webkit-gradient(linear,0 0,0 100%,from(#c81e2b),to(#f04349));background:-moz-linear-gradient(#c81e2b,#f04349);background:-o-linear-gradient(#c81e2b,#f04349);background:linear-gradient(#c81e2b,#f04349)}.triangle-obtuse.left{margin-left:50px;background:#c81e2b}.triangle-obtuse.right{margin-right:50px;background:#c81e2b}.triangle-obtuse:before{content:"";position:absolute;bottom:-20px;left:60px;border:0;border-right-width:30px;border-bottom-width:20px;border-style:solid;border-color:transparent #c81e2b;display:block;width:0}.triangle-obtuse:after{content:"";position:absolute;bottom:-20px;left:80px;border:0;border-right-width:10px;border-bottom-width:20px;border-style:solid;border-color:transparent #fff;display:block;width:0}.triangle-obtuse.top:before{top:-20px;bottom:auto;left:auto;right:60px;border:0;border-left-width:30px;border-top-width:20px;border-color:transparent #c81e2b}.triangle-obtuse.top:after{top:-20px;bottom:auto;left:auto;right:80px;border-width:0;border-left-width:10px;border-top-width:20px;border-color:transparent #fff}.triangle-obtuse.left:before{top:15px;bottom:auto;left:-50px;border:0;border-bottom-width:30px;border-left-width:50px;border-color:#c81e2b transparent}.triangle-obtuse.left:after{top:35px;bottom:auto;left:-50px;border:0;border-bottom-width:10px;border-left-width:50px;border-color:#fff transparent}.triangle-obtuse.right:before{top:15px;bottom:auto;left:auto;right:-50px;border:0;border-bottom-width:30px;border-right-width:50px;border-color:#c81e2b transparent}.triangle-obtuse.right:after{top:35px;bottom:auto;right:-50px;left:auto;border:0;border-bottom-width:10px;border-right-width:50px;border-color:#fff transparent}.triangle-border{position:relative;padding:15px;margin:1em 0 3em;color:#333;background:#fff;-webkit-border-radius:10px;-moz-border-radius:10px;border-radius:10px}.triangle-border.left{margin-left:30px;border:5px solid #a29d9d}.triangle-border.right{margin-right:30px;border:5px solid #5a8f00}.triangle-border:before{content:"";position:absolute;bottom:-20px;left:40px;border-width:20px 20px 0;border-style:solid;border-color:#5a8f00 transparent;display:block;width:0}.triangle-border:after{content:"";position:absolute;bottom:-13px;left:47px;border-width:13px 13px 0;border-style:solid;border-color:#fff transparent;display:block;width:0}.triangle-border.top:before{top:-20px;bottom:auto;left:auto;right:40px;border-width:0 20px 20px}.triangle-border.top:after{top:-13px;bottom:auto;left:auto;right:47px;border-width:0 13px 13px}.triangle-border.left:before{top:10px;bottom:auto;left:-30px;border-width:15px 30px 15px 0;border-color:transparent #a29d9d}.triangle-border.left:after{top:16px;bottom:auto;left:-21px;border-width:9px 21px 9px 0;border-color:transparent #fff}.triangle-border.right:before{top:10px;bottom:auto;left:auto;right:-30px;border-width:15px 0 15px 30px;border-color:transparent #5a8f00}.triangle-border.right:after{top:16px;bottom:auto;left:auto;right:-21px;border-width:9px 0 9px 21px;border-color:transparent #fff}.example-commentheading{position:relative;padding:0;color:#b513af}.example-commentheading:before{content:"";position:absolute;top:9px;left:-25px;width:15px;height:10px;background:#b513af;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px}.example-commentheading:after{content:"";position:absolute;top:15px;left:-19px;border:4px solid transparent;border-left-color:#b513af;display:block;width:0}.example-right{position:relative;padding:15px 30px;margin:0;color:#fff;background:#5a8f00;background:-webkit-gradient(linear,0 0,0 100%,from(#b8db29),to(#5a8f00));background:-moz-linear-gradient(#b8db29,#5a8f00);background:-o-linear-gradient(#b8db29,#5a8f00);background:linear-gradient(#b8db29,#5a8f00);-webkit-border-radius:10px;-moz-border-radius:10px;border-radius:10px}.example-right+p{margin:15px 0 2em 85px;font-style:italic}.example-right:after{content:"";position:absolute;bottom:-50px;left:50px;border-width:0 20px 50px 0;border-style:solid;border-color:transparent #5a8f00;display:block;width:0}.example-obtuse{position:relative;padding:15px 30px;margin:0;color:#000;background:#f3961c;background:-webkit-gradient(linear,0 0,0 100%,from(#f9d835),to(#f3961c));background:-moz-linear-gradient(#f9d835,#f3961c);background:-o-linear-gradient(#f9d835,#f3961c);background:linear-gradient(#f9d835,#f3961c);-webkit-border-top-left-radius:25px 50px;-webkit-border-top-right-radius:25px 50px;-webkit-border-bottom-right-radius:25px 50px;-webkit-border-bottom-left-radius:25px 50px;-moz-border-radius:25px / 50px;border-radius:25px / 50px}.example-obtuse+p{margin:10px 150px 2em 0;text-align:right;font-style:italic}.example-obtuse:before{content:"";position:absolute;bottom:-30px;right:80px;border-width:0 0 30px 50px;border-style:solid;border-color:transparent #f3961c;display:block;width:0}.example-obtuse:after{content:"";position:absolute;bottom:-30px;right:110px;border-width:0 0 30px 20px;border-style:solid;border-color:transparent #fff;display:block;width:0}.example-twitter{position:relative;padding:15px;margin:100px 0 .5em;color:#333;background:#eee;-webkit-border-radius:10px;-moz-border-radius:10px;border-radius:10px}.example-twitter p{font-size:28px;line-height:1.25em}.example-twitter:before{content:url(twitter-logo.gif);position:absolute;top:-60px;left:0;width:155px;height:36px;display:block}.example-twitter:after{content:"";position:absolute;top:-30px;left:50px;border:15px solid transparent;border-bottom-color:#eee;display:block;width:0}.example-twitter+p{padding-left:15px;font:14px Arial,sans-serif}.example-number{position:relative;width:200px;height:200px;margin:50px 0 200px;text-align:center;font:140px/200px Arial,sans-serif;color:#fff;background:#c91f2c}.example-number:before{content:"";position:absolute;bottom:-140px;right:0;border-width:0 0 140px 140px;border-style:solid;border-color:transparent #c91f2c}.example-number:after{content:"";position:absolute;bottom:-140px;right:85px;border-width:0 0 140px 55px;border-style:solid;border-color:transparent #fff}.pinched{position:relative;padding:15px;margin:50px 0 3em;text-align:center;color:#fff;background:#333;-webkit-border-radius:10px;-moz-border-radius:10px;border-radius:10px}.pinched:before{content:"";position:absolute;top:-20px;left:50%;width:100px;height:20px;margin:0 0 0 -50px;background:#333}.pinched:after{content:"";position:absolute;top:-20px;left:0;width:50%;height:20px;background:#fff;-webkit-border-bottom-right-radius:15px;-moz-border-radius-bottomright:15px;border-bottom-right-radius:15px}.pinched>:first-child:before{content:"";position:absolute;top:-20px;right:0;width:50%;height:20px;background:#fff;-webkit-border-bottom-left-radius:15px;-moz-border-radius-bottomleft:15px;border-bottom-left-radius:15px}.oval-speech{position:relative;width:270px;padding:50px 40px;margin:1em auto 50px;text-align:center;color:#fff;background:#5a8f00;background:-webkit-gradient(linear,0 0,0 100%,from(#b8db29),to(#5a8f00));background:-moz-linear-gradient(#b8db29,#5a8f00);background:-o-linear-gradient(#b8db29,#5a8f00);background:linear-gradient(#b8db29,#5a8f00);-webkit-border-top-left-radius:220px 120px;-webkit-border-top-right-radius:220px 120px;-webkit-border-bottom-right-radius:220px 120px;-webkit-border-bottom-left-radius:220px 120px;-moz-border-radius:220px / 120px;border-radius:220px / 120px}.oval-speech p{font-size:1.25em}.oval-speech:before{content:"";position:absolute;z-index:-1;bottom:-30px;right:50%;height:30px;border-right:60px solid #5a8f00;background:#5a8f00;-webkit-border-bottom-right-radius:80px 50px;-moz-border-radius-bottomright:80px 50px;border-bottom-right-radius:80px 50px;-webkit-transform:translate(0,-2px);-moz-transform:translate(0,-2px);-ms-transform:translate(0,-2px);-o-transform:translate(0,-2px);transform:translate(0,-2px)}.oval-speech:after{content:"";position:absolute;z-index:-1;bottom:-30px;right:50%;width:60px;height:30px;background:#fff;-webkit-border-bottom-right-radius:40px 50px;-moz-border-radius-bottomright:40px 50px;border-bottom-right-radius:40px 50px;-webkit-transform:translate(-30px,-2px);-moz-transform:translate(-30px,-2px);-ms-transform:translate(-30px,-2px);-o-transform:translate(-30px,-2px);transform:translate(-30px,-2px)}.oval-thought{position:relative;width:270px;padding:50px 40px;margin:1em auto 80px;text-align:center;color:#fff;background:#075698;background:-webkit-gradient(linear,0 0,0 100%,from(#2e88c4),to(#075698));background:-moz-linear-gradient(#2e88c4,#075698);background:-o-linear-gradient(#2e88c4,#075698);background:linear-gradient(#2e88c4,#075698);-webkit-border-top-left-radius:220px 120px;-webkit-border-top-right-radius:220px 120px;-webkit-border-bottom-right-radius:220px 120px;-webkit-border-bottom-left-radius:220px 120px;-moz-border-radius:220px / 120px;border-radius:220px / 120px}.oval-thought p{font-size:1.25em}.oval-thought:before{content:"";position:absolute;bottom:-20px;left:50px;width:30px;height:30px;background:#075698;-webkit-border-radius:30px;-moz-border-radius:30px;border-radius:30px}.oval-thought:after{content:"";position:absolute;bottom:-30px;left:30px;width:15px;height:15px;background:#075698;-webkit-border-radius:15px;-moz-border-radius:15px;border-radius:15px}.oval-quotes{position:relative;width:400px;height:350px;margin:2em auto 10px;color:#000;background:#ffed26;-webkit-border-top-left-radius:400px 350px;-webkit-border-top-right-radius:400px 350px;-webkit-border-bottom-right-radius:400px 350px;-webkit-border-bottom-left-radius:400px 350px;-moz-border-radius:400px / 350px;border-radius:400px / 350px}.oval-quotes:before{content:"\201C";position:absolute;z-index:1;top:20px;left:20px;font:80px/1 Georgia,serif;color:#ffed26}.oval-quotes:after{content:"\201D";position:absolute;z-index:1;bottom:0;right:20px;font:80px/0.25 Georgia,serif;color:#ffed26}.oval-quotes p{width:250px;height:250px;padding:50px 0 0;margin:0 auto;text-align:center;font-size:35px}.oval-quotes p:before{content:"";position:absolute;z-index:-1;bottom:-30px;right:55%;width:180px;height:60px;background:#fff;-webkit-border-bottom-right-radius:40px 50px;-moz-border-radius-bottomright:40px 50px;border-bottom-right-radius:40px 50px;-webkit-transform:translate(-30px,-2px);-moz-transform:translate(-30px,-2px);-ms-transform:translate(-30px,-2px);-o-transform:translate(-30px,-2px);transform:translate(-30px,-2px)}.oval-quotes p:after{content:"";position:absolute;z-index:-2;bottom:-30px;right:25%;height:80px;border-right:200px solid #ffed26;background:#ffed26;-webkit-border-bottom-right-radius:200px 100px;-moz-border-radius-bottomright:200px 100px;border-bottom-right-radius:200px 100px;-webkit-transform:translate(0,-2px);-moz-transform:translate(0,-2px);-ms-transform:translate(0,-2px);-o-transform:translate(0,-2px);transform:translate(0,-2px);display:block;width:0}.oval-quotes+p{position:relative;width:150px;margin:0 0 2em;font-size:18px;font-weight:bold}.rectangle-speech-border{position:relative;padding:50px 15px;margin:1em 0 3em;border:10px solid #5a8f00;text-align:center;color:#333;background:#fff;-webkit-border-radius:20px;-moz-border-radius:20px;border-radius:20px}.rectangle-speech-border:before{content:"";position:absolute;z-index:10;bottom:-40px;left:50px;width:50px;height:30px;border-style:solid;border-width:0 10px 10px 0;border-color:#5a8f00;background:transparent;-webkit-border-bottom-right-radius:80px 50px;-moz-border-radius-bottomright:80px 50px;border-bottom-right-radius:80px 50px;display:block}.rectangle-speech-border:after{content:"";position:absolute;z-index:10;bottom:-40px;left:50px;width:20px;height:30px;border-style:solid;border-width:0 10px 10px 0;border-color:#5a8f00;background:transparent;-webkit-border-bottom-right-radius:40px 50px;-moz-border-radius-bottomright:40px 50px;border-bottom-right-radius:40px 50px;display:block}.rectangle-speech-border>:first-child:before{content:"";position:absolute;bottom:-40px;left:45px;width:10px;height:10px;background:#5a8f00;-webkit-border-radius:10px;-moz-border-radius:10px;border-radius:10px}.rectangle-speech-border>:first-child:after{content:"";position:absolute;bottom:-10px;left:76px;width:24px;height:15px;background:#fff}.oval-speech-border{position:relative;padding:70px 30px;margin:1em auto 60px;border:10px solid #f3961c;text-align:center;color:#333;background:#fff;-webkit-border-top-left-radius:240px 140px;-webkit-border-top-right-radius:240px 140px;-webkit-border-bottom-right-radius:240px 140px;-webkit-border-bottom-left-radius:240px 140px;-moz-border-radius:240px / 140px;border-radius:240px / 140px}.oval-speech-border:before{content:"";position:absolute;z-index:2;bottom:-40px;right:50%;width:50px;height:30px;border-style:solid;border-width:0 10px 10px 0;border-color:#f3961c;margin-right:-10px;background:transparent;-webkit-border-bottom-right-radius:80px 50px;-moz-border-radius-bottomright:80px 50px;border-bottom-right-radius:80px 50px;display:block}.oval-speech-border:after{content:"";position:absolute;z-index:2;bottom:-40px;right:50%;width:20px;height:31px;border-style:solid;border-width:0 10px 10px 0;border-color:#f3961c;margin-right:20px;background:transparent;-webkit-border-bottom-right-radius:40px 50px;-moz-border-radius-bottomright:40px 50px;border-bottom-right-radius:40px 50px;display:block}.oval-speech-border>:first-child:before{content:"";position:absolute;z-index:1;bottom:-40px;right:50%;width:10px;height:10px;margin-right:45px;background:#f3961c;-webkit-border-radius:10px;-moz-border-radius:10px;border-radius:10px}.oval-speech-border>:first-child:after{content:"";position:absolute;z-index:1;bottom:-10px;right:50%;width:30px;height:15px;background:#fff}.oval-thought-border{position:relative;padding:70px 30px;margin:1em auto 80px;border:10px solid #c81e2b;text-align:center;color:#333;background:#fff;-webkit-border-top-left-radius:240px 140px;-webkit-border-top-right-radius:240px 140px;-webkit-border-bottom-right-radius:240px 140px;-webkit-border-bottom-left-radius:240px 140px;-moz-border-radius:240px / 140px;border-radius:240px / 140px}.oval-thought-border:before{content:"";position:absolute;z-index:10;bottom:-40px;right:100px;width:50px;height:50px;border:10px solid #c81e2b;background:#fff;-webkit-border-radius:50px;-moz-border-radius:50px;border-radius:50px;display:block}.oval-thought-border:after{content:"";position:absolute;z-index:10;bottom:-60px;right:50px;width:25px;height:25px;border:10px solid #c81e2b;background:#fff;-webkit-border-radius:25px;-moz-border-radius:25px;border-radius:25px;display:block}
index f427d76..7ba43d2 100644 (file)
@@ -10,64 +10,26 @@ $chattheme_cfg->event_message = <<<TEMPLATE
 </div>
 TEMPLATE;
 $chattheme_cfg->user_message_left = <<<TEMPLATE
-<table class='chat-message'___tablealign___><tr>
-<td class="picture" valign="middle" width="32px">
-___avatar___
-</td>
-<td class="text">
-    <table cellspacing="0" cellpadding="0" border="0" ___mymessageclass___>
-    <tbody>
-        <tr><td class="topleft"></td><td class="top"></td><td class="topright"></td></tr>
-        <tr>
-            <td class="left"></td>
-            <td class="conmts">
-            ___message___
-            </td>
-            <td class="right"></td>
-        </tr>
-        <tr>
-            <td class="bottomleft"></td>
-            <td class="bottom"></td>
-            <td class="bottomright"></td>
-        </tr>
-    </tbody>
-    </table>
-</td>
-<tr>
-<td colspan="2"___align___>
-    <span class="time">___time___</span>
-    <span class="user">___sender___</span>
-</td>
-</tr>
+<div class='chat-message ___mymessageclass___'>
+    <div class="left">
+        <span class="picture">___avatar___</span>
+        <span class="text triangle-border left">___message___</span>
+    </div>
+    <div class="chat-message-meta left">
+        <span class="time">___time___</span>
+        <span class="user">___sender___</span>
+    </div>
+</div>
 TEMPLATE;
 $chattheme_cfg->user_message_right = <<<TEMPLATE
-<table class='chat-message'___tablealign___><tr>
-<td class="text">
-    <table cellspacing="0" cellpadding="0" border="0" ___mymessageclass___>
-    <tbody>
-        <tr><td class="topleft"></td><td class="top"></td><td class="topright"></td></tr>
-        <tr>
-            <td class="left"></td>
-            <td class="conmts">
-            ___message___
-            </td>
-            <td class="right"></td>
-        </tr>
-        <tr>
-            <td class="bottomleft"></td>
-            <td class="bottom"></td>
-            <td class="bottomright"></td>
-        </tr>
-    </tbody>
-    </table>
-</td>
-<td class="picture" valign="middle" width="32px">
-___avatar___
-</td>
-<tr>
-<td colspan="2" ___tablealign___>
-    <span class="time">___time___</span>
-    <span class="user">___sender___</span>
-</td>
-</tr>
+<div class='chat-message ___mymessageclass___'>
+    <div class="right">
+        <span class="text triangle-border right">___message___</span>
+        <span class="picture">___avatar___</span>
+    </div>
+    <div class="chat-message-meta right">
+        <span class="time">___time___</span>
+        <span class="user">___sender___</span>
+    </div>
+</div>
 TEMPLATE;
index fb78b5e..3103704 100644 (file)
@@ -11,7 +11,7 @@ $chattheme_cfg->event_message = <<<TEMPLATE
 TEMPLATE;
 $chattheme_cfg->user_message = <<<TEMPLATE
 <div class='chat-message'>
-    <div class="meta">
+    <div class="chat-message-meta">
         <span class="time">___time___</span>
         <span class="user"><a href="___senderprofile___" target="_blank">___sender___</a></span>
     </div>
index bbbaa41..f5e52ae 100644 (file)
@@ -875,7 +875,8 @@ function chat_format_message($message, $courseid, $currentuser, $chat_lastrow=NU
  * @return bool|string Returns HTML or false
  */
 function chat_format_message_theme ($message, $chatuser, $currentuser, $groupingid, $theme = 'bubble') {
-    global $CFG, $USER, $OUTPUT, $COURSE, $DB;
+    global $CFG, $USER, $OUTPUT, $COURSE, $DB, $PAGE;
+    require_once($CFG->dirroot.'/mod/chat/locallib.php');
 
     static $users;     // Cache user lookups
 
@@ -912,19 +913,13 @@ function chat_format_message_theme ($message, $chatuser, $currentuser, $grouping
     if(!empty($message->system)) {
         $result->type = 'system';
 
-        $userlink = new moodle_url('/user/view.php', array('id'=>$message->userid,'course'=>$courseid));
-
-        $patterns = array();
-        $replacements = array();
-        $patterns[] = '___senderprofile___';
-        $patterns[] = '___sender___';
-        $patterns[] = '___time___';
-        $patterns[] = '___event___';
-        $replacements[] = $CFG->wwwroot.'/user/view.php?id='.$sender->id.'&amp;course='.$courseid;
-        $replacements[] = fullname($sender);
-        $replacements[] = $message->strtime;
-        $replacements[] = get_string('message'.$message->message, 'chat', fullname($sender));
-        $result->html = str_replace($patterns, $replacements, $chattheme_cfg->event_message);
+        $senderprofile = $CFG->wwwroot.'/user/view.php?id='.$sender->id.'&amp;course='.$courseid;
+        $event = get_string('message'.$message->message, 'chat', fullname($sender));
+        $eventmessage = new event_message($senderprofile, fullname($sender), $message->strtime, $event, $theme);
+
+        $output = $PAGE->get_renderer('mod_chat');
+        $result->html = $output->render($eventmessage);
+
         return $result;
     }
 
@@ -994,38 +989,17 @@ function chat_format_message_theme ($message, $chatuser, $currentuser, $grouping
 
     $result->text = strip_tags($outtime.': '.$outmain);
 
-    $ismymessage = '';
-    $rightalign = '';
+    $mymessageclass = '';
     if ($sender->id == $USER->id) {
-        $ismymessage = ' class="mymessage"';
-        $rightalign = ' align="right"';
-    }
-    $patterns = array();
-    $replacements = array();
-    $patterns[] = '___avatar___';
-    $patterns[] = '___sender___';
-    $patterns[] = '___senderprofile___';
-    $patterns[] = '___time___';
-    $patterns[] = '___message___';
-    $patterns[] = '___mymessageclass___';
-    $patterns[] = '___tablealign___';
-    $replacements[] = $message->picture;
-    $replacements[] = fullname($sender);
-    $replacements[] = $CFG->wwwroot.'/user/view.php?id='.$sender->id.'&amp;course='.$courseid;
-    $replacements[] = $outtime;
-    $replacements[] = $outmain;
-    $replacements[] = $ismymessage;
-    $replacements[] = $rightalign;
-    if (!empty($chattheme_cfg->avatar) and !empty($chattheme_cfg->align)) {
-        if (!empty($ismymessage)) {
-            $result->html = str_replace($patterns, $replacements, $chattheme_cfg->user_message_right);
-        } else {
-            $result->html = str_replace($patterns, $replacements, $chattheme_cfg->user_message_left);
-        }
-    } else {
-        $result->html = str_replace($patterns, $replacements, $chattheme_cfg->user_message);
+        $mymessageclass = 'chat-message-mymessage';
     }
 
+    $senderprofile = $CFG->wwwroot.'/user/view.php?id='.$sender->id.'&amp;course='.$courseid;
+    $usermessage = new user_message($senderprofile, fullname($sender), $message->picture, $mymessageclass, $outtime, $outmain, $theme);
+
+    $output = $PAGE->get_renderer('mod_chat');
+    $result->html = $output->render($usermessage);
+
     //When user beeps other user, then don't show any timestamp to other users in chat.
     if (('' === $outmain) && $special) {
         return false;
index 5b24d4d..1a14659 100644 (file)
@@ -154,3 +154,97 @@ class chat_portfolio_caller extends portfolio_module_caller_base {
                 : '');
     }
 }
+
+/**
+ * A chat event such a user entering or leaving a chat activity
+ *
+ * @package    mod_chat
+ * @copyright  2012 Andrew Davis
+ * @license    http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
+ */
+class event_message implements renderable {
+
+    /** @var string The URL of the profile of the user who caused the event */
+    public $senderprofile;
+
+    /** @var string The ready to display name of the user who caused the event */
+    public $sendername;
+
+    /** @var string Ready to display event time */
+    public $time;
+
+    /** @var string Event description */
+    public $event;
+
+    /** @var string The chat theme name */
+    public $theme;
+
+    /**
+     * event_message constructor
+     *
+     * @param string $senderprofile The URL of the profile of the user who caused the event
+     * @param string $sendername The ready to display name of the user who caused the event
+     * @param string $time Ready to display event time
+     * @param string $theme The chat theme name
+     */
+    function __construct($senderprofile, $sendername, $time, $event, $theme) {
+
+        $this->senderprofile = $senderprofile;
+        $this->sendername = $sendername;
+        $this->time = $time;
+        $this->event = $event;
+        $this->theme = $theme;
+    }
+}
+
+/**
+ * A chat message from a user
+ *
+ * @package    mod_chat
+ * @copyright  2012 Andrew Davis
+ * @license    http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
+ */
+class user_message implements renderable {
+
+    /** @var string The URL of the profile of the user sending the message */
+    public $senderprofile;
+
+    /** @var string The ready to display name of the user sending the message */
+    public $sendername;
+
+    /** @var string HTML for the avatar of the user sending the message */
+    public $avatar;
+
+    /** @var string Empty or a html class definition to append to the html */
+    public $mymessageclass;
+
+    /** @var string Ready to display message time */
+    public $time;
+
+    /** @var string The message */
+    public $message;
+
+    /** @var string The name of the chat theme to use */
+    public $theme;
+
+    /**
+     * user_message constructor
+     *
+     * @param string $senderprofile The URL of the profile of the user sending the message
+     * @param string $sendername The ready to display name of the user sending the message
+     * @param string $avatar HTML for the avatar of the user sending the message
+     * @param string $mymessageclass Empty or a html class definition to append to the html
+     * @param string $time Ready to display message time
+     * @param string $message The message
+     * @param string $theme The name of the chat theme to use
+     */
+    function __construct($senderprofile, $sendername, $avatar, $mymessageclass, $time, $message, $theme) {
+
+        $this->sendername = $sendername;
+        $this->avatar = $avatar;
+        $this->mymessageclass = $mymessageclass;
+        $this->time = $time;
+        $this->message = $message;
+        $this->theme = $theme;
+    }
+}
diff --git a/mod/chat/renderer.php b/mod/chat/renderer.php
new file mode 100644 (file)
index 0000000..5075ed8
--- /dev/null
@@ -0,0 +1,107 @@
+<?php
+
+// This file is part of Moodle - http://moodle.org/
+//
+// Moodle is free software: you can redistribute it and/or modify
+// it under the terms of the GNU General Public License as published by
+// the Free Software Foundation, either version 3 of the License, or
+// (at your option) any later version.
+//
+// Moodle is distributed in the hope that it will be useful,
+// but WITHOUT ANY WARRANTY; without even the implied warranty of
+// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+// GNU General Public License for more details.
+//
+// You should have received a copy of the GNU General Public License
+// along with Moodle.  If not, see <http://www.gnu.org/licenses/>.
+
+/**
+ * Chat module rendering methods
+ *
+ * @package    mod_chat
+ * @copyright  2012 Andrew Davis
+ * @license    http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
+ */
+
+defined('MOODLE_INTERNAL') || die();
+
+/**
+ * Chat module renderer class
+ *
+ * @copyright 2012 Andrew Davis
+ * @license   http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
+ */
+class mod_chat_renderer extends plugin_renderer_base {
+
+    /**
+     * Render and event_message instance
+     *
+     * @param event_message $eventmessage The event_message instance to render
+     * @return string HTML representing the event_message instance
+     */
+    protected function render_event_message(event_message $eventmessage) {
+        global $CFG;
+    
+        if (file_exists($CFG->dirroot . '/mod/chat/gui_ajax/theme/'.$eventmessage->theme.'/config.php')) {
+            include($CFG->dirroot . '/mod/chat/gui_ajax/theme/'.$eventmessage->theme.'/config.php');
+        }
+        
+        $patterns = array();
+        $patterns[] = '___senderprofile___';
+        $patterns[] = '___sender___';
+        $patterns[] = '___time___';
+        $patterns[] = '___event___';
+
+        $replacements = array();
+        $replacements[] = $eventmessage->senderprofile;
+        $replacements[] = $eventmessage->sendername;
+        $replacements[] = $eventmessage->time;
+        $replacements[] = $eventmessage->event;
+
+        return str_replace($patterns, $replacements, $chattheme_cfg->event_message);
+    }
+
+    /**
+     * Render a user message
+     *
+     * @param user_message $usermessage the user message to display
+     * @return string html representation of a user_message instance
+     */
+    protected function render_user_message(user_message $usermessage) {
+        global $CFG;
+
+        if (file_exists($CFG->dirroot . '/mod/chat/gui_ajax/theme/'.$usermessage->theme.'/config.php')) {
+            include($CFG->dirroot . '/mod/chat/gui_ajax/theme/'.$usermessage->theme.'/config.php');
+        }
+
+        $patterns = array();
+        $patterns[] = '___avatar___';
+        $patterns[] = '___sender___';
+        $patterns[] = '___senderprofile___';
+        $patterns[] = '___time___';
+        $patterns[] = '___message___';
+        $patterns[] = '___mymessageclass___';
+
+        $replacements = array();
+        $replacements[] = $usermessage->avatar;
+        $replacements[] = $usermessage->sendername;
+        $replacements[] = $usermessage->senderprofile;
+        $replacements[] = $usermessage->time;
+        $replacements[] = $usermessage->message;
+        $replacements[] = $usermessage->mymessageclass;
+
+        $output = null;
+
+        if (!empty($chattheme_cfg->avatar) and !empty($chattheme_cfg->align)) {
+            if (!empty($usermessage->mymessageclass)) {
+                $output = str_replace($patterns, $replacements, $chattheme_cfg->user_message_right);
+            } else {
+                $output = str_replace($patterns, $replacements, $chattheme_cfg->user_message_left);
+            }
+        } else {
+            $output = str_replace($patterns, $replacements, $chattheme_cfg->user_message);
+        }
+
+        return $output;
+    }
+}
index 9478670..f4468c1 100644 (file)
@@ -1,8 +1,7 @@
 /** General Styles **/
 .path-mod-chat .chat-event .picture,
-.path-mod-chat .chat-message .picture {width:40px;vertical-align:top;}
-.path-mod-chat .chat-event .text,
-.path-mod-chat .chat-message .text {text-align: left;}
+.path-mod-chat .chat-message .picture {width:40px;}
+.path-mod-chat .chat-event .text {text-align: left;}
 .path-mod-chat #messages-list,
 .path-mod-chat #users-list {list-style-type:none;padding:0;margin:0}
 .path-mod-chat #chat-header {overflow: hidden;}
index a91000e..856ca67 100644 (file)
@@ -356,10 +356,9 @@ table.mod_index {width:100%;}
 .comment-paging{text-align:center;}
 .comment-paging .pageno{padding:2px;}
 .comment-paging .curpage{border:1px solid #CCC;}
-.comment-userpicture {width: 20px;float:left;}
-.comment-content {margin-left: 22px;}
-.comment-content div {margin:0;padding:0;}
-.comment-content p {padding:0;margin:0 18px 0 0;}
+.comment-message .picture {width: 20px;float:left;}
+.comment-message .text {margin:0;padding:0;}
+.comment-message .text p {padding:0;margin:0 18px 0 0;}
 .comment-delete {float:right;text-align:right;}
 .comment-delete-confirm {background: #eee; padding: 2px; width: 5em;text-align:center;}
 .comment-container {float:left;margin: 4px;}
index 0be514e..7f96a82 100644 (file)
@@ -9,7 +9,7 @@
 
 .message .author {font-weight: bold;}
 .message .time {font-style: italic;}
-.message .content {}
+.message .text {}
 
 #page-message-user .commands span {font-size:0.7em;}
 #page-message-user .name {font-weight: bold;font-size:1.1em;}
index 6456edf..45b1d1a 100644 (file)
@@ -51,8 +51,6 @@ table.mod_index {width:90%;margin:1em auto;}
 .path-mod-chat .chat-event {text-align:center;color:gray;}
 .path-mod-chat .chat-event .event,
 .path-mod-chat .chat-message .title {color:#888}
-.path-mod-chat .chat-event .text,
-.path-mod-chat .chat-message .text {text-align: left;color:#000;}
 .path-mod-chat #chat-header {background: transparent;font-size: 200%;}
 .path-mod-chat #chat-header p {font-size: 50%;color: gray;}
 #page-mod-chat-gui_basic h1 {font-size:1.4em;}
@@ -191,4 +189,4 @@ a#mod-scorm-log-toggle {font-size: 0.7em;font-weight: bold;}
 #page-mod-survey-report .reportsummary,
 #page-mod-survey-report .studentreport,
 #page-mod-survey-report .reportbuttons,
-#page-mod-survey-report .centerpara {text-align:center;}
\ No newline at end of file
+#page-mod-survey-report .centerpara {text-align:center;}