opal-browser 0.1.0.beta1 → 0.3.1

data/opal/browser/storage.rb

@@ -1,19 +1,24 @@
-#--
-#            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 'json'
 require 'stringio'
 
 module Browser
 
-class Storage < Hash
+# A {Storage} allows you to store data across page loads and browser
+# restarts.
+#
+# Compatibility
+# -------------
+# The compatibility layer will try various implementations in the following
+# order.
+#
+# + [window.localStorage](https://developer.mozilla.org/en-US/docs/Web/Guide/API/DOM/Storage#localStorage)
+# + [window.globalStorage](https://developer.mozilla.org/en-US/docs/Web/Guide/API/DOM/Storage#globalStorage)
+# + [document.body.addBehavior](http://msdn.microsoft.com/en-us/library/ms531424(VS.85).aspx)
+# + [document.cookie](https://developer.mozilla.org/en-US/docs/Web/API/document.cookie)
+#
+# @see https://developer.mozilla.org/en-US/docs/Web/Guide/API/DOM/Storage
+# @todo remove method_defined? checks when require order is fixed
+class Storage
   def self.json_create(data)
     data.delete(JSON.create_id)
 
@@ -22,101 +27,181 @@ class Storage < Hash
     }]
   end
 
+  # @!attribute [r] name
+  # @return [String] the name of the storage
   attr_reader :name
 
+  # Create a new storage on the given window with the given name.
+  #
+  # @param window [native] the window to save the storage to
+  # @param name [String] the name to use to discern different storages
   def initialize(window, name)
     super()
 
     @window = window
     @name   = name
+    @data   = {}
 
     autosave!
+    reload
+  end
+
+  # Check if autosaving is enabled.
+  #
+  # When autosaving is enabled the {Storage} is saved every time a change is
+  # made, otherwise you'll have to save it manually yourself.
+  def autosave?
+    @autosave
+  end
 
-    init if respond_to? :init
+  # Enable autosaving.
+  def autosave!
+    @autosave = true
   end
 
-  def encoded_name
-    "$opal.storage.#{@name}"
+  # Disable autosaving.
+  def no_autosave!
+    @autosave = false
   end
 
-  def autosave?;    @autosave;         end
-  def autosave!;    @autosave = true;  end
-  def no_autosave!; @autosave = false; end
+  include Enumerable
 
-  def replace(what)
-    if what.is_a?(String)
-      super JSON.parse(what)
+  # Iterate over the (key, value) pairs in the storage.
+  #
+  # @yield [key, value]
+  def each(&block)
+    return enum_for :each unless block
+
+    @data.each(&block)
+
+    self
+  end
+
+  def method_missing(*args, &block)
+    @data.__send__(*args, &block)
+  end
+
+  # Set a value in the storage.
+  def []=(key, value)
+    @data[key] = value
+
+    save if autosave?
+  end
+
+  # Delete a value from the storage.
+  def delete(key)
+    @data.delete(key).tap {
+      save if autosave?
+    }
+  end
+
+  # Clear the storage.
+  def clear
+    @data.clear.tap {
+      save if autosave?
+    }
+  end
+
+  # Replace the current storage with the given one.
+  #
+  # @param new [Hash, String] if new is a {String} it will be parsed as JSON
+  def replace(new)
+    if String === new
+      @data.replace(JSON.parse(new))
     else
-      super
+      @data.replace(new)
     end
   end
 
-  %w([]= delete clear).each {|name|
-    define_method name do |*args|
-      # FIXME: remove the application when it's fixed
-      super(*args).tap {
-        save if autosave?
-      }
+  # Call the block between a [#reload] and [#save].
+  def commit(&block)
+    autosave  = @autosave
+    @autosave = false
+    result    = nil
+
+    reload
+
+    begin
+      result = block.call
+      save
+    rescue
+      reload
+      raise
+    ensure
+      @autosave = autosave
     end
-  }
 
-  def save; end
+    result
+  end
+
+  def to_h
+    @data
+  end
+
+  # @!method reload
+  #   Load the storage.
 
-  if `window.localStorage`
-    def init
-      replace `#@window.localStorage[#{encoded_name}] || '{}'`
+  # @!method save
+  #   Persist the current state to the storage.
+
+  if Browser.supports? 'Storage.local'
+    def reload
+      replace `#@window.localStorage[#@name] || '{}'`
     end
 
     def save
