Permalink
Browse files

Merge branch 'share-component'

  • Loading branch information...
eelco committed Jul 29, 2016
2 parents 39bf120 + fe3fe3f commit d86e1ec6900208352e8b6b5c18ba20d1da686cc6
Showing with 21 additions and 40 deletions.
  1. +21 −40 framer/Components/ShareComponent.coffee
@@ -8,7 +8,8 @@ class ShareLayer extends Layer
width: options.parent.width if options and options.parent
ignoreEvents: false
style:
fontFamily: "Roboto, Helvetica Neue, Helvetica, Arial, sans-serif"
fontFamily: "-apple-system, Roboto, Helvetica Neue, Helvetica, Arial, sans-serif"
textAlign: "left"
fontSize: "14px"
color: "#111"
lineHeight: "1"
@@ -25,7 +26,6 @@ class Button extends ShareLayer
height: 33
ignoreEvents: false
style:
fontFamily: "Roboto, Helvetica Neue, Helvetica, Arial, sans-serif"
fontWeight: "500"
webkitUserSelect: "text"
borderRadius: 3
@@ -267,7 +267,6 @@ class ShareComponent
letterSpacing: ".2px"
_enableUserSelect: (layer) ->
if !layer.html then layer.html = ""
layer._elementHTML.style["-webkit-user-select"] = "auto"
layer._elementHTML.style["cursor"] = "auto"
@@ -291,21 +290,17 @@ class ShareComponent
urlified.replace lineBreakRegex, '<br />'
@description = new Layer
ignoreEvents: false
@description = new ShareLayer
parent: @info
y: @credentials.maxY + 10
backgroundColor: null
style:
lineHeight: "1.5"
wordWrap: "break-word"
color: "#111"
@_enableUserSelect(@description)
descriptionStyle =
fontSize: "14px"
fontFamily: "Roboto"
fontFamily: "-apple-system, Roboto, Helvetica Neue, Helvetica, Arial, sans-serif"
lineHeight: "1.5"
wordWrap: "break-word"
@@ -315,18 +310,8 @@ class ShareComponent
{width: "#{@description.width}"}
)
descriptionClickRegister = (e) ->
@descriptionStartX = e.x
@descriptionStartY = e.y
descriptionClickCompare = (e) ->
if @descriptionStartX is e.x and @descriptionStartY is e.y
showFullDescription()
showFullDescription = =>
@options.truncated = false
@description.height = @descriptionSize.height
@description.html = parseDescription(@shareInfo.description)
@@ -336,15 +321,11 @@ class ShareComponent
@_updateHeight()
@_calculateAvailableSpace()
@_enableUserSelect(@description)
@description.onMouseMove =>
@description.style =
cursor: "default"
# Remove events when description is shown to make links clickable
@description.off Events.TapStart, descriptionClickRegister
@description.off Events.TapEnd, descriptionClickCompare
# Truncate if description is too long
if @shareInfo.description.length > @options.maxDescriptionLength
@options.truncated = true
@@ -361,16 +342,13 @@ class ShareComponent
@description.height = @descriptionTruncatedSize.height
@description.html = parseDescription(@options.shortDescription)
@description.once(Events.TapEnd, showFullDescription)
@_showPointer(@description)
# Selecting text also triggers a click event to counter this
# we compare the TapStart and TapEnd positions
@description.on Events.TapStart, descriptionClickRegister
@description.on Events.TapEnd, descriptionClickCompare
else
@description.height = @descriptionSize.height
@description.html = parseDescription(@shareInfo.description)
@_enableUserSelect(@description)
_renderButtons: ->
@buttons = new ShareLayer
@@ -428,22 +406,24 @@ class ShareComponent
backgroundImage: "url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAWCAYAAADTlvzyAAAABGdBTUEAALGPC/xhBQAAAr5JREFUSA2tlUloU1EUhpuhITFCAnUTR1zVgsQUF1pw4UbETUAq7tTiogUDKkiJSUjaTBvdFCliF5KVazdKigu3BYsjlEIcIOKEEgewTVoz+J2HCa8378UOuXC494z/O+e8e4+lZ4srk8kcq1arVywWyxChvI1Go8g573Q6p8Lh8IdmeOyO1uv1vZamYDN7MpnMABDB16r6A1qGLlut1gIfFOfsHhgYOK4BplKpq6APut3uS+Pj40uqsxGPzyg+M0Y6VQbYS4CHsfc3v+w5RueXl5efEuiw6qDy6XR6P5lNqXIT/hW2c4Dle3t7FzRA0N+JMYp+FE8mJydz1HyXSQCxOwe5zPSK3E+Gw9CFaDRa0AAB2a0zEtkIdS/Qo9tGGQN2Vmff8QjQfX6gQCKRmBNDrYe5XM5ZLBY/w3tNvF/g+BDdPM7zlUplGtDTJrZrxD6fzzE2NvanKbTLoVQqbaesN8k021QoewCAgMjK5bKi6syurKxI6VuAWkkR7iTgGRSPO7tvXEs1tum9tAwdDscXeuZHYdMru3Be9Xg8JX0cLUPu3lcyzOsV3TjT90V9/ySmBqgdrNbr7K2nSGRdWM/UGC1AftsFl8t1BINpvuytarhJ/p7q1wIUBY/tJzbpZVX4La4CSbT9hGsABYDsluhn/xbBJM4NqKHGaQPkPsqo+aUabpB/NDExcdfIpw0wHo+/ttlshzC+A72Bfhs5dpB9t9vtF830HechD/g+7uctnINmAfRyKvMNOknvZPoYLkNAgPbUarVreIzSz3VNBYA+0o4TVGjREOmf0MI0GMT4J7yDtzQIQBB+iH29r04d+xleq1gkEvnRCUx08rStks0Iu4ycA5DMO9n+tyoYzDJU07FYrO2CmzmvKWk2m/XTs1MAymQ4CO2AvGQgr73cUaH38LN9fX0PQqHQRn+onr9RuQfzn9jjeAAAAABJRU5ErkJggg==')"
_openIfEnoughSpace: =>
# Open or close sheet based on available space
if @availableSpace < @threshold
'close'
@_closeSheet()
else
@_openSheet()
_calculateAvailableSpace: =>
device = Framer.Device
threshold = @options.minAvailableSpaceFullScreen
availableSpace = Canvas.width
@threshold = @options.minAvailableSpaceFullScreen
@availableSpace = Canvas.width
# When device is selected, us the device's
# position to calculate available space
if device.deviceType isnt "fullscreen"
threshold = @options.minAvailableSpace
availableSpace = Screen.canvasFrame.x
# Open or close sheet beased on available space
if availableSpace < threshold
@_closeSheet()
else
@_openSheet()
@threshold = @options.minAvailableSpace
@availableSpace = Screen.canvasFrame.x
# If verticalSpace is less then sheet height, make sheet scrollable
canvasHeight = Canvas.height - 20
@@ -492,6 +472,7 @@ class ShareComponent
# When the window resizes evaluate if the sheet needs to be hidden
Canvas.onResize =>
@_calculateAvailableSpace()
@_openIfEnoughSpace()
# Show hand cursor
_showPointer: (layer) ->

0 comments on commit d86e1ec

Please sign in to comment.