credit_card_type_field 0.9

data/.gitignore

@@ -0,0 +1,18 @@
+*.gem
+*.rbc
+.bundle
+.config
+.yardoc
+Gemfile.lock
+InstalledFiles
+_yardoc
+coverage
+doc/
+.DS_Store
+lib/bundler/man
+pkg
+rdoc
+spec/reports
+test/tmp
+test/version_tmp
+tmp

data/Gemfile

@@ -0,0 +1,4 @@
+source 'https://rubygems.org'
+
+# Specify your gem's dependencies in credit_card_field.gemspec
+gemspec

data/LICENSE.txt

@@ -0,0 +1,22 @@
+Copyright (c) 2012 benzhang
+
+MIT License
+
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of this software and associated documentation files (the
+"Software"), to deal in the Software without restriction, including
+without limitation the rights to use, copy, modify, merge, publish,
+distribute, sublicense, and/or sell copies of the Software, and to
+permit persons to whom the Software is furnished to do so, subject to
+the following conditions:
+
+The above copyright notice and this permission notice shall be
+included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
+LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
+OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
+WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

data/README.md

@@ -0,0 +1,44 @@
+# CreditCardField
+
+Credit card type field auto detected by the credit card number.
+
+## Installation
+Only support Rails 3.1+ with jQuery
+
+Add this line to your application's Gemfile:
+
+    gem 'credit_card_type_field'
+
+And then execute:
+
+    $ bundle
+
+Or install it yourself as:
+
+    $ gem install credit_card_type_field
+
+Add to assets pipeline
+
+application.js
+
+    $ //= require credit_card_type_field
+
+application.css
+
+    $ *= require credit_card_type_field
+
+## Tutorial
+
+
+
+## Demo
+  
+
+
+## Contributing
+
+1. Fork it
+2. Create your feature branch (`git checkout -b my-new-feature`)
+3. Commit your changes (`git commit -am 'Add some feature'`)
+4. Push to the branch (`git push origin my-new-feature`)
+5. Create new Pull Request

data/Rakefile

@@ -0,0 +1 @@
+require "bundler/gem_tasks"

data/credit_card_type_field.gemspec

@@ -0,0 +1,19 @@
+# -*- encoding: utf-8 -*-
+lib = File.expand_path('../lib', __FILE__)
+$LOAD_PATH.unshift(lib) unless $LOAD_PATH.include?(lib)
+require 'credit_card_type_field/version'
+
+Gem::Specification.new do |gem|
+  gem.name          = "credit_card_type_field"
+  gem.version       = CreditCardField::VERSION
+  gem.authors       = ["benzhang"]
+  gem.email         = ["bzbnhang@gmail.com"]
+  gem.description   = %q{Credit Card type}
+  gem.summary       = %q{A nice graphic Credit Card type field}
+  gem.homepage      = "https://github.com/BenZhang/credit_card_type_field"
+
+  gem.files         = `git ls-files`.split($/)
+  gem.executables   = gem.files.grep(%r{^bin/}).map{ |f| File.basename(f) }
+  gem.test_files    = gem.files.grep(%r{^(test|spec|features)/})
+  gem.require_paths = ["lib"]
+end

data/lib/credit_card_type_field/version.rb

@@ -0,0 +1,3 @@
+module CreditCardField
+  VERSION = "0.9"
+end

data/lib/credit_card_type_field/view_helper.rb

@@ -0,0 +1,25 @@
+module CreditCardTypeField
+  module ViewHelper
+
+    def credit_card_type_field(method, options = {})
+      options[:card_number_selector] ||= "##{@object_name}_credit_card_no"
+      options[:accept_types] ||= %w(visa master american_express diners_club)
+      html = '<ul class="credit-card-type clearfix">'.html_safe
+      options[:accept_types].each {|type| html << "<li class=\"icon #{type} #{'active' if self.object.try(method) == type}\">#{type.camelize}</li>".html_safe }
+      html << %Q(<li class="icon not_valid #{'active' unless self.object.try(method)}">Invalid Card</li>
+              <li class="hint not_valid"><strong>Not a Valid Credit Card Number</strong></li>
+            </ul>).html_safe
+      html << hidden_field(method, rel: 'credit-card-type')
+      html << %Q(
+        <script>
+          $('input[rel=credit-card-type]').closest('form').find('#{options[:card_number_selector]}').keyup(CreditCardField.keyup);
+        </script>
+        ).html_safe
+    end
+
+    def credit_card_type_field_tag(object_name, method, options = {})
+      
+    end
+    
+  end
+end

data/spec/spec_helper.rb

@@ -0,0 +1,16 @@
+# Configure Rails Environment
+ENV["RAILS_ENV"] = "test"
+
+# require File.expand_path("../dummy/config/environment.rb",  __FILE__)
+require 'rspec/rails'
+# require 'capybara/rspec'
+
+# Capybara.javascript_driver = :selenium
+RSpec.configure do |config|
+  config.mock_with :mocha
+end
+
+# Rails.backtrace_cleaner.remove_silencers!
+
+# Load support files
+# Dir["#{File.dirname(__FILE__)}/support/**/*.rb"].each { |f| require f }

data/spec/view_helper_spec.rb

@@ -0,0 +1,5 @@
+require 'spec_helper'
+
+describe CreditCardField::ViewHelper do
+  
+end

data/vendor/assets/javascripts/credit_card_field.coffee

