New qute:history page.

qutebrowser/browser/qutescheme.py

@@ -24,12 +24,12 @@
     _HANDLERS: The handlers registered via decorators.
 """
 
+import json
 import sys
 import time
-import datetime
 import urllib.parse
 
-from PyQt5.QtCore import QUrlQuery
+from PyQt5.QtCore import QUrl, QUrlQuery
 
 import qutebrowser
 from qutebrowser.utils import (version, utils, jinja, log, message, docutils,
@@ -165,83 +165,77 @@ def qute_bookmarks(_url):
 
 @add_handler('history')  # noqa
 def qute_history(url):
-    """Handler for qute:history. Display history."""
-    # Get current date from query parameter, if not given choose today.
-    curr_date = datetime.date.today()
-    try:
-        query_date = QUrlQuery(url).queryItemValue("date")
-        if query_date:
-            curr_date = datetime.datetime.strptime(query_date, "%Y-%m-%d")
-            curr_date = curr_date.date()
-    except ValueError:
-        log.misc.debug("Invalid date passed to qute:history: " + query_date)
-
-    one_day = datetime.timedelta(days=1)
-    next_date = curr_date + one_day
-    prev_date = curr_date - one_day
-
-    def history_iter(reverse):
-        """Iterate through the history and get items we're interested in."""
-        curr_timestamp = time.mktime(curr_date.timetuple())
+    """Handler for qute:history. Display and serve history."""
+    def history_iter(start_time, reverse=False):
+        """Iterate through the history and get items we're interested.
+
+        Keyword arguments:
+        reverse -- whether to reverse the history_dict before iterating.
+        start_time -- select history starting from this timestamp.
+        """
         history = objreg.get('web-history').history_dict.values()
         if reverse:
             history = reversed(history)
 
-        for item in history:
-            # If we can't apply the reverse performance trick below,
-            # at least continue as early as possible with old items.
-            # This gets us down from 550ms to 123ms with 500k old items on my
-            # machine.
-            if item.atime < curr_timestamp and not reverse:
-                continue
-
-            # Convert timestamp
-            try:
-                item_atime = datetime.datetime.fromtimestamp(item.atime)
-            except (ValueError, OSError, OverflowError):
-                log.misc.debug("Invalid timestamp {}.".format(item.atime))
-                continue
-
-            if reverse and item_atime.date() < curr_date:
-                # If we could reverse the history in-place, and this entry is
-                # older than today, only older entries will follow, so we can
-                # abort here.
-                return
+        end_time = start_time - 86400.0  # end is 24hrs earlier than start
 
-            # Skip items not on curr_date
+        for item in history:
+            # Abort/continue as early as possible
+            item_newer = item.atime > start_time
+            item_older = item.atime < end_time
+            if reverse:
+                # history_dict is reversed, we are going back in history.
+                # so:
+                #     abort if item is older than start_time+24hr
+                #     skip if item is newer than start
+                if item_older:
+                    return
+                if item_newer:
+                    continue
+            else:
+                # history_dict is not reversed, we are going forward in history.
+                # so:
+                #     abort if item is newer than start_time
+                #     skip if item is older than start_time+24hrs
+                if item_older:
+                    continue
+                if item_newer:
+                    return
+
+            # Skip items not within start_time and end_time
             # Skip redirects
             # Skip qute:// links
+            is_in_window = item.atime > end_time and item.atime <= start_time
             is_internal = item.url.scheme() == 'qute'
-            is_not_today = item_atime.date() != curr_date
-            if item.redirect or is_internal or is_not_today:
+            if item.redirect or is_internal or not is_in_window:
                 continue
 
             # Use item's url as title if there's no title.
             item_url = item.url.toDisplayString()
             item_title = item.title if item.title else item_url
-            display_atime = item_atime.strftime("%X")
+            item_time = int(item.atime)
+
+            yield {"url": item_url, "title": item_title, "time": item_time}
 
