unpoly-rails 0.22.1 → 0.23.0

data/lib/unpoly/rails/version.rb

@@ -4,6 +4,6 @@ module Unpoly
     # The current version of the unpoly-rails gem.
     # This version number is also used for releases of the Unpoly
     # frontend code.
-    VERSION = '0.22.1'
+    VERSION = '0.23.0'
   end
 end

data/spec_app/Gemfile.lock

@@ -1,7 +1,7 @@
 PATH
   remote: ..
   specs:
-    unpoly-rails (0.21.0)
+    unpoly-rails (0.22.1)
       rails (>= 3)
 
 GEM

data/spec_app/app/assets/javascripts/integration_test.coffee

@@ -0,0 +1,2 @@
+#= require jquery
+#= require unpoly

data/spec_app/app/assets/javascripts/jasmine_specs.coffee

@@ -0,0 +1,7 @@
+#= require jquery
+#= require jquery_ujs
+#= require jasmine-jquery
+#= require jasmine-fixture
+#= require jasmine-ajax
+#= require helpers/knife
+#= require unpoly

data/spec_app/app/assets/stylesheets/integration_test.sass

@@ -0,0 +1,24 @@
+//= require unpoly
+
+body
+  margin: 0
+  background: image-url('grid.png') repeat
+  font-family: arial, sans-serif
+
+.example
+  margin: 50px
+
+.button
+  display: inline-block
+  height: 50px
+  line-height: 50px
+  padding-left: 25px
+  padding-right: 25px
+  background-color: #e21
+  color: white
+  text-decoration: none
+  &:hover
+    background-color: #fa1
+
+dt
+  font-weight: bold

data/spec_app/app/assets/stylesheets/jasmine_specs.sass

@@ -0,0 +1 @@
+//= require unpoly

data/spec_app/app/controllers/{test_controller.rb → binding_test_controller.rb}

@@ -1,4 +1,4 @@
-class TestController < ActionController::Base
+class BindingTestController < ActionController::Base
 
   def is_up
     render :text => up?.to_s

data/spec_app/app/controllers/css_test_controller.rb

@@ -0,0 +1,5 @@
+class CssTestController < ApplicationController
+
+  layout 'integration_test'
+
+end

data/spec_app/app/controllers/form_test/basics_controller.rb

@@ -0,0 +1,14 @@
+module FormTest
+  class BasicsController < ApplicationController
+
+    layout 'integration_test'
+
+    def new
+    end
+
+    def create
+      render 'form_test/submission_result'
+    end
+
+  end
+end

data/spec_app/app/controllers/form_test/uploads_controller.rb

@@ -0,0 +1,15 @@
+module FormTest
+  class UploadsController < ApplicationController
+
+    layout 'integration_test'
+
+    def new
+
+    end
+
+    def create
+      render 'form_test/submission_result'
+    end
+
+  end
+end

data/spec_app/app/controllers/pages_controller.rb

@@ -0,0 +1,5 @@
+class PagesController < ApplicationController
+
+  layout 'integration_test'
+
+end

data/spec_app/app/views/css_test/tooltip.erb

@@ -0,0 +1,15 @@
+<div class="example">
+  <a class="button" href="#" up-tooltip="Tooltip text" up-position="top">Top tooltip</a>
+</div>
+
+<div class="example">
+  <a class="button" href="#" up-tooltip="Tooltip text" up-position="bottom">Bottom tooltip</a>
+</div>
+
+<div class="example">
+  <a class="button" href="#" up-tooltip="Tooltip text" up-position="left">Left tooltip</a>
+</div>
+
+<div class="example">
+  <a class="button" href="#" up-tooltip="Tooltip text" up-position="right">Right tooltip</a>
+</div>

data/spec_app/app/views/form_test/basics/new.erb

@@ -0,0 +1,33 @@
+<div class="example">
+
+  <h2>Basic form</h2>
+
+  <%= form_tag "/form_test/basic", method: :post, 'up-target' => '.result' do %>
+
+    <p>
+      <input type="text" name="text-param" value="text-value" />
+    </p>
+
+    <p>
+      <input type="password" name="password-param" value="password-value" />
+    </p>
+
+    <p>
+      <select name="select-param">
+        <option value="select-value">select-label</option>
+      </select>
+    </p>
+
+    <p>
+      <button type="submit">Submit</button>
+    </p>
+
+  <% end %>
+
+  <h3>Submission result</h3>
+
+  <div class="result">
+    Results of the form submission will be shown here.
+  </div>
+
+</div>

data/spec_app/app/views/form_test/submission_result.erb

@@ -0,0 +1,30 @@
+<% require "base64" %>
+
+<div class="result">
+
+  <p>
+    Submitted <code>params</code> were:
+  </p>
+
+  <dl>
+    <% params.each do |key, value| %>
+      <dt><code><%= key %></code></dt>
+      <dd>
+        <% if value.is_a?(String) %>
+          <pre><code><%= value %></code></pre>
+        <% elsif value.is_a?(ActionDispatch::Http::UploadedFile) %>
+          <% if value.original_filename.ends_with?('.jpg') %>
+            <img src="data:image/jpeg;base64,<%= Base64.encode64(value.read) %>">
+          <% elsif value.original_filename.ends_with?('.png') %>
+            <img src="data:image/png;base64,<%= Base64.encode64(value.read) %>">
+          <% else %>
+            <%= value.original_filename %> (<%= value.size %> bytes)
+          <% end %>
+        <% else %>
+          <%= value.inspect %>
+        <% end %>
+      </dd>
+    <% end %>
+  </dl>
+
+</div>

