opal-browser 0.1.0.beta1

checksums.yaml

@@ -0,0 +1,7 @@
+---
+SHA1:
+  metadata.gz: 67a9bf1ea4b1b5b2f0b9850b39a8e7da1b464806
+  data.tar.gz: 021fa0a9e5ed6d1ab1b3d64f85d68c4860696c79
+SHA512:
+  metadata.gz: 7fc4300cbb533f11e140ea654de6bf4742bbfca85041d6f6e2bc3f69cb352c4ff20e4cc42c54ffa15320e53ae094abb502b52d023e8701581caec38e53a6dba2
+  data.tar.gz: 3d27cd50d48f61dc21a4d838d502e212ff0e25ff8cfb2e8db264b439068a14f79a4d19630ac64f173c2d48d6ac1969e45aabd75c2c29349d114672fece6fe0b2

data/.gitignore

@@ -0,0 +1,5 @@
+Gemfile.lock
+vendor
+.bundle
+copycat
+doc

data/.yardopts

@@ -0,0 +1 @@
+--no-private opal/**/*.rb

data/Gemfile

@@ -0,0 +1,11 @@
+source 'https://rubygems.org'
+gemspec
+
+gem 'rake'
+gem 'rack'
+gem 'sinatra'
+gem 'sinatra-websocket'
+
+gem 'opal', github: 'opal/opal'
+gem 'opal-rspec', '0.3.0.beta2'
+gem 'paggio', github: 'meh/paggio'

data/README.md

@@ -0,0 +1,106 @@
+Browser support for Opal
+========================
+This library aims to be a full-blown wrapper for all the browser API including
+HTML5.
+
+Features
+========
+This is a list of the currently wrapped features and some details on them.
+
+DOM
+---
+DOM support is complete as far as I know, it has a very Nokogiri feel to it
+with obvious differences where relevant (for instance, event handling).
+
+```ruby
+$document.on :load do
+  alert "yo dawg, I'm all loaded up in here"
+end
+```
+
+It also supports a markaby inspired builder DSL which generates DOM nodes
+directly instead of creating a string.
+
+```ruby
+$document.on :load do
+  DOM {
+    div.info {
+      span.red "I'm all cooked up."
+    }
+  }.append_to($document.body)
+end
+```
+
+CSSOM
+-----
+CSSOM support is still incomplete but the useful parts are implemented, this
+includes a DSL for generating a CSS style and the same DSL is also used to
+change style declarations (which can either belong to a `DOM::Element` or a
+`CSS::Rule::Style`).
+
+```ruby
+$document.body.style.apply {
+  background color: 'black'
+  color 'white'
+  font family: 'Verdana'
+}
+```
+
+AJAX & SJAX
+-----------
+The `XMLHttpRequest` API has been wrapped completely, it also optionally
+supports binary results as typed-arrays.
+
+It easily allows for synchronous and asynchronous requests.
+
+```ruby
+Browser::HTTP.get "/something.json" do
+  on :success do |res|
+    alert res.json.inspect
+  end
+end
+```
+
+WebSocket
+---------
+Websockets have been fully wrapped and they are easily configurable with
+blocks.
+
+```ruby
+Browser::Socket.new 'ws://echo.websocket.org' do
+  on :open do
+    every 1 do
+      puts "ping"
+    end
+  end
+
+  on :message do |e|
+    log "Received #{e.data}"
+  end
+end
+```
+
+EventSource
+-----------
+Event sources have been implemented and are easily configurable with blocks.
+
+History
+-------
+The HTML5 History API has been fully wrapped.
+
+Storage
+-------
+The HTML5 Storage API has been wrapped and it exports a single Storage class
+that uses the most appropriate and available API to store data locally.
+
+Cross-browser compatibility
+===========================
+Right now all features are implemented with the stable or working-drafts API
+which aren't implemented everywhere.
+
+The current approach is to have a file for each method in the `compatibility`
+directory where alternatives based on functional-presence are implemented.
+
+You can see an example for the matches selector API [here][1].
+
+[1]: https://github.com/opal/opal-browser/blob/master/opal/browser/compatibility/dom/element/matches.rb

data/Rakefile

@@ -0,0 +1,5 @@
+require 'bundler'
+Bundler.require
+
+require 'opal/rspec/rake_task'
+Opal::RSpec::RakeTask.new(:default)

data/config.ru

