wanted to add button "back to the top" when i scroll 300px

i found this example

https://www.w3schools.com/howto/tryit.asp?filename=tryhow_js_scroll_to_top

window.onscroll = function() {scrollFunction()};

function scrollFunction() {
    if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
        document.getElementById("myBtn").style.display = "block";
    } else {
        document.getElementById("myBtn").style.display = "none";
    }
}

added that to html in <script> tag

how do i convert that Js function to cljs

and reagent

how can that be used?

i dont know how to access the window.onscroll so it is global like in that js file

maybe the question isnt right how do i do this properly in reagent ? that is maybe better one

so can anyone help?

@lexwin I added more comments to the ReactTransitionGroup github issue for reagent-project: https://github.com/reagent-project/reagent/issues/55

Yes, I see! But I'm wondering if that issue was dead too long, maybe a new one should be started.

That may very well be 🙂

@lepistane you should have access to the same js functions, look up clojurescript / js interop. You’ll probably have to dig a little and fiddle with it to get it to work. As for the “proper reagent solution”, I don’t know 🙂

http://www.spacjer.com/blog/2014/09/12/clojurescript-javascript-interop/

I also looked at the code you found but I think my conclusion was that that was only for when reagent needed to add its behaviour?

the custom-wrapper function, you mean?

in reagent-project

I can’t tell what it does 😄

I mean, it wraps function calls somehow, but why or what the wrapping does is beyond me at the moment

bbl, lunchtime 🙂

I will create a new ticket

@reefersleep https://github.com/reagent-project/reagent/issues/311

Are you Scandinavian, btw? Looks like we’re in the same time zone. (And I notice the “å” in your last name… : )

any idiomatic way to have a for return more than one element per iteration? Want two tr elements sometimes, and other times one per item in the collection. Might just be a basic clojure problem, but thought i'd ask

@stvnmllr2 you could use a vec as your return argument

(let [[one two] (returns-two foo)] ...)

but as far as the reagent requirements, you cannot pass two flat siblings and expect it to render - each node must have only 1 root

ok. figured. thx

hey all .. i’m running into a pretty outlandish bug of which I’m still not 100% sure the root cause. I suspect its a call-stack-overflow caused by the fact that reagent uses a renderqueue via requestAnimationFrame: https://github.com/reagent-project/reagent/blob/dda0cfa0ad65f40659304bccd7ae069237025809/src/reagent/impl/batching.cljs#L54-L58

if an animation frame is never granted for a long while, for example in google chrome where only the active tab gets the frame, i think this eventually leads to the flushing of a queue that exceeds memory limits

i.e. if someone tabs-away from the running reagent process, but that process continues to receive websocket updates, it will seemingly enqueue requests for the next frame until it finally blows the stack when swapping back to the tab

Hello. While this is a more general problem, I’m asking with the hope that someone here has encountered it and knows where I might be wrong. I have the following (relevant) dependencies in my project.clj [cljsjs/react-dom “16.0.0-beta.5-0”] [cljsjs/material-ui “0.19.0-0" :exclusions [cljsjs/react cljsjs/react-dom]] [reagent “0.7.0” :exclusions [cljsjs/react cljsjs/react-dom]] But in my output JS file, with advanced mode compilation, React code is included twice. What could possibly be wrong? My build config looks like this :prod {:id :prod :source-paths [“src”] :compiler {:source-map-timestamp true :main “==my-main-namespace==” :verbose false :output-to “www/js/app.js” :output-dir “www/js/app-out” :optimizations :advanced :pretty-print false :source-map “www/js/app.js.map” :cache-analysis true :externs [“externs/material-ui.js”]}}