# --
# Copyright (C) 2001-2017 OTRS AG, http://otrs.com/
# --
# This software comes with ABSOLUTELY NO WARRANTY. For details, see
# the enclosed file COPYING for license information (AGPL). If you
# did not receive this file, see http://www.gnu.org/licenses/agpl.txt.
# --
## nofilter(TidyAll::Plugin::OTRS::TT::ScriptUsage)

[% RenderBlockStart("ArticleFilterDialog") %]
<div id="ArticleFilterDialog" class="Hidden">
    <form action="[% Env("CGIHandle") %]" method="post" id="ArticleFilterDialogForm" name="ArticleFilterDialogForm">
        <input type="hidden" value="AgentTicketZoom" name="Action"/>
        <input type="hidden" value="ArticleFilterSet" name="Subaction"/>
        <input type="hidden" value="[% Data.TicketID | html %]" name="TicketID"/>
        <fieldset class="TableLike">
            <label for="CommunicationChannelFilter">[% Translate("Communication channel") | html %]:</label>
            <div class="Field">
                [% Data.Channels %]
            </div>
            <div class="Clear"></div>
            <label for="CustomerVisibilityFilter">[% Translate("Customer visibility") | html %]:</label>
            <div class="Field">
                [% Data.CustomerVisibility %]
            </div>
            <div class="Clear"></div>
            <label for="ArticleSenderTypeFilter">[% Translate("Sender Type") | html %]:</label>
            <div class="Field">
                [% Data.ArticleSenderTypeFilterString %]
            </div>
            <div class="Clear"></div>
            <label for="SaveDefaults">[% Translate("Save filter settings as default") | html %]:</label>
            <div class="Field">
                <input type="checkbox" id="SaveDefaults" name="SaveDefaults" value="1" />
            </div>
        </fieldset>
    </form>
</div>
[% RenderBlockEnd("ArticleFilterDialog") %]

[% RenderBlockStart("EventTypeFilterDialog") %]
<div id="EventTypeFilterDialog" class="Hidden">
    <form action="[% Env("CGIHandle") %]" method="post" id="EventTypeFilterDialogForm" name="EventTypeFilterDialogForm">
        <input type="hidden" value="AgentTicketZoom" name="Action"/>
        <input type="hidden" value="EvenTypeFilterSet" name="Subaction"/>
        <input type="hidden" value="[% Data.TicketID | html %]" name="TicketID"/>
        <fieldset class="TableLike">
            <label for="EventTypeFilter">[% Translate("Event Type") | html %]:</label>
            <div class="Field">
                [% Data.EventTypeFilterString %]
            </div>
            <div class="Clear"></div>
            <label for="SaveDefaults">[% Translate("Save as default") | html %]:</label>
            <div class="Field">
                <input type="checkbox" id="SaveDefaults" name="SaveDefaults" value="1" />
            </div>
        </fieldset>
    </form>
</div>
[% RenderBlockEnd("EventTypeFilterDialog") %]

[% RenderBlockStart("Header") %]
<div class="MainBox ARIARoleMain TicketZoom UseArticleColors">
    <div class="ClearLeft"></div>
    <div class="Headline NoMargin">
        <div class="Flag" title="[% Translate(Data.Priority) | html %]"><span class="PriorityID-[% Data.PriorityID | html %]">[% Translate(Data.Priority) | html %]</span></div>
        <h1>
            [% Data.Hook %][% Config('Ticket::HookDivider') %][% Data.TicketNumber %] &mdash; [% Data.Title | html %]
        </h1>
    </div>

# Iframe used for fixing bug#8545: Attachment download not possible if pop up of another action is open
# All downloads (e.g. attachments) have this iframe as target. This prevents the browser from sending
# an http request to the TicketZoom window. It sends the download request to this iframe instead.
# Sending the download request to the main window would lead to an alert message about leaving the page
# if at the same time a popup window (e.g. for a ticket answer) is opened.
    <iframe src="about:blank" width="0" height="0" name="AttachmentWindow" id="AttachmentWindow"></iframe>

    <div class="LayoutFixedSidebar SidebarLast">
        <div class="SidebarColumn">

