plexpy/data/interfaces/default/index.html

<%inherit file="base.html"/>

<%def name="headIncludes()">
</%def>

<%def name="body()">
<div class="container-fluid">
    <div class="row">
        <div class="col-md-12">
            <div class="padded-header" id="current-activity-header">
                <h3>Activity</h3>
            </div>
            <div id="currentActivity">
                <div class="text-muted"><i class="fa fa-refresh fa-spin"></i> Checking for activity...</div>
                <br>
            </div>
        </div>
    </div>
    % if config['home_stats_cards']:
    <div class="row">
        <div class="col-md-12">
            <div class="padded-header">
                <h3>Watch Statistics <small>Last ${config['home_stats_length']} days</small></h3>
            </div>
            <div id="home-stats" class="home-platforms">
                <div class="text-muted"><i class="fa fa-refresh fa-spin"></i> Loading stats...</div>
                <br>
            </div>
        </div>
    </div>
    % endif
    % if config['home_library_cards']:
    <div class="row">
        <div class="col-md-12">
            <div class="padded-header" id="library-statistics-header">
                <h3>Library Statistics <small>${config['pms_name']}</small></h3>
            </div>
            <div id="library-stats" class="library-platforms">
                <div class="text-muted"><i class="fa fa-refresh fa-spin"></i> Loading stats...</div>
                <br>
            </div>
        </div>
    </div>
    % endif
    <div class="row">
        <div class="col-md-12">
            <div class="padded-header">
                <ul class="nav nav-header nav-dashboard pull-right">
                    <li>
                        <a href="#" id="recently-added-page-left" class="paginate btn-gray disabled" data-id="+1"><i class="fa fa-lg fa-chevron-left"></i></a>
                    </li>
                    <li>
                        <a href="#" id="recently-added-page-right" class="paginate btn-gray disabled" data-id="-1"><i class="fa fa-lg fa-chevron-right"></i></a>
                    </li>
                </ul>
                <h3>Recently Added</h3>
            </div>
            <div id="recentlyAdded" style="margin-right: -15px;">
                <div class="text-muted"><i class="fa fa-refresh fa-spin"></i> Looking for new items...</div>
                <br>
            </div>
        </div>
    </div>
</div>
</%def>

<%def name="javascriptIncludes()">
<script src="${http_root}js/moment-with-locale.js"></script>
<script>
    function currentActivityHeader() {
        $.ajax({
            url: 'get_current_activity_header',
            cache: false,
            async: true,
            complete: function(xhr, status) {
                $("#current-activity-header").html(xhr.responseText);
            }
        });
    }
    currentActivityHeader();

    function currentActivity() {
        $.ajax({
            url: 'get_current_activity',
            cache: false,
            async: true,
            complete: function(xhr, status) {
                $("#currentActivity").html(xhr.responseText);
            }
        });
    }
    currentActivity();

    setInterval(function () {
        $('.bar, .bufferbar').tooltip('destroy');
        currentActivityHeader();
        currentActivity();
    }, 15000);

    function getHomeStats(days) {
        $.ajax({
            url: 'home_stats',
            cache: false,
            async: true,
            data: { },
            complete: function(xhr, status) {
                $("#home-stats").html(xhr.responseText);
            }
        });
    }
    getHomeStats();

    function getLibraryStats() {
        $.ajax({
            url: 'library_stats',
            cache: false,
            async: true,
            data: { },
            complete: function(xhr, status) {
                $("#library-stats").html(xhr.responseText);
            }
        });
    }
    getLibraryStats();

    function recentlyAdded() {
        $.ajax({
            url: 'get_recently_added',
            type: "GET",
            async: true,
            data: { count : 50 },
            complete: function(xhr, status) {
                $("#recentlyAdded").html(xhr.responseText);
                highlightAddedScrollerButton();
            }
        });
    }
    recentlyAdded();

    var date_format = 'YYYY-MM-DD';
    var time_format = 'hh:mm a';
    $.ajax({
        url: 'get_date_formats',
        type: 'GET',
        success: function(data) {
            date_format = data.date_format;
            time_format = data.time_format;
        }
    });

    function highlightAddedScrollerButton() {
        var scroller = $("#recently-added-row-scroller");
        var numElems = scroller.find("li").length;
        scroller.width(numElems * 175);
        if (scroller.width() > $("body").find(".container-fluid").width()) {
            $("#recently-added-page-right").removeClass("disabled");
        } else {
            $("#recently-added-page-right").addClass("disabled");
        }
    }

    $(window).resize(function () {
        highlightAddedScrollerButton();
    });

    var leftTotal = 0;
    $(".paginate").click(function (e) {
        e.preventDefault();
        var scroller = $("#recently-added-row-scroller");
        var containerWidth = $("body").find(".container-fluid").width();
        var scrollAmount = $(this).data("id") * parseInt((containerWidth - 15) / 175) * 175;
        var leftMax = Math.min(-parseInt(scroller.width()) + Math.abs(scrollAmount), 0);

        leftTotal = Math.max(Math.min(leftTotal + scrollAmount, 0), leftMax);
        scroller.animate({ left: leftTotal }, 250);

        if (leftTotal == 0) {
            $("#recently-added-page-left").addClass("disabled").blur();
        } else {
            $("#recently-added-page-left").removeClass("disabled");
        }

        if (leftTotal == leftMax) {
            $("#recently-added-page-right").addClass("disabled").blur();
        } else {
            $("#recently-added-page-right").removeClass("disabled");
        }
    });
</script>

</%def>