Use online logo for preloader

framer/Extras/Hints.coffee

@@ -29,7 +29,7 @@ class Hints

	showHints: ->
		context = Framer.CurrentContext
		@_context.run => _.invokeMap(context.rootLayers, "_showHint")
		@_context.run => _.invoke(context.rootLayers, "_showHint")

	destroy: ->
		@_context.destroy()

framer/Extras/Preloader.coffee

@@ -33,42 +33,7 @@ class Preloader extends BaseClass
			blocker.onTouchMove (event) ->
				event.stopPropagation()

		@context.run =>

			@cover = new Layer
				frame: @context
				backgroundColor: "white"
				opacity: 0

			@progressIndicator = new CircularProgressComponent
				size: 160
				point: Align.center
				parent: @cover

			@progressIndicator.railsColor = Color.grey(0, 0.1)
			@progressIndicator.progressColor = "rgb(75,169,248)"
			@progressIndicator.setProgress(@progress, false)

			@brand = new Layer
				width: 96
				height: 96
				point: Align.center
				parent: @cover
				backgroundColor: null

			# Set directly via style, to avoid inclusion in the preloader list
			@brand.style["background-image"] = "url('framer/images/preloader-icon.png')"

			do layout = =>
				if Utils.isMobile()
					scale = 2
				else
					screen = Framer.Device?.screen
					scale = screen?.frame.width / screen?.canvasFrame.width
				@progressIndicator.scale = scale
				@brand.scale = scale

			Canvas.onResize(layout)
		@context.run(@_setupContext)

	@define "progress",
		get: -> @_mediaLoaded.length / @_media.length or 0
@@ -84,6 +49,11 @@ class Preloader extends BaseClass
			return false if not @isLoading
			return @_mediaLoaded.length is @_media.length

	setLogo: (url) =>
		@_logo = url
		# Set directly via style, to avoid inclusion in the preloader list
		@brand.style["background-image"] = "url('#{url}')" if @brand

	addImagesFromContext: (context) ->
		_.pluck(context.layers, "image").map(@addImage)

@@ -166,6 +136,50 @@ class Preloader extends BaseClass
		console.warn("Preloader timeout, ending")
		@end()

	_setupContext: =>

		console.log "_setupContext"

		@cover = new Layer
			frame: @context
			backgroundColor: "white"
			opacity: 0

		@progressIndicator = new CircularProgressComponent
			size: 160
			point: Align.center
			parent: @cover

		@progressIndicator.railsColor = Color.grey(0, 0.1)
		@progressIndicator.progressColor = "rgb(75,169,248)"
		@progressIndicator.setProgress(@progress, false)

		@brand = new Layer
			width: 96
			height: 96
			point: Align.center
			parent: @cover
			backgroundColor: null

		if @_logo
			@setLogo(@_logo)
		else
			# Use the online logo, make sure we don't use the file:// protocol
			logoUrl = "//resources.framerjs.com/static/images/preloader/framer-logo.png"
			logoUrl = "http:" + logoUrl if _.startsWith(window.location.href, "file://")
			@setLogo(logoUrl)

		do layout = =>
			if Utils.isMobile()
				scale = 2
			else
				screen = Framer.Device?.screen
				scale = screen?.frame.width / screen?.canvasFrame.width
			@progressIndicator.scale = scale
			@brand.scale = scale

		Canvas.onResize(layout)

exports.enable = ->
	Framer.Preloader ?= new Preloader()

@@ -176,3 +190,6 @@ exports.disable = ->

exports.addImage = (url) ->
	Framer.Preloader?.addImage(url)

exports.setLogo = (url) ->
	Framer.Preloader?.setLogo(url)