omise / card.js Goto Github PK

View Code? Open in Web Editor NEW

6.0 6.0 3.0 1.4 MB

Deprecation Notice: Moved to Omise.js

card.js's People

Contributors

Stargazers

Watchers

Forkers

hipflat pongsakornsemsuwan pinkdiamond1

card.js's Issues

getScriptElement in card.js get wrong content and consistency

I plan to use card.js in Dialog box to paid

but when load with html example in https://docs.omise.co/card-js/ is not working
I try to reproduce getScriptElement methods so i found this

from the same page with 2 scenario normal and popup dialog

so that make omise payment popup is not have any data

IE9 (and older) compatibility

Tested www.lnwtrue.com on IE9 and got the following result:

Example Custom Integration does not work

Hi,
I was trying this 'card.js' and run into errors.

First thing first, the example in README is using gz compression and I'm not sure if it is supposed to be decompressed on the fly or not but my browser console show
card.js.gz:1 Uncaught SyntaxError: Invalid or unexpected token

When I remove the gz, the error is gone but I run into

omise.html:6 Uncaught ReferenceError: OmiseCard is not defined
omise.html:23 Uncaught ReferenceError: OmiseCard is not defined

which is understandable because when I look into card.js, there is no exporting/declaring of OmiseCard obj.

I also try get a copy of gz version and decompress it and I see no different with uncompressed version

<html>
<body>
<script type="text/javascript" src="https://cdn.omise.co/card.js.gz"></script>
<script type="text/javascript">
    // Set default parameters
    OmiseCard.configure({
        publicKey: 'YOUR_PUBLIC_KEY',
        amount: 99500
    });
    // Configuring your own custom button
    OmiseCard.configureButton('#checkout-button-1', {
        frameLabel: 'Merchant site name',
        submitLabel: 'PAY NOW',
    });
</script>
<form name="checkoutForm" method="POST" action="test.html">
    <!--Sample checkout for a 995.00 THB charge-->
    <button type="submit" id="checkout-button-1">Checkout</button>
</form>
<script type="text/javascript">OmiseCard.attach();</script>
</body>
</html>

Update usability in popup UI

1. What I pay for

2. How much I commit to pay

3. Name on card

Name of card holder
Card holder name
Name on card < shortest and clearest
Name (as it appears on your card)
Full name on card

4. My card can pay?

use logo

5. Expire date

Because this input requires a particular format for the date, we included placeholder text inside the input. Note that the placeholder text includes a “/”, but this is not required to be typed by the user. We limit the input value to numbers only, so if a user does type a forward slash, it is not registered. After the month is entered, the slash is automatically appended.

6. Security code

it’s meant to make cards more secure. The problem is that this code suffers severely from non-standardized naming. What should we call it? Every card brand has its own naming convention:

MasterCard — card validation code (“CVC2”)
Visa — card verification value (“CVV2”)
JCB -- security code < use this

select popup help depend on card number

## 7. Address should have more detail not only zipcode

[ address text area ]
[ zipcode ]

8. Add more secure feeling

submit button should have total money + secure icon under button

## 9. Show what happen after pay

result fail handle is missing

function listenToCardJsIframeMessage(event) {
    if (!event.origin) {
      return;
    };

    if (event.origin !== serverOrigin) {
      return;
    };

    if (event.data == "closeOmiseCardJsPopup") {
      hideIframe();
    } else {

      try {
        if (formObject && formObject.active) {
          var result = JSON.parse(event.data);
          omiseTokenHiddenField.value = result.omiseToken;
          hideIframe();
          formObject.submit();
        };
      }
      catch (e) {
        hideIframe();
      };

    };
  };

I can't find a way to handle error message if Omise return Error https://docs.omise.co/api/errors/
It's just cactch and hide iframe

incase that Omise return error msg correctly I still can't get error msg because of submit form only omiseToken data