Init version of ticket zoom enhancements.

app/assets/javascripts/app/controllers/agent_ticket_zoom.js.coffee

@@ -9,6 +9,7 @@ class Index extends App.Controller
     'click [data-type=internal]':             'public_internal',
     'click [data-type=history]':              'history_view',
     'change [name="ticket_article_type_id"]': 'form_update',
+    'click .show_toogle':                     'show_toogle',
 
   constructor: (params) ->
     super
@@ -66,7 +67,16 @@ class Index extends App.Controller
     if !@articles
       @articles = []
       for article_id in @ticket.article_ids
-        @articles.push App.TicketArticle.find(article_id)
+        article = App.TicketArticle.find(article_id)
+        
+        # build html body
+        article['html'] = window.linkify( article.body.trim() )
+        notify = "<a href=\"#\" style=\"color:blue\" class=\"show_toogle\">" + T('See more') + "</a>"
+        article['html'] = article['html'].replace /--/m, (match) ->
+          notify + '<div class="hide">' + match
+        article['html'] = article['html'] + '</div>'
+
+        @articles.push article
 
     # check attachments
     for article in @articles
@@ -157,6 +167,11 @@ class Index extends App.Controller
       debug: false
     )
 
+  show_toogle: (e) ->
+    e.preventDefault()
+    $(e.target).hide()
+    $(e.target).next('div').show()
+
   history_view: (e) ->
     e.preventDefault()
     new History( ticket_id: @ticket_id )

app/assets/javascripts/app/views/agent_ticket_zoom.jst.eco

@@ -53,7 +53,7 @@
           </div>
         <% end %>
         <hr/>
-        <div style="white-space:pre-wrap;"><%- window.linkify( article.body.trim() ) %></div>
+        <div style="white-space:pre-wrap;" class="article-content"><%- article.html %></div>
       </div>
     </div>
 <% end %>

app/assets/stylesheets/zzz.css

@@ -108,7 +108,7 @@ footer {
 }
 
 .ticket-answer .avatar {
-    margin-left: 10px;
+  margin-left: 10px;
 }
 .ticket-answer .span8 {
   width: 558px;
@@ -158,6 +158,12 @@ footer {
   width: 602px;
 }
 
+.show_toogle {
+  font-size: 10px;
+  line-height: 12px;
+  color: #999999;
+}
+
 .well-muted {
   background-color: whiteSmoke;
   border: 1px solid #eee;