[% RenderBlockStart("FormDraftTable") %]
            <div class="WidgetSimple">
                <div class="Header">
                    <div class="WidgetAction Toggle">
                        <a href="#" title="[% Translate("Show or hide the content") | html %]"><i class="fa fa-caret-right"></i><i class="fa fa-caret-down"></i></a>
                    </div>
                    <h2>[% Translate( "Drafts") | html %]</h2>
                </div>

                <div class="Content">
                    <table class="DataTable" id="FormDraftTable">
                        <tbody>
                            [% FOREACH FormDraft IN Data.FormDrafts %]
                            <tr class="MasterAction">
                                <td class="DraftName">
                                    <a
                                        href="[% Env("Baselink") %][% FormDraft.Link | Interpolate %];LoadFormDraft=1;FormDraftID=[% FormDraft.FormDraftID | html %]"
                                        class="[% FormDraft.Class | html %] MasterActionLink"
                                        [% FormDraft.LinkParam %]>

                                        <span title="[% Translate(FormDraft.Description) | html %]">
                                            [% Translate(FormDraft.Name) | html %] -
                                        </span>
                                        <span title="[% Translate("Created") | html %] [% FormDraft.CreateTime | Localize("TimeShort") %] [% Translate("by") | html %] [% FormDraft.CreatedByUser | html %] [% Translate("Changed") | html %] [% FormDraft.ChangeTime | Localize("TimeShort") %] [% Translate("by") | html %] [% FormDraft.ChangedByUser | html %]">
                                            [% FormDraft.Title | html %]
                                        </span>
                                    </a>
                                </td>
                                <td>
                                    <a class="FormDraftDelete"
                                        href="[% Env("CGIHandle") %]?Action=AgentTicketZoom;Subaction=FormDraftDelete;FormDraftID=[% FormDraft.FormDraftID | html %];TicketID=[% Data.TicketID %]"
                                        title="[% Translate("Delete") | html %]"
                                        data-title="[% FormDraft.Title | html %]"
                                        [% FormDraft.LinkParam %]>

                                        <i class="fa fa-trash-o"></i>
                                    </a>
                                </td>
                            [% END %]
                        </tbody>
                    </table>
                </div>
            </div>
[% RenderBlockEnd("FormDraftTable") %]

            [% FOREACH Widget IN Data.SidebarWidgets; %]
                [% IF Widget.Async; %]
                    <div id="[% Widget.ElementID %]">
                        <div class="WidgetIsLoading">
                            <i class="fa fa-spinner fa-spin"></i>
                        </div>
                    </div>
                [% ELSE; %]
                    [% Widget.Output %]
                [% END; %]
            [% END; %]
        </div>
        <div class="ContentColumn">
            <div class="WidgetSimple">
                <div class="Content OverflowVisible">
                    <div class="ActionRow Cluster">
                        <div class="WidgetAction ArticleView">
                            <a id="ArticleViewSettings" href="#" title="[% Translate("Settings") | html %]">
                                <i class="fa fa-cog"></i>
                                <span class="InvisibleText">[% Translate("Settings") | html %]</span>
                            </a>
                        </div>
                        <ul class="Actions">
[% RenderBlockStart("TicketMenu") %]
                            <li id="nav-[% Data.Name | replace(' ', '-') | html %]">
                            [% IF Data.Type == 'Cluster' %]
                                <span class="[% Data.Class %]" >[% Translate(Data.Name) | html %] <i class="fa fa-caret-down"></i></span>
                            [% ELSE %]
                                <a href="[% Env("Baselink") %][% Data.Link | Interpolate %]" class="[% Data.Class %]" [% Data.LinkParam %] title="[% Translate(Data.Description) | html %]">[% Translate(Data.Name) | html %]</a>
                            [% END %]
[% RenderBlockStart("TicketMenuSubContainer") %]
                                <ul id="nav-[% Data.Name | replace(' ', '-') | html %]-container">
