History

Speed up offline page by loading download statuses in a single transaction

Thibaut committed 11 years ago

Commit c2879a51 parent 4f781d74 files · +44 −25Browse files

Showing the changes to assets/javascripts (4 of 4 files). Show all

Unified · Split

4 files
  1. assets/javascripts/app/db.coffee +20 −0
  2. assets/javascripts/collections/docs.coffee +6 −0
  3. assets/javascripts/templates/pages/offline_tmpl.coffee +6 −9
  4. assets/javascripts/views/content/offline_page.coffee +12 −16
assets/javascripts/app/db.coffee+20−0
@@ -103,6 +103,26 @@ class app.DB · 102 unmodified lines
103 return103 return
104 return104 return
105 105
106 versions: (docs, fn) ->
107 @db (db) ->
108 result = {}
109
110 unless db
111 result[doc.slug] = false for doc in docs
112 fn(result)
113 return
114
115 txn = db.transaction ['docs'], 'readonly'
116 txn.oncomplete = -> fn(result)
117 store = txn.objectStore('docs')
118
119 docs.forEach (doc) ->
120 req = store.get(doc.slug)
121 req.onsuccess = -> result[doc.slug] = req.result
122 req.onerror = -> result[doc.slug] = false
123 return
124 return
125
106 load: (entry, onSuccess, onError) ->126 load: (entry, onSuccess, onError) ->
107 if @useIndexedDB and @_db isnt false127 if @useIndexedDB and @_db isnt false
108 onError = @loadWithXHR.bind(@, entry, onSuccess, onError)128 onError = @loadWithXHR.bind(@, entry, onSuccess, onError)
assets/javascripts/collections/docs.coffee+6−0
@@ -34,3 +34,9 @@ class app.collections.Docs extends app.Collection · 33 unmodified lines
34 clearCache: ->34 clearCache: ->
35 doc.clearCache() for doc in @models35 doc.clearCache() for doc in @models
36 return36 return
37
38 getDownloadStatuses: (callback) ->
39 app.db.versions @models, (statuses) ->
40 for key, value of statuses
41 statuses[key] = downloaded: !!value, version: value
42 callback(statuses)
assets/javascripts/templates/pages/offline_tmpl.coffee+6−9
@@ -1,16 +1,13 @@
1app.templates.offlinePage = ->1app.templates.offlinePage = (docs) ->
2 """ <h1 class="_lined-heading">Offline</h1>2 """ <h1 class="_lined-heading">Offline</h1>
3 <table class="_docs">3 <table class="_docs">#{docs}</table> """
4 #{app.templates.render 'offlineDoc', app.docs.all()}
5 </table> """
6 4
7app.templates.offlineDoc = (doc) ->5app.templates.offlineDoc = (doc, status) ->
8 """<tr data-slug="#{doc.slug}"></tr>"""6 html = """<tr data-slug="#{doc.slug}">"""
9 7 html += """<th class="_icon-#{doc.slug}">#{doc.name}</th>"""
10app.templates.offlineDocContent = (doc, status) ->
11 html = """<th class="_icon-#{doc.slug}">#{doc.name}</th>"""
12 html += if status.downloaded8 html += if status.downloaded
13 """<td><a data-del>Delete</a></td>"""9 """<td><a data-del>Delete</a></td>"""
14 else10 else
15 """<td><a data-dl>Download</a></td>"""11 """<td><a data-dl>Download</a></td>"""
12 html += """</tr>"""
16 html13 html
assets/javascripts/views/content/offline_page.coffee+12−16
@@ -4,32 +4,26 @@ class app.views.OfflinePage extends app.View · 3 unmodified lines
4 @events:4 @events:
5 click: 'onClick'5 click: 'onClick'
6 6
7 @elements:
8 list: '_._docs'
9
10 deactivate: ->7 deactivate: ->
11 if super8 if super
12 @empty()9 @empty()
13 return10 return
14 11
15 render: ->12 render: ->
16 @html @tmpl('offlinePage')13 app.docs.getDownloadStatuses (statuses) =>
17 @refreshElements()14 html = ''
18 app.docs.each(@renderDoc)15 html += @renderDoc(doc, statuses[doc.slug]) for doc in app.docs.all()
16 @html @tmpl('offlinePage', html)
17 return
19 return18 return
20 19
21 renderDoc: (doc) =>20 renderDoc: (doc, status) ->
22 doc.getDownloadStatus (status) =>21 app.templates.render('offlineDoc', doc, status)
23 html = app.templates.render('offlineDocContent', doc, status)
24 el = @docEl(doc)
25 el.className = ''
26 el.innerHTML = html
27 return
28 22
29 getTitle: ->23 getTitle: ->
30 'Offline'24 'Offline'
31 25
32 getDoc: (el) ->26 docByEl: (el) ->
33 el = el.parentNode until slug = el.getAttribute('data-slug')27 el = el.parentNode until slug = el.getAttribute('data-slug')
34 app.docs.findBy('slug', slug)28 app.docs.findBy('slug', slug)
35 29
@@ -48,16 +42,18 @@ class app.views.OfflinePage extends app.View · 12 unmodified lines
48 42
49 if action43 if action
50 $.stopEvent(event)44 $.stopEvent(event)
51 doc = @getDoc(event.target)45 doc = @docByEl(event.target)
52 doc[action](@onDownloadSuccess.bind(@, doc), @onDownloadError.bind(@, doc))46 doc[action](@onDownloadSuccess.bind(@, doc), @onDownloadError.bind(@, doc))
53 @docEl(doc).classList.add("#{action}ing")47 @docEl(doc).classList.add("#{action}ing")
54 return48 return
55 49
56 onDownloadSuccess: (doc) ->50 onDownloadSuccess: (doc) ->
57 @renderDoc(doc)51 doc.getDownloadStatus (status) =>
52 @docEl(doc).outerHTML = @renderDoc(doc, status)
58 return53 return
59 54
60 onDownloadError: (doc) ->55 onDownloadError: (doc) ->
61 el = @docEl(doc)56 el = @docEl(doc)
62 el.className = ''57 el.className = ''
63 el.classList.add('error')58 el.classList.add('error')
59 return