summaryrefslogtreecommitdiff
path: root/src/frontend_blog/essay_cc-form.html
blob: 672942e59c91ae7b4b8636c82551e9668bd51e51 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
<html>
  <head>
    <link rel="stylesheet" type="text/css" href="../style.css">
  </head>
  <body lang="en" bgcolor="#FFFFFF" text="#000000" link="#0000FF" vlink="#800080" alink="#FF0000">
    <header>
      <div id="logo"><img src="../gnu.svg" height="100" width="100"></div>
      <h1>Credit card payment</h1>
    </header>
    <section id="main">
      <h1>Enter your details</h1>
      <p>We need a few details before proceeding with credit card payment</p>
      <form>
        First name<br> <input type="text"></input><br>
        Family name<br> <input type="text"></input><br>
        Age<br> <input type="text"></input><br>
        Nationality<br> <input type="text"></input><br>
        Gender<br> <input type="radio" name"gender">Male</input>
        <input type="radio" name="gender">Female</input><br>
        <input id='article-name' type="hidden" value="{article}"></input>
      </form>
      <form method="post" action="essay_cc-fulfillment.php?article={article}">
        <input type="submit"></input>
      </form>
    </section>
    <script type="application/javascript">
    function handle_contract(json_contract) {
      var cEvent = new CustomEvent('taler-contract',
                                   {detail: json_contract});
      document.dispatchEvent(cEvent);
    };

    function get_contract(article) {
      var contract_request = new XMLHttpRequest();
      contract_request.open("GET",
                            "essay_contract.php?article=" + article,
	                    true);
      contract_request.onload = function (e) {
        if (contract_request.readyState == 4) {
          if (contract_request.status == 200) {
            console.log("response text:",
	                contract_request.responseText);
            handle_contract(contract_request.responseText);
          } else {
          alert("Failure to download contract from merchant " +
                "(" + contract_request.status + "):\n" +
                contract_request.responseText);
          }
        } 
      };
      contract_request.onerror = function (e) {
        alert("Failure requesting the contract:\n"
              + contract_request.statusText);
        };
      contract_request.send();
    }

    function has_taler_wallet_cb(aEvent){
      var article = document.getElementById('article-name');
      get_contract(article.value); 
    };
  
    function signal_taler_wallet_onload(){
      var eve = new Event('taler-probe');
      document.dispatchEvent(eve);
    };
  
    document.addEventListener("taler-wallet-present",
                              has_taler_wallet_cb,
                              false);
  
    // Register event to be triggered by the wallet when it gets enabled while
    // the user is on the payment page
    document.addEventListener("taler-load",
                              signal_taler_wallet_onload,
                              false);

    function executePayment(H_contract, pay_url, offering_url) {
      var detail = {
        H_contract: H_contract,
        pay_url: pay_url,
        offering_url: offering_url
      };
      var eve = new CustomEvent('taler-execute-payment', {detail: detail});
      document.dispatchEvent(eve);
    }
    </script>
    <script type="application/javascript" src="taler-presence.js"></script>
    <script type="text/javascript">
      {jscode}
    </script>
  </body>
</html>