[% RenderBlockStart("TicketMenuSubContainerItem") %]
                                    <li id="nav-[% Data.Name | replace(' ', '-') | html %]">
                                        <a href="[% IF !Data.ExternalLink %][% Env("Baselink") %][% END %][% Data.Link | Interpolate %]" class="[% Data.Class | html %]" [% Data.LinkParam %] title="[% Translate(Data.Description) | html %]">[% Translate(Data.Name) | html %]</a>
                                    </li>
[% RenderBlockEnd("TicketMenuSubContainerItem") %]
                                </ul>
[% RenderBlockEnd("TicketMenuSubContainer") %]
                            </li>
[% RenderBlockEnd("TicketMenu") %]
[% RenderBlockStart("TicketMenuPhoneAsDropdown") %]
                            <li>
                                <form title="[% Translate(Data.Name) | html %]" action="[% Env("CGIHandle") %]" method="get" id="[% Data.FormID | html %]">
                                    <input type="hidden" name="Action" value="[% Data.Action | html %]"/>
                                    <input type="hidden" name="TicketID" value="[% Data.TicketID | html %]"/>
                                    <label for="[% Data.PhoneElementID | html %]" class="InvisibleText">[% Translate(Data.Name) | html %]:</label>
                                    [% Data.StandardReplyStrg %]
                                </form>
                            </li>
[% RenderBlockEnd("TicketMenuPhoneAsDropdown") %]
[% RenderBlockStart("MoveLink") %]
                            <li class="[% Data.Class | html %]">
                                <form title="[% Translate("Move ticket to a different queue") | html %]" action="[% Env("CGIHandle") | html %]" method="post">
                                    <input type="hidden" name="Action" value="AgentTicketMove"/>
                                    <input type="hidden" name="QueueID" value="[% Data.QueueID | html %]"/>
                                    <input type="hidden" name="TicketID" value="[% Data.TicketID | html %]"/>
                                    <label for="DestQueueID" class="InvisibleText">[% Translate("Queue") | html %]:</label>
                                    [% Data.MoveQueuesStrg %]
                                </form>
                            </li>
[% RenderBlockEnd("MoveLink") %]
[% RenderBlockStart("MoveForm") %]
                            <li>
                                <a href="[% Env("Baselink") %]Action=AgentTicketMove;TicketID=[% Data.TicketID | uri %];" class="AsPopup PopupType_TicketAction" title="[% Translate("Change Queue") | html %]">[% Translate("Queue") | html %]</a>
                            </li>
[% RenderBlockEnd("MoveForm") %]
[% RenderBlockStart("TicketMenuExternalLink") %]
                            <li>
                                <a href="[% Data.Link | Interpolate %]" class="[% Data.Class | html %]" [% Data.LinkParam %] title="[% Translate(Data.Description) | html %]" target="[% Data.Target %]">[% Translate(Data.Name) | html %]</a>
                            </li>
[% RenderBlockEnd("TicketMenuExternalLink") %]
                        </ul>
                        <div class="Clear"></div>
                    </div>
                </div>
            </div>

[% RenderBlockStart("ProcessWidget") %]
            <div class="WidgetSimple Expanded" id="DynamicFieldsWidget">
                <div class="Header">
                    <div class="WidgetAction Toggle"><a href="#" title="[% Translate("Show or hide the content") | html %]"><i class="fa fa-caret-right"></i><i class="fa fa-caret-down"></i></a></div>
                    <h2>[% Translate(Data.WidgetTitle) | html %]</h2>
                </div>
[% RenderBlockStart("NextActivityDialogs") %]
                <div class="LightRow Bottom">
                    <ul class="Actions">
                        <li><strong>[% Translate(Data.ActivityName) | html %]:</strong></li>
[% RenderBlockStart("ActivityDialog") %]
                        <li>
                            <a title="[% Translate(Data.Name) | html %]" class="AsPopup PopupType_TicketAction" href="[% Env("Baselink") %]Action=AgentTicketProcess;Subaction=DisplayActivityDialog;TicketID=[% Data.TicketID | uri %];ProcessEntityID=[% Data.ProcessEntityID | uri %];ActivityDialogEntityID=[% Data.ActivityDialogEntityID | uri %]">[% Translate(Data.Name) | html %]</a>
                        </li>
