1+ <!doctype html>
2+ < html lang ="en ">
3+ < head >
4+ < meta charset ="UTF-8 ">
5+ < meta name ="viewport "
6+ content ="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0 ">
7+ < meta http-equiv ="X-UA-Compatible " content ="ie=edge ">
8+ < title > Blockchain Front</ title >
9+ < link rel ="stylesheet " href ="static/vendor/bootstrap/css/bootstrap.min.css ">
10+ < link rel ="stylesheet " href ="/static/vendor/DataTables/css/datatables.min.css ">
11+ < link rel ="stylesheet " href ="/static/vendor/font-awesome/font-awesome.min.css ">
12+ < link rel ="stylesheet " href ="/static/css/custom.css ">
13+
14+ </ head >
15+ < body style ="background: linear-gradient(110deg, #fdcd3b 60%, #ffed4b 60%); ">
16+ < nav class ="navbar navbar-expand-lg navbar-dark bg-dark fixed-top ">
17+ < div class ="container ">
18+ < a href ="# " class ="navbar-brand "> Blockchain Client</ a >
19+
20+ < div class ="collapse navbar-collapse ">
21+ < ul class ="navbar-nav ml-auto ">
22+ < li class ="nav-item ">
23+ < a href ="/ " class ="nav-link "> Wallet Generator</ a >
24+ </ li >
25+ < li class ="nav-item active ">
26+ < a href ="/make_transaction " class ="nav-link "> Make Transaction</ a >
27+ </ li >
28+ < li class ="nav-item ">
29+ < a href ="/view_transactions " class ="nav-link "> View transactions</ a >
30+ </ li >
31+ </ ul >
32+ </ div >
33+ </ div >
34+ </ nav >
35+
36+ < div class ="container ">
37+ < div class ="row ">
38+ < div class ="col-lg-12 text-center ">
39+ < div class ="card-body ">
40+ < h4 class ="card-title "> Send Coins:</ h4 >
41+ < p class ="card-text "> Enter transaction details and click on "Generate Transaction" button to generate your transaction</ p >
42+ </ div >
43+ </ div >
44+ </ div >
45+ </ div >
46+
47+
48+ < div class ="container alert alert-secondary ">
49+ < form id ="transaction_form ">
50+ < div class ="row ">
51+ < label class ="col-sm-2 "> Sender Public Key:</ label >
52+ < div class ="col-sm-10 ">
53+ < input type ="text " name ="sender_public_key " id ="sender_public_key " class ="form-control ">
54+ </ div >
55+ </ div >
56+
57+ < br >
58+
59+ < div class ="row ">
60+ < label class ="col-sm-2 "> Sender Private Key:</ label >
61+ < div class ="col-sm-10 ">
62+ < input type ="text " name ="sender_private_key " id ="sender_private_key " class ="form-control ">
63+ </ div >
64+ </ div >
65+
66+ < br >
67+
68+ < div class ="row ">
69+ < label class ="col-sm-2 "> Recipient Public Key:</ label >
70+ < div class ="col-sm-10 ">
71+ < input type ="text " name ="recipient_public_key " id ="recipient_public_key " class ="form-control ">
72+ </ div >
73+ </ div >
74+
75+ < br >
76+
77+ < div class ="row ">
78+ < label class ="col-sm-2 "> Amount:</ label >
79+ < div class ="col-sm-10 ">
80+ < input type ="text " name ="amount " id ="amount " class ="form-control ">
81+ </ div >
82+ </ div >
83+
84+ < br >
85+
86+ < div class ="row ">
87+ < div class ="col-sm-12 text-center ">
88+ < input type ="button " name ="generate_transaction " id ="generate_transaction " class ="btn btn-primary btn-lg " value ="Generate Transaction ">
89+ </ div >
90+ </ div >
91+
92+ </ form >
93+
94+
95+ </ div >
96+
97+
98+ < script src ="/static/vendor/jquery/jquery.min.js "> </ script >
99+ < script src ="/static/vendor/DataTables/js/datatables.min.js "> </ script >
100+ < script src ="/static/vendor/bootstrap/js/bootstrap.bundle.js "> </ script >
101+ < script src ="/static/vendor/DataTables/js/ellipsis.js "> </ script >
102+ < script >
103+ $ ( function ( ) {
104+ $ ( "#generate_transaction" ) . click ( function ( ) {
105+ $ . ajax ( {
106+ url : "/generate_transaction" ,
107+ type : "POST" ,
108+ dataType : 'json' ,
109+ data : $ ( '#transaction_form' ) . serialize ( ) ,
110+ success : function ( response ) {
111+ console . log ( response ) ;
112+ } ,
113+ error : function ( error ) {
114+ console . log ( error ) ;
115+ }
116+ } ) ;
117+ } ) ;
118+ } ) ;
119+ </ script >
120+ </ body >
121+ </ html >
0 commit comments