/upstream/templates/libraries/stats.tmpl
Type: /type/template
body: value: $def with (stats)

<div id="contentHead">
    $:render_template("borrow/navigation", path="/libraries/stats")
    <h1>$_("Borrow eBooks")</h1>
</div>

<script type="text/javascript">

function setup_tooltip(selector, format_message) {
    format_message = format_message || function(x, y) {
        return "(" + x + ", " + y + ")";
    };

    function showTooltip(x, y, contents) {
        \$('<div id="chartLabelA">' + contents + '</div>').css({
            position: 'absolute',
            display: 'none',
            top: y + 12,
            left: x + 12,
            padding: '2px',
            backgroundColor: '#efefef',
            color: '#454545',
            fontSize: '11px',
            webkitBoxShadow: '0 0 3px #333',
            mozBoxShadow: '0 0 3px #333',
            boxShadow: '0 0 3px #333'
        }).appendTo("body").fadeIn(200);
    };

    \$(selector).bind("plothover", function (event, pos, item) {
        \$("#x").text(pos.x);
        \$("#y").text(pos.y.toFixed(0));
        if (item) {
            \$("#chartLabelA").remove();

            var x = item.datapoint[0];
            var y = item.datapoint[1];
            var msg = format_message(x, y);

            if (x == 1) {
                    showTooltip(item.pageX, item.pageY,
                                y + " $_('loans for') " + x + " $_('day')");
                } else {
                    showTooltip(item.pageX, item.pageY,
                                y + " $_('loans for') " + x + " $_('days')");
                };
        } else {
            \$("#chartLabelA").remove();
        };
    });
}

\$(function () {
    \$.plot("#loans-per-day", [
        {
            "data": $:json_encode(stats.get_loans_per_day("bookreader")), 
            "label": "bookreader",
            bars: { "fillColor": "#fffdcd" },
            color: "#fffdcd"
        }, {
            "data": $:json_encode(stats.get_loans_per_day("pdf")), 
            "label": "pdf",
            bars: { "fillColor": "#ffa337" },
            color: "#ffa337"
        }, {
            "data": $:json_encode(stats.get_loans_per_day("epub")), 
            "label": "epub",
            bars: { "fillColor": "#748d36" },
            color: "#748d36"
        }
    ], {
        series: {
            stack: 0,
            bars: {
                show: true,
                align: "left",
                barWidth: 20 * 60 * 60 * 1000,
            },
        },
        grid: {
            hoverable: true,
            show: true,
            borderWidth: 1, 
            borderColor: "#d9d9d9"
        },
        xaxis: {
            mode: "time"
        }
    });
    
    $ lib_loans = stats.get_loans_per_library()
    $ ticks = [[i, lib] for i, (lib, count) in enumerate(lib_loans)]
    $ data = [[i, count] for i, (lib, count) in enumerate(lib_loans)]

    \$.plot("#loans-per-library", [$:json_encode(data)], {
        series: {
             bars: {
                 show: true,
                 align: "center",
                 color: "#35672e",
                 fillColor: "#35672e",
             },
             color: "#35672e"
        },
        grid: {
            hoverable: true,
            show: true,
            borderWidth: 1, 
            borderColor: "#d9d9d9"
        },
        xaxis: {
            ticks: $:json_encode(ticks)
        }
    });
    
    \$.plot("#duration", [$:json_encode(stats.get_loan_duration_frequency())], {
        series: {
             bars: {
                 show: true,
                 align: "center",
                 color: "#35672e",
                 fillColor: "#35672e",
             },
             color: "#35672e"
        },
        grid: {
            hoverable: true,
            show: true,
            borderWidth: 1, 
            borderColor: "#d9d9d9"
        },
        xaxis: {
            ticks: [7, 14]
        }
    });

    \$.plot("#loans-per-user", [$:json_encode(stats.get_loans_per_user(limit=5))], {
        series: {
             bars: {
                 show: true,
                 align: "center",
                 color: "#35672e",
                 fillColor: "#35672e",
             },
             color: "#35672e"
        },
        grid: {
            hoverable: true,
            show: true,
            borderWidth: 1, 
            borderColor: "#d9d9d9"
        }
    });
    

    \$.plot("#loans-per-book", [$:json_encode(stats.get_loans_per_book(limit=5))], {
        series: {
             bars: {
                 show: true,
                 align: "center",
                 color: "#35672e",
                 fillColor: "#35672e",
             },
             color: "#35672e"
        },
        grid: {
            hoverable: true,
            show: true,
            borderWidth: 1, 
            borderColor: "#d9d9d9"
        }
    });

});
</script>