[% RenderBlockEnd("ActivityDialog") %]
                    </ul>
[% RenderBlockStart("NoActivityDialogs") %]
                    <span class="ActionMessage">[% Translate("There are no dialogs available at this point in the process.") | html %]</span>
[% RenderBlockEnd("NoActivityDialogs") %]
                    <div class="Clear"></div>
                </div>
[% RenderBlockEnd("NextActivityDialogs") %]
                <div class="Content ProcessInfo">
                    <div class="ProcessInformation">
                        <fieldset>
[% RenderBlockStart("ProcessWidgetDynamicFieldGroups") %]
[% RenderBlockStart("ProcessWidgetDynamicFieldGroupSeparator") %]
                            <h2 class="FieldSetSeparator">[% Data.Name %]</h2>
[% RenderBlockEnd("ProcessWidgetDynamicFieldGroupSeparator") %]
[% RenderBlockStart("ProcessWidgetDynamicField") %]
                            <div class="FieldContainer DynamicFieldAutoResize">
                                <label title="[% Data.Label | html %]">
                                    [% Data.Label | html %]
[% RenderBlockStart("ProcessWidgetDynamicFieldValueOverlayTrigger") %]
                                    <a href="#" class="ShowFieldInfoOverlay">+</a>
[% RenderBlockEnd("ProcessWidgetDynamicFieldValueOverlayTrigger") %]
                                </label>
                                <p class="Value CutValue DynamicField_[% Data.Name %]">
<!-- OutputFilterHook_WidgetDynamicFieldBegin -->
[% RenderBlockStart("ProcessWidgetDynamicFieldLink") %]
                                    <span title="[% Data.Title %]"><a href="[% Data.Link | Interpolate %]"[% IF Data.LinkPreview %] data-trigger="floater" data-floater-url="[% Data.LinkPreview | Interpolate %]"[% END %] target="_blank" class="DynamicFieldLink">[% Data.Value %]</a></span>
[% RenderBlockEnd("ProcessWidgetDynamicFieldLink") %]
[% RenderBlockStart("ProcessWidgetDynamicFieldPlain") %]
                                    [% Data.Value %]
[% RenderBlockEnd("ProcessWidgetDynamicFieldPlain") %]
<!-- OutputFilterHook_WidgetDynamicFieldEnd -->
                                </p>
                                <p class="ValueLong">
[% RenderBlockStart("ProcessWidgetDynamicFieldValueLong") %]
                                    [% Data.Value %]
[% RenderBlockEnd("ProcessWidgetDynamicFieldValueLong") %]
                                </p>
                                <div class="Clear"></div>
                            </div>
[% RenderBlockEnd("ProcessWidgetDynamicField") %]
[% RenderBlockEnd("ProcessWidgetDynamicFieldGroups") %]
                        </fieldset>
                    </div>
                </div>
            </div>
[% RenderBlockEnd("ProcessWidget") %]

            <div id="ArticleTree">
[% Data.ArticleTree %]
            </div>

[% RenderBlockStart("HintNoArticles") %]
            <div class="WidgetSimple">
                <div class="Content">
                    [% Translate("This item has no articles yet.") | html %]
                </div>
            </div>
[% RenderBlockEnd("HintNoArticles") %]

            <div id="ArticleItems">
[% Data.ArticleItems %]
            </div>

            [% FOREACH Widget IN Data.MainWidgets; %]
                [% IF Widget.Async; %]
                    <div id="[% Widget.ElementID %]"></div>
                [% ELSE; %]
                    [% Widget.Output %]
                [% END; %]
            [% END; %]

        </div>
        <div class="Clear"></div>
    </div>

</div>
[% RenderBlockEnd("Header") %]

[% RenderBlockStart("Tree") %]
<div class="WidgetSimple">
    <div class="Header">
        <div class="WidgetAction Toggle">
            <a href="#" title="[% Translate("Show or hide the content") | html %]">
                <i class="fa fa-caret-right"></i>
                <i class="fa fa-caret-down"></i>
            </a>
        </div>
        <h2>
        [% IF Data.ZoomTimeline %]
            [% Translate("Ticket Timeline View") | html %]
        [% ELSE %]
            [% Translate("Article Overview - %s Article(s)", Data.ArticleCount) | html %]
        [% END %]
        </h2>
        <div class="AdditionalInformation ControlRow">