data/spec_app/app/views/form_test/uploads/new.erb

@@ -0,0 +1,27 @@
+<div class="example">
+
+  <h2>Form with file uploads</h2>
+
+  <%= form_tag "/form_test/upload", method: :post, multipart: true, 'up-target' => '.result' do %>
+
+    <p>
+      <input type="text" name="text-param" value="text-value" />
+    </p>
+
+    <p>
+      <input type="file" name="file-param" />
+    </p>
+
+    <p>
+      <button type="submit">Submit</button>
+    </p>
+
+  <% end %>
+
+  <h3>Submission result</h3>
+
+  <div class="result">
+    Results of the form submission will be shown here.
+  </div>
+
+</div>

data/spec_app/app/views/layouts/integration_test.erb

@@ -0,0 +1,14 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <title>Integration test - Unpoly</title>
+    <%= stylesheet_link_tag 'integration_test', media: 'all' %>
+    <%= javascript_include_tag 'integration_test' %>
+    <%= csrf_meta_tags %>
+  </head>
+  <body>
+    <div class="page">
+      <%= yield %>
+    </div>
+  </body>
+</html>

data/spec_app/app/views/pages/start.erb

@@ -0,0 +1,25 @@
+<div class="example">
+
+  <h1>Unpoly tests</h1>
+
+  <h2>Unit tests</h2>
+
+  <ul>
+    <li><%= link_to 'Jasmine specs', '/specs' %></li>
+  </ul>
+
+  <h2>Integration tests</h2>
+
+  <ul>
+    <li><%= link_to 'Tooltip', '/css_test/tooltip' %></li>
+  </ul>
+
+  <ul>
+    <li><%= link_to 'Form (basic)', '/form_test/basic/new' %></li>
+  </ul>
+
+  <ul>
+    <li><%= link_to 'Form (upload)', '/form_test/upload/new' %></li>
+  </ul>
+
+</div>

data/spec_app/config/initializers/assets.rb

@@ -8,4 +8,7 @@ Rails.application.config.assets.version = '1.0'
 
 # Precompile additional assets.
 # application.js, application.css, and all non-JS/CSS in app/assets folder are already added.
-# Rails.application.config.assets.precompile += %w( search.js )
+
+
+Rails.application.config.assets.precompile += %w( application.js application.css )
+Rails.application.config.assets.precompile += %w( jasmine_specs.js jasmine_specs.css integration_test.js integration_test.css )

data/spec_app/config/routes.rb

@@ -1,8 +1,14 @@
 Rails.application.routes.draw do
 
   mount JasmineRails::Engine => '/specs' if defined?(JasmineRails)
-  root to: redirect('/specs')
+  root to: 'pages#start'
 
-  get 'test/:action', controller: 'test'
+  get 'binding_test/:action', controller: 'binding_test'
+  get 'css_test/:action', controller: 'css_test'
+
+  namespace :form_test do
+    resource :basic, only: [:new, :create]
+    resource :upload, only: [:new, :create]
+  end
 
 end

data/spec_app/spec/controllers/{test_controller_spec.rb → binding_test_controller_spec.rb}

@@ -1,4 +1,4 @@
-describe TestController do
+describe BindingTestController do
 
   describe '#up?' do
 

data/spec_app/spec/javascripts/helpers/parse_form_data.js.coffee

@@ -0,0 +1,9 @@
+beforeEach ->
+
+  jasmine.Ajax.addCustomParamParser
+    test: (xhr) ->
+      up.util.isFormData(xhr.params)
+
+    parse: (params) ->
+      # Just return it
+      params

data/spec_app/spec/javascripts/support/jasmine.yml

@@ -17,12 +17,12 @@ css_dir: "app/assets/stylesheets"
 # list of file expressions to include as source files
 # relative path from src_dir
 src_files:
- - "application.{js.coffee,js,coffee}"
+ - "jasmine_specs.{js.coffee,js,coffee}"
 
 # list of file expressions to include as css files
 # relative path from css_dir
 css_files:
- - "application.{css.sass,css,sass}"
+ - "jasmine_specs.{css.sass,css,sass}"
 
 # path to parent directory of spec_files
 # relative path from Rails.root

data/spec_app/spec/javascripts/up/form_spec.js.coffee

@@ -166,9 +166,29 @@ describe 'up.form', ->
             @respondWith('<div class="response">new-text</div>')
             expect(up.browser.url()).toEqual(@hrefBeforeExample)
 
