Fork me on GitHub
#clojurescript
<
2015-06-11
>
dnolen02:06:55

@jeff.terrell: well that's mostly Closure, I just make sure the code we generate doesn't get in the way

robert-stuttaford05:06:09

@ericnormand: clojurewest 2013 (where i met you) was 27 hours 😉

jonpither09:06:49

Looking for a good pattern of doing a paginated table using Om..

a.espolov09:06:12

@jonpither: It does not exist(

a.espolov09:06:52

There are of course basic stuff. for example, paginator

a.espolov09:06:38

@jonpither: you need to change the number of items to display on a single page?

ul09:06:19

@jonpither: may be http://facebook.github.io/fixed-data-table/ will fit your needs, tail-loading could be easily implemented for it instead of pagination

jonpither09:06:21

I guess it shouldn't be hard to build. Just have the meta table about the table in application state (no of pages, total number etc), what page you're on

jonpither09:06:04

@ul interesting. Any pointers for how to use this from clojurescript/om?

hmadelaine09:06:29

@jonpither: Hi am about to share an Om table component that I use in my projects. It has sort and pagination included

jonpither09:06:03

I'd be very happy to give it a run

malcolmsparks09:06:54

I think such a component would require support in the REST API it was talking to

malcolmsparks09:06:10

i.e. via query parameters, or even resource ranges

hmadelaine09:06:43

@jonpither: Ok, I will try to share it this afternoon. You can build it in a couple of hours.

jonpither09:06:20

@ul: that is very cool. I didn't realise you can mix in react components so easily: https://github.com/ul/fixed-data-table-demo/blob/master/src/fixed_data_table_demo/core.cljs

agile_geek10:06:10

@malcolmsparks: agreed. Similar components in other languages take this pagination params in request approach.

malcolmsparks10:06:41

I want to build in pagination support into yada at some point, this stuff should be easier than it is right now, and it's the sort of thing you should be able to do decoratively rather than imperatively.

malcolmsparks10:06:08

s/decoratively/declaratively

malcolmsparks10:06:46

spell checker fail, yet 'decoratively' could be a thing too simple_smile

agile_geek10:06:38

@malcolmsparks: I’d be interested in seeing that. I haven’t had any time to look at yada yet. Day job gets in the way!

malcolmsparks10:06:57

yada is still coming (like winter in #got), it's still alpha but a few brave people are trying it and giving useful feedback, but since this is a clojurescript channel i'll shut up now

dmich10:06:53

@malcolmsparks: Nice thing about slack is you can edit your old messages 😜

jonpither11:06:34

@ul: I notice in your fixed-data-table the width is set to 100, Ideally it'd be great to specify the width as 100%, but I can't get this to work

jonpither11:06:39

then the table is responsive..

ul11:06:13

fixed-data-table accept only pixels

jonpither11:06:35

What's really annoying is how does one view the source code for these examples? https://facebook.github.io/fixed-data-table/example-flexgrow.html

ul11:06:50

wait a minute i will create a gist with adapted

jonpither11:06:29

@ul do you know where source code to the facebook examples are, i.e. how do they configure the tables to exhibit properties sort as sorting

ul11:06:08

Ouch, sorry.

ul11:06:30

This is responsive fixed data table.

jonpither11:06:52

do you need the debounce stuff? Or is it enough to plug in file-responsive-fixed-data-table-js?

ul11:06:24

it uses debounce, but you can remove it from source

malcolmsparks11:06:48

@dmich: thanks for that tip. If I edit that message, should you delete your advice? simple_smile

agile_geek11:06:36

@malcolmsparks: transient message dependencies?

ul11:06:01

how to disable that madness

rohit11:06:20

@ul, here is a your code adapted for reagent: https://gist.github.com/ducky427/10551a3346695db6a5f0. TL;DR - Facebook’s Fixed data table in Reagent

jonpither11:06:25

I'm kinda new to this, but for ease of use and for others, would it make sense to get https://www.npmjs.com/package/responsive-fixed-data-table onto http://cljsjs.github.io/?

jonpither11:06:38

^ Not sure how one would go about is

rohit11:06:45

Using reagent’s adapt-react-class gives you something which feels slightly more idomatic

ul11:06:06

yes it makes sense; it is in my TODO but will be totally happy if somebody will do it earlier

ul11:06:44

low priority task, not sure that i will take it soon

ul11:06:56

but having it in cljsjs would be nice

jonpither11:06:54

This is already kind of responsive, although there's no documentation on the actual configuration of that example

ul11:06:23

simply store column width somewhere and update on :onColumnResizeEndCallback

ul11:06:46

the gotcha is to set :isColumnResizing to false in that callback

hmadelaine13:06:47

@jonpither: I have extracted my table component, it is very simple but useful: https://github.com/hiram-madelaine/om-table

jonpither13:06:41

Looks very cool

jonpither13:06:31

It just occured to me (I'm not a UI guy) that these days pagination is somewhat old fashioned, i.e. you should be able to rapidly scroll data in a table

jonpither13:06:59

A lazy sequence ought to be a good fit for this, i.e. realising the sequence results in ajax requests for more data..

jonpither13:06:39

are people using this approach? I.e. feed a lazy smart sequence into an existing table component

jrychter13:06:00

Given that I've just implemented a table for https://partsbox.io/ I'll pitch in — I went with showing about 30 rows (will adapt automatically to screen size later on) and having a "show more" button at the end. That way there is no pagination, which I think is better. All global ops such as search and select still work on complete data set, not just what is visible on the screen.

jrychter13:06:02

As for lazy sequences, kind-of. Laziness doesn't buy all that much if your tables are complex and have selectable rows. You might still have to deal with things that are off-screen but selected.

mccraigmccraig14:06:32

fwiw here's a sorted / paginated table i'm using : it's not very generic and is quite dependent on the api used to fetch data, but it's pretty easy to grok : https://github.com/trampoline/clustermap-components/blob/master/src/clustermap/components/table.cljs

mfikes14:06:24

If you often reconnect using the browser REPL, you may find this interesting: http://blog.fikesfarm.com/posts/2015-06-10-analyze-path-ftw.html

dnolen14:06:59

@mfikes: that feature needs more exposure

dnolen14:06:39

more low hanging fruit for the aspiring ClojureScript compiler hacker simple_smile

jeluard14:06:26

According to http://danielcompton.net/2015/06/10/clojure-reader-conditionals-by-example you can define several (:require ..) per ns form. This helps reducing duplication when using reader conditionals. It looks like this does not work with the ClojureScript compiler. Is that something that could be relaxed or a hack that should not work in the first place?

dnolen14:06:08

@jeluard: there are no examples there with multiple :requires. And no we’re not going to change that.

dnolen14:06:56

the ClojureScript ns form is unlikely to see any changes anytime soon.

dnolen14:06:24

the only enhancement currently on the table for consideration is macro inference for :refer.

jeluard14:06:31

It allows to do something like (from the blog):

(ns poc.cml.sem
  (#?(:clj :require :cljs :require-macros)
    [poc.cml.macros :refer [go sync!]])
  (:require
    [poc.cml :refer [choose wrap]]
    [poc.cml.util :refer [chan on put!]]))
This is a particular case as ClojureScript has a specific require-macros syntax.

jeluard14:06:06

I guess it's safer not to rely on this Clojure particularity in cljc files.

dnolen14:06:52

Clojure ns is incredibly permissive and we cannot desugar to runtime code as Clojure can.

dnolen14:06:11

every feature adds an incredible amount of complexity.

dnolen14:06:40

last time I checked the ns form in ClojureScript is the most complicated bit in the compiler.

jeluard15:06:06

Makes sense!

alandipert15:06:47

i just published http://adzerk.com/blog/2015/06/splint-functional-first-aid-jquery/, a guide to using ClojureScript via splint.js in legacy jQuery apps

dnolen15:06:08

@alandipert: nice twist on Mori simple_smile cool stuff.

jonpither17:06:53

Hi, anyone using js libs via webjars and providing them via externs?

jonpither19:06:50

it's got unquoted HTML in there

jonpither19:06:04

Ah I bet I have to run it through the NPM install process

jonpither19:06:17

there's some funkiness going on I'm missing

nullptr20:06:01

mfikes: oh, yeah, bald guy in black t-shirt sitting in the back — he’s at all of these conferences

mystery20:06:57

David's everywhere.

jonas20:06:11

@jonpither it's a jsx file

erichmond20:06:40

I’m dying to see this talk!

nullptr20:06:47

somebody should put it on periscope

martintrojer20:06:00

dnolen: interesting way to do ‘eval' in cljs simple_smile

borkdude21:06:59

oops, I saw it was already mentioned, sorry

borkdude21:06:47

@dnolen: about the analyze-path(s): why is that a different thing from source-paths?

dnolen21:06:18

@borkdude: :source-paths isn’t a thing, that’s a cljsbuild-ism

borkdude21:06:27

@dnolen: I'm sorry about that then simple_smile

danielcompton22:06:25

@jeluard: I’ve updated the post to make it clear that cljs can only have one :require. Thanks!

alwaysbcoding23:06:51

what does upstream-deps mean with reference to clojurescript? Getting some weird errors and that term keeps popping up, not sure what it means

dnolen23:06:49

@alwaysbcoding: need more information - like the actual error you are seeing

alwaysbcoding23:06:36

It's not in the actual error message, but it's in a lot of github comment threads about similar errors, was just curious what upstream-deps meant, I had never heard the term before.