[% RenderBlockStart("ArticlePages") %]
            <div class="ArticlePages Icons">
        [% FOREACH page IN [1 .. Data.Pages]; %]
                <a href="[% Env("Baselink") %]Action=AgentTicketZoom;TicketID=[% Data.TicketID | uri %];ArticlePage=[% page %]" title="[% Translate('Page %s', page) | html %]" data-page="[% page %]" [% IF page == Data.CurrentPage %]class="Active"[% END %]>[% page %]</a>
        [% END; %]
            </div>
[% RenderBlockEnd("ArticlePages") %]
[% RenderBlockStart("ArticleFilterDialogLink") %]
            <div class="ArticleFilter Icons">
                <span class="InvisibleText">[% Translate("Article Filter") | html %]:</span>
# Only show one: Set or Reset.
#[% RenderBlockStart("ArticleFilterSetLink") %]
                <a href="#" id="SetArticleFilter" title="[% Translate("Add Filter") | html %]"><i class="fa fa-filter"></i><span>[% Translate("Set") | html %]</span></a>
#[% RenderBlockEnd("ArticleFilterSetLink") %]
[% RenderBlockStart("ArticleFilterResetLink") %]
                <a href="#" id="ResetArticleFilter" title="[% Translate("Reset Filter") | html %]"><i class="fa fa-trash-o"></i><span>[% Translate("Reset") | html %]</span></a>
[% RenderBlockEnd("ArticleFilterResetLink") %]
            </div>
[% RenderBlockEnd("ArticleFilterDialogLink") %]
            <div class="Clear"></div>
        </div>
    </div>
    <div class="Content">

[% RenderBlockStart("ArticleList") %]
        <div class="TicketList">
            <div id="ArticleTableBody" class="ActionRow">
                <div class="Scroller">
                    <table id="ArticleTable" class="DataTable [% Data.TableClasses | html %]">
                        <thead>
                            <tr>
                                <th class="No Sortable"><a href="#">[% Translate("No.") | html %]</a></th>
                                <th class="UnreadArticles">
                                    <a class="UnreadArticles" href="#" title="[% Translate("Unread articles") | html %]">
                                        <span class="UnreadArticles">
                                            <i class="fa fa-star"></i>
                                            <i class="fa fa-star"></i>
                                        </span>
                                    </a>
                                </th>
                                <th class="Direction Sortable"><a href="#" title="[% Translate("Direction") | html %]"><i class="fa fa-exchange"></i></a></th>
                                <th class="Sender Sortable"><a href="#">[% Translate("Sender") | html %]</a></th>
                                <th class="Channel Sortable"><a href="#">[% Translate("Via") | html %]</a></th>
                                <th class="Subject Sortable"><a href="#">[% Translate("Subject") | html %]</a></th>
                                <th class="Created Sortable"><a href="#">[% Translate("Created") | html %]</a></th>
                                <th class="Attachments Last Center">
                                    <a href="#" title="[% Translate("Attachments") | html %]">
                                        <i class="fa fa-paperclip"></i>
                                    </a>
                                </th>
                            </tr>
                        </thead>
                        <tbody>
[% RenderBlockStart("TreeItem") %]
                            <tr class="[% Data.SenderType | html %] [% IF Data.SenderType == 'customer' %]Incoming[% ELSE %]Outgoing[% END %] [% IF Data.IsVisibleForCustomer %]VisibleForCustomer[% ELSE %]NotVisibleForCustomer[% END %] [% Data.ClassRow | html %]" id="Row[% Data.ArticleNumber | uri %]">
                                <td class="No">
                                    [% Data.ArticleNumber | html %]
                                    <input type="hidden" class="ArticleInfo" name="Link[% Data.ArticleNumber | uri %]" value="[% Env("Baselink") %]Action=AgentTicketZoom;Subaction=ArticleUpdate;Count=[% Data.ArticleNumber | uri %];TicketID=[% Data.TicketID | html %];ArticleID=[% Data.ArticleID | html %];"/>
                                    <input type="hidden" class="ArticleID" value="[% Data.ArticleID | html %]" />
                                    <input type="hidden" class="SortData" value="[% Data.ArticleNumber | html %]" />
                                </td>
                                <td class="[% Data.Class | html %] UnreadArticles Fixed NonTextContent">