<style type="text/css">
div.graph,div.chart{width:898px;height:180px;float:none;background-image:none;}
.chartYaxis{width:180px;top:85px;left:-85px;}
</style>

<div id="contentBody">

    <h2>Loans Per Day</h2>

    <div class="chart">
        <div id="loans-per-day" class="graph">
            <noscript>$_("You need to have JavaScript turned on to see the nifty chart!")</noscript>
        </div>
    </div>
    
    <h2>Loans Per Library</h2>

    <div class="chart">
        <div id="loans-per-library" class="graph">
            <noscript>$_("You need to have JavaScript turned on to see the nifty chart!")</noscript>
        </div>
    </div>

    <h2>Average Time a Book is Checked Out</h2>
    <div class="chart">
        <div id="duration" class="graph">
            <noscript>$_("You need to have JavaScript turned on to see the nifty chart!")</noscript>
        </div>
        <div class="chartYaxis" style="width:180px;">$_("This Many Books")</div>
        <div class="chartXaxis">$_("Were Borrowed for This Many Days")</div>
    </div>

    <p class="smaller grey sansserif">
        $ summary = stats.get_summary()
        $ total = summary['total_loans']
        $ onehour = summary['one_hour_loans']
        $ expired = summary['expired_loans']
        $ percent = lambda v: sprintf("%.2f%%", (100.0 * v)/total)

        Total Loans: $total
        <br/>
        Loans returned in less than one hour: $onehour ($percent(onehour))
        <br/>
        Expired Loans: $expired ($percent(expired))
        <br/>
    </p>

<!-- Hiding this graph for now -->
<!--
    <h2>Average Loan Duration</h2>
    <div class="chart">
        <div id="avg-duration" class="graph">
            <noscript>$_("You need to have JavaScript turned on to see the nifty chart!")</noscript>
        </div>
    </div>
-->

    <h2>Average Loans per Person</h2>
    <div class="chart">
        <div id="loans-per-user" class="graph">
            <noscript>$_("You need to have JavaScript turned on to see the nifty chart!")</noscript>
        </div>
        <div class="chartYaxis" style="width:180px;">$_("This Many People")</div>
        <div class="chartXaxis">$_("Borrowed This Many Books")</div>
    </div>
    
    <br/>

    <h2>Distribution of How Many Times a Book is Borrowed</h2>
    <div class="chart">
        <div id="loans-per-book" class="graph">
            <noscript>$_("You need to have JavaScript turned on to see the nifty chart!")</noscript>
        </div>
        <div class="chartYaxis" style="width:180px;">$_("This Many Books")</div>
        <div class="chartXaxis">$_("Were Borrowed This Many Times")</div>
    </div>

    <br/>

    <h2>Popular Books</h2>
    $def render_authors(book):
        $ work = book.works and book.works[0]
        $ authors = work and [a.author for a in work.authors if "author" in a]
        $if not authors:
            <em>Unknown authors</em>
        $else:
            $for a in authors:
                <a href="$a.url()" class="results">$a.name</a>$cond(loop.last, "", ", ")

    $def render_book(book, count):
        $ cover = book.get_cover()
        $ cover_url = cover and cover.url("M") or "/images/icons/avatar_book-sm.png"
        <span class="image">
            <a href="$book.url()"><img src="$cover_url" height="70"/></a>
        </span>
        <span class="details">
            <span class="resultTitle">
                <h3><a href="$book.url()" class="results">$book.title</a></h3>
                <span class="small">by $:render_authors(book)</span>
                <span class="meta">
                    $ msg = ungettext("Borrowed once", "Borrowed %(count)s times", count)
                    $sprintf(msg, count=count)
                </span>
            </span>
        </span>

    <ul id="listResults" class="narrow">
        $for book, count in stats.get_popular_books():
            <li>
                $:render_book(book, count)
            </li>
</div>
plugin: openlibrary
title: /libraries/stats template
m: edit