summaryrefslogtreecommitdiff
path: root/frontend/app/views/tile/handles
diff options
context:
space:
mode:
Diffstat (limited to 'frontend/app/views/tile/handles')
-rw-r--r--frontend/app/views/tile/handles/tile.gradient.js15
-rw-r--r--frontend/app/views/tile/handles/tile.image.js15
-rw-r--r--frontend/app/views/tile/handles/tile.link.js15
-rw-r--r--frontend/app/views/tile/handles/tile.script.js2
-rw-r--r--frontend/app/views/tile/handles/tile.text.js22
-rw-r--r--frontend/app/views/tile/handles/tile.video.js25
6 files changed, 57 insertions, 37 deletions
diff --git a/frontend/app/views/tile/handles/tile.gradient.js b/frontend/app/views/tile/handles/tile.gradient.js
index 0b20ace..8d7091f 100644
--- a/frontend/app/views/tile/handles/tile.gradient.js
+++ b/frontend/app/views/tile/handles/tile.gradient.js
@@ -1,7 +1,7 @@
import React from 'react'
-import { generateTransform, unitsDimension, hexToRgb } from 'app/views/tile/tile.utils'
+import { generateTransform, unitsDimension, hexToRgb, pickCursor } from 'app/views/tile/tile.utils'
-export default function TileGradient({ tile, box, bounds, videoBounds, viewing, onMouseDown, onDoubleClick, onMouseEnter }) {
+export default function TileGradient({ tile, box, bounds, cursors, videoBounds, viewing, onMouseDown, onDoubleClick, onMouseEnter }) {
// console.log(tile)
const style = {
transform: generateTransform(tile, box, bounds, videoBounds),
@@ -9,10 +9,13 @@ export default function TileGradient({ tile, box, bounds, videoBounds, viewing,
}
// console.log(generateTransform(tile))
let className = ['tile', tile.type].join(' ')
- if (tile.target_page_id || (viewing && tile.href)) {
- if (viewing || tile.settings.cursor !== 'unclickable') {
- className += ' ' + (tile.settings.cursor || 'hand_up')
- }
+
+ let [cursorClass, cursorStyle] = pickCursor(tile, cursors, viewing)
+ if (cursorClass) {
+ className += " " + cursorClass
+ }
+ if (cursorStyle) {
+ style.cursor = cursorStyle
}
className += ' ' + tile.settings.align
diff --git a/frontend/app/views/tile/handles/tile.image.js b/frontend/app/views/tile/handles/tile.image.js
index c4d5e58..78b492e 100644
--- a/frontend/app/views/tile/handles/tile.image.js
+++ b/frontend/app/views/tile/handles/tile.image.js
@@ -1,7 +1,7 @@
import React from 'react'
-import { generateTransform } from 'app/views/tile/tile.utils'
+import { generateTransform, pickCursor } from 'app/views/tile/tile.utils'
-export default function TileImage({ tile, box, bounds, videoBounds, viewing, onMouseDown, onDoubleClick, onMouseEnter }) {
+export default function TileImage({ tile, box, bounds, cursors, videoBounds, viewing, onMouseDown, onDoubleClick, onMouseEnter }) {
// console.log(tile)
const style = {
transform: generateTransform(tile, box, bounds, videoBounds),
@@ -10,10 +10,13 @@ export default function TileImage({ tile, box, bounds, videoBounds, viewing, onM
// console.log(generateTransform(tile))
let content
let className = ['tile', tile.type].join(' ')
- if (tile.target_page_id || (viewing && tile.href)) {
- if (viewing || tile.settings.cursor !== 'unclickable') {
- className += ' ' + (tile.settings.cursor || 'hand_up')
- }
+
+ let [cursorClass, cursorStyle] = pickCursor(tile, cursors, viewing)
+ if (cursorClass) {
+ className += " " + cursorClass
+ }
+ if (cursorStyle) {
+ style.cursor = cursorStyle
}
if (!tile.settings.url) {
diff --git a/frontend/app/views/tile/handles/tile.link.js b/frontend/app/views/tile/handles/tile.link.js
index 8ddc3ea..2d0e368 100644
--- a/frontend/app/views/tile/handles/tile.link.js
+++ b/frontend/app/views/tile/handles/tile.link.js
@@ -1,7 +1,7 @@
import React from 'react'
-import { generateTransform, unitsDimension } from 'app/views/tile/tile.utils'
+import { generateTransform, unitsDimension, pickCursor } from 'app/views/tile/tile.utils'
-export default function TileLink({ tile, box, bounds, videoBounds, viewing, onMouseDown, onDoubleClick, onMouseEnter }) {
+export default function TileLink({ tile, box, bounds, videoBounds, cursors, viewing, onMouseDown, onDoubleClick, onMouseEnter }) {
// console.log(tile)
const style = {
transform: generateTransform(tile, box, bounds, videoBounds),
@@ -9,10 +9,13 @@ export default function TileLink({ tile, box, bounds, videoBounds, viewing, onMo
}
// console.log(generateTransform(tile))
let className = ['tile', tile.type].join(' ')
- if (tile.target_page_id || (viewing && tile.href)) {
- if (viewing || tile.settings.cursor !== 'unclickable') {
- className += ' ' + (tile.settings.cursor || 'hand_up')
- }
+
+ let [cursorClass, cursorStyle] = pickCursor(tile, cursors, viewing)
+ if (cursorClass) {
+ className += " " + cursorClass
+ }
+ if (cursorStyle) {
+ style.cursor = cursorStyle
}
let content = ""
diff --git a/frontend/app/views/tile/handles/tile.script.js b/frontend/app/views/tile/handles/tile.script.js
index e844adf..44a525b 100644
--- a/frontend/app/views/tile/handles/tile.script.js
+++ b/frontend/app/views/tile/handles/tile.script.js
@@ -10,7 +10,7 @@ export default class TileScript extends Component {
}
render() {
if (viewing) {
- return <div style={{ display: 'none' }} />
+ return null
}
const { tile, box, bounds, videoBounds, viewing, onMouseDown, onDoubleClick } = this.props
diff --git a/frontend/app/views/tile/handles/tile.text.js b/frontend/app/views/tile/handles/tile.text.js
index 6ef8734..cfd4b30 100644
--- a/frontend/app/views/tile/handles/tile.text.js
+++ b/frontend/app/views/tile/handles/tile.text.js
@@ -1,8 +1,12 @@
import React from 'react'
-import { generateTransform, unitsDimension, hexToRgb } from 'app/views/tile/tile.utils'
+import { generateTransform, unitsDimension, hexToRgb, pickCursor } from 'app/views/tile/tile.utils'
import Marquee from "react-fast-marquee"
-export default function TileScript({ tile, box, bounds, videoBounds, viewing, onMouseDown, onDoubleClick, onMouseEnter }) {
+export default function TileText({ tile, box, bounds, videoBounds, cursors, viewing, onMouseDown, onDoubleClick, onMouseEnter }) {
+ if (!tile.settings.content) {
+ return null
+ }
+
// console.log(tile)
const style = {
transform: generateTransform(tile, box, bounds, videoBounds),
@@ -10,15 +14,15 @@ export default function TileScript({ tile, box, bounds, videoBounds, viewing, on
}
// console.log(generateTransform(tile))
let className = ['tile', tile.type].join(' ')
- if (tile.target_page_id || (viewing && tile.href)) {
- if (viewing || tile.settings.cursor !== 'unclickable') {
- className += ' ' + (tile.settings.cursor || 'hand_up')
- }
- }
- if (!tile.settings.content) {
- return null
+ let [cursorClass, cursorStyle] = pickCursor(tile, cursors, viewing)
+ if (cursorClass) {
+ className += " " + cursorClass
}
+ if (cursorStyle) {
+ style.cursor = cursorStyle
+ }
+
let content = <span dangerouslySetInnerHTML={{ __html: tile.settings.content }} />
className += ' ' + tile.settings.align
diff --git a/frontend/app/views/tile/handles/tile.video.js b/frontend/app/views/tile/handles/tile.video.js
index e8dbc72..dbcc856 100644
--- a/frontend/app/views/tile/handles/tile.video.js
+++ b/frontend/app/views/tile/handles/tile.video.js
@@ -1,6 +1,6 @@
import React, { Component } from 'react'
-import { generateTransform, generateVideoStyle } from 'app/views/tile/tile.utils'
+import { generateTransform, generateVideoStyle, pickCursor } from 'app/views/tile/tile.utils'
import { timestampToSeconds } from 'app/utils'
export default class TileVideo extends Component {
@@ -65,22 +65,29 @@ export default class TileVideo extends Component {
}
render() {
- let { tile, box, bounds, videoBounds, viewing, onMouseDown, onDoubleClick, onMouseEnter } = this.props
+ let { tile, box, bounds, videoBounds, cursors, viewing, onMouseDown, onDoubleClick, onMouseEnter } = this.props
+
+ if (!tile.settings.url) {
+ return null
+ }
+
// console.log(tile)
const style = {
transform: generateTransform(tile, box, bounds, videoBounds),
opacity: tile.settings.opacity,
}
+
let className = ['tile', tile.type].join(' ')
- if (tile.target_page_id || (viewing && tile.href)) {
- if (viewing || tile.settings.cursor !== 'unclickable') {
- className += ' ' + (tile.settings.cursor || 'hand_up')
- }
+
+ let [cursorClass, cursorStyle] = pickCursor(tile, cursors, viewing)
+ if (cursorClass) {
+ className += " " + cursorClass
}
- // console.log(tile.settings)
- if (!tile.settings.url) {
- return null
+ if (cursorStyle) {
+ style.cursor = cursorStyle
}
+
+ // console.log(tile.settings)
className += ' ' + tile.settings.align
const muted = viewing
? tile.settings.muted