[% RenderBlockStart("TreeItemImportantArticle") %]
                                    <span class="ImportantArticles" title="[% Translate("Important") | html %]">
                                        <i class="fa fa-info-circle"></i>
                                        <em>[% Translate("Important") | html %]</em>
                                    </span>
[% RenderBlockEnd("TreeItemImportantArticle") %]
[% RenderBlockStart("TreeItemNewArticle") %]
                                    <span class="[% Data.Class | html %]" title="[% Translate("Unread Article!") | html %]">
                                        <i class="fa fa-star"></i>
                                        <i class="fa fa-star"></i>
                                    </span>
[% RenderBlockEnd("TreeItemNewArticle") %]
[% RenderBlockStart("TreeItemNoNewArticle") %]
                                    <span class="NoContent"></span>
[% RenderBlockEnd("TreeItemNoNewArticle") %]
                                </td>
                                <td class="Direction">
[% RenderBlockStart("TreeItemDirectionIncoming") %]
                                    <span class="Direction Incoming" title="[% Translate("Incoming message") | html %]">
                                        <i class="fa fa-long-arrow-left"></i>
                                    </span>
                                    <input type="hidden" class="SortData" value="0" />
[% RenderBlockEnd("TreeItemDirectionIncoming") %]
[% RenderBlockStart("TreeItemDirectionOutgoing") %]
                                    <span class="Direction Outgoing" title="[% Translate("Outgoing message") | html %]">
                                        <i class="fa fa-long-arrow-right"></i>
                                    </span>
                                    <input type="hidden" class="SortData" value="1" />
[% RenderBlockEnd("TreeItemDirectionOutgoing") %]
[% RenderBlockStart("TreeItemDirectionInternal") %]
                                    <span class="Direction Internal" title="[% Translate("Internal message") | html %]"></span>
                                    <input type="hidden" class="SortData" value="2" />
[% RenderBlockEnd("TreeItemDirectionInternal") %]
                                </td>
                                <td class="Sender">
                                    <div title="[% Data.ArticleFields.Sender.Value | html %]"><a href="#">[% Data.ArticleFields.Sender.Realname | truncate(100) | html %]</a></div>
                                    <input type="hidden" class="SortData" value="[% Data.ArticleFields.Sender.Value | html %]" />
                                </td>
                                <td class="Channel">
                                    <div>[% Translate(Data.ChannelDisplayName) | html %]
                                    [% IF Data.ChannelInvalid %]
                                        <span title="[% Translate("Missing channel") | html %]">
                                            <i class="fa fa-exclamation-triangle Warning" aria-hidden="true"></i>
                                        </span>
                                    [% END %]
                                    [% IF Data.TransmissionStatus %]
                                        [% IF Data.TransmissionStatus.Status == 'Failed' %]
                                        <span title="[% Translate("Sending of this message has failed.") | html %]">
                                            <i class="fa fa-times Error" aria-hidden="true"></i>
                                        </span>
                                        [% ELSIF Data.TransmissionStatus.Status == 'Processing' %]
                                        <span title="[% Translate("This message has been queued for sending.") | html %]">
                                            <i class="fa fa-spin fa-circle-o-notch Warning" aria-hidden="true"></i>
                                        </span>
                                        [% END %]
                                    [% END %]
                                    </div>
                                    <input type="hidden" class="SortData" value="[% Translate(Data.ChannelDisplayName) | html %]" />
                                </td>
                                <td class="Subject">
                                    <div title="[% Data.ArticleFields.Subject.Value | html %]"><a href="#">[% Data.ArticleFields.Subject.Value | truncate(100) | html %]</a></div>
                                    <input type="hidden" class="SortData" value="[% Data.ArticleFields.Subject.Value | html %]" />
                                </td>
                                <td class="Created">
                                    <div title="[% Data.CreateTime | Localize('TimeShort') %]"><a href="#">[% Data.CreateTime | Localize("TimeShort") %]</a></div>
