dare 0.1.0 → 0.2.0

checksums.yaml

@@ -1,15 +1,15 @@
 ---
 !binary "U0hBMQ==":
   metadata.gz: !binary |-
-    OWY5MzQ5MzBmNTE3YzExNTNmZTU3YmI0NjBiOTBkOTMxZWMwOGFhMA==
+    NjhhODdlYTdmMTk1MTg0YzI1YTI4NjUwNmY1OWFlZTViMzk0OWJkNA==
   data.tar.gz: !binary |-
-    YTkwYTc2OWI5NGM4NjVkN2FiOGIzNjk5ZjkwNTQ5Nzg5ZmMxZTcyOA==
+    YzhhMzYxZGNlOTBlNjg2MTMzYWFlZmIxYjRhZWI5YTg3YWM0ZmQxYg==
 SHA512:
   metadata.gz: !binary |-
-    YTUzYjQwMDM4Njc0ZjM2NTIxZGJlNGY4MDIxN2FkMjk3ZTg2YjAwNTM1N2Qz
-    NDAyMDNlM2JhMjk5MDViODA4NDNiM2JlN2M0M2QxOTE0YmQ3ZTI2ZWZmZTYx
-    N2I0YzM1ZDE0MjdiM2UwZWE4ZTI2MDAzMjhlZDY1ZDk4ZTZlNzA=
+    M2E5OTU3YmQ0NjU1MDFlZjNlOTAxMTQ2N2NjZTg3Y2M5OTk3MzE3NzM3Yzg4
+    ODcxMDE1ODIzN2ZmZTk4MjQ3ZjU5ZTdiOGVkZTMyZWNkMjVhMmIwMmFmOTFj
+    MDc4NzRiN2Q0YzIwYjY5MjdmZWEzMGNkOTNmNjc5ZjQ5YWY3NTU=
   data.tar.gz: !binary |-
-    YmI0NzllYzU0NjJmZTdmMTBmNzRiMDExMTA1ZThkMTc0MmI1NTMyZWQ3ZjA5
-    NDkxOTkwMzUzNzk5Y2NlNzcwM2I4ZDZjY2U1MTA5YzJhOTI5MmQzYTNkMGJk
-    ODlkNjZiNjhmZWY4YTE0OWJlNWY1NzUyM2VjM2U5YzQyZjUyOTQ=
+    YWJjMDRhMjYzMzMzNWI4MmZkMWRlNTVmY2M2ODI2ODVkZDMxYjg0ZGE2NDI1
+    MzJjYzY1NTBhOThlYThlMDlhZTE0MjNlNmMwM2UyOWMzODRlNDY1ZmU2MWMy
+    ZmRlYmM2YWZlN2U3NWQ5Yzc5ZGVjZTUxZmYxNGIzNjE4N2M4YTg=

data/bin/dare

@@ -6,19 +6,20 @@ class DareCLI < Thor
   desc "new", "creates a new app"
   def new(app_name)
     add_file("#{app_name}/Gemfile") do
-      "gem 'dare', '0.1.0'
+      "gem 'dare', '0.2.0'
 gem 'opal', '0.7.0beta3'
 gem 'opal-jquery', '0.3.0beta1'"
     end
     add_file "#{app_name}/Rakefile" do
 "desc \"Build #{app_name}.js\"
 task :build do
-  gem 'dare', '0.1.0'
+  gem 'dare', '0.2.0'
   gem 'opal', '0.7.0beta3'
   gem 'opal-jquery', '0.3.0beta1'
   require 'opal'
   require 'opal-jquery'
   Opal::Processor.source_map_enabled = false
+  Opal::Processor.inline_operators_enabled = true
   env = Sprockets::Environment.new
   Opal.paths.each do |path|
     env.append_path path
@@ -32,9 +33,7 @@ task :build do
 end"
     end
     add_file "#{app_name}/#{app_name}.rb" do
-"require 'opal' #this will be removed when 0.7.0 is released
-require 'opal-jquery'
-require 'dare'
+"require 'dare'
 
 class #{app_name[0].upcase + app_name[1..-1]} < Dare::Window
 
@@ -43,11 +42,11 @@ class #{app_name[0].upcase + app_name[1..-1]} < Dare::Window
   end
 
   def draw
-    #code that runs every frame
+    #code that draws every frame
   end
 
   def update
-    #code that runs every frame
+    #code that runs every update_interval
   end
 
 end

