Don't show page until fully loaded

This commit is contained in:
Andrew Miner
2016-04-28 22:38:04 -07:00
parent 2dbda99986
commit 636a8d061c
7 changed files with 63 additions and 14 deletions
+31 -2
View File
@@ -9,6 +9,9 @@
module.exports = class BaseModel extends Backbone.Model module.exports = class BaseModel extends Backbone.Model
@_loadingQueue = []
@_isDraining = false
constructor: (attributes={}, options={})-> constructor: (attributes={}, options={})->
options.logEvents ?= true options.logEvents ?= true
super attributes, options super attributes, options
@@ -72,8 +75,7 @@ module.exports = class BaseModel extends Backbone.Model
if @fileCache? if @fileCache?
@loading = @fileCache.loading.then => @loading = @fileCache.loading.then =>
if @fileCache.hasFile url if @fileCache.hasFile url
@onLoadSucceeded @fileCache.getFile(url), 'success', {url:url} return @_addToLoadingQueue @fileCache.getFile(url), 'success', {url:url}
return w.resolve(true)
else else
@loading = loadFromServer() @loading = loadFromServer()
else else
@@ -98,3 +100,30 @@ module.exports = class BaseModel extends Backbone.Model
toString: -> toString: ->
return "#{@constructor.name}.#{@cid}" return "#{@constructor.name}.#{@cid}"
# Private Methods ##############################################################################
_addToLoadingQueue: (text, status, xhr)->
deferred = w.defer()
BaseModel._loadingQueue.push resolve:deferred.resolve, func:(=> @onLoadSucceeded text, status, xhr)
@_drainLoadingQueue()
return deferred.promise
_drainLoadingQueue: ->
return if @_isDraining
@_isDraining = true
drainDelay = 50
drain = =>
toLoad = BaseModel._loadingQueue.shift()
if not toLoad?
@_isDraining = false
else
toLoad.func()
toLoad.resolve(true)
_.delay drain, drainDelay
_.delay drain, drainDelay
+5 -2
View File
@@ -29,8 +29,6 @@ module.exports = class Mod extends BaseModel
@_modVersions = [] @_modVersions = []
@_tutorials = [] @_tutorials = []
@once c.event.sync, => @_verifyActiveModVersion()
# Class Methods ################################################################################## # Class Methods ##################################################################################
@Version: Version = @Version: Version =
@@ -144,6 +142,9 @@ module.exports = class Mod extends BaseModel
for modVersion in @_modVersions for modVersion in @_modVersions
callback modVersion callback modVersion
getAllModVersions: ->
return @_modVersions[..]
getModVersion: (version)-> getModVersion: (version)->
return null if version is Mod.Version.None return null if version is Mod.Version.None
return @_modVersions[0] if version is Mod.Version.Latest return @_modVersions[0] if version is Mod.Version.Latest
@@ -202,6 +203,8 @@ module.exports = class Mod extends BaseModel
@_parser ?= new ModParser model:this @_parser ?= new ModParser model:this
@_parser.parse text @_parser.parse text
@_verifyActiveModVersion()
return null # prevent calling `set` return null # prevent calling `set`
url: -> url: ->
+13 -6
View File
@@ -6,9 +6,10 @@
# #
BaseModel = require '../base_model' BaseModel = require '../base_model'
SimpleInventory = require '../crafting/simple_inventory' Mod = require './mod'
ModVersionParser = require '../parsing/mod_version_parser' ModVersionParser = require '../parsing/mod_version_parser'
Recipe = require './recipe' Recipe = require './recipe'
SimpleInventory = require '../crafting/simple_inventory'
######################################################################################################################## ########################################################################################################################
@@ -165,12 +166,18 @@ module.exports = class ModPack extends BaseModel
# Private Methods ############################################################################## # Private Methods ##############################################################################
_onModVersionLoaded: (modVersion)-> _onModVersionLoaded: (modVersion)->
working = true mods = @getAllMods()
@eachMod (mod)-> return true unless mods.length > 0
mod.eachModVersion (modVersion)->
working = working and (modVersion.isUnloaded or modVersion.isLoading)
return if working for mod in mods
modVersions = mod.getAllModVersions()
return true unless modVersions.length > 0
continue if mod.activeVersion is Mod.Version.None
activeModVersion = mod.activeModVersion
return true unless activeModVersion?
return true if activeModVersion.isUnloaded
return true if activeModVersion.isLoading
@trigger c.event.change, this @trigger c.event.change, this
@trigger c.event.sync, this @trigger c.event.sync, this
+5 -1
View File
@@ -212,7 +212,11 @@ module.exports = class Recipe extends BaseModel
_computeQuantities: (pattern)-> _computeQuantities: (pattern)->
quantityMap = {} quantityMap = {}
for c in pattern.split '' index = 0
while index < pattern.length
c = pattern[index]
index += 1
continue if c is '.' continue if c is '.'
continue if c is ' ' continue if c is ' '
+1 -1
View File
@@ -21,7 +21,7 @@ html
.page .page
.view__header .view__header
.content(style="display: none") .content.hidden
.content-loading .content-loading
img(src="/images/wait.gif") img(src="/images/wait.gif")
+4 -2
View File
@@ -53,8 +53,8 @@ module.exports = class SiteController extends BaseController
if global.env isnt 'prerender' if global.env isnt 'prerender'
@modPack.once c.event.sync, => @modPack.once c.event.sync, =>
@$pageContent.css 'display', '' @$pageContent.removeClass 'hidden'
@$pageContentLoading.css 'display', 'none' @$pageContentLoading.addClass 'hidden'
loadCurrentUser: -> loadCurrentUser: ->
@client.fetchCurrentUser() @client.fetchCurrentUser()
@@ -144,6 +144,8 @@ module.exports = class SiteController extends BaseController
$pageContent = $('.page > .content') $pageContent = $('.page > .content')
$pageContent.removeClass() $pageContent.removeClass()
$pageContent.addClass 'content' $pageContent.addClass 'content'
if not @$pageContentLoading.hasClass 'hidden'
$pageContent.addClass 'hidden'
window.scrollTo 0, 0 window.scrollTo 0, 0
+4
View File
@@ -69,6 +69,10 @@
} }
} }
.hidden {
display: none !important;
}
.page > .content { .page > .content {
min-height: $size-skyscraper-height; min-height: $size-skyscraper-height;
} }