# Include custom sorting information: date in ISO format.
# Other date formats cannot be sorted reliably.
                                    <input type="hidden" class="SortData" value="[% Data.CreateTime | html %]" />
                                </td>
                                <td class="Attachments Center Attachment Fixed NonTextContent">
[% RenderBlockStart("TreeItemAttachment") %]
[% PROCESS ArticleAttachments.tt %]
[% RenderBlockEnd("TreeItemAttachment") %]
[% RenderBlockStart("TreeItemNoAttachment") %]
                                    <span class="NoContent"></span>
[% RenderBlockEnd("TreeItemNoAttachment") %]
                                </td>
                            </tr>
[% RenderBlockEnd("TreeItem") %]
                        </tbody>
                    </table>
                </div>
                <div class="Handle ui-resizable-handle ui-resizable-s">
                    <a href="#">[% Translate("Resize") | html %]</a>
                </div>
            </div>
        </div>
[% RenderBlockEnd("ArticleList") %]

[% RenderBlockStart("TimelineView") %]

        <div class="TimelineViewTicketActions Hidden">
[% RenderBlockStart("TimelineViewTicketActions") %]
            <div class="TicketActions ArticleID_[% Data.ArticleID | html %]">
[% PROCESS ArticleActionMenu.tt %]
            </div>
[% RenderBlockEnd("TimelineViewTicketActions") %]
        </div>

        <div class="TimelineViewArticleAttachments Hidden">
[% RenderBlockStart("TimelineViewArticleAttachments") %]
            <div class="ArticleAttachments ArticleID_[% Data.ArticleID | html %]">
[% PROCESS ArticleAttachments.tt %]
            </div>
[% RenderBlockEnd("TimelineViewArticleAttachments") %]
        </div>

        <ul class="Hidden">
            <li id="TemplateListItem">
                <h3>
                    <div class="UnreadArticles Remarkable" title="[% Translate("Mark this article as read") | html %]">
                        <i class="fa fa-star"></i>
                        <i class="fa fa-star"></i>
                    </div>
                    <i class="fa fa-info-circle" title="[% Translate("Important") | html %]"></i>
                    <em></em>
                    <strong class="Type"></strong>
                    <span><span></span></span>
                    <a href="#" class="ShowFullArticleText" title="[% Translate("Show Full Text") | html %]">
                        <i class="fa fa-search-plus"></i>
                    </a>
                </h3>
            </li>
        </ul>

        <div id="TemplateArticleData" class="Hidden">
            <ul>
                <li class="subject">
                    <strong>[% Translate("Subject") | html %]: </strong>
                </li>
                <li class="from">
                    <strong>[% Translate("From") | html %]: </strong>
                </li>
                <li class="to">
                    <strong>[% Translate("To") | html %]: </strong>
                </li>
                <li class="cc">
                    <strong>[% Translate("Cc") | html %]: </strong>
                </li>
            </ul>
            <div class="Hidden FullArticlePlainText" data-title="[% Translate("Full Article Text") | html %]">
                <div class="TimelinePlainText"></div>
            </div>
            <p class="PlainText"></p>
            <div class="Hidden ArticleIFrame" data-title="[% Translate("Full Article Text") | html %]"></div>
        </div>

        <div class="TimelineView UseArticleColors">
            <ul class="ListLeft">
                <li class="NoEvents">[% Translate("No more events found. Please try changing the filter settings.") | html %]</li>
            </ul>
            <ul class="ListRight"></ul>
            <div class="Clear"></div>
            <span><i class="fa fa-spinner fa-spin"></i></span>
        </div>

[% RenderBlockEnd("TimelineView") %]

    </div>
</div>
[% RenderBlockEnd("Tree") %]

[% Data.ArticleWidgetsHTML %]