@@ -0,0 +1,63 @@
+require 'bundler'
+Bundler.require
+
+apps = []
+apps << Opal::Server.new { |s|
+  s.main = 'opal/rspec/sprockets_runner'
+  s.append_path 'spec'
+  s.debug = false
+}
+
+apps << Class.new(Sinatra::Base) {
+  get '/http' do
+    "lol"
+  end
+
+  post '/http' do
+    if params['lol'] == 'wut'
+      "ok"
+    else
+      "fail"
+    end
+  end
+
+  put '/http' do
+    if params['lol'] == 'wut'
+      "ok"
+    else
+      "fail"
+    end
+  end
+
+  delete '/http' do
+    "lol"
+  end
+
+  get '/events' do
+    headers 'Content-Type' => 'text/event-stream'
+
+    stream do |out|
+      sleep 0.2
+
+      out << "data: lol\n" << "\n"
+      out << "event: custom\n" << "data: omg\n" << "\n"
+      out << "data: wut\n" << "\n"
+
+      sleep 10
+    end
+  end
+
+  get '/socket' do
+    request.websocket do |ws|
+      ws.onopen do
+        ws.send 'lol'
+      end
+
+      ws.onmessage do |msg|
+        ws.send msg
+      end
+    end
+  end
+}
+
+run Rack::Cascade.new(apps)

data/lib/opal/browser.rb

@@ -0,0 +1,4 @@
+require 'opal'
+
+Opal.append_path File.expand_path('../../../opal', __FILE__)
+Opal.use_gem 'paggio'

data/opal-browser.gemspec

@@ -0,0 +1,23 @@
+$LOAD_PATH << File.expand_path('../opal', __FILE__)
+require 'browser/version'
+
+Gem::Specification.new {|s|
+  s.name         = 'opal-browser'
+  s.version      = Browser::VERSION
+  s.author       = 'meh.'
+  s.email        = 'meh@schizofreni.co'
+  s.homepage     = 'http://github.com/opal/opal-browser'
+  s.platform     = Gem::Platform::RUBY
+  s.summary      = 'Browser support for Opal.'
+
+  s.files         = `git ls-files`.split("\n")
+  s.executables   = `git ls-files -- bin/*`.split("\n").map { |f| File.basename(f) }
+  s.test_files    = `git ls-files -- {test,spec,features}/*`.split("\n")
+  s.require_paths = ['lib']
+
+  s.add_dependency 'opal', '>= 0.5.5'
+  s.add_dependency 'paggio'
+
+  s.add_development_dependency 'opal-rspec'
+  s.add_development_dependency 'rake'
+}

data/opal/browser.rb

@@ -0,0 +1,10 @@
+require 'native'
+require 'paggio'
+
+require 'browser/version'
+require 'browser/utils'
+require 'browser/compatibility'
+
+require 'browser/window'
+require 'browser/dom'
+require 'browser/css'

data/opal/browser/animation_frame.rb

@@ -0,0 +1,29 @@
+require 'browser/compatibility/animation_frame'
+
+module Browser
+
+# FIXME: drop the method_defined? checks when require order is fixed
+class AnimationFrame
+  def initialize(window, &block)
+    @window = window
+    @native = window.to_n
+    @id     = request(block)
+  end
+
+  def request
+    raise NotImplementedError, 'window requestAnimationFrame unsupported'
+  end unless method_defined? :request
+
+  def cancel
+    raise NotImplementedError, 'window cancelAnimationFrame unsupported'
+  end unless method_defined? :cancel
+end
+
+end
+
+class Proc
+  # Execute a block to update an animation before the next repaint.
+  def animation_frame
+    Browser::AnimationFrame.new($window, &self)
+  end
+end

data/opal/browser/canvas.rb

