<script>
enqueLists.push([{
    res: 'calls_slice',
    widgetName: "SubscriberCallsOverview",
    cb: function(data) {
        //console.log(data);
        var calls = data.widget_data;
        if (calls.length == 0) {
            $("#subscriber_call_overview_lazy_items_list").append('<li>[% c.escape_js(c.loc('No calls yet')) %]</li>');
        } else {
            for (var i = 0; i < calls.length; i++) {
                var call = calls[i];
                $("#subscriber_call_overview_lazy_items_list").append('<li>' +
                    '<div class="row-fluid">' +
                        (call.source_user_id == '[% c.user.uuid %]' ?
                            '<div class="span1"><i ' +
                            (call.call_status == "ok" ?
                                'class="icon-circle-arrow-right" style="color:green"'
                            :
                                'class="icon-circle-arrow-up" style="color:red"'
                            ) + '></i></div>' +
                            '<div class="span8">' + call.destination_user_in + '</div>'
                        :
                            '<div class="span1"><i ' +
                            (call.call_status == "ok" ?
                                'class="icon-circle-arrow-left" style="color:green"'
                            :
                                'class="icon-circle-arrow-down" style="color:red"'
                            ) + '></i></div>' +
                            '<div class="span8">' + call.source_cli + '</div>'
                        ) +
                    '</div>' +
                    '<div class="row-fluid">' +
                        '<div class="offset1 span8">' + call.start_time + '</div>' +
                        '<div class="span1">' + call.duration + '</div>' +
                    '</div>' +
                '</li>');
            }
        }
    }
},{
    res: 'calls_count',
    widgetName: "SubscriberCallsOverview",
    cb: function(data) {
        //console.log(data);
        $("#subscriber_call_overview_lazy_loading").remove();
        $("#subscriber_call_overview_lazy_items_header").append(
            '<div class="plan-price">' +
                '<span>' + data.widget_data + '</span>' +
                '<span class="term">' + (data.widget_data == 1 ? '[% c.escape_js(c.loc('Recent Call')) %]' : '[% c.escape_js(c.loc('Recent Calls')) %]') + '</span>' +
            '</div>');
    }
}]);
</script>
<div class="plan-container">
    <div class="plan">
        <div class="plan-header" id="subscriber_call_overview_lazy_items_header">
            <div class="plan-title">[% c.loc('Call List') %]</div>
            <div class="plan-price widget-loading" id="subscriber_call_overview_lazy_loading"><span>0</span><span class="term">processing ...</span></div>
        </div>
        <div class="plan-features large">
            <ul id="subscriber_call_overview_lazy_items_list">
            </ul>
        </div>
        <div class="plan-actions">
            <a href="[% c.uri_for_action('/subscriber/calllist', [c.user.voip_subscriber.id]) %]" class="btn">[% c.loc('View Call List') %]</a>
        </div>
    </div>
</div>
[% # vim: set tabstop=4 syntax=html expandtab: -%]
