Permalink
Browse files

Merge pull request #265 from koenbok/feature/customDevice

Fix local image path when using a custom device
  • Loading branch information...
koenbok committed Dec 17, 2015
2 parents b4583d4 + a33b96b commit 920106e14502da27ad85ed1527808a1eaf569b2f
@@ -3,7 +3,7 @@
"sharedPrototype" : 1,
"deviceOrientation" : 0,
"contentScale" : 1,
"deviceType" : "fullscreen",
"deviceType" : "ipad-mini-silver",
"updateDelay" : 0.3,
"deviceScale" : -1,
"delay" : 0.3
@@ -279,19 +279,22 @@ class exports.DeviceComponent extends BaseClass
if _.startsWith(name, "http://") or _.startsWith(name, "https://")
return name
# If this device is added by the user we use the name as it is
if @_deviceType not in BuiltInDevices
return name
# We want to get these image from our public resources server
resourceUrl = "//resources.framerjs.com/static/DeviceResources"
# If we're running Framer Studio and have local files, we'd like to use those
if Utils.isFramerStudio() and window.FramerStudioInfo
resourceUrl = window.FramerStudioInfo.deviceImagesUrl
# If not, we want to get these image from our public resources server
else
resourceUrl = "//resources.framerjs.com/static/DeviceResources"
resourceUrl = window.FramerStudioInfo.deviceImagesUrl
# We'd like to use jp2 if possible, or check if we don't for this specific device
if Utils.isJP2Supported() and @_device.deviceImageJP2 isnt false
if Utils.isJP2Supported() and @_device.deviceImageJP2 is true
return "#{resourceUrl}/#{name.replace(".png", ".jp2")}"
else
return "#{resourceUrl}/#{name}"
return "#{resourceUrl}/#{name}"
###########################################################################
# DEVICE ZOOM
@@ -823,5 +826,6 @@ Devices =
"applewatchedition-42-gold-sportband-white": _.clone(AppleWatch42Device)
exports.DeviceComponent.Devices = Devices
BuiltInDevices = _.keys(Devices)
View
@@ -19,5 +19,6 @@ require "./tests/ContextTest"
require "./tests/ScrollComponentTest"
require "./tests/VersionTest"
require "./tests/ColorTest"
require "./tests/DeviceComponentTest"
mocha.run()
@@ -0,0 +1,89 @@
describe "DeviceComponent", ->
it "should default to iphone 5s spacegray", ->
comp = new DeviceComponent()
comp.deviceType.should.equal "iphone-5s-spacegray"
it "should use images on server for built in devices when not in Studio", ->
comp = new DeviceComponent()
localUrl = "resources.framerjs.com/static/DeviceResources/"
imageUrl = comp._deviceImageUrl(comp._deviceImageName())
result = imageUrl.indexOf(localUrl)
result.should.not.equal -1
it "should use the deviceImage string as is for custom devices when not in Studio", ->
comp = new DeviceComponent()
DeviceComponent.Devices["test"] =
"deviceType": "phone"
"screenWidth": 720
"screenHeight": 1000
"deviceImage": "images/framer-icon.png"
"deviceImageWidth": 800
"deviceImageHeight": 1203
# Set custom device
comp.deviceType = "test"
comp.deviceType.should.equal "test"
comp._deviceImageUrl(comp._deviceImageName()).should.eql "images/framer-icon.png"
it "should use the local file url when run in Studio with built in device", ->
# stub isFramerStudio helper
_originalIsFramerStudio = Utils.isFramerStudio
Utils.isFramerStudio = ->
return true
Utils.isFramerStudio().should.be.true
# example url
localFileUrl = "file:///Users/name/Library/Developer/Xcode/DerivedData/Framer_Studio/Build/Products/Debug/Framer%20Studio.app/Contents/Resources/DeviceImages/"
window.FramerStudioInfo = new Object()
window.FramerStudioInfo.deviceImagesUrl = localFileUrl
window.FramerStudioInfo.deviceImagesUrl.should.equal(localFileUrl)
comp = new DeviceComponent()
imageUrl = comp._deviceImageUrl(comp._deviceImageName())
result = imageUrl.indexOf(localFileUrl)
result.should.not.equal -1
# reset stubs
Utils.isFramerStudio = _originalIsFramerStudio
it "should use deviceImageName when a custom device is used in Studio", ->
# stub isFramerStudio helper
_originalIsFramerStudio = Utils.isFramerStudio
Utils.isFramerStudio = ->
return true
Utils.isFramerStudio().should.be.true
comp = new DeviceComponent()
DeviceComponent.Devices["test"] =
"deviceType": "phone"
"screenWidth": 720
"screenHeight": 1000
"deviceImage": "images/framer-icon.png"
"deviceImageWidth": 800
"deviceImageHeight": 1203
# Set custom device
comp.deviceType = "test"
comp.deviceType.should.equal "test"
imageUrl = comp._deviceImageUrl(comp._deviceImageName())
imageUrl.should.equal "images/framer-icon.png"
# reset stubs
Utils.isFramerStudio = _originalIsFramerStudio

0 comments on commit 920106e

Please sign in to comment.