@@ -0,0 +1,23 @@
+class @CreditCardType
+  constructor: (number) ->
+    @card_number = number.replace(/[ -]/g, '')
+  
+  cardType: ->
+    visaCard = /^4[0-9]{12}(?:[0-9]{3})?$/
+    masterCard = /^5[1-5][0-9]{14}$/
+    americanExpress = /^3[47][0-9]{13}$/
+    dinerCard = /^3(?:0[0-5]|[68][0-9])[0-9]{11}$/
+    return 'visa' if visaCard.test(@card_number)
+    return 'master' if masterCard.test(@card_number)
+    return 'american_express' if americanExpress.test(@card_number)
+    return 'diners_club' if dinerCard.test(@card_number)
+    'not_valid'
+
+@CreditCardField = {
+  keyup: (e)->
+    cardType = new CreditCardType($(this).val()).cardType()
+    form = $(this).closest('form')
+    form.find(".credit-card-type li").removeClass('active')
+    form.find(".credit-card-type .#{cardType}").addClass('active')
+    form.find('input[rel=credit-card-type]').val(cardType)
+}

data/vendor/assets/stylesheets/credit_card_field.css.scss

@@ -0,0 +1,80 @@
+.credit-card-type {
+  margin:-10px 0 0 0;
+  li {
+    display:inline-block;
+    &.icon {
+      width:30px;
+      height:20px;
+      text-indent:-999em;
+      background-position:center;
+      opacity:0.3;
+      filter: alpha(opacity = 30);
+      &.visa { background-image:url('/assets/credit_cards/visa_32.png');}
+      &.master { background-image:url('/assets/credit_cards/mastercard_32.png');}
+      &.diners_club { background-image:url('/assets/credit_cards/diners_club_32.png');}
+      &.american_express { background-image:url('/assets/credit_cards/american_express_32.png');}
+      &.not_valid { background-image:url('/assets/credit_cards/not_valid_32.png');}
+      &.active { opacity:1; filter: alpha(opacity = 100); }
+    }
+    &.hint {
+      display:none;
+      margin-left:2px;
+      color:#f00;
+      font-size:90%;
+      &.active { display:inline-block; }
+    }
+  }
+}
+
+.credit-card-form {
+  label.cc-label {
+    height:115px;
+    padding:10px;
+    &:hover { background:#f5f5f5; }
+    &.active { background:#eee; box-shadow:inset 0 0 15px #ccc; border-color:#ccc; }
+  }
+  .cc-label {
+    margin-bottom:10px;
+    padding:10px 0;
+    border-radius:5px;
+    border:1px solid transparent;
+    .cc-template {
+      float:left;
+      border-radius:5px;
+      font-weight:bold;
+      color:#fff;
+      width:166px;
+      height:117px;
+      background:url(/assets/credit_cards/credit_card_bg.png);
+      overflow:hidden;
+      padding:0 5px 0 15px;
+      .cc-number {
+        padding:50px 0 10px 0;
+        font-size:16px;
+        letter-spacing:2px;
+      }
+      .cc-name {
+        float:left;
+        width:120px;
+      }
+      .cc-type {
+        float:right;
+        text-indent:-999em;
+        span {
+          display:block;
+          width:30px;
+          height:20px;
+          background-position:center;
+          &.visa { background-image:url('/assets/credit_cards/visa_32.png');}
+          &.master { background-image:url('/assets/credit_cards/mastercard_32.png');}
+          &.diners_club { background-image:url('/assets/credit_cards/diners_club_32.png');}
+          &.american_express { background-image:url('/assets/credit_cards/american_express_32.png');}
+        }
+      }
+    }
+    .cc-details {
+      padding-left:210px;
+      p:last-child { margin:0; }
+    }
+  }
+}

metadata

@@ -0,0 +1,65 @@
+--- !ruby/object:Gem::Specification
+name: credit_card_type_field
+version: !ruby/object:Gem::Version
+  version: '0.9'
+  prerelease: 
+platform: ruby
+authors:
+- benzhang
+autorequire: 
+bindir: bin
+cert_chain: []
+date: 2012-11-30 00:00:00.000000000 Z
+dependencies: []
+description: Credit Card type
+email:
+- bzbnhang@gmail.com
+executables: []
+extensions: []
+extra_rdoc_files: []
+files:
+- .gitignore
+- Gemfile
+- LICENSE.txt
+- README.md
+- Rakefile
+- credit_card_type_field.gemspec
+- lib/credit_card_type_field/version.rb
+- lib/credit_card_type_field/view_helper.rb
+- spec/spec_helper.rb
+- spec/view_helper_spec.rb
+- vendor/assets/images/credit_cards/american_express_32.png
+- vendor/assets/images/credit_cards/credit_card_bg.png
+- vendor/assets/images/credit_cards/diners_club_32.png
+- vendor/assets/images/credit_cards/mastercard_32.png
+- vendor/assets/images/credit_cards/not_valid_32.png
+- vendor/assets/images/credit_cards/visa_32.png
+- vendor/assets/javascripts/credit_card_field.coffee
+- vendor/assets/stylesheets/credit_card_field.css.scss
+homepage: https://github.com/BenZhang/credit_card_type_field
+licenses: []
+post_install_message: 
+rdoc_options: []
+require_paths:
+- lib
+required_ruby_version: !ruby/object:Gem::Requirement
+  none: false
+  requirements:
+  - - ! '>='
+    - !ruby/object:Gem::Version
+      version: '0'
+required_rubygems_version: !ruby/object:Gem::Requirement
+  none: false
+  requirements:
+  - - ! '>='
+    - !ruby/object:Gem::Version
+      version: '0'
+requirements: []
+rubyforge_project: 
+rubygems_version: 1.8.24
+signing_key: 
+specification_version: 3
+summary: A nice graphic Credit Card type field
+test_files:
+- spec/spec_helper.rb
+- spec/view_helper_spec.rb