-            yield (item_url, item_title, display_atime)
+    if QUrl(url).path() == '/data':
+        # Use start_time in query or current time.
+        start_time = QUrlQuery(url).queryItemValue("start_time")
+        start_time = float(start_time) if start_time else time.time()
 
-    if sys.hexversion >= 0x03050000:
-        # On Python >= 3.5 we can reverse the ordereddict in-place and thus
-        # apply an additional performance improvement in history_iter.
-        # On my machine, this gets us down from 550ms to 72us with 500k old
-        # items.
-        history = list(history_iter(reverse=True))
+        if sys.hexversion >= 0x03050000:
+            # On Python >= 3.5 we can reverse the ordereddict in-place and thus
+            # apply an additional performance improvement in history_iter.
+            # On my machine, this gets us down from 550ms to 72us with 500k old
+            # items.
+            history = list(history_iter(start_time, reverse=True))
+        else:
+            # On Python 3.4, we can't do that, so we'd need to copy the entire
+            # history to a list. There, filter first and then reverse it here.
+            history = reversed(list(history_iter(start_time, reverse=False)))
+
+        return 'text/html', json.dumps(history)
     else:
-        # On Python 3.4, we can't do that, so we'd need to copy the entire
-        # history to a list. There, filter first and then reverse it here.
-        history = reversed(list(history_iter(reverse=False)))
-
-    html = jinja.render('history.html',
-                        title='History',
-                        history=history,
-                        curr_date=curr_date,
-                        next_date=next_date,
-                        prev_date=prev_date,
-                        today=datetime.date.today())
-    return 'text/html', html
+        return 'text/html', jinja.render('history.html', title='History')
 
 
 @add_handler('pyeval')

qutebrowser/html/history.html

@@ -16,43 +16,165 @@
     white-space: nowrap;
 }
 
