stylize login screen, add development mode

kzk · Oct 29, 2012 · 67929e7 · 67929e7
1 parent 49c6e1a
commit 67929e7
Show file tree

Hide file tree

Showing 5 changed files with 103 additions and 8 deletions.
diff --git a/Rakefile b/Rakefile
@@ -1,2 +1,25 @@
 #!/usr/bin/env rake
 require "bundler/gem_tasks"
+
+require 'rubygems'
+require 'bundler'
+Bundler.setup
+$LOAD_PATH << File.dirname(__FILE__) + '/lib'
+
+desc 'start a development server'
+task :server do
+  Dir.chdir 'examples'
+  if which('shotgun')
+    exec 'shotgun -O sinatra.rb -p 5678'
+  else
+    warn 'warn: shotgun not installed; reloading is disabled.'
+      exec 'ruby -rubygems sinatra.rb -p 5678'
+  end
+end
+def which(command)
+  ENV['PATH'].
+    split(':').
+    map  { |p| "#{p}/#{command}" }.
+    find { |p| File.executable?(p) }
+end
+task :start => :server
diff --git a/examples/sinatra.rb b/examples/sinatra.rb
@@ -1,5 +1,7 @@
 $:.push File.dirname(__FILE__) + '/../lib'
 
+require 'rubygems'
+require 'omniauth'
 require 'omniauth-td'
 require 'sinatra'
 
@@ -10,7 +12,8 @@
   "<a href='/auth/td'>Log in with Treasure Data</a>"
 end
 
-get '/auth/td/callback' do
+post '/auth/td/callback' do
   content_type 'text/plain'
   request.env['omniauth.auth'].inspect
+  "login succeeded!"
 end
diff --git a/lib/omniauth/strategies/td.rb b/lib/omniauth/strategies/td.rb
@@ -1,3 +1,5 @@
+require 'erb'
+require 'rack'
 require 'omniauth-td/version'
 require 'td/client'
 
@@ -9,14 +11,12 @@ class Td
       option :fields, [:email]
       option :uid_field, :email
 
+      VIEW_DIR = File.dirname(__FILE__) + "/../../../view/"
+
       def request_phase
-        form = OmniAuth::Form.new(:title => "Account Info", :url => callback_path)
-        options.fields.each do |field|
-          form.text_field field.to_s.capitalize.gsub("_", " "), field.to_s
-        end
-        form.password_field 'Password', 'password'
-        form.button "Sign In"
-        form.to_response
+        tmpl = VIEW_DIR + 'form.erb'
+        html = ERB.new(open(tmpl).read).result(binding)
+        Rack::Response.new(html).finish
       end
 
       def callback_phase

diff --git a/omniauth-td.gemspec b/omniauth-td.gemspec
@@ -17,4 +17,6 @@ Gem::Specification.new do |gem|
 
   gem.add_dependency 'omniauth', '~> 1.0'
   gem.add_dependency 'td-client', '~> 0.8.35'
+  gem.add_development_dependency 'shotgun', '~> 0.9'
+  gem.add_development_dependency 'sinatra', '~> 1.3.1'
 end
diff --git a/view/form.erb b/view/form.erb
@@ -0,0 +1,67 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <title>Sign Up | Treasure Data</title>
+
+    <!-- jQuery -->
+    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.0/jquery.min.js"></script>
+    <script src="https://ajax.aspnetcdn.com/ajax/jquery.validate/1.6/jquery.validate.min.js"></script>
+
+    <!-- Assets -->
+    <link rel='stylesheet' href='http://www.treasure-data.com/stylesheets/base.css' media='screen' />
+
+    <!-- ready() -->
+    <script>
+      $(document).ready(function(){
+        $('#SignUpForm').validate({
+          rules: {
+            password: {
+              minlength: 6,
+              maxlength: 30
+            }
+          },
+          messages: {
+            password: {
+              required: "Enter password.",
+            }
+          }
+        });
+      });
+    </script>
+  </head>
+  <body>
+    <br />
+    <br />
+    <br />
+    <br />
+    <div id="container_signup">
+      <h1>
+        <a href="http://www.treasure-data.com/" id="brand_signup">Treasure Data</a>
+      </h1>
+      <div id="form_wrapper">
+        <form method="POST" action="/auth/td/callback" id="SignUpForm" >
+            <div>
+              Email: 
+              <input class="text required" name="email" placeholder="Email" type="text" />
+            </div>
+            <div>
+              Password:
+              <input class="text" name="password" placeholder="Password"  type="password" />
+            </div>
+            <div>
+              <button type="submit">Login</button>
+            </div>
+            <input name="code" type="hidden" value="treasure-data" />
+            <input name="source" type="hidden" value="top" />
+            <input name="return_url" type="hidden" value="http://treasure-data.com/thanks/" />
+        </form>
+        <p class="smaller-print">
+          Don't have an account? <a href="http://www.treasure-data.com/signup/">Sign up.</a> Or <a href="http://docs.treasure-data.com/articles/change-password">forgot password</a>?
+        </p>
+      </div>
+      <div id="footer_signup">
+        <div>&copy; 2011- <a href="http://treasure-data.com">Treasure Data, Inc.</a> All Rights Reserved. </div>
+      </div>
+    </div>
+  </body>
+</html>