Page 1 of 1

Gmail style reply collapse

Posted: Wed May 23, 2007 12:49 pm
by tsjaar
/*************************************
Title: Gmail Style Reply Collapse
Version: 0.94
Author: Erik van Dijk (tsjaar)
Demo: I'm sorry, no demo
Download: See instructions below
Website:

Short description:
Collapse the reply's to an ticket and just see the last ticket reply.
Tested on IE7 and FF 2.0
*************************************/

If you have a long list of reply's you have to scroll all the way down to see the last reply. This mod collapses all the reply's but the last one. This way, you will directly see the last reply.

The 2 lines with the date and name will be visible, and there will show up an icon next to the date, if there is an attachement in this reply. A click on this part of the reply will open the reply (the mouse will become a pointer / hand if you hover). Click again, and the reply will be collapsed again.

Just edit the code in the 2 files: admin_ticket.php and ticket.php

Replace the php code that looks like:

Code: Select all

<?php
  $i=1;
  while ($reply = hesk_dbFetchAssoc($result))
//....all the way up to the end of the script part...
}
?>

Code: Select all

<?php
$i=1;
$replyNum=0; //number of reply we are in
while ($reply = hesk_dbFetchAssoc($result))
{
if ($i) {$color=''; $i=0;}
else {$color='class="white"'; $i=1;}
$replyNum++;
$hideReply = "";
//hide all reply's, but the last one
if($replyNum != $replies){
  $hideReply = 'style="display:none;"';
}
$hasAtt = ""; //if this reply has an attribute, add an image next to the date
if ($hesk_settings['attachments']['use'] && !empty($reply['attachments'])) {
  $hasAtt = '<img src="img/clip.gif" />';
}

echo <<<EOC
    <tr>
    <td $color onclick="hesk_toggleLayerDisplay('reply_$replyNum');" style="cursor:pointer;">
        <table border="0" cellspacing="1">
        <tr>
        <td $color>$replyNum. $hesklang[date]:</td>
        <td $color>$reply[dt] $hasAtt</td>
        </tr>
        <tr>
        <td $color>$hesklang[name]:</td>
        <td $color>$reply[name]</td>
        </tr>
        </table>
    <span id="reply_$replyNum" $hideReply>
    <p><b>$hesklang[message]:</b></p>
    <p>$reply[message]</p>

EOC;

if ($hesk_settings['attachments']['use'] && !empty($reply['attachments'])) {
    echo '<p><b>'.$hesklang['attachments'].':</b><br>';
    $att=explode('#####',substr($reply['attachments'], 0, -5));
    foreach ($att as $myatt) {
        echo '<img src="img/clip.gif" width="20" height="20"><a href="'.$myatt.'" target="_blank">'.substr(strstr($myatt, $trackingID),16).'</a><br>';
    }
    echo '</p>';
}

echo '</span></td></tr>';
}
?>
I hope you will like this script.

[edit]
One (small) disadvantage: when you click on a link, the reply will collapse. I don't know (yet) how to solve this. I still want to click anywhere in the reply to collapse/show the reply. If you have an idea, I would like to hear it.
[/edit]

Posted: Wed May 23, 2007 1:32 pm
by Klemen
A good idea, this is very useful especially for longer tickets, I will include something like this in the next release.

The collapse when you click on a link (or when you try to copy some text for example) is really a bit annoying though. It might be better to have a link to show/hide posts instead of clicking on the TR, something like:

Code: Select all

<?php
$i=1;
$replyNum=0; //number of reply we are in
while ($reply = hesk_dbFetchAssoc($result))
{
if ($i) {$color=''; $i=0;}
else {$color='class="white"'; $i=1;}
$replyNum++;
$hideReply = "";
//hide all reply's, but the last one
if($replyNum != $replies){
  $hideReply = 'style="display:none;"';
}
$hasAtt = ""; //if this reply has an attribute, add an image next to the date
if ($hesk_settings['attachments']['use'] && !empty($reply['attachments'])) {
  $hasAtt = '<img src="img/clip.gif" />';
}

echo <<<EOC
    <tr>
    <td $color>
        <table border="0" cellspacing="1">
        <tr>
        <td width="10%" nowrap $color>$replyNum. $hesklang[date]:</td>
        <td width="10%" nowrap $color>$reply[dt] $hasAtt</td>
        <td width="80%" align="right" $color><a href="#" onclick="hesk_toggleLayerDisplay('reply_$replyNum');return false;">Show/Hide</a></td>
        </tr>
        <tr>
        <td width="10%" nowrap  $color>$hesklang[name]:</td>
        <td width="10%" nowrap  $color>$reply[name]</td>
        <td width="80%" $color>&nbsp;</td>
        </tr>
        </table>
    <span id="reply_$replyNum" $hideReply>
    <p><b>$hesklang[message]:</b></p>
    <p>$reply[message]</p>

EOC;

if ($hesk_settings['attachments']['use'] && !empty($reply['attachments'])) {
    echo '<p><b>'.$hesklang['attachments'].':</b><br>';
    $att=explode('#####',substr($reply['attachments'], 0, -5));
    foreach ($att as $myatt) {
        echo '<img src="img/clip.gif" width="20" height="20"><a href="'.$myatt.'" target="_blank">'.substr(strstr($myatt, $trackingID),16).'</a><br>';
    }
    echo '</p>';
}

echo '</span></td></tr>';
}
?>