+        describe 'in a form with file inputs', ->
+
+          beforeEach ->
+            @$form.affix('input[name="file-field"][type="file"]')
+
+          describeCapability 'canFormData', ->
+
+            it 'transfers the form fields via FormData', ->
+              up.submit(@$form)
+              data = @lastRequest().data()
+              expect(u.isFormData(data)).toBe(true)
+
+          describeFallback 'canFormData', ->
+
+            it 'falls back to a vanilla form submission', ->
+              form = @$form.get(0)
+              spyOn(form, 'submit')
+              up.submit(@$form)
+              expect(form.submit).toHaveBeenCalled()
+
       describeFallback 'canPushState', ->
         
-        it 'submits the given form', ->
+        it 'falls back to a vanilla form submission', ->
           $form = affix('form[action="/path/to"][method="put"][up-target=".response"]')
           form = $form.get(0)
           spyOn(form, 'submit')

data/spec_app/spec/javascripts/up/tooltip_spec.js.coffee

@@ -4,36 +4,73 @@ describe 'up.tooltip', ->
     
     describe 'up.tooltip.attach', ->
       
-      it 'opens a tooltop above the center of the given element', ->
-        $link = affix('span').text('button label')
-        $link.css(
-          position: 'absolute'
-          left: '200px'
-          top: '200px'
-          width: '50px'
-          height: '50px'
-        )
+      it 'opens a tooltip with the given text', ->
+        $link = affix('span')
         up.tooltip.attach($link, html: 'tooltip text')
         $tooltip = $('.up-tooltip')
-        expect($tooltip).toBeInDOM()
         expect($tooltip).toHaveText('tooltip text')
-        tooltipBox = up.util.measure($tooltip, relative: true)
-        linkBox = up.util.measure($link, relative: true)
-        expect(tooltipBox.top).toBeAround(linkBox.top - tooltipBox.height, 15)
-        expect(tooltipBox.left).toBeAround(linkBox.left + 0.5 * (linkBox.width - tooltipBox.width), 15)
-        
-      it 'allows HTML for the tooltip text when contents are given as .html option', ->
+
+      it 'allows HTML for the tooltip text when contents are given as { html } option', ->
         $link = affix('span')
         up.tooltip.attach($link, html: '<b>text</b>')
         $tooltip = $('.up-tooltip')
         expect($tooltip.html()).toEqual('<b>text</b>')
 
-      it 'escapes HTML for the tooltip text when contents given as .html option', ->
+      it 'escapes HTML for the tooltip text when contents given as { text } option', ->
         $link = affix('span')
         up.tooltip.attach($link, text: '<b>text</b>')
         $tooltip = $('.up-tooltip')
         expect($tooltip.html()).toEqual('&lt;b&gt;text&lt;/b&gt;')
 
+      describe 'positioning', ->
+
+        beforeEach ->
+          @$link = affix('span').text('button label')
+          @$link.css(
+            position: 'absolute'
+            left: '200px'
+            top: '200px'
+            width: '50px'
+            height: '50px'
+          )
+          @linkBox = up.util.measure(@$link, relative: true)
+
+        describe 'with { position: "top" }', ->
+
+          it 'centers the tooltip above the given element', ->
+            up.tooltip.attach(@$link, html: 'tooltip text', position: 'top')
+            $tooltip = $('.up-tooltip')
+            tooltipBox = up.util.measure($tooltip, relative: true)
+            expect(tooltipBox.top).toBeAround(@linkBox.top - tooltipBox.height, 15)
+            expect(tooltipBox.left).toBeAround(@linkBox.left + 0.5 * (@linkBox.width - tooltipBox.width), 15)
+
+        describe 'with { position: "right" }', ->
+
+          it 'centers the tooltip at the right side of the given element', ->
+            up.tooltip.attach(@$link, html: 'tooltip text', position: 'right')
+            $tooltip = $('.up-tooltip')
+            tooltipBox = up.util.measure($tooltip, relative: true)
+            expect(tooltipBox.top).toBeAround(@linkBox.top + 0.5 * (@linkBox.height - tooltipBox.height), 15)
+            expect(tooltipBox.left).toBeAround(@linkBox.left + @linkBox.width, 15)
+
+        describe 'with { position: "bottom" }', ->
+
+          it 'centers the tooltip below the given element', ->
+            up.tooltip.attach(@$link, html: 'tooltip text', position: 'bottom')
+            $tooltip = $('.up-tooltip')
+            tooltipBox = up.util.measure($tooltip, relative: true)
+            expect(tooltipBox.top).toBeAround(@linkBox.top + @linkBox.height, 15)
+            expect(tooltipBox.left).toBeAround(@linkBox.left + 0.5 * (@linkBox.width - tooltipBox.width), 15)
+
+        describe 'with { position: "left" }', ->
+
+          it 'centers the tooltip at the left side of the given element', ->
+            up.tooltip.attach(@$link, html: 'tooltip text', position: 'left')
+            $tooltip = $('.up-tooltip')
+            tooltipBox = up.util.measure($tooltip, relative: true)
+            expect(tooltipBox.top).toBeAround(@linkBox.top + 0.5 * (@linkBox.height - tooltipBox.height), 15)
+            expect(tooltipBox.left).toBeAround(@linkBox.left - tooltipBox.width, 15)
+
       it 'closes an existing tooltip'
       
       describe 'with position option', ->