Code Monkey home page Code Monkey logo

owlet's Introduction

Owlet

Owlet is a Typed Spreadsheet UI library for ScalaJS. It is built on top of Monix and Typelevel Cats to combine predefined input fields to a reactive user interface, just like what you would done in spreadsheet. Owlet is inspired by the PureScript library Flare.

Do one thing and do it well micro birds library series

Get Started

1. add dependency in your build.sbt

Stable

Latest version

libraryDependencies += "us.oyanglul" %%% "owlet" % "<maven version>"

RC

resolvers += "jitpack" at "https://jitpack.io"
libraryDependencies += "com.github.jcouyang" % "owlet" % "<jitpact version>"

2. Now programming UI is just like using spreadsheet

import us.oyanglul.owlet._
import DOM._
val a1 = number("a1", 1)
val a2 = number("a2", 2)
val a3 = number("a3", 3)
val sum = fx[List, Double, Double](_.sum, List(a1, a2, a3))
render(a1 &> a2 &> a3 &> sum, "#app")

or Cats Friendly Badge

val a1 = number("a1", 1)
val a2 = number("a2", 2)
val a3 = number("a3", 3)
val sum = a1 |+| a2 |+| a3
renderOutput(sum, "#app")

eh... Ready for 3D spreadsheet programming?

You know spreadsheet is 2D, when we have monad, it became 3D

!!!Monad Warning!!!

val numOfItem = int("noi", 3)
val items = numOfItem
  .flatMap(
    no => (0 to no).toList.parTraverse(i => string("inner", i.toString))
  )
  • imagine that numOfItem lives in dimension (x=1, y=1, z=0)
  • then items live in dimension (x=1,y=1,z=1)

you can render either numOfItem or items seperatly, for they live in diffenrent z axis (which means render items you won't able to see numOfItem even it's flatMap from there

but you can some how connect the dots with magic &>

renderOutput(numOfItem &> items, "#output")

Anyway, just keep in mind that monad ops map ap flatMap... will lift your z axis parMap parAp parXXX instead, will keep them in the same z axis

More...

owlet's People

Contributors

cryptokoans avatar dependabot[bot] avatar gblike avatar jcouyang avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar

owlet's Issues

example for hyperlink?

Perhaps before I try to come up with a canonical example for a #5 I should try to better understand how you have envisioned the hyperlink def a[A]: Owlet[A] = ... function working? I understand that it behaves similarly to button[A] but takes as input a child : Owlet[_] and could not find a good example for how to use it? Would you mind providing an example? I think that may inform us for whether/if there is a way to tackle #5 Thanks!

display-once semantics intended?

I've noticed that an Owlet graphical component is only rendered in one location at a time. See here for example: https://scalafiddle.io/sf/QqYTclD/1
Is that the intended semantics?

I'm asking because this actually somewhat relates to our discussion in the other #5 issue. In particular, it would be very nice if two copies of the same component could be rendered and the user be guaranteed that they will "stay in sync."

In other words, let's say that there is a number val myNumber = int("mynum",1) the value of which is utilized by various other components in various other parts of the display. The way Owlet seems to currently work right now, the gui component that allows the user to change the myNumber value is only rendered one place. However, in my opinion, a preferred semantics would be to allow it to be rendered in multiple places but guarantee that the two renderings will always stay in sync.

I hope what I'm talking about is making sense?

default gui function for Either and Pair?

In a similar way that graphical checkbox can be thought of a simple presentation of an Owlet[Boolean], I've been wondering if we might be able to make a generic Owlet[Either[A,B]] perhaps called "choice" or "fork" or something? It would be a default presentation of the user essentially choosing an execution path I think?

Or, perhaps a slightly more concrete example might be a classical spreadsheet where each cell is Either[RawValue,Formula] ?

Maven central release?

Hi, I'd like to be able to release my owlet-using project to maven central (if only to be able to use the webjars CDN). Are you willing to make a release to maven central? Or I can make my own fork and release there?

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.