But like said, I like the idea. Thanks for sharing!

Posted: Wed May 23, 2007 2:00 pm
by tsjaar
You got a point on that.
I will combine these 2 :D
The first row is clickable, including a link on the right.

Code: Select all

echo <<<EOC
    <tr>
    <td $color>
      <table border="0" cellspacing="1">
        <tr onclick="hesk_toggleLayerDisplay('reply_$replyNum');" style="cursor:pointer;">
          <td width="10%" nowrap $color>$replyNum. $hesklang[date]:</td> 
          <td width="10%" nowrap $color>$reply[dt] $hasAtt</td> 
          <td width="80%" align="right" $color ><a href="#" onclick="return false;">Show/Hide</a></td> 
        </tr> 
        <tr> 
          <td width="10%" nowrap  $color>$hesklang[name]:</td> 
          <td width="10%" nowrap  $color>$reply[name]</td> 
          <td width="80%" $color>&nbsp;</td> 
        </tr>
      </table>
    <span id="reply_$replyNum" $hideReply>
    <p><b>$hesklang[message]:</b></p>
    <p>$reply[message]</p>

EOC;

ps. I also added the sender name to the mail header and the ticket ID to the mail Subject:

Code: Select all

$headers="From: $hesk_settings[hesk_title] <$hesk_settings[noreply_mail]>\n";
$headers.="Reply-to: $hesk_settings[noreply_mail]\n";
@mail($email,$hesklang['ticket_received'] . ' ( ' . $hesklang['trackID'] . ' : ' . $trackingID . ' )' ,$message,$headers);

Posted: Wed May 23, 2007 2:22 pm
by Klemen
Yes, probably the best solution :D

As for the title in "From:" header you can add this sure, but I don't think I will be adding it in the official version because some names/languages can contain special characters (like š č ć ž đ ä ü and so on) and e-mail programs can have problems displaying those or even give errors or warnings when replying to such e-mails (wrong encoding type, doesn't recognize recipient etc.) I had some problems like this in the past (not with Hesk but with some other work) so I decided not to include anything else but e-mail in "From:" to avoid compatibility issues (Hesk is used in many languages).

I also read your other suggestions in the "what features should be added" topic, will try to include most.

Posted: Thu Sep 13, 2007 2:48 pm
by andrew
Nice hack here Tsar 8)

thanks, can I just confirm with anyone who knows.

To get the updated code that combines both posters ideas, do we replace the relevant code in those two files with this code?



echo <<<EOC
<tr>
<td $color>
<table border="0" cellspacing="1">
<tr onclick="hesk_toggleLayerDisplay('reply_$replyNum');" style="cursor:pointer;">
<td width="10%" nowrap $color>$replyNum. $hesklang[date]:</td>
<td width="10%" nowrap $color>$reply[dt] $hasAtt</td>
<td width="80%" align="right" $color ><a href="#" onclick="return false;">Show/Hide</a></td>
</tr>
<tr>
<td width="10%" nowrap $color>$hesklang[name]:</td>
<td width="10%" nowrap $color>$reply[name]</td>
<td width="80%" $color>&nbsp;</td>
</tr>
</table>
<span id="reply_$replyNum" $hideReply>
<p><b>$hesklang[message]:</b></p>
<p>$reply[message]</p>

EOC;



Thanks

Posted: Tue Dec 18, 2007 7:37 am
by DC
I tested the above mod and it works great, plus I finally figured out a mod for the JS part mixed with some php so it will also toggle a small icon image as well ...

I may post this if I see it works across all browsers or most browsers correctly im still in test mode...

DC