data/lib/dare.rb

@@ -1,17 +1,11 @@
+require 'opal' #this will be removed when 0.7.0 is released
 require 'opal-jquery'
-# Dir["dare/*.rb"].each {|f| require f } # can't do this because Opal
-require "dare/canvas.rb"
-require "dare/font.rb"
-require "dare/image.rb"
-require "dare/keyboard_constants.rb"
-require "dare/sound.rb"
-require "dare/sprite.rb"
-require "dare/window.rb"
+require_tree 'dare'
 
 module Dare
 
   # returns the current version of this gem
-  VERSION = "0.1.0"
+  VERSION = "0.2.0"
 
   # returns the magnitude of the horizontal component of a vector
   # at some angle and some magnitude where the angle is in degrees
@@ -22,7 +16,7 @@ module Dare
   # Dare.offset_x(45, 10) # returns 10 times the square root of 2
   #
   def self.offset_x(angle, magnitude)
-    `#{magnitude}*Math.cos(#{angle}*Math.PI/180.0)`
+    `#{magnitude}*Math.cos(-#{angle}*Math.PI/180.0)`
   end
 
   # returns the magnitude of the vertical component of a vector
@@ -34,7 +28,7 @@ module Dare
   # Dare.offset_y(45, 10) # returns 10 times the square root of 2
   #
   def self.offset_y(angle, magnitude)
-    `#{magnitude}*Math.sin(#{angle}*Math.PI/180.0)`
+    `#{magnitude}*Math.sin(-#{angle}*Math.PI/180.0)`
   end
 
   # returns the number of milliseconds since the Unix epoch
@@ -43,6 +37,11 @@ module Dare
   def self.ms
     `(new Date()).getTime()`
   end
+
+  def self.distance(x1, y1, x2, y2)
+    `Math.sqrt((x2-x1)*(x2-x1) + (y2-y1)*(y2-y1))`
+  end
+
   class << self
     attr_accessor :default_canvas
   end

data/lib/dare/font.rb

@@ -1,18 +1,23 @@
 module Dare
   class Font
-    def initialize(window = Dare.default_canvas, font_type = "30px Arial")
-      @window = window
-      @font = font_type
-      @color = "red"
-      @x = 50
-      @y = 50
+    def initialize(opts = {})
+      opts[:font] ||= "Arial"
+      opts[:canvas] ||= Dare.default_canvas
+      opts[:size] ||= 30
+      opts[:color] ||= "black"
+
+      @font = opts[:size].to_s + "px" + " " + opts[:font]
+      @canvas = opts[:canvas]
+      @color = opts[:color]
     end
 
-    def draw(string = "", x = @x, y = @y)
+    def draw(string = "", x = 0, y = 0, opts = {})
       %x{
-        #{@window.canvas.context}.font = #{@font};
-        #{@window.canvas.context}.fillStyle = #{@color};
-        #{@window.canvas.context}.fillText(#{string}, #{x}, #{y});
+        #{@canvas.context}.font = #{@font} ;
+        #{@canvas.context}.textAlign = 'left';
+        #{@canvas.context}.textBaseline = 'top';
+        #{@canvas.context}.fillStyle = #{@color};
+        #{@canvas.context}.fillText(#{string}, #{x}, #{y});
       }
     end
   end

data/lib/dare/image.rb

@@ -1,24 +1,218 @@
 module Dare
 
-  # loads an image which can be drawn to a canvas
+  # Represents an image which can be drawn to a canvas
   #
   class Image
 
-    # loads a new image resource
-    # image = Dare::Image.new('some_image.png')
+    # Loads a new image resource from an absolute URL or relative path
     #
-    def initialize(path = "", window = Dare.default_canvas)
+    # @param [String] path ("") the path to the resource
+    # @param [Hash] opts ({}) the options to create an image.
+    # @option opts [Dare::Canvas] :canvas (Dare.default_canvas) a canvas to refer to when drawing.
+    #
+    # @example
+    #   Dare::Image.new('some_image.png')
+    #
+    # @example
+    #   Dare::Image.new('https://www.google.com/images/srpr/logo11w.png', canvas: Dare::Canvas.new)
+    #
+    def initialize(path = "", opts = {})
+      opts[:canvas] ||= Dare.default_canvas
+      @path = path
       @img = `new Image()`
       `#{@img}.src = #{path}`