-      `#@window.localStorage[#{encoded_name}] = #{JSON.dump(self)}`
+      `#@window.localStorage[#@name] = #{JSON.dump(self)}`
     end
-  elsif `window.globalStorage`
-    def init
-      replace `#@window.globalStorage[#@window.location.hostname][#{encoded_name}] || '{}'`
+  elsif Browser.supports? 'Storage.global'
+    def reload
+      replace `#@window.globalStorage[#@window.location.hostname][#@name] || '{}'`
     end
 
     def save
-      `#@window.globalStorage[#@window.location.hostname][#{encoded_name}] = #{JSON.dump(self)}`
+      `#@window.globalStorage[#@window.location.hostname][#@name] = #{JSON.dump(self)}`
     end
-  elsif `document.body.addBehavior`
-    def init
+  elsif Browser.supports? 'Element.addBehavior'
+    def reload
       %x{
         #@element = #@window.document.createElement('link');
         #@element.addBehavior('#default#userData');
 
         #@window.document.getElementsByTagName('head')[0].appendChild(#@element);
 
-        #@element.load(#{encoded_name});
+        #@element.load(#@name);
       }
 
-      replace `#@element.getAttribute(#{encoded_name}) || '{}'`
+      replace `#@element.getAttribute(#@name) || '{}'`
     end
 
     def save
       %x{
-        #@element.setAttribute(#{encoded_name}, #{JSON.dump(self)});
-        #@element.save(#{encoded_name});
+        #@element.setAttribute(#@name, #{JSON.dump(self)});
+        #@element.save(#@name);
       }
     end
   else
-    def init
+    def reload
       $document.cookies.options expires: 60 * 60 * 24 * 365
 
-      replace $document.cookies[encoded_name]
+      replace $document.cookies[@name]
     end
 
     def save
-      $document.cookies[encoded_name] = self
+      $document.cookies[@name] = JSON.dump(self)
     end
   end
 
+  # Convert the storage to JSON.
+  #
+  # @return [String] the JSON representation
   def to_json
-    io = StringIO.new("{")
+    io = StringIO.new << "{"
 
     io << JSON.create_id.to_json << ":" << self.class.name.to_json << ","
 
