From 14594c7a4dc661831d07d6b97bfd69d7032a4ddd Mon Sep 17 00:00:00 2001
From: Rishabh Saxena <orishabh1@gmail.com>
Date: Sat, 18 Jun 2016 18:30:17 +0530
Subject: [PATCH] add payment views, styling and its helper methods

---
 app/assets/images/credit_card.png             | Bin 0 -> 4086 bytes
 app/assets/stylesheets/application.css        |   1 +
 app/assets/stylesheets/osem-payments.css.scss |  24 +++++++++++++
 app/helpers/payments_helper.rb                |  13 +++++++
 app/views/payments/_payment.html.haml         |  34 ++++++++++++++++++
 app/views/payments/index.html.haml            |  32 +++++++++++++++++
 app/views/payments/new.html.haml              |  14 ++++++++
 7 files changed, 118 insertions(+)
 create mode 100644 app/assets/images/credit_card.png
 create mode 100644 app/assets/stylesheets/osem-payments.css.scss
 create mode 100644 app/helpers/payments_helper.rb
 create mode 100644 app/views/payments/_payment.html.haml
 create mode 100644 app/views/payments/index.html.haml
 create mode 100644 app/views/payments/new.html.haml

diff --git a/app/assets/images/credit_card.png b/app/assets/images/credit_card.png
new file mode 100644
index 0000000000000000000000000000000000000000..a5e0b1e3409e051fb7def7231e977c8c133d97c8
GIT binary patch
literal 4086
zcmbW1`6JYc<Hq0bdCzTzVP+VaG>%*iX2#L5YG=rmqj98hw9SmObd0E^YcPZ~P2|kT
z5g}>1B(=Nas<aXztW_krYFB7OWxu<hKjHiQ@cQlf?Rj4Ao^EUhVLM;~d;$K8(FPjR
z%9?F!w*%T7?c}sq!!*{_CTKey4)N76do*C%Em1qr^k9^2ur@1{XypTe5g@o94aS1#
zy%=;98H&+B$HP%abTng;^k~o~0<_(SwT;rW5rTH{NUL}YyMs;^o^Fs^keREN%VDN_
zoHK_T9JI^ZJJ>VyL{wyC!r}O%ar=Zn3G!g%he$*to|uL)tEF34>zlNLP!|l=4d9+&
zkOKhFhrkX&@J>+s6^hhjYc*k}clXdbS)k>0v2|&b<&2nG%=D@;a;b@k?udwOJrLYy
z=lxX%`%naY&V$zSz@^LJS~2W<9`0MQ+EM}TpFHB%%fuCh_H-8JV;N?x5?ZcAd@U!>
zR*^ra(EiS{TFJHjQ_1SjHe9~!yLy%X`Ht7>jYBUhlKyG&$AHOHVR=Y=LEs@7|5%0a
zNFi{d9XRzwepGVfgj^AldP;sh@mw*G{1}w}24ua^IM)rzdNpJ{U`{_+GJ?(<B4j)>
zC>UTB_EO4Uqsw1AR{suGjKgXt(GAlS<+NkNxcU7#hvr%1`U$VP5%=n$UCPmfhOPu<
z_wfe<dvEl6G)?Vnn%vtwe&o^HxcpYn){miWe+EBUjDGy__><ZFT}z_Q#rW>U6E8lU
z?E9RWl6vuiytt@XUT{`gc<(}9ZGKf#Lw$Wk<yB=v!~LeFn*~??zLWJrd2ha|?rVGg
z$6jfF`=gbvT6yF1#>S3oKle8%pQQgfasTejvxnU;ejP7qdsVJ_QPt6Zzq7Ad)t>%r
zE~Rhj{J>(t&{FR6x!Tdi+s|k2yjvaY{H>#FXrOOk`1jF){?VtM&))w&JU96K``DAO
zGlPH4^^J~>^$*QHe>FGt$K=q|^2qF`_wV1&&CN}{|FAmu?w{`;mX|)hpZxlM@$2lD
z)rEzHwJ(d`zb!3(UR(OU_HUL}KQFxf=YK2yf5Kn|{=X*uKmPX#0KEouVyGU<GVb9&
z)U~~9l;v$_2}awgPsJ4-=O{MV`kGsn?q{h#W>GyE5gs{a0sEX*<W(L87U9oIJnvLL
zzsxuk<y}a;x-FOF*ZOXl72}yXlT+;VEO2*om3Q8DpQ$DDoi#iA6kdajy$`N?Do%ec
zR^L5T6VqA!G3gaO;QsdKb$TP0EJCgY54$NYH{N{ntL8sg{cm69xGf2oO}<Hmj6XU~
z{ifJ7NVz@vi$<>VkTMyXdQq|^6=|82Fx8D;mnh*JiEX(`*4kD`Gf08s$P@yNA!<*-
z-my037$t+5FcelU5R^B<Mu^(tBdd;z8+(RMME*6f$^S;k#n!cRX9MT_ETf;lyuRnk
zTG41cLIEq>@#`<&zb-GvM|L%~Ouei|n2qg)Z<YHxhiSeGMBZ`baACNoK&raqI|-z2
z_lVI7SI?ori6QLqZA2d501n-E6(_?nRQ7P}G|-o6TAm=PG%XTTJT*vP@_2gT<cD(i
z^|EXiz759Tjpq-99SzQfZLHz><Hdr>Jbu)0aDG_Sj0%aTddM#MRmUf%Y6>_U{14OO
zRJ{G82dQ}WQ;viX;skb-p4iGnki4l35UJrN9`heC2$-lS-=8ueODFlGH*ntzYxT}&
z#J@}Kw=D9_^>uz_oT6tJ6@r2eze>)#ia@s_*Jx5t3+^6;!-yKQU+$uA*AGN%*njBR
zq{(A*5oG@lx@n}K48AKttv_nI9&$k7D%+$BohA+@S~FLr^THYZLlMp9_aal))rl%)
znLU?g_D5Ag>k`Vi&<6f6h~D4?z)<T0F-jzrEx!pNZq5cn$b%CHYdwX67P!%L^L6z&
ztRDSx!tX%GZ9mQ@DaoJB>>&DVi{rp<S4}7#5k-hDhC-^fz41yy4rb%)?W+^|`R_j=
zjf&ONueL?VR%V*d*=62!@jAbV-}R;}wVORH50^Pidj}nH9J>nPScAr&&j%bViu^oa
z^<&rpM~Z*|;2rxV<)iE&Rohw#o4`HX8D?uBA||<g+C~cHFcFx0_Y?{KgQrC{-Ry;L
zmQ`<G-#V+e?a=DoYd);SF8i<trb+%IPHo<flO9Gsj$QIn+3bs+wd|L^4-XJFdj|iU
z$4+ok>CXL8Se9&FQ+oJ3Mn7?0f{DBm?hM89`y|-0OE#~jpp8dB1oA^x8-DW`;~L&U
zRW#S2ZLcZ19T3QL)%KEpkP>3NuRnarN_y$pZL<J3(TYP~@x#U(RYKKSCWVzBFL=&y
zxByH73xadVAiKrP|6&W^J)tHdv{6FDDG6d8iFj!Y1DC)Kzq8sqa0|=M7hyHnG;_PK
zHp_ZAj<{b1U#sRra9cannJp^qef&07wzL^lT?xZVTGTJ8Aj&s^vko@sb-e^($tlN#
zGPHH;32qkba{dl}>swsMmgJL@I-55kneW)y2M#!E7OL8f2~3Qew@6F2ocbX9m3?8d
zRZ68G9S9;w$R!f;JA%YQusNO8W2ha;Z~+>VVcOYm;V+alTi95sj-#<f=no@QLX>)}
zga#kyyFlJ!*%n1_&273K7i?96aV4#!MBM<rynGO;qN%?&Yo*tWr$#NPP(OOW=tt$L
z3!@UWU_RY00!(MJTd)E-OgE5;hbu2q)2UB`Bo}d_uvAK?+=%IzjM;&9DSf=gc+8Z>
zW&1D;^`vp>6Lo#Yq-?_!t%!6rGm2!OYC<hitk@J52XkYEljz2-*e4O&e`ZW>s-_h>
z_N&0aj7m73mulxUpRA!2Zkpk@LGL9NueP|J@F4|!>9U2bA2VDprlIWL3h?`BLh8*#
z1Y54cMbbdMdZim(N|S~rK-$l1+-x6R#K#octREe^5|H29?VvS5Y@?-{YJpe>?FmZ$
z7@V2yhw)+?QcL4STz4T?8%`s42|z4d1taFS<lHrLp$GkI%WN3pP9-g(z`l!8Tt&65
ze`#40t-!NY+B58qI;s+xpsavmIq68-u>xVzAvkk+t;4G17LHFVClB@@Y=0`tHsXZq
z45|?Jva<6g9^=>>{B%~cA9i2hPHh+V)I@uAruUeiW~QovhAl_C(qWosIB=si#_Pk(
zd24m)3xkamz|YADIE@F)OARC#Ul(b(7_kc}$3CeR=fc=A?&FbpH_F5Fs0=RVuJB)R
z-los+(?8MVc%oQ<zcx>2)WdWJ7nTs?D%Z_X*RzA<F31|5yNz5aV^a;(dl@PAPsND6
zO|80*$`ESLn24AX1N4-4bkWI{O8t$_?pe#>Ihx5CTw4(#71(A3_+>7xx|Zn&>4Y>I
zJRD|5u1koU-h(_zsA+O#-D4E4p?DW%ahJxRSQUa%-}np})@q}{;G^<Ck>mGAZqn}t
zz%0%=cDs;Vqe^Gxx12jrZ>aas!`M0mJV(iPruH-;?CV>yVgl{-=4frZwtPDW(>5fO
zDTkSyix@AG3#EkOwo#x^3+KP3yrZP4wRh$1WcMdKKUN6%@+?26aMJbph}*$_Ty3)(
z*1i*?<{w)N62gq^sw`1f)G<lu)iTgPUIh&SDO!9VDiDgC>o>S(f*d)a#^B(7;-u=f
z3y^MRt+=Q%$Y@!DboXe*ot}qiR0ABhtd5YuL)4{n)ePC!a*zvd0oEeomFX#chn7qq
zafRl2hMU#ezTKG-*&;+GCCx0TJB5rZ%k7$e%+XjWASWygjfh*Y9!#u1nnt$#pvHbS
z?_4ndCq2yJtUav^CMgZqCGb<(;_~$VnlaKo3CFV0UWR0kt(#)}wplPM%<L4P`n$Lq
zulqMqrvcO!M$y;XJ#Z7-WUQA*5!u&1EebS%tp?n5>>EGF;qB9GCp<Qh`QdyczEK9B
zx^B!)#(8CYqts0sV|^JCu<6?*L__>Vwf~fWul`M@hhvMz)2!sfwED|Peh*8#uyKVx
zRhaG5J5FjiHAxM)USC98GGPnphgyq?xcNqiddVA`a@qN5{XBft&H#OWQ9Qn~MniLX
zDHEqjk2fG&;=K6IT1SsajSn+rfpU>fEx*H}=@xdU(vTdiSn<8rb@#&UU(|r*qyZ4w
zv2ZfQ#_$Bp&9@BUUuNnHoYJ5m{KRf27hL^Sh=FToB1ND|2*kmlNB&#w36KMCGn;|%
zk)-f@=x<0rnh+5IWe8^;K&?1~87HOPM{#eXICoIT1gPU;)Da%)AW!O+VeZ|}S!cHY
z`xDaZ`7;1T0!?a#G7W=OrqSDyc|2Cf0yEke5y&~#nIj31r|rFT%nPkYQL(HE^tha@
zP7(trfbOJ%?05)C4&7Ucz?rdk0B{{1NTTf?@Jl=<My+vkQCninU4}BwH*t>J?f#}?
z@sfx1OU!JzFCFk>MN3(sg0K<~)=B^L9#i(7ZO4pk5TQ!AKj+xV!t|&V5X%GAXpr{d
zllDAF#WH1bfL+QoViVkO!PR#jZkhsW@lw&PnrsR>YdM<>*&ZLukYz}Ze?I7S$7;ti
zqA(*9Hf_F}o$WiHdFFPSX`5+?3jWNWRcB_{whZ4<2AU`l$_$YBujP1pMk>g@2cqOM
z?Pw5A4(Jl#Ap%4Q2l2NHVi(N}BLFe-Q@#mmrv#|8i5GwLkRD`6-IkGVL+Igo%BgWq
z&b09kHgdEu=gqQ}XKxyLIfsE+%WXsF3gs|!F<daYjm!X3JwOs+Jx&0y=3&+XQ)sWA
zRvCcf0bBsip}}1UFr2gAy%v^;wfo*YDp8r2)RUJaL7i6Si5&71ImTa%b7GQ>r(302
z!f=s1M_iPdH)$>ylZ{hk!F>AhqO=o51%8~JVJh>!je3o@a<#;Te^WqeV&Pd`Fl9Pd
z=AfrV(7VIclbEiLEh5zr^e^-jDKMBa-Qo(};v7K#o&Y}}FRrUCem<sORCNAyuj4IA
zPF(Qik1!YPOX)eGhxJ?Y=2{B9Q}fpclu;MnN?gg)+6}QQ>(bltBV#3Dk0X0@6@BK4
z-o1(!#}&9YEgL!>XpSoJZ!#5wMT!YbX|HbSa3_AmVYeQr7^qde4KD3oDV@axFl|dD
z$-ZGAQK-4!yj-1;dfD3`(WXUFDpFrJeg$htm}2Nu>1;%25&jA;C0SgV7{<@m+7g5T
zj5M8}ddvL`bdP@W3-u!#KHFgW$&c!&4Pb@T?b@MSo#v@>WXSs9-YeE2<YxB+AuSb5
z$Fe2|6OC0ZWdUuAP?H{a^)Hsz_TM#qX0IxvPcZfc7_C+|xl^{56GNJ-!kUS@Er>f-
ct3-~~5h2x4N!2mM)tZ{s`(`yk5cuK$0P%6UEdT%j

literal 0
HcmV?d00001

diff --git a/app/assets/stylesheets/application.css b/app/assets/stylesheets/application.css
index d0447354..84c0bd9a 100644
--- a/app/assets/stylesheets/application.css
+++ b/app/assets/stylesheets/application.css
@@ -10,6 +10,7 @@
  *= require osem-splash
  *= require font-awesome
  *= require osem-fonts
+ *= require osem-payments
  *= require bootstrap-markdown
  *= require bootstrap-datetimepicker
  *= require leaflet
diff --git a/app/assets/stylesheets/osem-payments.css.scss b/app/assets/stylesheets/osem-payments.css.scss
new file mode 100644
index 00000000..b74a6324
--- /dev/null
+++ b/app/assets/stylesheets/osem-payments.css.scss
@@ -0,0 +1,24 @@
+.price-tags {
+  list-style-type: none;
+  padding-top: 2rem;
+  // display: inline-block;
+}
+.price-tags li {
+  line-height: 40px;
+  position: relative;
+  margin-right: -3rem;
+}
+.price-tags a {
+  background: #2f991d;
+  color: #fff;
+  font-size: 1.5rem;
+  padding: 9px 10px;
+  text-decoration: none;
+}
+.price-tags a:after {
+  content: "";
+  float: left;
+  border-top: 20px solid transparent;
+  border-right: 20px solid #2f991d;
+  border-bottom: 20px solid transparent;
+}
diff --git a/app/helpers/payments_helper.rb b/app/helpers/payments_helper.rb
new file mode 100644
index 00000000..50b53262
--- /dev/null
+++ b/app/helpers/payments_helper.rb
@@ -0,0 +1,13 @@
+module PaymentsHelper
+  def months
+    (1..12).collect{|n| ["#{n} - #{Date::MONTHNAMES[n]}", n]}
+  end
+
+  def years
+    (Date.current.year..Date.current.year + 15)
+  end
+
+  def card_types
+    [[['Visa', 'visa'], ['MasterCard', 'master'], ['Discover', 'discover'], ['American Express', 'american_express']]]
+  end
+end
diff --git a/app/views/payments/_payment.html.haml b/app/views/payments/_payment.html.haml
new file mode 100644
index 00000000..c0f47e38
--- /dev/null
+++ b/app/views/payments/_payment.html.haml
@@ -0,0 +1,34 @@
+= semantic_form_for(@payment, url: conference_payments_path) do |f|
+  .form-group
+    = f.label :first_name, 'First name(as on card)'
+    = f.text_field :first_name, class: "form-control", placeholder: "John"
+  .form-group
+    = f.label :last_name, 'Last name(as on card)'
+    = f.text_field :last_name,class: "form-control", placeholder: "Doe"
+  %span.pull-right
+    %img.img-responsive{:src => image_url('credit_card.png')}
+  .form-group
+    = f.label :credit_card_number, "Credit Card number(without spaces)"
+    .input-group
+      = f.text_field :credit_card_number, class: "form-control", placeholder: "XXXX XXXX XXXX XXXX"
+      %span.input-group-addon
+        %i.fa.fa-credit-card
+  .form-group.col-md-6
+    = f.label :expiration_month
+    = f.select :expiration_month, months, {}, class: "form-control"
+  .form-group.col-md-6
+    = f.label :expiration_year
+    = f.select :expiration_year, years, {}, class: "form-control"
+  .form-group.col-md-10
+    = f.label :card_verification_value, 'Security Code(3 on back, AmEx: 4 on front)'
+    = f.text_field :card_verification_value, class: "form-control", placeholder: "XXX"
+    = f.number_field :amount, value: @total_amount_to_pay, class: "form-control", type: 'hidden'
+  %ul.price-tags.pull-right
+    %li.text-muted
+      you will pay
+    %li
+      %a
+        = number_to_currency @total_amount_to_pay
+  .form-group
+    = f.submit "Charge Card", class: "btn btn-primary"
+    = link_to "Cancel", conference_conference_registrations_path, class: "btn btn-danger"
diff --git a/app/views/payments/index.html.haml b/app/views/payments/index.html.haml
new file mode 100644
index 00000000..702e02e1
--- /dev/null
+++ b/app/views/payments/index.html.haml
@@ -0,0 +1,32 @@
+.container
+  .row
+    .col-md-12
+      .page-header
+        %h1
+          Payment Attempts for
+          = @conference.title
+      - if !flash[:notice].blank?
+        .alert.alert-success
+          = flash[:notice]
+      %table.table.table-bordered.table-striped
+        %tr
+          %th First Name
+          %th Last Name
+          %th Last 4
+          %th Amount
+          %th Status
+          %th Authorization Code
+        - if @payments.size > 0
+          - @payments.each do |payment|
+            %tr
+              %td= payment.first_name
+              %td= payment.last_name
+              %td= payment.last4
+              %td= number_to_currency payment.amount
+              %td= payment.status
+              %td= payment.authorization_code
+        - else
+          %tr
+            %td{:colspan => "5"} No payments have been attempted.
+      .pull-right
+        = link_to "Conference Registration", conference_conference_registrations_path(@conference.short_title), class: 'btn btn-primary'
diff --git a/app/views/payments/new.html.haml b/app/views/payments/new.html.haml
new file mode 100644
index 00000000..f7e4fc36
--- /dev/null
+++ b/app/views/payments/new.html.haml
@@ -0,0 +1,14 @@
+.container
+  .row
+    .col-xs-6.col-xs-offset-3
+      %h1
+        Buy tickets for
+        = @total_amount_to_pay.symbol
+        = humanized_money @total_amount_to_pay
+      - if @payment.errors.any?
+        .alert.alert-danger
+          %ul
+            - @payment.errors.full_messages.each do |msg|
+              %li= msg
+    .col-xs-6.col-xs-offset-3.well
+      = render partial: 'payment'