-      @window = window
+      @canvas = opts[:canvas]
+    end
+
+    # The path or URL of the image
+    #
+    # @return [String]
+    #
+    def path
+      @path
+    end
+
+    def img
+      @img
+    end
+
+    # The width of the image in pixels
+    #
+    # @return [Integer]
+    #
+    def width
+      `#{@img}.width`
+    end
+
+    # The height of the image in pixels
+    #
+    # @return [Integer]
+    #
+    def height
+      `#{@img}.height`
+    end
+
+    # Draws image to a canvas at an `x` and `y` position. `x` and `y` represent the top-left corner of the image
+    #
+    # @param [Integer] x (0) x coordinate of top-left of image
+    # @param [Integer] y (0) y coordinate of top-left of image
+    # @param [Hash] opts ({}) the options to draw an image.
+    # @option opts [Dare::Canvas] :canvas (Dare.default_canvas) a canvas to refer to when drawing.
+    #
+    # @example
+    #   image.draw(100, 200)
+    #
+    # @example
+    #   image.draw(10, 10, canvas: Dare::Canvas.new(width: 100, height: 100))
+    #
+    def draw(x = 0, y = 0, opts = {})
+
+      opts[:canvas] ||= @canvas
+      %x{
+        #{opts[:canvas].context}.drawImage(
+          #{@img},
+          #{x},
+          #{y}
+        );
+      }
+    end
+
+    # (see #draw)
+    # @note Used by Dare::ImageTile to draw a portion of an image to a canvas.
+    #
+    def draw_tile(x = 0, y = 0, opts = {})
+
+      opts[:canvas] ||= @canvas
+      opts[:sx] ||= 0
+      opts[:sy] ||= 0
+      opts[:swidth] ||= width - opts[:sx]
+      opts[:sheight] ||= height - opts[:sy]
+      opts[:dwidth] ||= opts[:swidth]
+      opts[:dheight] ||= opts[:sheight]
+
+      %x{
+        #{opts[:canvas].context}.drawImage(
+          #{@img},
+          #{opts[:sx]},
+          #{opts[:sy]},
+          #{opts[:swidth]},
+          #{opts[:sheight]},
+          #{x},
+          #{y},
+          #{opts[:dwidth]},
+          #{opts[:dheight]}
+        );
+      }
+    end
+
+    # Draws image to a canvas at an x and y position and rotated at some angle
+    # x and y represent the center of the image
+    # angle is in degrees starting by pointing to the right and increasing counterclockwise
+    #
+    # @param [Integer] x (0) x coordinate of center of image
+    # @param [Integer] y (0) y coordinate of center of image
+    # @param [Float] angle (90.0) angle of image
+    # @param [Hash] opts ({}) the options to draw an image.
+    # @option opts [Dare::Canvas] :canvas (Dare.default_canvas) a canvas to refer to when drawing.
+    #
+    # @example
+    #   image.draw_rot(100, 200, 45) # this will point the top of the image up and to the right
+    #
+    # @example
+    #   image.draw_rot(50, 75, 270, canvas: some_other_canvas)
+    #
+    def draw_rot(x = 0, y = 0, angle = 90, opts = {})
+      opts[:canvas] ||= @canvas
+      %x{
+        var context = #{opts[:canvas].context};
+        var width = #{@img}.width;
+        var height = #{@img}.height;
+        context.translate(#{x}, #{y});
+        context.rotate(-#{angle-90}*Math.PI/180.0);
+        context.drawImage(#{@img}, -width/2, -height/2, width, height);
+        context.rotate(#{angle-90}*Math.PI/180.0);
+        context.translate(-#{x}, -#{y});
+      }
+    end
+
+    # (see #draw_rot)
+    # @note Used by Dare::ImageTile to draw a portion of an image to a canvas at an angle.
+    #
+    def draw_tile_rot(x = 0, y = 0, angle = 90, opts = {})
+      opts[:canvas] ||= @canvas
+      opts[:sx] ||= 0
+      opts[:sy] ||= 0
+      opts[:swidth] ||= width - opts[:sx]
+      opts[:sheight] ||= height - opts[:sy]
+      opts[:dwidth] ||= opts[:swidth]
+      opts[:dheight] ||= opts[:sheight]
+      %x{
+        var context = #{opts[:canvas].context};
+        context.translate(#{x}, #{y});
+        context.rotate(-#{angle-90}*Math.PI/180.0);
+        context.drawImage(
+          #{@img},
+          #{opts[:sx]},
+          #{opts[:sy]},
+          #{opts[:swidth]},
+          #{opts[:sheight]},
+          -#{opts[:swidth]}/2,
+          -#{opts[:sheight]}/2,
+          #{opts[:swidth]},
+          #{opts[:sheight]});
+        context.rotate(#{angle-90}*Math.PI/180.0);
+        context.translate(-#{x}, -#{y});
+      }
     end
 
-    # draws image to a canvas at an x and y position
-    # x and y represent the top-left corner of the image
-    # image.draw(100, 200)
+    # Loads image and cuts it into tiles
     #
-    def draw(x = 0, y = 0)
-      `#{@window.canvas.context}.drawImage(#{@img},#{x},#{y})`
+    # @param [String] path ("") the path to the resource
+    # @param [Hash] opts ({}) the options to create an image.
+    # @option opts [Integer] :width (Image.new(path).width) width of a single tile from the image
+    # @option opts [Integer] :height (Image.new(path).height) height of a single tile from the image
+    #
+    # @return [Array] An array of images each of which are individual tiles of the original
+    #
+    def self.load_tiles(path = "", opts = {})
+
+      image = Image.new(path)
+      @tiles = []
+
+      %x{
+        #{image.img}.onload = function() {
+          #{opts[:width] ||= image.width};
+          #{opts[:height] ||= image.height};
+          #{columns = image.width/opts[:width]};
+          #{rows = image.height/opts[:height]};
+
+          #{rows.times do |row|
+            columns.times do |column|
+              @tiles << ImageTile.new(image, column*opts[:width].to_i, row*opts[:height].to_i, opts[:width].to_i, opts[:height].to_i)
+            end
+          end};
+        }
+      }
+      @tiles
+    end
+  end
+
+  class ImageTile
+    attr_reader :width, :height
+    def initialize(image = Image.new, x = 0, y = 0, width = 0, height = 0)
+      @image = image
+      @x = x
+      @y = y
+      @width = width
+      @height = height
+    end
+
+    def draw(x = 0, y = 0, opts = {})
+      @image.draw_tile(x, y, opts.merge({sx: @x, sy: @y, swidth: @width, sheight: @height}))
+    end
+
+    def draw_rot(x = 0, y = 0, angle = 90, opts = {})
+      @image.draw_tile_rot(x, y, angle, opts.merge({sx: @x, sy: @y, swidth: @width, sheight: @height}))
     end
   end
 end

data/lib/dare/sound.rb

@@ -8,14 +8,24 @@ module Dare
   class Sound
 
     # loads an audio resource from a path
-    # Sound.new('http://www.some-site.com/song.mp3')
+    # Sound.new('http://www.google.com/song.mp3')
     # Sound.new('local_song_in_same_directory_of_app_js_file.mp3')
-    # a predefined volume may be passed as a second parameter
-    # Sound.new('file.mp3', 0.5)
-    def initialize(path, volume = 1)
-      `var snd = new Audio(#{path})`
-      `snd.volume = #{volume}`
-      @sound = `snd`
+    # a predefined volume may be passed as an option
+    # Sound.new('file.mp3', volume: 0.5)
+    #
+    def initialize(path, opts = {})
+      opts[:overlap] ||= 1
+      opts[:volume] ||= 1
+      opts[:overlap] = 1 if opts[:overlap].to_i < 1
+      opts[:overlap] = 10 if opts[:overlap].to_i > 10
+      @overlap = opts[:overlap]
+      @sounds = []
+      @overlap.times do
+        `var snd = new Audio(#{path})`
+        `snd.volume = #{opts[:volume]}`
+        @sounds << `snd`
+      end
+      @sound = 0
     end
 
     # set the volume of the audio resource to value between 0 and 1
@@ -34,7 +44,9 @@ module Dare
     # if resource was paused, it will start playing from where it left off
     #
     def play
-      `#{@sound}.play()`
+      @sound += 1
+      @sound %= @overlap
+      `#{@sounds[@sound]}.play()`
     end
 
     # pause the audio resource, halting playback

data/lib/dare/window.rb

@@ -1,16 +1,22 @@
 module Dare
+  class Color
+    attr_accessor :red, :green, :blue
+    def initialize(color)
+
+    end
+  end
   class Window
 
     attr_reader :width, :height, :ticks, :mouse_x, :mouse_y, :canvas, :key, :update_interval
 
-    # creates a new window object to hold all your game goodness
-    # options include:
-    #  :width # (default 640) sets default canvas to a particular width in pixels
-    #  :height # (default (480) sets default canvas to a particular height in pixels
-    #  :update_interval # (default 16.666666) sets the update interval in milliseconds between updates
-    #  :border # true/false (default false) draws a border around the default canvas
-    #  :canvas # a canvas to refer to when drawing.  Just let the default do its thing
-    #  :mouse # true/false (default true) turn off mouse event listeners by setting to false
+    # Creates a new window object to hold all your game goodness
+    # @param [Hash] opts the options to create a window.
+    # @option opts [Integer] :width (640) sets default canvas to a particular width in pixels
+    # @option opts [Integer] :height (480) sets default canvas to a particular height in pixels
+    # @option opts [Float] :update_interval (16.666666) sets the update interval in milliseconds between updates
+    # @option opts [Boolean] :border (false) draws a border around the default canvas
+    # @option opts [Dare::Canvas] :canvas (Dare.default_canvas) a canvas to refer to when drawing.
+    # @option opts [Boolean] :mouse (true) turn off mouse event listeners by setting to false
     #
     def initialize(opts = {})
       opts[:width] ||= 640
@@ -33,12 +39,15 @@ module Dare
     # starts the game loop for the window.
     def run!
       %x{
+        function update_loop() {
+          #{update};
+        }
         function anim_loop() {
           requestAnimationFrame(anim_loop);
-          #{update};
-          #{@canvas.context}.clearRect(0, 0, #{width}, #{height});
+          #{@canvas.canvas}.width = #{@canvas.canvas}.width;
           #{draw};
         }
+        setInterval(update_loop, #{@update_interval});
         requestAnimationFrame(anim_loop);
       }
     end
@@ -72,6 +81,9 @@ module Dare
       Element.find("html").on :keyup do |event|
         @keys[get_key_id(event)] = false
       end
+      ::Window.on :blur do |event|
+        @keys.fill false
+      end
     end
 
     # checks to see if button passed is currently being pressed
@@ -115,11 +127,44 @@ module Dare
       `#{@canvas.context}.fillRect(#{x}, #{y}, #{width}, #{height})`
     end
 
+    #works the same as Gosu::Window.draw_quad
+    def draw_quad(x1, y1, c1, x2, y2, c2, x3, y3, c3, x4, y4, c4, z)
+      %x{
+        var QUALITY = 256;
+
+        var canvas_colors = document.createElement( 'canvas' );
+        canvas_colors.width = 2;
+        canvas_colors.height = 2;
+
+        var context_colors = canvas_colors.getContext( '2d' );
+        context_colors.fillStyle = 'rgba(0,0,0,1)';
+        context_colors.fillRect( 0, 0, 2, 2 );
+
+        var image_colors = context_colors.getImageData( 0, 0, 2, 2 );
+        var data = image_colors.data;
+
+        var canvas_render = #{@canvas};
+
+        var context_render = #{@canvas.context};
+        context_render.translate( - QUALITY / 2, - QUALITY / 2 );
+        context_render.scale( QUALITY, QUALITY );
+
+        data[ 0 ] = 255; // Top-left, red component
+        data[ 5 ] = 255; // Top-right, green component
+        data[ 10 ] = 255; // Bottom-left, blue component
+
+        context_colors.putImageData( image_colors, 0, 0 );
+        context_render.drawImage( canvas_colors, 0, 0 );
+      }
+    end
+
     # sets the caption/title of the window to the string passed
-    def caption(title)
+    def caption=(title)
       `document.getElementById('pageTitle').innerHTML = #{title}`
     end
 
+    alias :title= :caption=
+
     # checks if game is fullscreen.  currently not implemented.
     def fullscreen?
       false

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: dare
 version: !ruby/object:Gem::Version
-  version: 0.1.0
+  version: 0.2.0
 platform: ruby
 authors:
 - Dominic Muller
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2014-12-11 00:00:00.000000000 Z
+date: 2014-12-17 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: rake
@@ -108,6 +108,10 @@ extensions: []
 extra_rdoc_files: []
 files:
 - bin/dare
+- examples/tutorial/assets/Beep.wav
+- examples/tutorial/assets/Space.png
+- examples/tutorial/assets/Star.png
+- examples/tutorial/assets/Starfighter.png
 - lib/dare.rb
 - lib/dare/canvas.rb
 - lib/dare/font.rb