-.date {
-    color: #888;
-    font-size: 14pt;
-    padding-left: 25px;
+table {
+    margin-bottom: 30px;
 }
 
-.pagination-link {
-    display: inline-block;
-    margin-bottom: 10px;
-    margin-top: 10px;
-    padding-right: 10px;
+.date {
+    color: #555;
+    font-size: 12pt;
+    padding-bottom: 15px;
+    font-weight: bold;
+    text-align: left;
 }
 
-.pagination-link > a {
-    color: #333;
-    font-weight: bold;
+.session-separator {
+    color: #aaa;
+    height: 40px;
+    text-align: center;
 }
+
 {% endblock %}
 
-{% block content %}
+{% block script %}
+/**
+ * Container for global stuff
+ */
+var global = {
+    // The last history item that was seen.
+    lastItem: null,
+    // The cutoff interval for session-separator (30 minutes)
+    SESSION_CUTOFF: 30*60
+};
+
+/**
+ * Finds or creates the session table>tbody to which item with given date
+ * should be added.
+ *
+ * @param {Date} date - the date of the item being added.
+ */
+var getSessionNode = function(date) {
+    var histContainer = document.getElementById('hist-container');
+
+    // Find/create table
+    var tableId = "hist-" + date.getDate() + date.getMonth() + date.getYear();
+    var table = document.getElementById(tableId);
+    if (table === null) {
+        table = document.createElement("table");
+        table.id = tableId;
+
+        caption = document.createElement("caption");
+        caption.className = "date";
+        var options = {weekday: 'long', year: 'numeric', month: 'long', day: 'numeric'};
+        caption.innerHTML = date.toLocaleDateString('en-US', options);
+        table.appendChild(caption);
+
+        // Add table to page
+        histContainer.appendChild(table);
+    }
+
+    // Find/create tbody
+    var tbody = table.lastChild;
+    if (tbody.tagName !== "TBODY") { // this is the caption
+        tbody = document.createElement("tbody");
+        table.appendChild(tbody);
+    }
+
+    // Create session-separator and new tbody if necessary
+    if (tbody.lastChild !== null && global.lastItem !== null) {
+        lastItemDate = new Date(parseInt(global.lastItem.time)*1000);
+        var interval = (lastItemDate.getTime() - date.getTime())/1000.00;
+        if (interval > global.SESSION_CUTOFF) {
+            // Add session-separator
+            var sessionSeparator = document.createElement('td');
+            sessionSeparator.className = "session-separator";
+            sessionSeparator.colSpan = 2;
+            sessionSeparator.innerHTML = "§"
+            table.appendChild(document.createElement('tr'));
+            table.lastChild.appendChild(sessionSeparator);
 
-<h1>Browsing history <span class="date">{{curr_date.strftime("%a, %d %B %Y")}}</span></h1>
+            // Create new tbody
+            tbody = document.createElement("tbody");
+            table.appendChild(tbody);
+        }
+    }
 
-<table>
-    <tbody>
-    {% for url, title, time in history %}
-        <tr>
-            <td class="title"><a href="{{url}}">{{title}}</a></td>
-            <td class="time">{{time}}</td>
-        </tr>
-    {% endfor %}
-    </tbody>
-</table>
+    return tbody;
+}
+
+/**
+ * Given a history item, create and return <tr> for it.
+ * param {string} itemUrl - The url for this item
+ * param {string} itemTitle - The title for this item
+ * param {string} itemTime - The formatted time for this item
+ */
+var makeHistoryRow = function(itemUrl, itemTitle, itemTime) {
+    var row = document.createElement('tr');
+
+    var title = document.createElement('td');
+    title.className = "title";
+    var link = document.createElement('a');
+    link.href = itemUrl;
+    link.innerHTML = itemTitle;
+    title.appendChild(link);
+
+    var time = document.createElement('td');
+    time.className = "time";
+    time.innerHTML = itemTime;
+
+    row.appendChild(title);
+    row.appendChild(time);
+
+    return row;
+}
 
-<span class="pagination-link"><a href="qute://history/?date={{prev_date.strftime("%Y-%m-%d")}}" rel="prev">Previous</a></span>
-{% if today >= next_date %}
-<span class="pagination-link"><a href="qute://history/?date={{next_date.strftime("%Y-%m-%d")}}" rel="next">Next</a></span>
-{% endif %}
+var getJSON = function(url, callback) {
+    var xhr = new XMLHttpRequest();
+    xhr.open('GET', url, true);
+    xhr.responseType = 'json';
+    xhr.onload = function() {
+      var status = xhr.status;
+      callback(status, xhr.response);
+    };
+    xhr.send();
+};
+
+/**
+ * Load new history.
+ */
+var loadHistory = function() {
+    url = "qute://history/data";
+    if (global.lastItem !== null) {
+        startTime = parseInt(global.lastItem.time) - 1;
+        url = "qute://history/data?start_time=" + startTime.toString();
+    }
+
+    getJSON(url, function(status, history) {
+        if (history !== undefined) {
+            for (item of history) {
+                atime = new Date(parseInt(item.time)*1000);
+                var session = getSessionNode(atime);
+                var row = makeHistoryRow(item.url, item.title, atime.toLocaleTimeString());
+                session.appendChild(row)
+                global.lastItem = item;
+            }
+        }
+    });
+}
+{% endblock %}
+
+{% block content %}
+<h1>Browsing history</h1>
+<div id="hist-container"></div>
+<script>
+window.onload = function() {
+    loadHistory();
 
+    window.onscroll = function(ev) {
+        if ((window.innerHeight + window.scrollY) >= document.body.scrollHeight) {
+            loadHistory();
+        }
+    };
+};
+</script>
 {% endblock %}

tests/end2end/features/history.feature

@@ -77,7 +77,7 @@ Feature: Page history
     Scenario: Listing history
         When I open data/numbers/3.txt
         And I open data/numbers/4.txt
-        And I open qute:history
+        And I open qute://history/data
         Then the page should contain the plaintext "3.txt"
         Then the page should contain the plaintext "4.txt"