-    each {|key, value|
-      io << key.to_json.to_json << ":" << value.to_json << ","
+    @data.each {|key, value|
+      io << key.to_json.to_s << ":" << value.to_json << ","
     }
 
     io.seek(-1, IO::SEEK_CUR)
@@ -126,21 +211,39 @@ class Storage < Hash
   end
 end
 
+# A {SessionStorage} allows you to store data across page reloads, as long as the session
+# is active.
+#
+# @see https://developer.mozilla.org/en-US/docs/Web/Guide/API/DOM/Storage#sessionStorage
 class SessionStorage < Storage
-  def init
-    replace `#@window.sessionStorage[#{encoded_name}] || '{}'`
+  def self.supported?
+    Browser.supports? 'Storage.session'
+  end
+
+  def reload
+    replace `#@window.sessionStorage[#@name] || '{}'`
   end
 
   def save
-    `#@window.sessionStorage[#{encoded_name}] = #{JSON.dump(self)}`
+    `#@window.sessionStorage[#@name] = #{JSON.dump(self)}`
   end
 end
 
 class Window
+  # Get a storage with the given name.
+  #
+  # @param name [Symbol] the name of the storage
+  #
+  # @return [Storage]
   def storage(name = :default)
     Storage.new(to_n, name)
   end
 
+  # Get a session storage with the given name.
+  #
+  # @param name [Symbol] the name of the storage
+  #
+  # @return [SessionStorage]
   def session_storage(name = :default)
     SessionStorage.new(to_n, name)
   end

data/opal/browser/support.rb

@@ -0,0 +1,299 @@
+# The engine the browser is running on.
+#
+# Keep in mind it uses the user agent to know, so it's not reliable in case of
+# spoofing.
+BROWSER_ENGINE = `/MSIE|WebKit|Presto|Gecko/.exec(navigator.userAgent)[0]`.downcase rescue :unknown
+
+module Browser
+  # @private
+  @support = `{}`
+
+  # Check if the browser supports the given feature.
+  def self.supports?(feature)
+    if defined?(`#@support[#{feature}]`)
+      return `#@support[#{feature}]`
+    end
+
+    support = case feature
+      when 'MutationObserver'
+        defined?(`window.MutationObserver`)
+
+      when 'WebSocket'
+        defined?(`window.WebSocket`)
+
+      when 'EventSource'
+        defined?(`window.EventSource`)
+
+      when 'XHR'
+        defined?(`window.XMLHttpRequest`)
+
+      when 'ActiveX'
+        defined?(`window.ActiveXObject`)
+
+      when 'WebSQL'
+        defined?(`window.openDatabase`)
+
+      when 'Query.css'
+        defined?(`document.querySelectorAll`)
+
+      when 'Query.xpath'
+        defined?(`document.evaluate`)
+
+      when 'Storage.local'
+        defined?(`window.localStorage`)
+
+      when 'Storage.global'
+        defined?(`window.globalStorage`)
+
+      when 'Storage.session'
+        defined?(`window.sessionStorage`)
+
+      when 'Immediate'
+        defined?(`window.setImmediate`)
+
+      when 'Immediate (Internet Explorer)'
+        defined?(`window.msSetImmediate`)
+
+      when 'Immediate (Firefox)'
+        defined?(`window.mozSetImmediate`)
+
+      when 'Immediate (Opera)'
+        defined?(`window.oSetImmediate`)
+
+      when 'Immediate (Chrome)', 'setImmediate (Safari)'
+        defined?(`window.webkitSetImmediate`)
+
+      when 'CSS.computed'
+        defined?(`window.getComputedStyle`)
+
+      when 'CSS.current'
+        defined?(`document.documentElement.currentStyle`)
+
+      when 'Window.send'
+        defined?(`window.postMessage`)
+
+      when 'Window.send (Asynchronous)'
+        if defined?(`window.postMessage`) && !defined?(`window.importScripts`)
+          %x{
+            var ok  = true,
+                old = window.onmessage;
+
+            window.onmessage = function() { ok = false; };
+            window.postMessage("", "*")
+            window.onmessage = old;
+
+            return ok;
+          }
+        end
+
+      when 'Window.send (Synchronous)'
+        !supports?('Window.send (Asynchronous)')
+
+      when 'Window.innerSize'
+        defined?(`window.innerHeight`)
+
+      when 'Window.outerSize'
+        defined?(`window.outerHeight`)
+
+      when 'Window.scroll'
+        defined?(`document.documentElement.scrollLeft`)
+
+      when 'Window.scrollBy'
+        defined?(`document.documentElement.scrollBy`)
+
+      when 'Window.pageOffset'
+        defined?(`window.pageXOffset`)
+
+      when 'Attr.isId'
+        %x{
+          var div = document.createElement('div');
+              div.setAttribute('id', 'xxxxxxxxxxxxx');
+
+          return typeof(div.attributes['id'].isId) !== "undefined";
+        }
+
+      when 'Element.addBehavior'
+        defined?(`document.documentElement.addBehavior`)
+
+      when 'Element.className'
+        %x{
+          var div = document.createElement("div");
+              div.setAttribute('className', 'x');
+
+          return div.className === 'x';
+        }
+
+      when 'Element.class'
+        %x{
+          var div = document.createElement("div");
+              div.setAttribute('class', 'x');
+
+          return div.className === 'x';
+        }
+
+      when 'Element.for'
+        %x{
+          var label = document.createElement("label");
+              label.setAttribute('for', 'x');
+
+          return label.htmlFor === 'x';
+        }
+
+      when 'Element.htmlFor'
+        %x{
+          var label = document.createElement("label");
+              label.setAttribute('htmlFor', 'x');
+
+          return label.htmlFor === 'x';
+        }
+
+      when 'Element.clientSize'
+        defined?(`document.documentElement.clientHeight`)
+
+      when 'Element.scroll'
+        defined?(`document.documentElement.scrollLeft`)
+
+      when 'Element.textContent'
+        defined?(`document.documentElement.textContent`)
+
+      when 'Element.innerText'
+        defined?(`document.documentElement.innerText`)
+
+      when 'Element.matches'
+        defined?(`document.documentElement.matches`)
+
+      when 'Element.matches (Internet Explorer)'
+        defined?(`document.documentElement.msMatchesSelector`)
+
+      when 'Element.matches (Firefox)'
+        defined?(`document.documentElement.mozMatchesSelector`)
+
+      when 'Element.matches (Opera)'
+        defined?(`document.documentElement.oMatchesSelector`)
+
+      when 'Element.matches (Chrome)', 'Element.matches (Safari)'
+        defined?(`document.documentElement.webkitMatchesSelector`)
+
+      when 'Element.getBoundingClientRect'
+        defined?(`document.documentElement.getBoundingClientRect`)
+
+      when 'Event.readystatechange'
+        `"onreadystatechange" in window.document.createElement("script")`
+
+      when 'Event.constructor'
+        begin
+          `new MouseEvent("click")`
+
+          true
+        rescue StandardError, JS::Error
+          false
+        end
+
+      when 'Event.create'
+        defined?(`document.createEvent`)
+
+      when 'Event.createObject'
+        defined?(`document.createEventObject`)
+
+      when 'Event.addListener'
+        defined?(`document.addEventListener`)
+
+      when 'Event.attach'
+        defined?(`document.attachEvent`)
+
+      when 'Event.removeListener'
+        defined?(`document.removeEventListener`)
+
+      when 'Event.detach'
+        defined?(`document.detachEvent`)
+
+      when 'Event.dispatch'
+        defined?(`document.dispatchEvent`)
+
+      when 'Event.fire'
+        defined?(`document.fireEvent`)
+
+      when /^Event\.([A-Z].*?)$/
+        `(#{$1} + "Event") in window`
+
+      when 'Document.view'
+        defined?(`document.defaultView`)
+
+      when 'Document.window'
+        defined?(`document.parentWindow`)
+
+      when 'History'
+        defined?(`window.history.pushState`)
+
+      when 'History.state'
+        defined?(`window.history.state`)
+
+      when 'Animation.request'
+        defined?(`window.requestAnimationFrame`)
+
+      when 'Animation.request (Internet Explorer)'
+        defined?(`window.msRequestAnimationFrame`)
+
+      when 'Animation.request (Firefox)'
+        defined?(`window.mozRequestAnimationFrame`)
+
+      when 'Animation.request (Opera)'
+        defined?(`window.oRequestAnimationFrame`)
+
+      when 'Animation.request (Chrome)', 'Animation.request (Safari)'
+        defined?(`window.webkitRequestAnimationFrame`)
+
+      when 'Animation.cancel'
+        defined?(`window.cancelAnimationFrame`)
+
+      when 'Animation.cancel (Internet Explorer)'
+        defined?(`window.msCancelAnimationFrame`)
+
+      when 'Animation.cancel (Firefox)'
+        defined?(`window.mozCancelAnimationFrame`)
+
+      when 'Animation.cancel (Opera)'
+        defined?(`window.oCancelAnimationFrame`)
+
+      when 'Animation.cancel (Chrome)', 'Animation.cancel (Safari)'
+        defined?(`window.webkitCancelAnimationFrame`)
+
+      when 'Animation.cancelRequest'
+        defined?(`window.cancelRequestAnimationFrame`)
+
+      when 'Animation.cancelRequest (Internet Explorer)'
+        defined?(`window.msCancelRequestAnimationFrame`)
+
+      when 'Animation.cancelRequest (Firefox)'
+        defined?(`window.mozCancelRequestAnimationFrame`)
+
+      when 'Animation.cancelRequest (Opera)'
+        defined?(`window.oCancelRequestAnimationFrame`)
+
+      when 'Animation.cancelRequest (Chrome)', 'Animation.cancelRequest (Safari)'
+        defined?(`window.webkitCancelRequestAnimationFrame`)
+
+      when 'Audio'
+        defined?(`window.AudioContext`)
+
+      when 'Audio (Safari)', 'Audio (Chrome)'
+        defined?(`window.webkitAudioContext`)
+      
+      when 'Custom Elements'
+        defined?(`window.customElements`)
+    end
+
+    `#@support[#{feature}] = #{support}`
+  end
+
+  # Check if the given polyfill is loaded.
+  def self.loaded?(name)
+    case name
+    when 'Sizzle'
+      defined?(`window.Sizzle`)
+
+    when 'wicked-good-xpath'
+      defined?(`window.wgxpath`)
+    end
+  end
+end