All Projects → lettier → webviewhs

lettier / webviewhs

Licence: BSD-3-Clause License
🌐 A Haskell binding to the webview library created by Serge Zaitsev.

Programming Languages

haskell
3896 projects
c
50402 projects - #5 most used programming language
Makefile
30231 projects

Projects that are alternatives of or similar to webviewhs

Google-Docs-for-Mac
Native Google Docs app for Mac
Stars: ✭ 33 (-69.72%)
Mutual labels:  webview, native, native-apps, webkit
Macdriver
Native Mac APIs for Go
Stars: ✭ 3,582 (+3186.24%)
Mutual labels:  bindings, native-apps, cocoa, webkit
Wxwidgets
wxWidgets is a free and open source cross-platform C++ framework for writing advanced GUI applications using native controls.
Stars: ✭ 3,994 (+3564.22%)
Mutual labels:  gtk, desktop, cocoa
Brisk
✨Cross-platform set of tools for building native UIs with Reason/OCaml
Stars: ✭ 518 (+375.23%)
Mutual labels:  native, desktop, cocoa
Share Api Polyfill
A polyfill for the sharing that can be used in desktop too, so your users can shere in their twitter, facebook, messenger, linkedin, sms, e-mail, print, telegram or whatsapp.
Stars: ✭ 210 (+92.66%)
Mutual labels:  native, desktop, webapp
Pywebview
Build GUI for your Python program with JavaScript, HTML, and CSS
Stars: ✭ 2,649 (+2330.28%)
Mutual labels:  gtk, cocoa, webkit
svelte-electron-boilerplate
🧬 Create a desktop app with this user-friendly Svelte boilerplate for electron
Stars: ✭ 70 (-35.78%)
Mutual labels:  desktop-app, webapp, electron-app
Bunqdesktop
The unofficial, free and open source desktop application for the bunq API
Stars: ✭ 271 (+148.62%)
Mutual labels:  desktop-app, desktop, electron-app
Lambda Lantern
🧙 ‎‎ A 3D game about functional programming patterns. Uses PureScript Native, C++, and Panda3D.
Stars: ✭ 122 (+11.93%)
Mutual labels:  desktop-app, native, bindings
ult
The Ultimate Dev Stack
Stars: ✭ 54 (-50.46%)
Mutual labels:  native, desktop, native-apps
webview
Nim bindings for https://github.com/zserge/webview
Stars: ✭ 91 (-16.51%)
Mutual labels:  webview, bindings
network-smoothie
Dead simple internet bonding. Take advantege of multiple network adapters.
Stars: ✭ 14 (-87.16%)
Mutual labels:  desktop-app, electron-app
airyx
A BSD-based OS project that aims to provide an experience like and some compatibility with macOS (formerly known as airyxOS)
Stars: ✭ 2,490 (+2184.4%)
Mutual labels:  desktop, cocoa
squoosh-desktop-app
Squoosh Desktop App is a multiplatform desktop app to compress, resize, and crop your images.
Stars: ✭ 141 (+29.36%)
Mutual labels:  desktop-app, electron-app
peasy-js-samples
Showcases business logic built with peasy-js and consumed by multiple clients
Stars: ✭ 19 (-82.57%)
Mutual labels:  spa, single-page-app
unofficial-webapp-office
Access all of your favorite Office 365 apps from Linux
Stars: ✭ 139 (+27.52%)
Mutual labels:  desktop, webapp
jquery-spa-example
Example Single Page Application build with jQuery
Stars: ✭ 27 (-75.23%)
Mutual labels:  spa, single-page-app
graderjs
💦 Turn your full-stack NodeJS application into a downloadable cross-platform binary. Also works for SPAs, or regular web-sites.
Stars: ✭ 147 (+34.86%)
Mutual labels:  desktop-app, native
stimulus todomvc
[WIP] An implementation of TodoMVC using Ruby on Rails and StimulusJS
Stars: ✭ 14 (-87.16%)
Mutual labels:  spa, single-page-app
libandroidjni
Android JNI bindings library
Stars: ✭ 66 (-39.45%)
Mutual labels:  native, bindings

webviewhs logo

What is webviewhs?

webviewhs is a Haskell binding to the webview library created by Serge Zaitsev.

According to webview:

[webview is] a tiny cross-platform webview library for C/C++/Golang to build modern cross-platform GUIs. It uses Cocoa/WebKit on macOS, gtk-webkit2 on Linux and MSHTML (IE10/11) on Windows.

For more information, see the webview README.

webviewhs allows you to create native desktop windows and dialogs—while at the same time—rich web-based UI experiences all wrapped up in the powerful, type-safe embrace of Haskell.

Coupled with PureScript for the front-end portion, you now have an end-to-end purely functional programming language solution for creating desktop apps.

Be sure to explore the provided examples.

How complete is the binding?

  • webview
  • webview_init
  • webview_loop
  • webview_eval
  • webview_inject_css
  • webview_set_title
  • webview_set_fullscreen
  • webview_set_color
  • webview_dialog
  • webview_dispatch
  • webview_terminate
  • webview_exit
  • webview_debug
  • webview_print_log

How do I install webviewhs?

In your my-project.cabal file, list webviewhs under build-depends: like so:

  build-depends:
      base >= 4.7 && < 5
    , webviewhs

If you're using stack >= 1.7.1, put the following in your stack.yaml:

extra-deps:
  - github: lettier/webviewhs
    commit: # Insert commit SHA1 here.

For older stack versions, put the following:

extra-deps:
  - git: https://github.com/lettier/webviewhs.git
    commit: # Insert commit SHA1 here.

And now the run the following.

stack install --only-dependencies

If you're using cabal, run the following:

git clone https://github.com/lettier/webviewhs.git
cd my-project
cabal sandbox init
cabal sandbox add-source ../webviewhs
cabal --require-sandbox install --only-dependencies

Depending on your cabal version, you may be able to specify the git repository and commit much like stack.

How do I use webviewhs?

If you want to open up a native desktop window that loads a web page and manages itself, do the following:

{-# LANGUAGE
    OverloadedStrings
#-}

import qualified Graphics.UI.Webviewhs as WHS

main :: IO ()
main = do
  WHS.createWindowAndBlock
    WHS.WindowParams
      { WHS.windowParamsTitle      = "Test"
      , WHS.windowParamsUri        = "https://lettier.github.io"
      , WHS.windowParamsWidth      = 800
      , WHS.windowParamsHeight     = 600
      , WHS.windowParamsResizable  = True
      , WHS.windowParamsDebuggable = True
      }

If you want more control over the native desktop window, you could do something like this:

{-# LANGUAGE
    OverloadedStrings
  , QuasiQuotes
#-}

import Control.Monad
import Control.Concurrent
import Control.Concurrent.BoundedChan as CCBC
import Data.Maybe
import Data.Text
import qualified Data.Text.Lazy as DTL
import Data.Text.Format.Heavy
import Language.Javascript.JMacro
import qualified Clay
import qualified Graphics.UI.Webviewhs as WHS

main :: IO ()
main = do
  -- Create a channel to communicate between the main thread and another thread you'll create.
  -- This isn't necessary but it's a great way to communicate between threads.
  channel <- newBoundedChan 1

  -- withWindowLoop handles the creation, iteration, and deletion of the window.
  WHS.withWindowLoop

    -- Set the window creation params.
    WHS.WindowParams
      { WHS.windowParamsTitle      = "Test"
        -- This could be a localhost URL to your single-page application (SPA).
      , WHS.windowParamsUri        = "https://lettier.github.com"
      , WHS.windowParamsWidth      = 800
      , WHS.windowParamsHeight     = 600
      , WHS.windowParamsResizable  = True
      , WHS.windowParamsDebuggable = True -- Enables the Web Inspector if using WebKit.
      }

    -- webview allows you to specify a callback function that can be
    -- called from the JavaScript side.
    -- The callback receives a single string parameter.
    -- This could be unstructured text or unparsed JSON for example.
    -- You can just print what was received for now.
    (\ _window stringFromJavaScript -> print stringFromJavaScript)

    -- This function runs before the loop.
    (WHS.WithWindowLoopSetUp    (\ _window -> print "Setting up."))

    -- This function runs after the loop.
    (WHS.WithWindowLoopTearDown (\ _window -> print "Tearing down."))

    -- If you don't need to set up and/or tear down anything, you can do this.
    -- (WHS.WithWindowLoopSetUp    (void . return . const))
    -- (WHS.WithWindowLoopTearDown (void . return . const))

    -- This function is called continuously.
    -- Return True to continue the window loop or
    -- return False to exit the loop and destroy the window.
    $ \ window -> do

      -- webviewhs provides log and log'.
      -- log uses text-format-heavy which provides a
      -- "full-featured string formatting function, similar to Python's string.format."
      -- log' takes a simple Text string.
      -- According to webview, logging will print to
      -- "stderr, MacOS Console or [Windows] DebugView."
      let string = "world" :: Text
      WHS.log "Hello {string}!" [("string" :: DTL.Text, Variable string)]

      -- webview allows you to run JS inside the window.
      -- webviewhs comes with runJavaScript and runJavaScript'.
      -- runJavaScript uses JMacro which is a
      -- "simple DSL for lightweight (untyped) programmatic generation of Javascript."
      -- runJavaScript' takes a Text string which may or may not be valid JavaScript.
      let red = "red" :: Text
      _ <- WHS.runJavaScript
        window

        -- This changes the web page background color to red.
        -- Notice that you can use Haskell values inside the JavaScript and
        -- even use Haskell like syntax.
        [jmacro|
          fun setBackgroundColor color { document.body.style.backgroundColor = color; }
          setTimeout(
            \ -> setBackgroundColor `(red)`,
            5000
          );
        |]

      -- webview allows you to inject CSS into the window.
      -- webviewhs offers injectCss and injectCss'.
      -- injectCss uses Clay "a CSS preprocessor like LESS and Sass,
      -- but implemented as an embedded domain specific language (EDSL) in Haskell."
      -- injectCss' takes a Text string which may or may not be valid CSS.
      _ <- WHS.injectCss
        window

        -- This turns all <div> text blue.
        $ Clay.div Clay.?
          Clay.color "#0000ff"

      -- Inside the window loop, create a thread.
      _ <- forkIO $ do
        WHS.log' "Hello from inside a thread."

        -- When you're not in the main window UI thread, you'll need to call
        -- dispatchToMain if you want to interact with the window.
        -- dispatchToMain will run the given function in the main UI thread.
        -- Note that dispatchToMain runs the function asynchronously with no guarantee
        -- as to when it will run.
        WHS.dispatchToMain
          window
          $ \ window' -> do
            result <-
              WHS.runJavaScript
                window'

                -- This will randomly scroll the web page up and down.
                [jmacro|
                  if (Math.random() < 0.1) {
                    setTimeout(
                      function() {
                        window.scrollTo(0, Math.random() * window.innerHeight);
                      },
                      10000
                    );
                  }
                |]

            -- runJavaScript returns True if it was successful and
            -- False if something went wrong.
            -- Here is an attempt to write the result to the channel.
            void $ CCBC.tryWriteChan channel result

      -- Exit the loop if you read False from the channel.
      -- Note that tryReadChan does not block which is
      -- important when inside the window loop.
      fromMaybe True <$> tryReadChan channel

  -- At this point,
  -- the loop has been exited,
  -- the window has been destroyed,
  -- and the program will now exit.

For more ways to use webviewhs, take a look at the examples directory.

What if I don't want clay, jmacro, and text-format-heavy?

webviewhs has a light build flag that removes the dependencies clay, jmacro, and text-format-heavy. In some cases, using the light build flag can reduce the final binary size by 77%.

Note that the light build flag removes runJavaScript, injectCss, and log from the API. You can still use runJavaScript', injectCss', and log'.

If you're using stack, you can supply the light flag in the stack.yaml file.

flags:
  webviewhs:
    light: true

You can also supply the light flag on the command line like so.

stack build --flag webviewhs:light

If you're using cabal, you'll have to supply a constraint for all configure and install commands.

# For configure.
cabal configure  --constraint="webviewhs +light"

# For install.
cabal install -j --constraint="webviewhs +light"

There's currently no way to supply the constraint in the cabal file itself, however, there is an open issue about it.

For more information about using the light version of webviewhs, take a look at the examples-light directory.

What is the license?

For the webviewhs license information, see LICENSE. For the webview license information, see deps/webview/LICENSE.

Who wrote webviewhs?

(C) 2018 David Lettier
lettier.com

Who wrote webview?

Copyright (c) 2017 Serge Zaitsev

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].