Fork me on GitHub
#clojurescript
<
2017-10-28
>
qqq10:10:49

<script>
 function BlockMove(event) {
  // Tell Safari not to move the window.
  event.preventDefault() ;
 }
</script>
 
<body ontouchmove="BlockMove(event);" >
  ...
</body>
how do I do the "ontouchmove = .... " part in cljs ?

qqq10:10:31

how do I get the body object from a js/window ?

thheller11:10:09

(js/document.body.addEventListener "touchmove" BlockMove)

qqq19:10:42

is (:require [goog.string]) supposed to get me goog.string/format ? -- if not, how do I get it ? [ I tried it, and it's getting undfined for me)

sundarj19:10:01

you have to require goog.string.format as well, which defines it under goog.string/format

qqq22:10:49

[:rect {:width        btn-w 
                     :height       btn-h 
                     :rx           5
                     :ry           5
                     :style        {:fill "#eef" :stroke "#888"}
                     :on-click     (fn [e]
                                     (conv/alert "click"))
                     :on-touch-end (fn [e]
                                     (conv/alert "touch end")) 
                     :on-touch-start (fn [e]
                                       (conv/alert "touch start"))
                     }]
I'm using reagent. I believe I'm running into the so called '300ms ios delay" how do I get around that ?

phronmophobic22:10:30

I thought the 300ms touch delay only applied to on-click events

phronmophobic22:10:45

do you still have the delay if you just rely on the on-touch events?

qqq22:10:34

I'm experiencing what I consider to be 300ms delay on on-touch events

phronmophobic22:10:56

which browser?

phronmophobic22:10:21

my work around in the past is to just use on-touch-start instead of on-click

phronmophobic22:10:29

but it was for a cordova ios app

phronmophobic22:10:41

and cordova web app

phronmophobic22:10:05

it’s not an ideal solution because it can mess with things like scrolling

phronmophobic22:10:14

but it worked for my use case

qqq22:10:00

@smith.adriane: I'm testing on an ipad air and an ipad pro

qqq22:10:05

mobile safari in both

phronmophobic23:10:21

i’m not sure it’s the 300ms ios delay. a few stack overflow articles and https://developer.telerik.com/featured/300-ms-click-delay-ios-8/ seem to indicate that the delay is only for onclick

phronmophobic23:10:28

which has been my experience in the past as well

qqq23:10:58

[:meta {:name "viewport" :content "user-scalable=no, width=device-width, initial-scale=1.0, maximum-scale=1.0"}]

qqq23:10:04

that appears to have solved it (in the html header)

qqq23:10:22

[ for some weird reason, on-click now appears 'more responsitve than on-touch-start' ]

phronmophobic23:10:04

a few of the articles mentioned that some newer versions of safari will auto detect situations where you might want fast clicks

qqq23:10:39

yeah, so I don't understand what the meta tag does, but right now, on-click is fast on ipad pro, ipad air, and iphone 6 ... so I'm going to consider it 'resolved' and move on 🙂

phronmophobic23:10:43

so if you’re planning on supporting older safari versions, it might worth checking now so you don’t have to redo things later

qqq23:10:48

thanks for your help / discussion

qqq23:10:44

this is what I have so far:

qqq23:10:47

[:meta {:name "apple-mobile-web-app-capable" :content "yes"}]
    [:meta {:name "viewport" :content
            "user-scalable=no, width=device-width, initial-scale=1.0, maximum-scale=1.0"}]
    [:meta {:name "apple-mobile-web-app-status-bar-style" :content "default"}] 
    [:meta {:name "viewport" :content "user-scalable=no, width=device-width"}] 
    [:meta {:name "mobile-web-app-capable" :content "yes"}]



phronmophobic23:10:52

it makes it so you can bookmark your webapp as a home screen icon and it feels like an almost native app

qqq23:10:03

I just reailzed, I have two viewports

phronmophobic23:10:28

i think you can make it even run offline

qqq23:10:10

oh, you mean maniest-cache ?

qqq23:10:40

$*@&$# under current config: mobile safari: on-click = instant, on-touch-start = delayed mobile chrome (on android): on-click = delayed, on-touch-start = instant 🙂