{include_template_file file="blocks/account_left.html"}





<div class="account-right">
    {if $mode =='inbox'}
    <h2 class="page-header">{lang code='private_messages'} &raquo; {lang code='inbox'}</h2>

    <div id="pm_container">
        <div class="pm_left_column">
            {if $threads}
            {foreach $threads as $_thread}
            {$the_thread=$_thread}
            <div class="thread_container gradient 
                 {if $smarty.get.thread_id==$the_thread.thread_id}thread_active{/if}
                 "
                 onclick="window.location='{$query_string}thread_id={$the_thread.thread_id}'"
                 >
                <div class="thread_author_image">
                    <img src="{$userquery->avatar($the_thread,'small')}" />
                </div>
                <div class="thread_author_name">
                    {list_thread_recipients($_thread)}
                </div>
                <div class="thread_subject">
                    {$the_thread.last_message|truncate:35}
                </div>
                <span class="thread_time">
                    {$the_thread.time_added|date_format:'%H:%M:%S'}
                </span>
            </div> 
            {/foreach}
            {/if}
        </div>
        <div class="pm_right_column">
            {if !$messages}
            <p class="alert alert-large">{lang code='No conversation selected'}</p>
            {else}
            <div class="thread_head">
                
                <div class="thread_recipients">{list_thread_recipients($thread)}</div>
                <div class="thread_subject">{$thread.subject}</div>
            </div>
            
            <div class="messages-container">
                <div class="nano">
                    <div class="content">
                        {foreach $messages as $message}
                        {$message_template=get_template('single_message','path')}
                        {include file=$message_template message=$message}
                        {/foreach}
                        <div id="new-message-spot"></div>
                    </div>
                </div>
            </div>

            <div class="new_msg_container">
                <form method="post" id="thread_message" onsubmit="cb_send_message('#thread_message','#send_message_btn'); return false;">
                    <div class="new_msg_subj">
                        <input type="text" class="msg_subject" name="subject" placeholder="Re: {$thread.subject}" />
                    </div>
                    <div class="new_msg_textfield_container">
                        <textarea name="message" class="add_message_textarea" ></textarea>
                        <i class="icon-eye-open msg_smiley"></i>
                        <input type="hidden" name="thread_id" value="{$thread_id}">
                        <input type="hidden" name="add_message" value="yes"/>
                    </div>
                    <div class="new_msg_actions">
                        <span class="label label-important display-none" id="send-message-error"></span>
                        <button class="btn btn-primary" id="send_message_btn"
                                data-loading-text="Sending.." >Send</button>
                    </div>
                </form>
            </div>
            {/if}
        </div>

        <div class="clearfix"></div>
    </div>

    <script>
        $(document).ready(function(){
            
            $('.add_message_textarea').autosize().shiftenter();  
            
            
            msg_time = '{time()}';
            //Scroll to message
            {if $mid}
            $(".nano").nanoScroller({ scrollTo: $('#message-{$mid}') });
            {else}
            $(".nano").nanoScroller({ scroll: 'bottom' });
            {/if}
            
            //Keep an eye on thread :D
            setInterval(function(){
                fetch_new_msgs({$thread_id});
            }, 5000);
            
        });
    </script>

    {/if} <!-- Ending Inbox -->


    <!-- Starting Compose message -->
    {if $mode=='new_msg'}
    <h2>{lang code='Compose new message'}</h2>
    <hr />

    <script>
        $(document).ready(function(){
            getFeedParams('friend');
            $("#pm_recipients").autoSuggest(baseurl+'/ajax/items.php', { 
                selectedItemProp: "name", 
                asHtmlID : 'pm_recipients',
                searchObjProps: "name",
         
                limitText : false,
                selectionAdded : function(){
               
                },
                selectionRemoved : function(elem){
                
                },
                formatList: function(data, elem){
                    var my_image = data.image;
                    var new_elem = elem.html("<img src='"+data.image+"' width='20' height='20'/> "+data.name);
                    return new_elem;
                }
            });
        })
        
    </script>
    <div class="compose_new_form">
        <form method="post">
            <div class="control-group">
                <label class="control-label" for="inputEmail">To</label>
                <div class="controls">
                    <input type="text" class="pm_recipients" id="pm_recipients"/>
                </div>
            </div>

            <div class="control-group">
                <label class="control-label" for="subject">Subject</label>
                <div class="controls">
                    <input type="text" name="subject" id="subject" placeholder="Message subject.." class="pm_subject">
                </div>
            </div>

            <div class="control-group">
                <label class="control-label" for="message">Message</label>
                <div class="controls">
                    <textarea placeholder="Enter your message" id="message" name="message" class="pm_message  auto-height"></textarea>
                </div>
            </div>

            <div class="form-actions" align="right">
                <input type="submit" class="btn btn-primary" name="send_message" value="Send message">
            </div>
        </form>
    </div>

    {/if}


</div>



<!--Clearing things up -->
<div class="clearfix"></div>