@@ -0,0 +1,277 @@
+#--
+#            DO WHAT THE FUCK YOU WANT TO PUBLIC LICENSE
+#                    Version 2, December 2004
+#
+#            DO WHAT THE FUCK YOU WANT TO PUBLIC LICENSE
+#   TERMS AND CONDITIONS FOR COPYING, DISTRIBUTION AND MODIFICATION
+#
+#  0. You just DO WHAT THE FUCK YOU WANT TO.
+#++
+
+require 'browser/canvas/style'
+require 'browser/canvas/text'
+require 'browser/canvas/data'
+require 'browser/canvas/gradient'
+
+module Browser
+
+class Canvas
+  include Native
+
+  attr_reader :element, :style, :text
+
+  def initialize(*args)
+    if DOM::Node === args.first
+      @element = args.shift
+    else
+      @element = $document.create_element('canvas')
+      @element[:width]  = args.shift
+      @element[:height] = args.shift
+    end
+
+    if @element.node_name != 'CANVAS'
+      raise ArgumentError, "the element isn't a <canvas> element"
+    end
+
+    super(`#{@element.to_n}.getContext('2d')`)
+
+    @style = Style.new(self)
+    @text  = Text.new(self)
+  end
+
+  def data(x = nil, y = nil, width = nil, height = nil)
+    x      ||= 0
+    y      ||= 0
+    width  ||= self.width
+    height ||= self.height
+
+    Data.new(self, x, y, width, height)
+  end
+
+  def pattern(image, type = :repeat)
+    `#@native.createPattern(#{Element(image).to_n}, type)`
+  end
+
+  def gradient(*args, &block)
+    Gradient.new(self, *args, &block)
+  end
+
+  def clear(x = nil, y = nil, width = nil, height = nil)
+    x      ||= 0
+    y      ||= 0
+    width  ||= self.width
+    height ||= self.height
+
+    `#@native.clearRect(x, y, width, height)`
+  end
+
+  def begin
+    `#@native.beginPath()`
+
+    self
+  end
+
+  def close
+    `#@native.closePath()`
+
+    self
+  end
+
+  def save
+    `#@native.save()`
+
+    self
+  end
+
+  def restore
+    `#@native.restore()`
+
+    self
+  end
+
+  def move_to(x, y)
+    `#@native.moveTo(x, y)`
+
+    self
+  end
+
+  alias move move_to
+
+  def line_to(x, y)
+    `#@native.lineTo(x, y)`
+
+    self
+  end
+
+  def line(x1, y1, x2, y2)
+    move_to x1, y1
+    line_to x2, y2
+  end
+
+  def rect(x, y, width, height)
+    `#@native.rect(x, y, width, height)`
+
+    self
+  end
+
+  def arc(x, y, radius, angle, clockwise = false)
+    `#@native.arc(x, y, radius, #{angle[:start]}, #{angle[:end]}, !clockwise)`
+
+    self
+  end
+
+  def quadratic_curve_to(cp1x, cp1y, x, y)
+    `#@native.quadraticCurveTo(cp1x, cp1y, x, y)`
+
+    self
+  end
+
+  def bezier_curve_to(cp1x, cp1y, cp2x, cp2y, x, y)
+    `#@native.bezierCurveTo(cp1x, cp1y, cp2x, cp2y, x, y)`
+
+    self
+  end
+
+  def curve_to(*args)
+    case args.length
+    when 4 then quadratic_curve_to(*args)
+    when 6 then bezier_curve_to(*args)
+
+    else raise ArgumentError, "don't know where to dispatch"
+    end
+
+    self
+  end
+
+  def draw_image(*args)
+    image = Element(args.shift)
+
+    if args.first.is_a?(Hash)
+      source, destination = args
+
+      `#@native.drawImage(#{image.to_n}, #{source[:x]}, #{source[:y]}, #{source[:width]}, #{source[:height]}, #{destination[:x]}, #{destination[:y]}, #{destination[:width]}, #{destination[:height]})`
+    else
+      x, y, width, height = args
+
+      `#@native.drawImage(#{image.to_n}, #{x}, #{y}, #{width || `undefined`}, #{height || `undefined`})`
+    end
+
+    self
+  end
+
+  def translate(x, y, &block)
+    if block
+      save
+
+      `#@native.translate(x, y)`
+
+      instance_eval(&block)
+
+      restore
+    else
+      `#@native.translate(x, y)`
+    end
+
+    self
+  end
+
+  def rotate(angle, &block)
+    if block
+      save
+
+      `#@native.rotate(angle)`
+
+      instance_eval(&block)
+
+      restore
+    else
+      `#@native.rotate(angle)`
+    end
+
+    self
+  end
+
+  def scale(x, y, &block)
+    if block
+      save
+
+      `#@native.scale(x, y)`
+
+      instance_eval(&block)
+
+      restore
+    else
+      `#@native.scale(x, y)`
+    end
+
+    self
+  end
+
+  def transform(m11, m12, m21, m22, dx, dy, &block)
+    if block
+      save
+
+      `#@native.transform(m11, m12, m21, m22, dx, dy)`
+
+      instance_eval(&block)
+
+      restore
+    else
+      `#@native.transform(m11, m12, m21, m22, dx, dy)`
+    end
+
+    self
+  end
+
+  def path(&block)
+    `#@native.beginPath()`
+
+    instance_eval(&block)
+
+    `#@native.closePath()`
+
+    self
+  end
+
+  def fill(&block)
+    path(&block) if block
+
+    `#@native.fill()`
+
+    self
+  end
+
+  def stroke(&block)
+    path(&block) if block
+
+    `#@native.stroke()`
+
+    self
+  end
+
+  def clip(&block)
+    path(&block) if block
+
+    `#@native.clip()`
+
+    self
+  end
+
+  def point_in_path?(x, y)
+    `#@native.isPointInPath(x, y)`
+  end
+
+  def width
+    @element[:width]
+  end
+
+  def height
+    @element[:height]
+  end
+
+  def to_data(type = undefined)
+    `#{@element.to_n}.toDataUrl(type)`
+  end
+end
+
+end