var h = require('virtual-dom/h')
  , inherits = require('util').inherits
  , BaseElement = require('./base-element')

module.exports = Send

function Send(target) {
  BaseElement.call(this, target)
}

inherits(Send, BaseElement)

Send.prototype.render = function(info) {
  return h('#send', [
    h('.wrapper', [
      h('.payment-panel', [
        h('.tab-text', [
          h('h3.text-primary', 'Send Paycoins')
        ])
      , h('.available-balance', [
          h('span', 'Balance:')
        , h('h4', String(info.balance))
        ])
      , h('form.large.form-horizontal', [
          h('.form-group', [
            h('.label.col-lg-2', [
              h('label', {
                for: 'payee'
              }, 'Pay To')
            ])
          , h('.col-lg-10', [
              h('input#payee.js-payee.form-control', {
                type: 'text'
              , name: 'payee'
              })
            ])
          ])
        , h('.form-group', [
            h('.label.col-lg-2', [
              h('label', {
                for: 'label'
              }, 'Label')
            ])
          , h('.col-lg-10', [
              h('input#label.form-control', {
                type: 'text'
              , name: 'label'
              })
            ])
          ])
        ])
      ])
    ])
  ])
}

@@ -354,16 +354,30 @@
 tab-text
+.inline.m-r-sm
 ', %5B%0A   
@@ -461,16 +461,28 @@
 -balance
+.inline.w-md
 ', %5B%0A   
@@ -495,16 +495,30 @@
  h('span
+.inline.m-r-sm
 ', 'Bala
@@ -541,10 +541,29 @@
  h('
-h4
+span.font-bold.inline
 ', S
@@ -613,30 +613,8 @@
 form
-.large.form-horizontal
 ', %5B
@@ -655,38 +655,42 @@
         h('.
-label.col-lg-2
+input-group.w-full
 ', %5B%0A       
@@ -691,37 +691,65 @@
              h('
-label
+span#payee.input-group-addon.w-xs
 ', %7B%0A           
@@ -809,54 +809,11 @@
     
-%5D)%0A          , h('.col-lg-10', %5B%0A           
   
+,
  h('
@@ -871,32 +871,87 @@
    type: 'text'%0A
+              , placeholder: 'Enter a PayCoin Address'%0A
               , 
@@ -1058,26 +1058,86 @@
 h('.
-label.col-lg-2', %5B
+input-group.w-full', %5B%0A              h('span#amount.input-group-addon.w-xs', %7B
 %0A   
@@ -1151,48 +1151,227 @@
     
-h('label', %7B%0A                for: 'label
+  for: 'label'%0A              %7D, 'Label')%0A              , h('input#label.js-label.form-control', %7B%0A                type: 'text'%0A              , placeholder: 'Enter a label for this address to save it to your address book
 '%0A  
@@ -1378,34 +1378,55 @@
             
-%7D
 , 
-'Label'
+name: 'label'%0A              %7D
 )%0A          
@@ -1424,32 +1424,43 @@
            %5D)%0A  
+        %5D)%0A
         , h('.co
@@ -1461,157 +1461,728 @@
 h('.
-col-lg-10', %5B%0A              h('input#label.form-control', %7B%0A                type: 'text'%0A              , name: 'label'%0A              %7D)%0A            %5D
+form-group', %5B%0A            h('.input-group.w-full', %5B%0A              h('span#amount.input-group-addon.w-xs', %7B%0A                for: 'amount'%0A              %7D, 'Amount')%0A              , h('input#amount.js-amount.form-control', %7B%0A                type: 'text'%0A              , placeholder: 'Enter an Amount to Send'%0A              , name: 'amount'%0A              %7D)%0A            %5D)%0A          %5D)%0A          , h('.form-group', %5B%0A            h('.available-balance.inline.w-md', %5B%0A              h('span.inline.m-r-md', 'Total:')%0A            , h('h4.font-bold.inline', '123.123')%0A            %5D)%0A            , h('button#submit.js-submit.btn.btn-default.w-md.pull-right.inline', %7B%0A                type: 'submit'%0A              %7D, 'Submit'
 )%0A  

update UI