- Sample bank application to test the TIC deployment

- Refer README for more instructions
parent 7f5dccf3
# Logs
logs
*.log
npm-debug.log*
yarn-debug.log*
yarn-error.log*
lerna-debug.log*
# Diagnostic reports (https://nodejs.org/api/report.html)
report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
# Runtime data
pids
*.pid
*.seed
*.pid.lock
# Directory for instrumented libs generated by jscoverage/JSCover
lib-cov
# Coverage directory used by tools like istanbul
coverage
*.lcov
# nyc test coverage
.nyc_output
# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
.grunt
# Bower dependency directory (https://bower.io/)
bower_components
# node-waf configuration
.lock-wscript
# Compiled binary addons (https://nodejs.org/api/addons.html)
build/Release
# Dependency directories
node_modules/
jspm_packages/
# TypeScript v1 declaration files
typings/
# TypeScript cache
*.tsbuildinfo
# Optional npm cache directory
.npm
# Optional eslint cache
.eslintcache
# Microbundle cache
.rpt2_cache/
.rts2_cache_cjs/
.rts2_cache_es/
.rts2_cache_umd/
# Optional REPL history
.node_repl_history
# Output of 'npm pack'
*.tgz
# Yarn Integrity file
.yarn-integrity
# dotenv environment variables file
.env
.env.test
# parcel-bundler cache (https://parceljs.org/)
.cache
# Next.js build output
.next
# Nuxt.js build / generate output
.nuxt
dist
# Gatsby files
.cache/
# Comment in the public line in if your project uses Gatsby and *not* Next.js
# https://nextjs.org/blog/next-9-1#public-directory-support
# public
# vuepress build output
.vuepress/dist
# Serverless directories
.serverless/
# FuseBox cache
.fusebox/
# DynamoDB Local files
.dynamodb/
# TernJS port file
.tern-port
# Reference : https://github.com/mhart/alpine-node#example-dockerfile-for-your-own-nodejs-project
# This stage installs our modules
FROM mhart/alpine-node:12
LABEL stage=bank-app-stage1-docker-builder
WORKDIR /app
COPY package.json package-lock.json ./
# If you have native dependencies, you'll need extra tools
# RUN apk add --no-cache make gcc g++ python3
RUN apk add --no-cache make g++ python3
RUN npm ci --prod
# Then we copy over the modules from above onto a `slim` image
FROM mhart/alpine-node:slim-12
LABEL stage=bank-app-stage2-docker-builder
# If possible, run your container using `docker run --init`
# Otherwise, you can use `tini`:
# RUN apk add --no-cache tini
# ENTRYPOINT ["/sbin/tini", "--"]
WORKDIR /app
COPY --from=0 /app .
COPY . .
EXPOSE 3000
CMD [ "node", "app.js" ]
Apache License
Version 2.0, January 2004
http://www.apache.org/licenses/
TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
1. Definitions.
"License" shall mean the terms and conditions for use, reproduction,
and distribution as defined by Sections 1 through 9 of this document.
"Licensor" shall mean the copyright owner or entity authorized by
the copyright owner that is granting the License.
"Legal Entity" shall mean the union of the acting entity and all
other entities that control, are controlled by, or are under common
control with that entity. For the purposes of this definition,
"control" means (i) the power, direct or indirect, to cause the
direction or management of such entity, whether by contract or
otherwise, or (ii) ownership of fifty percent (50%) or more of the
outstanding shares, or (iii) beneficial ownership of such entity.
"You" (or "Your") shall mean an individual or Legal Entity
exercising permissions granted by this License.
"Source" form shall mean the preferred form for making modifications,
including but not limited to software source code, documentation
source, and configuration files.
"Object" form shall mean any form resulting from mechanical
transformation or translation of a Source form, including but
not limited to compiled object code, generated documentation,
and conversions to other media types.
"Work" shall mean the work of authorship, whether in Source or
Object form, made available under the License, as indicated by a
copyright notice that is included in or attached to the work
(an example is provided in the Appendix below).
"Derivative Works" shall mean any work, whether in Source or Object
form, that is based on (or derived from) the Work and for which the
editorial revisions, annotations, elaborations, or other modifications
represent, as a whole, an original work of authorship. For the purposes
of this License, Derivative Works shall not include works that remain
separable from, or merely link (or bind by name) to the interfaces of,
the Work and Derivative Works thereof.
"Contribution" shall mean any work of authorship, including
the original version of the Work and any modifications or additions
to that Work or Derivative Works thereof, that is intentionally
submitted to Licensor for inclusion in the Work by the copyright owner
or by an individual or Legal Entity authorized to submit on behalf of
the copyright owner. For the purposes of this definition, "submitted"
means any form of electronic, verbal, or written communication sent
to the Licensor or its representatives, including but not limited to
communication on electronic mailing lists, source code control systems,
and issue tracking systems that are managed by, or on behalf of, the
Licensor for the purpose of discussing and improving the Work, but
excluding communication that is conspicuously marked or otherwise
designated in writing by the copyright owner as "Not a Contribution."
"Contributor" shall mean Licensor and any individual or Legal Entity
on behalf of whom a Contribution has been received by Licensor and
subsequently incorporated within the Work.
2. Grant of Copyright License. Subject to the terms and conditions of
this License, each Contributor hereby grants to You a perpetual,
worldwide, non-exclusive, no-charge, royalty-free, irrevocable
copyright license to reproduce, prepare Derivative Works of,
publicly display, publicly perform, sublicense, and distribute the
Work and such Derivative Works in Source or Object form.
3. Grant of Patent License. Subject to the terms and conditions of
this License, each Contributor hereby grants to You a perpetual,
worldwide, non-exclusive, no-charge, royalty-free, irrevocable
(except as stated in this section) patent license to make, have made,
use, offer to sell, sell, import, and otherwise transfer the Work,
where such license applies only to those patent claims licensable
by such Contributor that are necessarily infringed by their
Contribution(s) alone or by combination of their Contribution(s)
with the Work to which such Contribution(s) was submitted. If You
institute patent litigation against any entity (including a
cross-claim or counterclaim in a lawsuit) alleging that the Work
or a Contribution incorporated within the Work constitutes direct
or contributory patent infringement, then any patent licenses
granted to You under this License for that Work shall terminate
as of the date such litigation is filed.
4. Redistribution. You may reproduce and distribute copies of the
Work or Derivative Works thereof in any medium, with or without
modifications, and in Source or Object form, provided that You
meet the following conditions:
(a) You must give any other recipients of the Work or
Derivative Works a copy of this License; and
(b) You must cause any modified files to carry prominent notices
stating that You changed the files; and
(c) You must retain, in the Source form of any Derivative Works
that You distribute, all copyright, patent, trademark, and
attribution notices from the Source form of the Work,
excluding those notices that do not pertain to any part of
the Derivative Works; and
(d) If the Work includes a "NOTICE" text file as part of its
distribution, then any Derivative Works that You distribute must
include a readable copy of the attribution notices contained
within such NOTICE file, excluding those notices that do not
pertain to any part of the Derivative Works, in at least one
of the following places: within a NOTICE text file distributed
as part of the Derivative Works; within the Source form or
documentation, if provided along with the Derivative Works; or,
within a display generated by the Derivative Works, if and
wherever such third-party notices normally appear. The contents
of the NOTICE file are for informational purposes only and
do not modify the License. You may add Your own attribution
notices within Derivative Works that You distribute, alongside
or as an addendum to the NOTICE text from the Work, provided
that such additional attribution notices cannot be construed
as modifying the License.
You may add Your own copyright statement to Your modifications and
may provide additional or different license terms and conditions
for use, reproduction, or distribution of Your modifications, or
for any such Derivative Works as a whole, provided Your use,
reproduction, and distribution of the Work otherwise complies with
the conditions stated in this License.
5. Submission of Contributions. Unless You explicitly state otherwise,
any Contribution intentionally submitted for inclusion in the Work
by You to the Licensor shall be under the terms and conditions of
this License, without any additional terms or conditions.
Notwithstanding the above, nothing herein shall supersede or modify
the terms of any separate license agreement you may have executed
with Licensor regarding such Contributions.
6. Trademarks. This License does not grant permission to use the trade
names, trademarks, service marks, or product names of the Licensor,
except as required for reasonable and customary use in describing the
origin of the Work and reproducing the content of the NOTICE file.
7. Disclaimer of Warranty. Unless required by applicable law or
agreed to in writing, Licensor provides the Work (and each
Contributor provides its Contributions) on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
implied, including, without limitation, any warranties or conditions
of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A
PARTICULAR PURPOSE. You are solely responsible for determining the
appropriateness of using or redistributing the Work and assume any
risks associated with Your exercise of permissions under this License.
8. Limitation of Liability. In no event and under no legal theory,
whether in tort (including negligence), contract, or otherwise,
unless required by applicable law (such as deliberate and grossly
negligent acts) or agreed to in writing, shall any Contributor be
liable to You for damages, including any direct, indirect, special,
incidental, or consequential damages of any character arising as a
result of this License or out of the use or inability to use the
Work (including but not limited to damages for loss of goodwill,
work stoppage, computer failure or malfunction, or any and all
other commercial damages or losses), even if such Contributor
has been advised of the possibility of such damages.
9. Accepting Warranty or Additional Liability. While redistributing
the Work or Derivative Works thereof, You may choose to offer,
and charge a fee for, acceptance of support, warranty, indemnity,
or other liability obligations and/or rights consistent with this
License. However, in accepting such obligations, You may act only
on Your own behalf and on Your sole responsibility, not on behalf
of any other Contributor, and only if You agree to indemnify,
defend, and hold each Contributor harmless for any liability
incurred by, or claims asserted against, such Contributor by reason
of your accepting any such warranty or additional liability.
END OF TERMS AND CONDITIONS
APPENDIX: How to apply the Apache License to your work.
To apply the Apache License to your work, attach the following
boilerplate notice, with the fields enclosed by brackets "[]"
replaced with your own identifying information. (Don't include
the brackets!) The text should be enclosed in the appropriate
comment syntax for the file format. We also recommend that a
file or class name and description of purpose be included on the
same "printed page" as the copyright notice for easier
identification within third-party archives.
Copyright [yyyy] [name of copyright owner]
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
# Articonf bank Node App
# Requirements
1. Bityoga fabric sdk should be up and running
2. Node version
- Supports node version >=v11.0.0
- Tested with v11.0.0
# Run Instructions
1. ## Clone this repository
- git clone https://github.com/bityoga/articonf-bank-app.git
2. ## Run npm install
- cd articonf-bank-app/
- #### Set node version
- nvm use node v11.Updated REAdm0.0 (using nvm)
- **Execute Command :** npm install
3. ## Update fabric ip address in 'articonf-bank-app/fabric_node_sdk_helper/network_profile.json'
- (For other New App Developers) fabric_node_sdk_helper is available in git repository : https://github.com/bityoga/fabric_node_sdk_helper.git
- **update the url ip addresses of orderer, peer2, orgca, tlsca (4 places)**.
- update it with your prime manager's ip address
4. ## Retrieve hyperledger fabric tls certificates of 'orderer' and 'peer2'
#### Through shell script - needs ssh permission
- cd articonf-bank-app/fabric_node_sdk_helper
- In 'articonf-bank-app/fabric_node_sdk_helper/get_tls_certificates.sh' Replace **IP_ADDRESS="178.62.207.235"** with your fabric prime manager's ip address
- **Execute Command :** bash get_tls_certificates.sh
#### (OR) Through Manual scp commands - needs ssh permission
- Replace ipaddress in the below scp commands with your fabric prime manager's ip address.
- scp -r root@178.62.207.235:/root/hlft-store/orderer/tls-msp/tlscacerts/tls-tlsca-7054.pem .articonf-bank-app/fabric_node_sdk_helper/hlft-store/orderer/tls-msp/tlscacerts/tls-tlsca-7054.pem
- scp -r root@178.62.207.235:/root/hlft-store/peer2/tls-msp/tlscacerts/tls-tlsca-7054.pem .articonf-bank-app/fabric_node_sdk_helper/hlft-store/peer2/tls-msp/tlscacerts/tls-tlsca-7054.pem
#### (OR) Manually edit the following two files - no need of ssh permission
- articonf-bank-app/fabric_node_sdk_helper/hlft-store/orderer/tls-msp/tlscacerts/tls-tlsca-7054.pem
- articonf-bank-app/fabric_node_sdk_helper/hlft-store/peer2/tls-msp/tlscacerts/tls-tlsca-7054.pem
5. ## Start App
- cd articonf-bank-app/
- **Execute Command :** node app.js
- app will be running in 'localhost' at port 3000
- open in browser: http://localhost:3000/
## Dockerisation
### 1) Build Docker Image
```sh
$ git clone https://github.com/bityoga/articonf-bank-app.git
$ cd articonf-bank-app
```
Do step 3 & 4 as said above
```sh
$ docker build --tag bank-app .
```
### 2a) Run as a docker container
```sh
$ docker run -d --name bank-app -p 3000:3000 bank-app:latest
```
### 2b) Run as a docker service with replicas
```sh
$ docker service create --name bank-service --replicas 1 -p 3000:3000 bank-app:latest
```
// import app essential libraries
const express = require("express");
const session = require("express-session");
const formidable = require("express-formidable");
var bodyParser = require("body-parser");
// import fabric node sdk helper functions
const enrollAdmin = require("./fabric_node_sdk_helper/enrollAdmin");
const registerUser = require("./fabric_node_sdk_helper/registerUser");
const querychaincode = require("./fabric_node_sdk_helper/query");
const invokechaincode = require("./fabric_node_sdk_helper/invoke");
const { load_certificates_from_wallet } = require("./fileread");
const { sqlite_json_insert } = require("./db_query");
const { check_login_and_load_certificates } = require("./db_query");
const { db_query } = require("./db_query");
// Create a express object
const app = express();
app.use(session({ secret: "ssshhhhh" }));
// Body-parser
app.use(bodyParser.json()); // to support JSON-encoded bodies
app.use(
bodyParser.urlencoded({
// to support URL-encoded bodies
extended: true,
})
);
// Create a router for the express object
const router = express.Router();
const app_port_number = 3000;
var app_session;
async function load_html_template_and_start_app(app_port_number) {
try {
//add the router
//Store all HTML files in view folder.
app.use(express.static(__dirname + "/html/view"));
//Store all JS and CSS in Scripts folder.
app.use(express.static(__dirname + "/html/script"));
app.use("/", router);
app.listen(process.env.port || app_port_number, "0.0.0.0");
console.log(
`######## App is Running at Port - ${app_port_number} #############`
);
} catch (error) {
console.error(`Failed to load_html_template: ${error}`);
process.exit(1);
}
}
app.post("/register", async (req, res) => {
console.log("inside register");
let html_json_data;
let user_role = "client";
let register_status = "success";
let combined_user_data;
let fabric_register_status;
let json_response = {};
try {
html_json_data = req.body;
console.log(html_json_data);
fabric_register_status = await registerUser(
html_json_data["User_Name"],
html_json_data["User_Password"],
user_role
);
console.log(fabric_register_status);
if (fabric_register_status.includes("Success")) {
let user_certificates_json = await load_certificates_from_wallet(
html_json_data["User_Name"]
);
combined_user_data = { ...html_json_data, ...user_certificates_json };
let insert_status = await sqlite_json_insert(combined_user_data, "User");
register_status = insert_status;
} else {
register_status = fabric_register_status;
}
} catch (e) {
console.log(e);
register_status = e;
} finally {
json_response["status"] = register_status;
res.json(json_response);
}
});
app.post("/", async (req, res) => {
app_session = req.session;
let response;
console.log(app_session);
if (app_session.user_name && app_session.password) {
console.log("session exists");
let user_assets = await get_user_assets_from_chaicode();
let all_assets = await get_all_assets_from_chaicode();
var user_assets_json = JSON.parse(user_assets["data"]);
var all_assets_json = JSON.parse(all_assets["data"]);
console.log("all_assets_json");
console.log(all_assets_json);
app_session.assets = [];
for (var i = 0; i < all_assets_json.length; i++) {
console.log("all_assets_json[i].Key");
app_session.assets.push(all_assets_json[i].Key);
}
console.log("app_session.assets");
console.log(app_session.assets);
app_session.balance = user_assets_json["Balance"];
//app_session.capacity = user_assets_json['size'];
response = {
status: "session active",
user_name: app_session.user_name,
user_password: app_session.password,
wallet: app_session.balance,
address: app_session.address,
smart_meter_id: app_session.smart_meter_id,
capacity: app_session.capacity,
assets: app_session.assets,
};
console.log(response);
} else {
response = {
status: "session not active",
};
console.log(response);
//res.json(response);
}
res.json(response);
});
app.post("/logout", async (req, res) => {
app_session = req.session;
app_session.destroy((err) => {
if (err) {
return console.log(err);
}
res.redirect("/");
});
});
// app.get('/logout', async (req, res,next) => {
// if (req.session) {
// // delete session object
// req.session.destroy(function(err) {
// if(err) {
// return next(err);
// } else {
// return res.redirect('/');
// }
// });
// }
// });
app.post("/login", async (req, res) => {
let html_json_data = req.body;
let user_name = html_json_data["Login_User_Name"];
let user_password = html_json_data["Login_Password"];
let login_status = await check_login_and_load_certificates(
user_name,
user_password
);
if (login_status["status"] === "success") {
app_session = req.session;
app_session.user_name = user_name;
app_session.password = user_password;
app_session.user_id = login_status["User_Id"];
app_session.assets = [];
user_assets = await get_user_assets_from_chaicode();
let all_assets = await get_all_assets_from_chaicode();
var user_assets_json = JSON.parse(user_assets["data"]);
var all_assets_json = JSON.parse(all_assets["data"]);
console.log("all_assets_json");
console.log(all_assets_json.length);
for (var i = 0; i < all_assets_json.length; i++) {
console.log("all_assets_json[i].Key");
app_session.assets.push(all_assets_json[i].Key);
}
console.log("app_session.assets");
console.log(app_session.assets);
app_session.balance = user_assets_json["amount"];
app_session.address = user_assets_json["color"];
app_session.smart_meter_id = user_assets_json["owner"];
app_session.capacity = user_assets_json["size"];
}
let response = {
status: login_status["status"],
//user_assets: user_assets,
};
console.log(response);
res.json(response);
});
app.post("/ad_submit", async (req, res) => {
let response;
app_session = req.session;
if (app_session.user_name && app_session.password) {
let user_name = app_session.user_name;
let html_json_data = req.body;
//html_json_data["User_Capacity"] = app_session.capacity;
// let post_timestamp = html_json_data["Posted_Timestamp"];
// let bank_to_sell = html_json_data["bank_To_Sell"];
// let cost = html_json_data["Cost"];
let session_info = {
User_Id: app_session.user_id,
};
let combined_user_data = { ...html_json_data, ...session_info };
let insert_status = await sqlite_json_insert(
combined_user_data,
"Advertisement"
);
response = {
status: "success",
data: insert_status,
};
} else {
response = {
status: "Failed",
data: "Session Expired - Please Login",
};
}
console.log(response);
res.json(response);
});
app.post("/sell", async (req, res) => {
let response;
let car_license_plate = req.body.car_license_plate;
let CHAIN_CODE_NAME = req.body.Chain_Code_Name;
let CHAIN_CODE_FUNCTION_NAME = req.body.Chain_Code_Function_Name;
let HISTORY_USER_NAME = req.body.History_User_Name;
app_session = req.session;
if (app_session.user_name && app_session.password) {
let user_name = app_session.user_name;
const CHANNEL_NAME = "appchannel";
//const CHAIN_CODE_NAME = "carcc";
//const CHAIN_CODE_FUNCTION_NAME = "createCar";
let invoke_result = await querychaincode(
user_name,
CHANNEL_NAME,
CHAIN_CODE_NAME,
CHAIN_CODE_FUNCTION_NAME,
HISTORY_USER_NAME
);
response = {
status: "success",
data: invoke_result,
};
} else {
response = {
status: "Failed",
data: "Session Expired - Please Login",
};
}
console.log(response);
res.json(response);
});
app.post("/create_user_asset", async (req, res) => {
let response;
let user_name = req.body.User_Name;
let user_wallet = "100";
let CHAIN_CODE_NAME = "bank";
let CHAIN_CODE_FUNCTION_NAME = "CreateAsset";
app_session = req.session;
const CHANNEL_NAME = "appchannel";
let invoke_result = await invokechaincode(
user_name,
CHANNEL_NAME,
CHAIN_CODE_NAME,
CHAIN_CODE_FUNCTION_NAME,
user_name,
user_wallet,
"Initial Credit"
);
response = {
status: "success",
data: invoke_result,
};
console.log(response);
res.json(response);
});
app.post("/buy_confirm_invoke_chaincode", async (req, res) => {
let response;
app_session = req.session;
let from_user_name = app_session.user_name;
let to_user_name = req.body.seller_user_input;
let amount = req.body.total_power_price_input;
let CHAIN_CODE_NAME = "bank";
let CHAIN_CODE_FUNCTION_NAME = "TransferBalance";
if (app_session.user_name && app_session.password) {
let user_name = app_session.user_name;
const CHANNEL_NAME = "appchannel";
//const CHAIN_CODE_NAME = "carcc";
//const CHAIN_CODE_FUNCTION_NAME = "createCar";
let invoke_result = await invokechaincode(
user_name,
CHANNEL_NAME,
CHAIN_CODE_NAME,
CHAIN_CODE_FUNCTION_NAME,
from_user_name,
to_user_name,
amount
);
let user_assets = await get_user_assets_from_chaicode();
var user_assets_json = JSON.parse(user_assets["data"]);
app_session = req.session;
app_session.balance = user_assets_json["Balance"];
//app_session.address = user_assets_json['color'];
//app_session.smart_meter_id = user_assets_json['owner'];
app_session.capacity = user_assets_json["size"];
console.log("after buy");
console.log(app_session);
response = {
status: "success",
data: invoke_result,
user_balance: app_session.balance,
user_capacity: app_session.capacity,
};
} else {
response = {
status: "Failed",
data: "Session Expired - Please Login",
};
}
console.log(response);
res.json(response);
});
app.post("/query_chain_code", async (req, res) => {
let response;
let CHAIN_CODE_NAME = req.body.Chain_Code_Name;
let CHAIN_CODE_FUNCTION_NAME = req.body.Chain_Code_Function_Name;
app_session = req.session;
if (app_session.user_name && app_session.password) {
let user_name = app_session.user_name;
let CHANNEL_NAME = "appchannel";
//let CHAIN_CODE_NAME = "carcc";
//let CHAIN_CODE_FUNCTION_NAME = "listCars";
let query_result = await querychaincode(
user_name,
CHANNEL_NAME,
CHAIN_CODE_NAME,
CHAIN_CODE_FUNCTION_NAME
);
response = {
status: "success",
data: query_result,
};
} else {
response = {
status: "Failed",
data: "Session Expired - Please Login",
};
}
console.log(response);
res.json(response);
});
app.post("/get_user_balance", async (req, res) => {
let response;
let CHAIN_CODE_NAME = "bank";
let CHAIN_CODE_FUNCTION_NAME = "ReadAsset";
let QUERY_USER_NAME = req.body.Query_User_Name;
app_session = req.session;
if (app_session.user_name && app_session.password) {
let user_name = app_session.user_name;
let CHANNEL_NAME = "appchannel";
//let CHAIN_CODE_NAME = "carcc";
//let CHAIN_CODE_FUNCTION_NAME = "listCars";
let query_result = await querychaincode(
user_name,
CHANNEL_NAME,
CHAIN_CODE_NAME,
CHAIN_CODE_FUNCTION_NAME,
QUERY_USER_NAME
);
response = {
status: "success",
data: query_result,
};
} else {
response = {
status: "Failed",
data: "Session Expired - Please Login",
};
}
console.log(response);
res.json(response);
});
app.post("/transfer_amount", async (req, res) => {
let response;
let CHAIN_CODE_NAME = "bank";
let CHAIN_CODE_FUNCTION_NAME = "TransferBalance";
let FROM_USER_NAME = req.body.From_User_Name;
let TO_USER_NAME = req.body.To_User_Name;
let AMOUNT = req.body.Amount;
let REASON = req.body.Reason;
app_session = req.session;
if (app_session.user_name && app_session.password) {
let user_name = app_session.user_name;
let CHANNEL_NAME = "appchannel";
//let CHAIN_CODE_NAME = "carcc";
//let CHAIN_CODE_FUNCTION_NAME = "listCars";
let query_result = await invokechaincode(
user_name,
CHANNEL_NAME,
CHAIN_CODE_NAME,
CHAIN_CODE_FUNCTION_NAME,
FROM_USER_NAME,
TO_USER_NAME,
AMOUNT,
REASON
);
response = {
status: "success",
data: query_result,
};
} else {
response = {
status: "Failed",
data: "Session Expired - Please Login",
};
}
console.log(response);
res.json(response);
});
async function get_user_assets_from_chaicode() {
let response;
let CHAIN_CODE_NAME = "bank";
let CHAIN_CODE_FUNCTION_NAME = "ReadAsset";
//app_session = req.session;
if (app_session.user_name && app_session.password) {
let user_name = app_session.user_name;
let CHANNEL_NAME = "appchannel";
//let CHAIN_CODE_NAME = "carcc";
//let CHAIN_CODE_FUNCTION_NAME = "listCars";
let query_result = await querychaincode(
user_name,
CHANNEL_NAME,
CHAIN_CODE_NAME,
CHAIN_CODE_FUNCTION_NAME,
user_name
);
response = {
status: "success",
data: query_result,
};
} else {
response = {
status: "Failed",
data: "Session Expired - Please Login",
};
}
return response;
//console.log(response);
//res.json(response);
}
async function get_all_assets_from_chaicode() {
let response;
let CHAIN_CODE_NAME = "bank";
let CHAIN_CODE_FUNCTION_NAME = "GetAllAssets";
//app_session = req.session;
if (app_session.user_name && app_session.password) {
let user_name = app_session.user_name;
let CHANNEL_NAME = "appchannel";
//let CHAIN_CODE_NAME = "carcc";
//let CHAIN_CODE_FUNCTION_NAME = "listCars";
let query_result = await querychaincode(
user_name,
CHANNEL_NAME,
CHAIN_CODE_NAME,
CHAIN_CODE_FUNCTION_NAME
);
response = {
status: "success",
data: query_result,
};
} else {
response = {
status: "Failed",
data: "Session Expired - Please Login",
};
}
return response;
//console.log(response);
//res.json(response);
}
app.post("/buy_ad_loader", async (req, res) => {
let response;
app_session = req.session;
if (app_session.user_name && app_session.password) {
let sql_query =
"SELECT Advertisement.*, User.User_Name, User.User_Image,User.User_Profile_Rating,User.Accumulated_Generated_Power FROM Advertisement JOIN User USING(User_Id) order by(Advertisement.Posted_Timestamp) desc";
let db_query_result = await db_query(sql_query);
response = {
status: "success",
data: db_query_result,
};
} else {
response = {
status: "Failed",
data: "Session Expired - Please Login",
};
}
console.log(response);
res.json(response);
});
async function main() {
admin_enroll_status = await enrollAdmin();
console.log(admin_enroll_status);
await load_html_template_and_start_app(app_port_number);
}
main();
#!/bin/bash
set -x #echo on
docker build --tag bank-app . &&
docker image prune --filter label=stage=bank-app-stage1-docker-builder --force &&
docker image prune --filter label=stage=bank-app-stage2-docker-builder --force &&
docker image rm mhart/alpine-node:12 --force &&
docker image rm mhart/alpine-node:slim-12 --force
var express = require("express");
//const sqlite3 = require('sqlite3').verbose();
let db_name = "bank.sqlite";
const sqlite3_async = require("sqlite-async");
var fs = require("fs").promises;
const { write_certificates_from_db_to_wallet } = require("./fileread");
//let table_name = "User";
// let json = {
// "User_Id": "2",
// "User_Name": "1",
// "User_Password": "1",
// "User_Enrollment_Certificate": "1",
// "User_Public_Key": "1",
// "User_Private_Key": "1",
// "User_Image": "1",
// "User_House_Number": "1",
// "User_Address": "1",
// "User_Geo_Location": "1",
// "User_Asset_Balance": 0,
// "Available_bank_Sources": "1",
// "Accumulated_Generated_Power": 0,
// "Accumulated_Consumed_Power": 0,
// "Smart_Meter_Reading_Updated_Timestamp": "1",
// "User_Profile_Rating": 0,
// "Sell_Count": 0,
// "Buy_Count" :0,
// "Profile_Updated_Timestamp":"1"
// };
async function sqlite_json_insert(json_dict, table_name) {
let insert_status;
try {
table_keys = Object.keys(json_dict).join(", ");
table_values = Object.values(json_dict).join("','");
let sql =
"INSERT INTO " +
table_name +
"(" +
table_keys +
") VALUES ('" +
table_values +
"')";
console.log(sql);
// open the database connection
let db_con = await sqlite3_async.open(db_name);
insert_status = await db_con.run(sql);
if ("changes" in insert_status) {
if (insert_status["changes"] > 0) {
insert_status = "success";
}
}
await db_con.close();
} catch (e) {
insert_status = e;
} finally {
return insert_status;
}
}
// const {load_certificates_from_wallet} = require('./fileread');
// async function check_insert(){
// let html_json_data = {
// "User_Name" : "ark",
// "user_Password": "ark",
// "User_House_Number" : "4A"
// }
// let user_certificates_json = await load_certificates_from_wallet(html_json_data["User_Name"]);
// let combined_user_data = {...html_json_data,...user_certificates_json};
// let insert_status = await sqlite_json_insert(combined_user_data,"User");
// console.log(insert_status);
// }
// check_insert();
async function check_login_and_load_certificates(user_name, user_password) {
let login_status = {};
login_status["status"] = "";
try {
console.log("1");
let db_con = await sqlite3_async.open(db_name);
let let_sql_query =
'SELECT * FROM User where User.User_Name = "' + user_name + '" ;';
console.log(let_sql_query);
const result = await db_con.all(let_sql_query);
await db_con.close();
console.log(result.length);
console.log("2");
if (result.length > 0) {
let user_info = result[0];
login_status["User_Id"] = user_info["User_Id"];
if (user_info["User_Password"] === user_password) {
let enrollment_json = JSON.parse(
user_info["User_Enrollment_Certificate"]
);
let enrollment_signingIdentity =
enrollment_json["enrollment"]["signingIdentity"];
console.log(
"enrollment_signingIdentity = " + enrollment_signingIdentity
);
console.log("3");
//console.log(user_info);
write_status = await write_certificates_from_db_to_wallet(
user_info,
enrollment_signingIdentity
);
console.log(write_status);
login_status["status"] = write_status;
console.log("4");
} else {
login_status["status"] = "Password is wrong";
}
} else {
login_status["status"] = "Account does not exist - Please register";
}
} catch (e) {
console.log(e);
login_status["status"] = e;
} finally {
console.log("5");
return login_status;
}
}
// async function check_login(){
// let login_status = await check_login_and_load_certificates("ark","ark");
// console.log(login_status);
// }
// check_login();
async function db_query(let_sql_query) {
let status;
try {
console.log("1");
let db_con = await sqlite3_async.open(db_name);
//let let_sql_query = 'SELECT * FROM '+table_name+';';
console.log(let_sql_query);
const result = await db_con.all(let_sql_query);
await db_con.close();
console.log(result.length);
console.log("2");
status = result;
} catch (e) {
console.log(e);
status = e;
} finally {
console.log("5");
return status;
}
}
module.exports = {
sqlite_json_insert: sqlite_json_insert,
check_login_and_load_certificates: check_login_and_load_certificates,
db_query: db_query,
};
# Fabric SDK Adaptor
Node sdk examples to interact with bityoga fabric set up
# Requirements
1. Bityoga fabric sdk should be up and running
2. Node version
- Supports node version >=8
- Tested with v8.10.0
# Run Instructions
1. ## Clone this repository into your app directory
- git clone https://github.com/bityoga/fabric_node_sdk_helper.git
2. ## Update your app's package.json
- Edit your app's **package.json with the "fabric_node_sdk_helper/package.json"** found in this repository.
3. ## Run npm install
- #### Set node version
- nvm use node v8.9.0 (using nvm)
- npm install
3. ## Update ip address in 'fabric_node_sdk_helper/network_profile.json'
- **update the url ip addresses of orderer, peer2, orgca, tlsca (4 places).**
- update it with your prime manager's ip address
4. ## Retrieve hyperledger fabric tls certificates of 'orderer' and 'peer2'
#### Through shell script - needs ssh permission
- cd fabric_node_sdk_helper/
- In 'fabric_node_sdk_helper/get_tls_certificates.sh' Replace **IP_ADDRESS="178.62.207.235"** with your fabric prime manager's ip address
- **Execute Command :** bash get_tls_certificates.sh
#### (OR) Through Manual scp commands - needs ssh permission
- Replace ipaddress in the below scp commands with your fabric prime manager's ip address.
- scp -r root@178.62.207.235:/root/hlft-store/orderer/tls-msp/tlscacerts/tls-tlsca-7054.pem ./fabric_node_sdk_helper/hlft-store/orderer/tls-msp/tlscacerts/tls-tlsca-7054.pem
- scp -r root@178.62.207.235:/root/hlft-store/peer2/tls-msp/tlscacerts/tls-tlsca-7054.pem ./fabric_node_sdk_helper/hlft-store/peer2/tls-msp/tlscacerts/tls-tlsca-7054.pem
#### (OR) Manually edit the following two files - no need of ssh permission
- fabric_node_sdk_helper/hlft-store/orderer/tls-msp/tlscacerts/tls-tlsca-7054.pem
- fabric_node_sdk_helper/hlft-store/peer2/tls-msp/tlscacerts/tls-tlsca-7054.pem
5. ## Enroll admin
- #### Call this function "once" when your app starts.
- When this function is called, a **wallet** directory will be created in the current directory
- Admin user will be enrolled and the certificates will availalble in **wallet** directory
- If fabric certificates are changed in future, this wallet directory should cleaned, and this function must be called again to get the new certificates
- check wallet directory
- a directory named 'admin' will be available
- certificates for admin will be available under this directory.
- sample :
``` Javascript
// import fabric node sdk helper functions
const enrollAdmin = require('./fabric_node_sdk_helper/enrollAdmin');
async function main() {
admin_enroll_status = await enrollAdmin();
console.log(admin_enroll_status);
}
main();
```
6. ## Register user
- sample :
``` Javascript
// import fabric node sdk helper functions
const registerUser = require('./fabric_node_sdk_helper/registerUser');
app.post('/register', async (req, res) => {
let user_name = req.body.uname;
let user_password = req.body.psw;
let user_role = "client";
let register_status = await registerUser(user_name,
user_password,
user_role);
let response = {
status:register_status
};
res.json(response);
});
```
- check wallet directory
- a directory with the name of the 'registerd user name' will be available
- certificates for the registerd user will be available under this directory.
7. ## Query a chaincode
- sample :
``` Javascript
// import fabric node sdk helper functions
const querychaincode = require('./fabric_node_sdk_helper/query');
app.post('/query', async (req, res) => {
let user_name = req.body.uname;
let CHANNEL_NAME = "appchannel";
let CHAIN_CODE_NAME = "carcc";
let CHAIN_CODE_FUNCTION_NAME = "listCars";
// Without Arguments
let query_result = await querychaincode(user_name,CHANNEL_NAME,CHAIN_CODE_NAME, CHAIN_CODE_FUNCTION_NAME);
// With Arguments
let query_result = await querychaincode(user_name,CHANNEL_NAME,CHAIN_CODE_NAME, CHAIN_CODE_FUNCTION_NAME , "a");
let response = {
"status":"success",
"data":query_result
};
console.log(response);
res.json(response);
});
```
8. ## Invoke a chaincode
- sample :
``` Javascript
// import fabric node sdk helper functions
const invokechaincode = require('./fabric_node_sdk_helper/invoke');
app.post('/invoke', async (req, res) => {
let user_name = req.body.uname;
let car_license_plate = req.body.car_license_plate;
let CHANNEL_NAME = "appchannel";
let CHAIN_CODE_NAME = "carcc";
let CHAIN_CODE_FUNCTION_NAME = "listCars";
let invoke_result = await invokechaincode(user_name,
CHANNEL_NAME,
CHAIN_CODE_NAME,
CHAIN_CODE_FUNCTION_NAME,
car_license_plate,
"Opel","Corsa","Light Blue","7","2050","1");
let response = {
"status":"success",
"data":invoke_result
};
console.log(response);
res.json(response);
});
```
/*
* SPDX-License-Identifier: Apache-2.0
*/
'use strict';
const FabricCAServices = require('fabric-ca-client');
const { FileSystemWallet, X509WalletMixin } = require('fabric-network');
const fs = require('fs');
const path = require('path');
const ccpPath = path.resolve(__dirname, '.', 'network_profile.json');
const ccpJSON = fs.readFileSync(ccpPath, 'utf8');
const ccp = JSON.parse(ccpJSON);
const admin_username = "ca-admin-orgca";
const admin_password = "orgcapw";
const ORGANISATION_MSP = "hlfMSP";
const CA_ORGANISATION_NAME = "orgca";
async function enrollAdmin() {
let return_value;
try {
// Create a new CA client for interacting with the CA.
const caInfo = ccp.certificateAuthorities[CA_ORGANISATION_NAME];
console.log(caInfo);
const caTLSCACerts = [];
//const caTLSCACerts = caInfo.tlsCACerts.pem;
const ca = new FabricCAServices(caInfo.url, { trustedRoots: caTLSCACerts, verify: false }, caInfo.caName);
// Create a new file system based wallet for managing identities.
const walletPath = path.join(process.cwd(), 'wallet');
const wallet = new FileSystemWallet(walletPath);
console.log(`Wallet path: ${walletPath}`);
// Check to see if we've already enrolled the admin user.
const adminExists = await wallet.exists('admin');
if (adminExists) {
return_value = 'An identity for the admin user "admin" already exists in the wallet';
}
else {
// Enroll the admin user, and import the new identity into the wallet.
const enrollment = await ca.enroll({ enrollmentID: admin_username, enrollmentSecret: admin_password });
const identity = X509WalletMixin.createIdentity(ORGANISATION_MSP, enrollment.certificate, enrollment.key.toBytes());
await wallet.import('admin', identity);
return_value = 'Successfully enrolled admin user "admin" and imported it into the wallet';
}
}
catch (error) {
return_value = `Failed to enroll admin user "admin": ${error}`;
}
finally {
console.log("'enrollAdmin' function -> returning value");
return return_value;
}
}
module.exports = enrollAdmin;
\ No newline at end of file
#!/bin/bash
set -x #echo on
IP_ADDRESS="46.101.220.140"
REMOTE_MACHINE_ORDERER_TLS_CERT_FILE="/root/hlft-store/orgca/orderer/msp/tls/ca.crt"
REMOTE_MACHINE_PEER2_TLS_CERT_FILE="/root/hlft-store/orgca/peer2/msp/tls/ca.crt"
LOCAL_ORDER_TLS_CERT_FILE="./hlft-store/orderer/tls-msp/tlscacerts/ca.crt"
LOCAL_ORDER_PEER2_CERT_FILE="./hlft-store/peer2/tls-msp/tlscacerts/ca.crt"
scp -r root@$IP_ADDRESS:$REMOTE_MACHINE_ORDERER_TLS_CERT_FILE $LOCAL_ORDER_TLS_CERT_FILE &&
scp -r root@$IP_ADDRESS:$REMOTE_MACHINE_PEER2_TLS_CERT_FILE $LOCAL_ORDER_PEER2_CERT_FILE
\ No newline at end of file
-----BEGIN CERTIFICATE-----
MIICATCCAaegAwIBAgIUHtIeXGIFSSSzdVv3i8OKtwTEoekwCgYIKoZIzj0EAwIw
XTELMAkGA1UEBhMCVVMxFzAVBgNVBAgTDk5vcnRoIENhcm9saW5hMRQwEgYDVQQK
EwtIeXBlcmxlZGdlcjEPMA0GA1UECxMGRmFicmljMQ4wDAYDVQQDEwV0bHNjYTAe
Fw0yMDEwMDcxOTA2MDBaFw0zNTEwMDQxOTA2MDBaMF0xCzAJBgNVBAYTAlVTMRcw
FQYDVQQIEw5Ob3J0aCBDYXJvbGluYTEUMBIGA1UEChMLSHlwZXJsZWRnZXIxDzAN
BgNVBAsTBkZhYnJpYzEOMAwGA1UEAxMFdGxzY2EwWTATBgcqhkjOPQIBBggqhkjO
PQMBBwNCAATiVMVg8vqfYkf33sVX5rsOO+RJr7gio3GQ4cRIBb9a0EL8ic8F40bG
R4/+cuFTVacUpC68JMPvIOXKZDPyL6Sdo0UwQzAOBgNVHQ8BAf8EBAMCAQYwEgYD
VR0TAQH/BAgwBgEB/wIBATAdBgNVHQ4EFgQU5SQIqQSqUa0S4iCIqW6D4F7BKakw
CgYIKoZIzj0EAwIDSAAwRQIhAOxtHlaXYbj/ptd0ncFWXa1fSeTfz2Ig06Nlx6c5
G+W4AiA1TbAWTspXu8dd/ky4w490fCj6nLbdvgE/uWT2npg/aA==
-----END CERTIFICATE-----
-----BEGIN CERTIFICATE-----
MIICATCCAaegAwIBAgIUHtIeXGIFSSSzdVv3i8OKtwTEoekwCgYIKoZIzj0EAwIw
XTELMAkGA1UEBhMCVVMxFzAVBgNVBAgTDk5vcnRoIENhcm9saW5hMRQwEgYDVQQK
EwtIeXBlcmxlZGdlcjEPMA0GA1UECxMGRmFicmljMQ4wDAYDVQQDEwV0bHNjYTAe
Fw0yMDEwMDcxOTA2MDBaFw0zNTEwMDQxOTA2MDBaMF0xCzAJBgNVBAYTAlVTMRcw
FQYDVQQIEw5Ob3J0aCBDYXJvbGluYTEUMBIGA1UEChMLSHlwZXJsZWRnZXIxDzAN
BgNVBAsTBkZhYnJpYzEOMAwGA1UEAxMFdGxzY2EwWTATBgcqhkjOPQIBBggqhkjO
PQMBBwNCAATiVMVg8vqfYkf33sVX5rsOO+RJr7gio3GQ4cRIBb9a0EL8ic8F40bG
R4/+cuFTVacUpC68JMPvIOXKZDPyL6Sdo0UwQzAOBgNVHQ8BAf8EBAMCAQYwEgYD
VR0TAQH/BAgwBgEB/wIBATAdBgNVHQ4EFgQU5SQIqQSqUa0S4iCIqW6D4F7BKakw
CgYIKoZIzj0EAwIDSAAwRQIhAOxtHlaXYbj/ptd0ncFWXa1fSeTfz2Ig06Nlx6c5
G+W4AiA1TbAWTspXu8dd/ky4w490fCj6nLbdvgE/uWT2npg/aA==
-----END CERTIFICATE-----
/*
* SPDX-License-Identifier: Apache-2.0
*/
"use strict";
const { FileSystemWallet, Gateway } = require("fabric-network");
const fs = require("fs");
const path = require("path");
const ccpPath = path.resolve(__dirname, ".", "network_profile.json");
async function invokechaincode(
USER_NAME,
CHANNEL_NAME,
CHAIN_CODE_NAME,
CHAIN_CODE_FUNCTION_NAME,
...ARGS
) {
let return_value;
try {
// Create a new file system based wallet for managing identities.
const walletPath = path.join(process.cwd(), "wallet");
const wallet = new FileSystemWallet(walletPath);
console.log(`Wallet path: ${walletPath}`);
// Check to see if we've already enrolled the user.
const userExists = await wallet.exists(USER_NAME);
if (!userExists) {
//console.log('An identity for the user "user1" does not exist in the wallet');
//console.log('Run the registerUser.js application before retrying');
return_value =
'An identity for the user "user1" does not exist in the wallet. Run the registerUser.js application before retrying';
} else {
// Create a new gateway for connecting to our peer node.
const gateway = new Gateway();
await gateway.connect(ccpPath, {
wallet,
identity: USER_NAME,
discovery: { enabled: false, asLocalhost: false },
});
// Get the network (channel) our contract is deployed to.
const network = await gateway.getNetwork(CHANNEL_NAME);
// Get the contract from the network.
const contract = network.getContract(CHAIN_CODE_NAME);
// Submit the specified transaction.
// createCar transaction - requires 5 argument, ex: ('createCar', 'CAR12', 'Honda', 'Accord', 'Black', 'Tom')
// changeCarOwner transaction - requires 2 args , ex: ('changeCarOwner', 'CAR10', 'Dave')
//await contract.submitTransaction(CHAIN_CODE_FUNCTION_NAME, "BE8800","Opel","Corsa","Light Blue","7","2050","1");
return_value = await contract.submitTransaction(
CHAIN_CODE_FUNCTION_NAME,
...ARGS
);
return_value = return_value.toString();
//await contract.submitTransaction(CHAIN_CODE_FUNCTION_NAME, "b","a","1");
console.log("Transaction has been submitted");
// Disconnect from the gateway.
await gateway.disconnect();
}
} catch (error) {
return_value = `Failed to evaluate transaction: ${error}`;
//process.exit(1);
} finally {
return return_value;
}
}
module.exports = invokechaincode;
{
"name": "hlf-bityoga",
"version": "1.0.0",
"client": {
"organization": "hlf",
"connection": {
"timeout": {
"peer": {
"endorser": "300"
}
}
}
},
"channels": {
"appchannel": {
"orderers": ["orderer"],
"peers": {
"peer2": {
"endorsingPeer": "true",
"chaincodeQuery": "true",
"ledgerQuery": "true",
"eventSource": "true",
"discover": "true"
},
"peer1": {
"endorsingPeer": "false",
"chaincodeQuery": "false",
"ledgerQuery": "true",
"eventSource": "false",
"discover": "true"
}
}
}
},
"organizations": {
"hlf": {
"mspid": "hlfMSP",
"peers": ["peer2", "peer1"],
"certificateAuthorities": ["orgca", "tlsca"]
}
},
"orderers": {
"orderer": {
"url": "grpcs://46.101.220.140:8053",
"tlsCACerts": {
"path": "./hlft-store/orderer/tls-msp/tlscacerts/ca.crt"
},
"grpcOptions": {
"ssl-target-name-override": "orderer"
}
}
},
"peers": {
"peer2": {
"url": "grpcs://46.101.220.140:8055",
"tlsCACerts": {
"path": "./hlft-store/peer2/tls-msp/tlscacerts/ca.crt"
},
"grpcOptions": {
"ssl-target-name-override": "peer2"
}
}
},
"certificateAuthorities": {
"orgca": {
"caName": "orgca",
"url": "https://46.101.220.140:8052",
"httpOptions": {
"verify": false
}
},
"tlsca": {
"caName": "tlsca",
"url": "https://46.101.220.140:8081",
"httpOptions": {
"verify": false
}
}
}
}
This source diff could not be displayed because it is too large. You can view the blob instead.
{
"engines": {
"node": ">=8",
"npm": ">=5"
},
"scripts": {
"lint": "eslint .",
"pretest": "npm run lint",
"test": "nyc mocha --recursive"
},
"engineStrict": true,
"author": "Hyperledger",
"license": "Apache-2.0",
"dependencies": {
"fabric-ca-client": "~1.4.3",
"fabric-network": "~1.4.3"
},
"devDependencies": {
"chai": "^4.2.0",
"eslint": "^5.9.0",
"mocha": "^5.2.0",
"nyc": "^15.0.0",
"sinon": "^7.1.1",
"sinon-chai": "^3.3.0"
},
"nyc": {
"exclude": [
"coverage/**",
"test/**"
],
"reporter": [
"text-summary",
"html"
],
"all": true,
"check-coverage": true,
"statements": 100,
"branches": 100,
"functions": 100,
"lines": 100
}
}
/*
* SPDX-License-Identifier: Apache-2.0
*/
"use strict";
const { FileSystemWallet, Gateway } = require("fabric-network");
const fs = require("fs");
const path = require("path");
const ccpPath = path.resolve(__dirname, ".", "network_profile.json");
async function querychaincode(
USER_NAME,
CHANNEL_NAME,
CHAIN_CODE_NAME,
CHAIN_CODE_FUNCTION_NAME,
...ARGS
) {
let return_value;
try {
// Create a new file system based wallet for managing identities.
const walletPath = path.join(process.cwd(), "wallet");
const wallet = new FileSystemWallet(walletPath);
console.log(`Wallet path: ${walletPath}`);
// Check to see if we've already enrolled the user.
const userExists = await wallet.exists(USER_NAME);
if (!userExists) {
// console.log('An identity for the user "user1" does not exist in the wallet');
// console.log('Run the registerUser.js application before retrying');
return_value =
'An identity for the user "user1" does not exist in the wallet. Run the registerUser.js application before retrying';
} else {
// Create a new gateway for connecting to our peer node.
const gateway = new Gateway();
await gateway.connect(ccpPath, {
wallet,
identity: USER_NAME,
discovery: { enabled: false, asLocalhost: false },
});
// Get the network (channel) our contract is deployed to.
const network = await gateway.getNetwork(CHANNEL_NAME);
// Get the contract from the network.
const contract = network.getContract(CHAIN_CODE_NAME);
// Evaluate the specified transaction.
// queryCar transaction - requires 1 argument, ex: ('queryCar', 'CAR4')
// queryAllCars transaction - requires no arguments, ex: ('queryAllCars')
console.log(ARGS);
console.log(CHAIN_CODE_FUNCTION_NAME);
// if (ARGS.length > 0 ) {
// console.log(CHAIN_CODE_FUNCTION_NAME);
// return_value = await contract.evaluateTransaction(CHAIN_CODE_FUNCTION_NAME,ARGS);
// return_value = return_value.toString();
// }
// else {
// return_value = await contract.evaluateTransaction(CHAIN_CODE_FUNCTION_NAME);
// return_value = return_value.toString();
// }
return_value = await contract.evaluateTransaction(
CHAIN_CODE_FUNCTION_NAME,
...ARGS
);
return_value = return_value.toString();
//const result = await contract.evaluateTransaction(CHAIN_CODE_FUNCTION_NAME,"b");
//const result = await contract.evaluateTransaction(CHAIN_CODE_FUNCTION_NAME,"a");
console.log(
`Transaction has been evaluated, result is: ${return_value.toString()}`
);
//return_value = result;
}
//return result;
//process.exit(1);
} catch (error) {
return_value = `Failed to evaluate transaction: ${error}`;
//process.exit(1);
} finally {
return return_value;
}
}
module.exports = querychaincode;
/*
* SPDX-License-Identifier: Apache-2.0
*/
'use strict';
const { FileSystemWallet, Gateway, X509WalletMixin } = require('fabric-network');
const path = require('path');
const ccpPath = path.resolve(__dirname, '.', 'network_profile.json');
async function registerUser(user_name, user_password, user_role) {
let return_value;
try {
// Create a new file system based wallet for managing identities.
const walletPath = path.join(process.cwd(), 'wallet');
const wallet = new FileSystemWallet(walletPath);
console.log(`Wallet path: ${walletPath}`);
// Check to see if we've already enrolled the user.
const userExists = await wallet.exists(user_name);
if (userExists) {
return_value = 'An identity for the user "'+user_name+'" already exists in the wallet';
}
else {
// Check to see if we've already enrolled the admin user.
const adminExists = await wallet.exists('admin');
if (!adminExists) {
return_value = "An identity for the admin user 'admin' does not exist in the wallet. Call 'enrollAdmin' function before retrying";
}
else {
// Create a new gateway for connecting to our peer node.
const gateway = new Gateway();
await gateway.connect(ccpPath, { wallet, identity: 'admin', discovery: { enabled: true, asLocalhost: false } });
// Get the CA client object from the gateway for interacting with the CA.
const ca = gateway.getClient().getCertificateAuthority();
const adminIdentity = gateway.getCurrentIdentity();
// Register the user, enroll the user, and import the new identity into the wallet.
const secret = await ca.register({ enrollmentID: user_name,role: user_role,enrollmentSecret:user_password }, adminIdentity);
const enrollment = await ca.enroll({ enrollmentID: user_name, enrollmentSecret: secret });
const userIdentity = X509WalletMixin.createIdentity('hlfMSP', enrollment.certificate, enrollment.key.toBytes());
await wallet.import(user_name, userIdentity);
return_value = 'Successfully registered and enrolled user "'+user_name+'" with role "'+user_role+'" and imported it into the wallet';
}
}
}
catch (error) {
//return_value = `Failed to register user ${user_name}: ${error}`;
return_value = "Failed to register user "+user_name+": " + error;
}
finally{
console.log("'registerUser' function -> returning value");
return return_value;
}
}
module.exports = registerUser;
var fs = require('fs').promises;
async function load_certificates_from_wallet(user_name) {
let certificates_json = {};
let cert_path = './wallet/'+user_name+'/';
try {
//get all filenames under a directory
var file_list = await fs.readdir(cert_path);
console.log(file_list);
for (index = 0; index < file_list.length; index++) {
console.log(file_list[index]);
if (file_list[index].includes('-priv')) {
let full_file_path = cert_path + file_list[index];
//read file contents to a string
certificates_json['User_Private_Key'] = await fs.readFile(full_file_path, "utf8");
}
if (file_list[index].includes('-pub')) {
let full_file_path = cert_path + file_list[index];
//read file contents to a string
certificates_json['User_Public_Key'] = await fs.readFile(full_file_path, "utf8");
}
if (file_list[index].includes(user_name)) {
let full_file_path = cert_path + file_list[index];
//read file contents to a string
certificates_json['User_Enrollment_Certificate'] = await fs.readFile(full_file_path, "utf8");
}
}
}
catch(e) {
console.log(e);
}
finally {
return certificates_json;
}
}
async function checkDirectorySync(directory) {
try {
await fs.stat(directory);
} catch(e) {
await fs.mkdir(directory);
}
}
async function write_certificates_from_db_to_wallet(db_user_info,enrollment_signingIdentity) {
let write_status;
let user_name = db_user_info['User_Name'];
let cert_path = './wallet/'+user_name+'/';
try {
//get all filenames under a directory
await checkDirectorySync(cert_path);
var file_list = await fs.readdir(cert_path);
if(file_list.length==0){
console.log(db_user_info["User_Private_Key"]);
await fs.writeFile(cert_path+enrollment_signingIdentity+"-priv", db_user_info["User_Private_Key"]);
await fs.writeFile(cert_path+enrollment_signingIdentity+"-pub", db_user_info["User_Public_Key"]);
await fs.writeFile(cert_path+user_name, db_user_info["User_Enrollment_Certificate"]);
write_status = "success";
}
else {
write_status = "success";
}
}
catch(e) {
write_status = e;
}
finally {
return write_status;
}
}
// async function check_file_load_to_wallet(user_name) {
// let load_status = await write_certificates_from_db_to_wallet(user_name);
// console.log(load_status);
// }
// let user_info = {};
// user_info["User_Name"] = "ark";
// user_info["User_Password"] = "ark";
// check_file_load_to_wallet(user_info);
// async function check_file_load_to_db(user_name) {
// let load_status = await load_certificates_from_wallet(user_name);
// console.log(load_status);
// }
// await check_file_load_to_db('ark');
module.exports = {
load_certificates_from_wallet : load_certificates_from_wallet,
write_certificates_from_db_to_wallet : write_certificates_from_db_to_wallet
};
\ No newline at end of file
.loader {
border: 16px solid #f3f3f3;
border-radius: 50%;
border-top: 16px solid #3498db;
width: 120px;
height: 120px;
-webkit-animation: spin 2s linear infinite; /* Safari */
animation: spin 2s linear infinite;
}
/* Safari */
@-webkit-keyframes spin {
0% { -webkit-transform: rotate(0deg); }
100% { -webkit-transform: rotate(360deg); }
}
@keyframes spin {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}
html {
scroll-behavior: smooth;
/*overflow: hidden;*/
}
.tooltip {
position: relative;
display: inline-block;
border-bottom: 1px dotted black;
}
.tooltip .tooltiptext {
visibility: hidden;
width: 120px;
background-color: black;
color: #fff;
text-align: center;
border-radius: 6px;
padding: 5px 0;
/* Position the tooltip */
position: absolute;
z-index: 1;
}
.tooltip:hover .tooltiptext {
visibility: visible;
}
body { margin:0; padding:0; text-align:center }
.iframe_holder {
padding:0px;
margin:0 auto;
width:100%;
/*height:89vh;*/
height: calc(100vh - 113px);
margin-top: 56px;
border: 0px;
/*margin-bottom: 52px;*/
}
.footer {
position: fixed;
left: 0;
bottom: 0;
width: 100%;
color: white;
text-align: center;
}
body {font-family: Arial, Helvetica, sans-serif;}
/* Full-width input fields */
input[type=text], input[type=password] {
width: 100%;
padding: 12px 20px;
margin: 8px 0;
display: inline-block;
border: 1px solid #ccc;
box-sizing: border-box;
}
/* Set a style for all buttons */
#login button {
background-color: #4CAF50;
color: white;
padding: 14px 20px;
margin: 8px 0;
border: none;
cursor: pointer;
width: 100%;
}
/* Set a style for all buttons */
#register button {
background-color: #4CAF50;
color: white;
padding: 14px 20px;
margin: 8px 0;
border: none;
cursor: pointer;
width: 100%;
}
/* Set a style for all buttons */
#sell button {
background-color: #4CAF50;
color: white;
padding: 14px 20px;
margin: 8px 0;
border: none;
cursor: pointer;
width: 100%;
}
/* Set a style for all buttons */
#query_chain_code_div button {
background-color: #4CAF50;
color: white;
padding: 14px 20px;
margin: 8px 0;
border: none;
cursor: pointer;
width: 100%;
}
button:hover {
opacity: 0.8;
}
/* Extra styles for the cancel button */
.cancelbtn {
width: auto !important;
padding: 10px 18px !important;
background-color: #f44336 !important;
}
/* Center the image and position the close button */
.imgcontainer {
text-align: center;
margin: 24px 0 12px 0;
position: relative;
}
img.avatar {
width: 40%;
border-radius: 50%;
}
.container {
padding: 16px;
}
span.psw {
float: right;
padding-top: 16px;
}
/* The Modal (background) */
.modal {
display: none; /* Hidden by default */
position: fixed; /* Stay in place */
z-index: 1; /* Sit on top */
left: 0;
top: 0;
width: 100%; /* Full width */
height: 100%; /* Full height */
overflow: auto; /* Enable scroll if needed */
background-color: rgb(0,0,0); /* Fallback color */
background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
padding-top: 60px;
}
/* Modal Content/Box */
.modal-content {
background-color: #fefefe;
margin: 5% auto 15% auto; /* 5% from the top, 15% from the bottom and centered */
border: 1px solid #888;
width: 40%; /* Could be more or less, depending on screen size */
}
/* The Close Button (x) */
.close {
position: absolute;
right: 25px;
top: 0;
color: #000;
font-size: 35px;
font-weight: bold;
}
.close:hover,
.close:focus {
color: red;
cursor: pointer;
}
/* Add Zoom Animation */
.animate {
-webkit-animation: animatezoom 0.6s;
animation: animatezoom 0.6s
}
@-webkit-keyframes animatezoom {
from {-webkit-transform: scale(0)}
to {-webkit-transform: scale(1)}
}
@keyframes animatezoom {
from {transform: scale(0)}
to {transform: scale(1)}
}
/* Change styles for span and cancel button on extra small screens */
@media screen and (max-width: 300px) {
span.psw {
display: block;
float: none;
}
.cancelbtn {
width: 100%;
}
}
.modal-content {
max-height: 80vh;
overflow: auto;
}
/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {
.modal-content {
width: 80%;
}
/* .iframe_holder {
height: calc(100vh - 153px);
} */
}
/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {
.modal-content {
width: 80%;
}
}
/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {
.modal-content {
width: 60%;
}
}
/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {
.modal-content {
width: 40%;
}
}
/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {
.modal-content {
width: 30%;
}
}
.alert {
padding: 20px;
color: white;
}
.alertclosebtn {
margin-left: 15px;
color: white;
font-weight: bold;
float: right;
font-size: 22px;
line-height: 20px;
cursor: pointer;
transition: 0.3s;
}
.w3-padding-24 {
padding-top: 24px!important;
padding-bottom: 24px!important;
}
\ No newline at end of file
function openLink(evt, animName) {
var i, x, tablinks;
x = document.getElementsByClassName("iframe_holder");
for (i = 0; i < x.length; i++) {
x[i].style.display = "none";
}
tablinks = document.getElementsByClassName("tablink");
console.log(tablinks);
for (i = 0; i < x.length; i++) {
tablinks[i].className = tablinks[i].className.replace(" w3-blue", " ");
tablinks[i].className = tablinks[i].className.replace("w3-blue", " ");
}
document.getElementById(animName).style.display = "block";
if(animName!="home") {
console.log(animName);
//evt.currentTarget.className += " w3-blue";
}
}
function myFunction() {
var x = document.getElementById("demo");
if (x.className.indexOf("w3-show") == -1) {
x.className += " w3-show";
} else {
x.className = x.className.replace(" w3-show", "");
}
}
function notification_function() {
var x = document.getElementById("notifications");
if (x.className.indexOf("w3-show") == -1) {
x.className += " w3-show";
} else {
x.className = x.className.replace(" w3-show", "");
}
}
function openLeftMenu() {
document.getElementById("leftMenu").style.display = "block";
}
function closeLeftMenu() {
document.getElementById("leftMenu").style.display = "none";
}
function openRightMenu() {
document.getElementById("rightMenu").style.display = "block";
}
function closeRightMenu() {
document.getElementById("rightMenu").style.display = "none";
}
\ No newline at end of file
// Get the modal
var modal = document.getElementById('id01');
// When the user clicks anywhere outside of the modal, close it
window.onclick = function(event) {
if (event.target == modal) {
modal.style.display = "none";
}
}
// Get the modal
var login_modal = document.getElementById('login');
var register_modal = document.getElementById('register');
var sell_modal = document.getElementById('sell');
// When the user clicks anywhere outside of the modal, close it
window.onclick = function(event) {
if (event.target == login_modal) {
login_modal.style.display = "none";
}
if (event.target == login_modal) {
register_modal.style.display = "none";
}
if (event.target == sell_modal) {
sell_modal.style.display = "none";
}
}
\ No newline at end of file
function logout() {
$.ajax({
type: "POST",
url: "/logout",
async: true,
complete: function (data) {
console.log(data);
//$("#login_button").removeClass("w3-hide");
// document.getElementById("welcome_user_span").style.display = "none";
//document.getElementById("logout_button").style.display = "none";
window.location.href = "/";
},
});
}
function get_session_details() {
$.ajax({
type: "POST",
url: "/",
async: true,
complete: function (data) {
var json = JSON.parse(data.responseText.replace(/\bNaN\b/g, "null"));
console.log(json);
if (json["status"] === "session active") {
$(".session_user_name").text(json["user_name"]);
$(".user_id").text(json["smart_meter_id"]);
$(".user_address").text(json["address"]);
$(".user_wallet").text(json["wallet"]);
$(".user_capacity").text(json["capacity"]);
} else {
$(".session_user_name").text("Session Expired");
}
},
});
}
function update_select_drop_downs(select_id, data_array) {
var select = document
.getElementById("my_profile_iframe")
.contentWindow.document.getElementById(select_id);
console.log(select);
// Optional: Clear all existing options first:
select.innerHTML = "";
var options = data_array;
for (var i = 0; i < options.length; i++) {
var opt = options[i];
var el = document.createElement("option");
el.textContent = opt;
el.value = opt;
select.appendChild(el);
}
}
function update_select_drop_downs_local(select_id, data_array) {
var select = document.getElementById(select_id);
console.log(select);
// Optional: Clear all existing options first:
select.innerHTML = "";
var options = data_array;
for (var i = 0; i < options.length; i++) {
var opt = options[i];
var el = document.createElement("option");
el.textContent = opt;
el.value = opt;
select.appendChild(el);
}
}
function check_session() {
$.ajax({
type: "POST",
url: "/",
async: true,
complete: function (data) {
var json = JSON.parse(data.responseText.replace(/\bNaN\b/g, "null"));
console.log(json);
if (json["status"] === "session active") {
//document.getElementById("session_user_name").textContent=json['user_name'];
//document.getElementById("welcome_user_span").style.display = "block";
//document.getElementById("logout_button").style.display = "block";
//document.getElementById('home').style.display = "block";
//$("#session_user_name").text(json['user_name']);
// console.log($('#my_profile').contents().find('div .session_user_name'));
// $('#my_profile').contents().find('.session_user_name').html(json['user_name']);
//$(".session_user_name").text(json['user_name']);
$(".login_button").hide();
$(".register_button").hide();
$("#welcome_user_span").show();
$(".logout_button").show();
$(".notification_button").show();
$(".buy_button").show();
$(".query_button").show();
$(".invoke_button").show();
$(".my_profile_button").show();
$("#login_check").hide();
$("#register_check").hide();
$("#buy").hide();
$("#my_profile").show();
console.log('json["assets"]');
console.log(json["assets"]);
if (json["assets"].length > 0) {
update_select_drop_downs("Query_User_Name", json["assets"]);
update_select_drop_downs("From_User_Name", json["assets"]);
update_select_drop_downs("To_User_Name", json["assets"]);
update_select_drop_downs_local("History_User_Name", json["assets"]);
}
} else {
//document.getElementById("welcome_user_span").style.display = "none";
//document.getElementById("logout_button").style.display = "none";
$(".login_button").show();
$(".register_button").show();
$("#welcome_user_span").hide();
$(".logout_button").hide();
$(".notification_button").hide();
$(".buy_button").hide();
$(".query_button").hide();
$(".invoke_button").hide();
$(".my_profile_button").hide();
$("#my_profile").hide();
$("#register_check").hide();
$("#buy").hide();
$("#login_check").show();
//document.getElementById('login_check').style.display = "block";
}
},
});
}
function check_iframe_session() {
$.ajax({
type: "POST",
url: "/",
async: true,
complete: function (data) {
var json = JSON.parse(data.responseText.replace(/\bNaN\b/g, "null"));
console.log(json);
if (json["status"] === "session active") {
//document.getElementById("session_user_name").textContent=json['user_name'];
//$("#login_button").addClass("w3-hide");
//document.getElementById("welcome_user_span").style.display = "block";
//document.getElementById("logout_button").style.display = "block";
//window.location.href = "/home_page.html";
//document.getElementById('home').style.display = "block";
console.log("session active");
// app_session.balance = user_assets_json['amount'];
// app_session.address = user_assets_json['color'];
// app_session.smart_meter_id = user_assets_json['owner'];
// app_session.capacity = user_assets_json['size'];
$(".session_user_name").text(json["user_name"]);
//$(".session_user_name").text(json['wallet']);
//$(".session_user_name").text(json['capacity']);
$(".user_wallet").text(json["wallet"]);
$(".user_capacity").text(json["capacity"]);
console.log('json["assets"]');
console.log(json["assets"]);
var $dropdown = $("#Query_User_Name");
if (json["assets"].length > 0) {
$.each(json["assets"], function () {
$dropdown.append($("<option />").val(this).text(this));
});
}
} else {
// document.getElementById("welcome_user_span").style.display = "none";
//document.getElementById("logout_button").style.display = "none";
// $("#login_button").removeClass("w3-hide");
//document.getElementById('login_check').style.display = "block";
window.location.href = "/";
}
},
});
}
// this is the id of the form
$("#register_form").submit(function (e) {
e.preventDefault(); // avoid to execute the actual submit of the form.
document.getElementById("register_loader").style.display = "block";
// var user_name = document.getElementById("User_Name").value;
// var user_password = document.getElementById("User_Password").value;
// var smart_meter_id = document.getElementById("User_House_Number").value;
var user_json = {
User_Name: document.getElementById("User_Name").value,
User_Password: document.getElementById("User_Password").value,
};
$.ajax({
type: "POST",
url: "/register",
async: true,
dataType: "json",
data: user_json,
complete: function (data) {
//document.getElementById("register_loader").style.display = "none";
console.log(data);
var json = JSON.parse(data.responseText.replace(/\bNaN\b/g, "null"));
//swal.fire(json.status);
swal.fire({
title: "Registration Status",
text: json.status,
icon: "success",
confirmButtonText:
'<i class="fa fa-thumbs-up"></i> Great!',
});
if (json["status"] === "success") {
//document.getElementById("register").style.display = "none";
//window.location.href = "/login_check.html";
create_user_asset_in_chaincode();
}
},
});
});
function create_user_asset_in_chaincode() {
// e.preventDefault(); // avoid to execute the actual submit of the form.
// var form = $(this);
var user_json = {
User_Name: document.getElementById("User_Name").value,
User_Password: document.getElementById("User_Password").value,
};
document.getElementById("register_loader").style.display = "block";
$.ajax({
type: "POST",
url: "/create_user_asset",
async: true,
dataType: "json",
data: user_json, // serializes the form's elements.
complete: function (data) {
document.getElementById("register_loader").style.display = "none";
var json = JSON.parse(data.responseText.replace(/\bNaN\b/g, "null"));
//swal.fire(json["status"]);
console.log(json);
window.location.href = "/login_check.html";
},
});
}
$("#login_form").submit(function (e) {
e.preventDefault(); // avoid to execute the actual submit of the form.
document.getElementById("login_loader").style.display = "block";
var user_json = {
Login_User_Name: document.getElementById("Login_User_Name").value,
Login_Password: document.getElementById("Login_Password").value,
};
$.ajax({
type: "POST",
url: "/login",
async: true,
dataType: "json",
data: user_json,
complete: function (data) {
document.getElementById("login_loader").style.display = "none";
var json = JSON.parse(data.responseText.replace(/\bNaN\b/g, "null"));
//swal.fire(json["status"]);
//swal.fire(json["status"]);
swal.fire({
title: "Registration Status",
text: json["status"],
icon: "success",
confirmButtonText:
'<i class="fa fa-thumbs-up"></i> Great!',
});
if (json["status"] === "success") {
//console.log(document.getElementById('Login_User_Name').value);
//$(parent.document).find("#session_user_name").text(document.getElementById("Login_User_Name").value);
//$(parent.document).find("#welcome_user_span").show();
//$(parent.document).find("#logout_button").show();
window.top.location.href = "/";
}
},
});
});
$("#sell_form").submit(function (e) {
e.preventDefault(); // avoid to execute the actual submit of the form.
var form = $(this);
document.getElementById("sell_loader").style.display = "block";
$.ajax({
type: "POST",
url: "/sell",
async: true,
data: form.serialize(), // serializes the form's elements.
complete: function (data) {
document.getElementById("sell_loader").style.display = "none";
var json = JSON.parse(data.responseText.replace(/\bNaN\b/g, "null"));
//swal.fire(json["data"]);
swal.fire({
title: "<i>Transaction History</i>",
html: json["data"],
confirmButtonText: "<u>Ok</u>",
});
},
});
});
$("#buy_form").submit(function (e) {
e.preventDefault(); // avoid to execute the actual submit of the form.
var form = $(this);
document.getElementById("buy_power_confirm_loader").style.display = "block";
$.ajax({
type: "POST",
url: "/buy_confirm_invoke_chaincode",
async: true,
data: form.serialize(), // serializes the form's elements.
complete: function (data) {
document.getElementById("buy_confirm_invoke_chaincode").style.display =
"none";
var json = JSON.parse(data.responseText.replace(/\bNaN\b/g, "null"));
swal.fire(json["status"]);
if (json["status"] == "success") {
//$(".session_user_name").text(json['user_name']);
//$(".user_id").text(json['smart_meter_id']);
//$(".user_address").text(json['address']);
$(".user_wallet").text(json["user_balance"]);
$(".user_capacity").text(json["user_capacity"]);
document.getElementById("buy_power_confirm").style.display = "none";
}
//console.log(JSON.parse(json['data']));
},
});
});
$("#query_chain_code").submit(function (e) {
e.preventDefault(); // avoid to execute the actual submit of the form.
var form = $(this);
document.getElementById("query_chain_code_loader").style.display = "block";
$.ajax({
type: "POST",
url: "/query_chain_code",
async: true,
data: form.serialize(), // serializes the form's elements.
complete: function (data) {
document.getElementById("query_chain_code_loader").style.display = "none";
var json = JSON.parse(data.responseText.replace(/\bNaN\b/g, "null"));
swal.fire({
title: "<i>All assets</i>",
html: json["data"],
confirmButtonText: "<u>Ok</u>",
});
console.log(JSON.parse(json["data"]));
},
});
});
$("#get_user_balance").submit(function (e) {
e.preventDefault(); // avoid to execute the actual submit of the form.
var form = $(this);
document.getElementById("get_balance_loader").style.display = "block";
$.ajax({
type: "POST",
url: "/get_user_balance",
async: true,
data: form.serialize(), // serializes the form's elements.
complete: function (data) {
document.getElementById("get_balance_loader").style.display = "none";
var json = JSON.parse(data.responseText.replace(/\bNaN\b/g, "null"));
//swal.fire(JSON.parse(json["data"]).Balance.toString());
swal.fire({
title: "Bank Balance",
text: JSON.parse(json["data"]).Balance.toString(),
icon: "success",
confirmButtonText:
'<i class="fa fa-thumbs-up"></i> Great!',
});
console.log(JSON.parse(json["data"]));
},
});
});
$("#transfer_amount").submit(function (e) {
e.preventDefault(); // avoid to execute the actual submit of the form.
var form = $(this);
document.getElementById("transfer_loader").style.display = "block";
$.ajax({
type: "POST",
url: "/transfer_amount",
async: true,
data: form.serialize(), // serializes the form's elements.
complete: function (data) {
document.getElementById("transfer_loader").style.display = "none";
var json = JSON.parse(data.responseText.replace(/\bNaN\b/g, "null"));
console.log(json);
//swal.fire(JSON.parse(json["data"]).Balance.toString());
swal.fire({
title: "Transaction Status",
text: json["status"].toString(),
icon: "success",
confirmButtonText:
'<i class="fa fa-thumbs-up"></i> Great!',
});
console.log(json["status"]);
},
});
});
$("#ad_submit").click(function () {
//swal.fire("cancel");
document.getElementById("ad_loader").style.display = "block";
var time = new Date();
var user_json = {
Posted_Timestamp: time.toString().slice(0, -41),
bank_To_Sell: document.getElementById("bank_selling").value,
Cost: document.getElementById("bank_cost").value,
Advertisement_text: document.getElementById("advertisement_text").value,
Advertisement_text: document.getElementById("advertisement_text").value,
};
$.ajax({
type: "POST",
url: "/ad_submit",
async: true,
dataType: "json",
data: user_json,
complete: function (data) {
document.getElementById("ad_loader").style.display = "none";
var json = JSON.parse(data.responseText.replace(/\bNaN\b/g, "null"));
swal.fire(json["status"]);
if (json["status"] === "success") {
//console.log(document.getElementById('Login_User_Name').value);
//$(parent.document).find("#session_user_name").text(document.getElementById("Login_User_Name").value);
//$(parent.document).find("#welcome_user_span").show();
//$(parent.document).find("#logout_button").show();
console.log(json["status"]);
//get_advertisements();
//document.getElementById('iframeID').contentWindow.location.reload();
//parent.document.getElementById("buy").location.reload();
//swal.fire(json["status"]);
window.top.location.href = "/";
}
},
});
});
function template_ad_content(json_data) {
var user_image = json_data["User_Image"];
var image_number = Math.floor(Math.random() * (+6 - +2)) + +2;
var user_image = "/images/avatar" + String(image_number) + ".png";
//var user_image = "/images/avatar2.png";
//var user_image = "/images/anand.jpg";
var user_name = json_data["User_Name"];
var user_id = json_data["User_Id"];
var cost = json_data["Cost"];
var bank_To_Sell = json_data["bank_To_Sell"];
var bank_Sources = json_data["bank_Source_Type"];
bank_Sources =
'<span><label><i class="fas fa-sun"></i> Solar ,</label>&nbsp;&nbsp;<label><i class="fas fa-fan"></i> Wind</label></span>';
var Capacity = json_data["User_Capacity"];
var Likes_Count = json_data["Likes_Count"];
var seller_rating = json_data["User_Profile_Rating"];
var price_comparison = json_data["Cost"];
var ad_text = json_data["Advertisement_Text"];
var timestamp = json_data["Posted_Timestamp"];
var add_content =
' <div class="w3-row w3-padding-24 w3-animate-bottom">' +
'<div class="w3-twothird w3-container">' +
'<div class="w3-container w3-card w3-white w3-round ad_content_div"><br>' +
'<img src="' +
user_image +
'" alt="Avatar" class="w3-left w3-circle w3-margin-right" style="width:60px">' +
'<span class="w3-right w3-opacity ad_time_stamp"><i class="far fa-clock" aria-hidden="true"></i> ' +
timestamp +
"</span>" +
'<h4 class="ad_user_name">' +
user_name +
"</h4><br>" +
'<div class="ad_user_id" style="display:none;">' +
user_id +
"</div>" +
'<hr class="w3-clear">' +
"<p>" +
ad_text +
"</p>" +
'<div class="w3-row-padding " >' +
'<div class="w3-quarter w3-center w3-right">' +
"<p >" +
'<span class="w3-text-dark-gray"><i class="fas fa-coins" aria-hidden="true"></i> Price (bank Tokens)</span><br>' +
'<span class="ad_cost">' +
cost +
"</span> / kwh" +
"</p>" +
"</div>" +
'<div class="w3-quarter w3-center w3-right ">' +
"<p >" +
'<span class="w3-text-dark-gray"><i class="fas fa-battery-half" aria-hidden="true"></i> Selling</span><br>' +
'<span class="ad_bank_to_sell">' +
bank_To_Sell +
" kwh</span>" +
"</p>" +
"</div>" +
'<div class="w3-quarter w3-center w3-right ">' +
"<p >" +
'<span class="w3-text-dark-gray"><i class="fas fa-charging-station" aria-hidden="true"></i> Source(s)</span><br>' +
'<span class="ad_bank_sources">' +
bank_Sources +
" </span>" +
"</p>" +
"</div>" +
'<div class="w3-quarter w3-center w3-right w3-hide-small w3-hide-medium">' +
"<p >" +
'<span class="w3-text-dark-gray"><i class="fas fa-battery-full" aria-hidden="true"></i> Battery Capacity</span><br>' +
'<span class="ad_capacity">' +
Capacity +
" kwh </span>" +
"</p>" +
"</div>" +
'</div><hr class="w3-clear">' +
'<button type="button" class="w3-button w3-theme-d1 w3-margin-bottom"><i class="fa fa-thumbs-up"></i>  Like <span>' +
Likes_Count +
"</span></button> " +
'<!-- <button type="button" class="w3-button w3-theme-d2 w3-margin-bottom"><i class="fa fa-comment"></i>  Comment <span>16</span></button> -->' +
'<button type="button" onclick="buy_button_clicked.call(this)" class="buy_bank_button w3-button w3-theme-d2 w3-margin-bottom w3-right w3-teal w3-hover-opacity"><i class="fa fa-shopping-cart"></i> Buy</button>' +
"</div>" +
"</div>" +
'<div class="w3-third w3-container w3-hide-small " style="margin-top: 25px;">' +
'<p class="w3-card w3-padding-large w3-padding-32 w3-center w3-animate-right">' +
'<img src="/images/profile_rating_icon.png" aria-hidden="true" alt="Avatar" class="w3-left w3-circle w3-margin-right" style="width:60px">' +
'<span class="w3-text-dark-gray"><i class="fas fa-star-half-alt" aria-hidden="true"></i> Seller Rating</span><br>' +
'<span class="ad_seller_rating">' +
seller_rating +
'% <i class="far fa-heart" aria-hidden="true"></i></span>' +
"</p>" +
'<p class="w3-card w3-padding-large w3-padding-32 w3-center w3-animate-left">' +
'<i class="fas fa-chart-line w3-xxxlarge w3-circle w3-left" aria-hidden="true"></i>' +
'<span class="w3-text-dark-gray"> Price Meter </span><br>' +
'<span class="ad_price_comparison">' +
price_comparison +
'% <i class="far fa-arrow-alt-circle-down" aria-hidden="true"></i> </span>' +
"</p>" +
"</div>" +
"</div>";
return add_content;
}
function get_advertisements() {
$.ajax({
type: "POST",
url: "/buy_ad_loader",
async: true,
dataType: "json",
//data : user_json,
complete: function (data) {
//document.getElementById("buy_ad_loader").style.display = "none";
var json = JSON.parse(data.responseText.replace(/\bNaN\b/g, "null"));
//swal.fire(json['status']);
if (json["status"] === "success") {
//console.log(document.getElementById('Login_User_Name').value);
//$(parent.document).find("#session_user_name").text(document.getElementById("Login_User_Name").value);
//$(parent.document).find("#welcome_user_span").show();
//$(parent.document).find("#logout_button").show();
//window.top.location.href = "/";
console.log(json["data"]);
var joined_ad_content = "";
for (i = 0; i < json["data"].length; i++) {
//$(".add_container").prepend(template_ad_content(json["data"][i]));
joined_ad_content =
joined_ad_content + template_ad_content(json["data"][i]);
}
$(joined_ad_content).prependTo("#adv_container");
}
},
});
}
<!DOCTYPE html>
<html>
<title>W3.CSS</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.9.0/css/all.min.css">
<script
src="https://code.jquery.com/jquery-3.4.1.min.js"
integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
crossorigin="anonymous"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/momentjs/latest/moment.min.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/daterangepicker/daterangepicker.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/daterangepicker/daterangepicker.css" />
<style>
div.sticky {
position: -webkit-sticky;
position: sticky;
top: 0;
}
html {
scroll-behavior: smooth;
}
#myBtn {
display: none;
position: fixed;
bottom: 20px;
right: 2px;
z-index: 99;
font-size: 18px;
border: none;
outline: none;
cursor: pointer;
padding: 15px;
border-radius: 4px;
color: #fff!important;
background-color: #305342!important;
}
.loader {
border: 16px solid #f3f3f3;
border-radius: 50%;
border-top: 16px solid #3498db;
width: 120px;
height: 120px;
-webkit-animation: spin 2s linear infinite; /* Safari */
animation: spin 2s linear infinite;
}
/* Safari */
@-webkit-keyframes spin {
0% { -webkit-transform: rotate(0deg); }
100% { -webkit-transform: rotate(360deg); }
}
@keyframes spin {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}
/* The Modal (background) */
.modal {
display: none; /* Hidden by default */
position: fixed; /* Stay in place */
z-index: 1; /* Sit on top */
left: 0;
top: 0;
width: 100%; /* Full width */
height: 100%; /* Full height */
overflow: auto; /* Enable scroll if needed */
background-color: rgb(0,0,0); /* Fallback color */
background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
padding-top: 60px;
}
/* Modal Content/Box */
.modal-content {
background-color: #fefefe;
margin: 5% auto 15% auto; /* 5% from the top, 15% from the bottom and centered */
border: 1px solid #888;
width: 40%; /* Could be more or less, depending on screen size */
}
/* The Close Button (x) */
.close {
/*position: absolute;
right: 25px;
top: 0;*/
color: #000;
font-size: 35px;
font-weight: bold;
}
.close:hover,
.close:focus {
color: red;
cursor: pointer;
}
/* Add Zoom Animation */
.animate {
-webkit-animation: animatezoom 0.6s;
animation: animatezoom 0.6s
}
@-webkit-keyframes animatezoom {
from {-webkit-transform: scale(0)}
to {-webkit-transform: scale(1)}
}
@keyframes animatezoom {
from {transform: scale(0)}
to {transform: scale(1)}
}
/* Change styles for span and cancel button on extra small screens */
@media screen and (max-width: 300px) {
span.psw {
display: block;
float: none;
}
.cancelbtn {
width: 100%;
}
}
.modal-content {
max-height: 80vh;
overflow: auto;
}
/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {
.modal-content {
width: 80%;
}
/* .iframe_holder {
height: calc(100vh - 153px);
} */
}
/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {
.modal-content {
width: 80%;
}
}
/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {
.modal-content {
width: 60%;
}
}
/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {
.modal-content {
width: 40%;
}
}
/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {
.modal-content {
width: 30%;
}
}
/* Full-width input fields */
input[type=text], input[type=password] {
width: 100%;
padding: 12px 20px;
margin: 8px 0;
display: inline-block;
border: 1px solid #ccc;
box-sizing: border-box;
}
/* Set a style for all buttons */
#buy_power_confirm_button {
background-color: #4CAF50;
color: white;
padding: 14px 20px;
margin: 8px 0;
border: none;
cursor: pointer;
width: 20%;
}
button:hover {
opacity: 0.8;
}
/* Extra styles for the cancel button */
.cancelbtn {
width: auto !important;
padding: 10px 18px !important;
background-color: #f44336 !important;
}
/* Center the image and position the close button */
.imgcontainer {
text-align: center;
margin: 24px 0 12px 0;
position: relative;
}
img.avatar {
width: 40%;
border-radius: 50%;
}
.container {
padding: 16px;
}
span.psw {
float: right;
padding-top: 16px;
}
</style>
<body >
<button class="w3-hover-opacity" onclick="topFunction()" id="myBtn" title="Go to top"><i class="fa fa-arrow-circle-up" aria-hidden="true"></i> Top</button>
<div class="w3-sidebar w3-bar-block w3-animate-left w3-collapse" style="display:none;left:0;width: 300px; z-index: 3; overflow: -moz-hidden-unscrollable;" id="leftMenu">
<!-- <button onclick="closeLeftMenu()" class="w3-bar-item w3-button w3-hide-large">Close &times;</button> -->
<div class="w3-container w3-display-container w3-padding-16 ">
<div >
<i onclick="closeLeftMenu()" class="fa fa-remove w3-hide-large w3-button w3-transparent w3-display-topright"></i>
<h3> <i class="fa fa-filter" aria-hidden="true"></i> Filters</h3>
<hr>
<form action="/action_page.php" target="_blank">
<p><label><i class="fas fa-user"></i> User</label></p>
<input style = "color: #244848;" class="w3-input w3-border" type="text" placeholder="User Name" name="user_name" required>
<p><label><i class="fa fa-calendar-check-o"></i> Period</label></p>
<!--<input class="w3-input w3-border" type="text" placeholder="DD MM YYYY" name="from_date" required> -->
<div id="datetimepicker_data_tables" style="background: #fff; cursor: pointer; padding: 5px 10px; border: 1px solid #ccc; width: fit-content; color: #244848;">
<span></span> <i class="fa fa-caret-down"></i>
</div>
<!--<p><label><i class="fa fa-calendar-o"></i> To</label></p>
<input class="w3-input w3-border" type="text" placeholder="DD MM YYYY" name="to_date" required> -->
<p><label><i class="fas fa-coins"></i> Min bank Tokens</label></p>
<input style = "color: #244848;" class="w3-input w3-border" type="number" placeholder="Min bank Tokens" value="0" name="min_bank_tokens" min="0">
<p><label><i class="fas fa-coins"></i> Max bank Tokens</label></p>
<input style = "color: #244848;" class="w3-input w3-border" type="number" placeholder="Min bank Tokens" value="0" name="capacity" min="0">
<p><label><i class="fas fa-charging-station"></i> Capacity</label></p>
<input style = "color: #244848;" class="w3-input w3-border" type="number" placeholder="Min bank Tokens" value="0" name="selling" min="0">
<p><label><i class="fas fa-battery-half"></i> Selling</label></p>
<input style = "color: #244848;" class="w3-input w3-border" type="number" placeholder="Max bank Tokens" value="0" name="max_bank_tokens" min="0">
<p><button class="w3-button w3-block w3-teal w3-left-align" type="submit"><i class="fa fa-search w3-margin-right"></i> Apply Filter</button></p>
</form>
</div>
</div>
</div>
<div class="w3-sidebar w3-bar-block w3-animate-right w3-collapse" style="display:none;right:0; width: 300px;z-index: 3;overflow: -moz-hidden-unscrollable;" id="rightMenu">
<button onclick="closeRightMenu()" class="w3-bar-item w3-button w3-hide-large">Close &times;</button>
<div class="w3-row">
<!-- Left Column -->
<div class="">
<!-- Profile -->
<div class=" w3-round w3-white">
<div class="w3-container">
<div class="w3-card" style="padding: 20px; margin-top: 2vh; margin-left: -2px;" >
<h4 class="w3-center"><img src="/images/anand.jpg" class="w3-circle" style="height:50px;width:50px" alt="Avatar"> <span class = "welcome_user_span" style="width:auto;" ><strong><span class="session_user_name">Anand </span></strong></span></h4>
<!-- <p class="w3-center"><img src="/images/anand.jpg" class="w3-circle" style="height:50px;width:50px" alt="Avatar"></p> -->
<hr>
<p><i class="fas fa-coins fa-fw w3-margin-right w3-text-theme"></i>Balance : <span class="user_wallet">23</span></p>
<p style="width: 100%;">
<button style="width: max-content;" class="w3-right w3-button w3-block w3-teal " type="submit"><i class="fas fa-pencil-alt w3-margin-right"></i> Refill</button>
</p><br> <br>
<hr>
<footer class="w3-container " style="color: #244848;">
<h5 class="w3-right"><i class="fas fa-clock"></i> <strong style="font-size: 15px;"></strong><span id="price_updated_timestamp" style="font-size: 13px;color: #244848;">Fri Jan 24 2020 19:25:15</span></h5>
</footer>
</div>
</div>
</div>
<br>
<!-- Interests -->
<div class=" w3-round w3-white w3-hide-small">
<div class="w3-container">
<div class="w3-card" style="" >
<div style="box-shadow: none !important;padding: 3px;" >
<div style="" >
<header class="w3-container ">
<div class="w3-row w3-center" style="padding-top: 2vh;color: #244848;">
<strong class="w3-center"><i class="fas fa-chart-pie"></i> Average Selling Price</strong>
</div>
<hr>
</header>
<div class="w3-container">
<p class="w3-center"><label >Price / kWh : </label> <span > 6 <i class="fas fa-coins"></i></span></p>
<hr>
</div>
<!-- <footer class="w3-container " style="color: #244848;">
<h5 class="w3-right"><i class="fas fa-clock"></i> <strong style="font-size: 15px;">Last Updated : </strong><span id="price_updated_timestamp" style="font-size: 13px;color: #244848;"></span></h5>
</footer> -->
</div>
</div>
</div>
</div>
</div>
<br>
<!-- Interests -->
<div class=" w3-round w3-white w3-hide-small">
<div class="w3-container">
<div class="w3-card" style="" >
<div style="box-shadow: none !important;padding: 3px;" >
<div style="" >
<header class="w3-container ">
<div class="w3-row w3-center" style="padding-top: 2vh;color: #244848;">
<strong class="w3-center"><i class="fas fa-chart-pie"></i> Average Buying Price</strong>
</div>
<hr>
</header>
<div class="w3-container">
<p class="w3-center"><label >Price / kWh : </label> <span > 5 <i class="fas fa-coins"></i></span></p>
<hr>
</div>
<!-- <footer class="w3-container " style="color: #244848;">
<h5 class="w3-right"><i class="fas fa-clock"></i> <strong style="font-size: 15px;">Last Updated : </strong><span id="price_updated_timestamp" style="font-size: 13px;color: #244848;"></span></h5>
</footer> -->
</div>
</div>
</div>
</div>
</div>
<br>
<!-- End Left Column -->
</div>
</div>
</div>
<div class="w3-main w3-animate-opacity" style="margin-left: 300px; margin-right: 300px;">
<div class="sticky w3-hide-large" style="color: #fff!important; background-color: #305342!important;z-index: 2;">
<button class="w3-button w3-large w3-left w3-hide-large" onclick="openLeftMenu()"><i class="fa fa-filter" aria-hidden="true"></i> Filters</button>
<button class="w3-button w3-large w3-right w3-hide-large" onclick="openRightMenu()"><i class="fas fa-user-circle" aria-hidden="true"> My Profile</i></button>
<div class="w3-container ">
<h2 class="w3-hide-small w3-hide-medium"><i class='fas fa-solar-panel' aria-hidden="true"></i> Smart bank <i class="fas fa-house-day"></i></h2>
</div>
</div>
<div id = "adv_container" class="w3-container" style="padding: 0px;">
<div class="add_container w3-row w3-padding-24 w3-animate-bottom">
<div class="w3-twothird w3-container">
<div class="w3-container w3-card w3-white w3-round "><br>
<img src="/images/rus.png" alt="Avatar" class="w3-left w3-circle w3-margin-right" style="width:60px">
<span class="w3-right w3-opacity"><i class="far fa-clock" aria-hidden="true"></i> 1 min</span>
<h4>Russel</h4><br>
<hr class="w3-clear">
<p>bank at affordable price</p>
<div class="w3-row-padding " >
<div class="w3-quarter w3-center w3-right">
<p >
<span class="w3-text-dark-gray"><i class="fas fa-coins" aria-hidden="true"></i> Price</span><br class="w3-hide_small">
<span>2 per kWh</span>
</p>
</div>
<div class="w3-quarter w3-center w3-right ">
<p >
<span class="w3-text-dark-gray"><i class="fas fa-battery-half" aria-hidden="true"></i> Selling</span><br class="w3-hide_small">
<span>350 kWh</span>
</p>
</div>
<div class="w3-quarter w3-center w3-right ">
<p >
<span class="w3-text-dark-gray"><i class="fas fa-charging-station" aria-hidden="true"></i> Source(s)</span><br class="w3-hide_small">
<span><label><i class="fas fa-sun"></i> Solar</label>&nbsp;&nbsp;<label><i class="fas fa-fan"></i> Wind</label></span>
</p>
</div>
<div class="w3-quarter w3-center w3-right w3-hide-small w3-hide-medium">
<p >
<span class="w3-text-dark-gray"><i class="fas fa-battery-full" aria-hidden="true"></i> Capacity</span><br class="w3-hide_small">
<span >1050 kWh </span>
</p>
</div>
</div><hr class="w3-clear">
<button type="button" class="w3-button w3-theme-d1 w3-margin-bottom"><i class="fa fa-thumbs-up"></i>  Like <span>26</span></button>
<!-- <button type="button" class="w3-button w3-theme-d2 w3-margin-bottom"><i class="fa fa-comment"></i>  Comment <span>16</span></button> -->
<button type="button" class="w3-button w3-theme-d2 w3-margin-bottom w3-right w3-teal w3-hover-opacity"><i class="fa fa-shopping-cart"></i> Buy</button>
</div>
</div>
<div class="w3-third w3-container w3-hide-small " style="margin-top: 25px;">
<p class="w3-card w3-padding-large w3-padding-32 w3-center w3-animate-right">
<img src="/images/profile_rating_icon.png" aria-hidden="true" alt="Avatar" class="w3-left w3-circle w3-margin-right" style="width:60px">
<span class="w3-text-dark-gray"><i class="fas fa-star-half-alt" aria-hidden="true"></i> Seller Rating</span><br>
<span>86% <i class="far fa-heart" aria-hidden="true"></i></span>
</p>
<p class="w3-card w3-padding-large w3-padding-32 w3-center w3-animate-left">
<!-- <img src="/images/bitcoin2.png" aria-hidden="true" alt="Avatar" class="w3-left w3-circle w3-margin-right" style="width:60px;margin-top: -7px;height: 60px;"> -->
<i class="fas fa-chart-line w3-xxxlarge w3-circle w3-left" aria-hidden="true"></i>
<span class="w3-text-dark-gray"> Price Meter </span><br>
<span>20% <i class="far fa-arrow-alt-circle-down" aria-hidden="true"></i> </span>
</p>
</div>
</div>
<div class="add_container w3-row w3-padding-24 w3-animate-bottom">
<div class="w3-twothird w3-container">
<div class="w3-container w3-card w3-white w3-round "><br>
<img src="/images/chum.png" alt="Avatar" class="w3-left w3-circle w3-margin-right" style="width:60px">
<span class="w3-right w3-opacity"><i class="far fa-clock" aria-hidden="true"></i> 1 min</span>
<h4>Chumming</h4><br>
<hr class="w3-clear">
<p>Cheapest price . Grab it soon !!!!</p>
<div class="w3-row-padding " >
<div class="w3-quarter w3-center w3-right">
<p >
<span class="w3-text-dark-gray"><i class="fas fa-coins" aria-hidden="true"></i> Price</span><br>
<span>1 per kWh</span>
</p>
</div>
<div class="w3-quarter w3-center w3-right ">
<p >
<span class="w3-text-dark-gray"><i class="fas fa-battery-half" aria-hidden="true"></i> Selling</span><br>
<span>3500 kWh</span>
</p>
</div>
<div class="w3-quarter w3-center w3-right ">
<p >
<span class="w3-text-dark-gray"><i class="fas fa-charging-station" aria-hidden="true"></i> Source</span><br>
<span>Solar Panel, Turbine </span>
</p>
</div>
<div class="w3-quarter w3-center w3-right w3-hide-small w3-hide-medium">
<p >
<span class="w3-text-dark-gray"><i class="fas fa-battery-full" aria-hidden="true"></i> Capacity</span><br>
<span >5050 kWh </span>
</p>
</div>
</div><hr class="w3-clear">
<button type="button" class="w3-button w3-theme-d1 w3-margin-bottom"><i class="fa fa-thumbs-up"></i>  Like <span>26</span></button>
<!-- <button type="button" class="w3-button w3-theme-d2 w3-margin-bottom"><i class="fa fa-comment"></i>  Comment <span>16</span></button> -->
<button type="button" class="w3-button w3-theme-d2 w3-margin-bottom w3-right w3-teal w3-hover-opacity"><i class="fa fa-shopping-cart"></i> Buy</button>
</div>
</div>
<div class="w3-third w3-container w3-hide-small " style="margin-top: 25px;">
<p class="w3-card w3-padding-large w3-padding-32 w3-center w3-animate-right">
<img src="/images/profile_rating_icon.png" aria-hidden="true" alt="Avatar" class="w3-left w3-circle w3-margin-right" style="width:60px">
<span class="w3-text-dark-gray"><i class="fas fa-star-half-alt" aria-hidden="true"></i> Seller Rating</span><br>
<span>86% <i class="far fa-heart" aria-hidden="true"></i></span>
</p>
<p class="w3-card w3-padding-large w3-padding-32 w3-center w3-animate-left">
<img src="/images/bitcoin2.png" aria-hidden="true" alt="Avatar" class="w3-left w3-circle w3-margin-right" style="width:60px;margin-top: -7px;height: 60px;">
<span class="w3-text-dark-gray"><i class="fas fa-chart-line w3-xlarge" aria-hidden="true"></i> Price Meter </span><br>
<span>20% <i class="far fa-arrow-alt-circle-down" aria-hidden="true"></i> </span>
</p>
</div>
</div>
<div class="add_container w3-row w3-padding-24 w3-animate-bottom">
<div class="w3-twothird w3-container">
<div class="w3-container w3-card w3-white w3-round "><br>
<img src="/images/long.png" alt="Avatar" class="w3-left w3-circle w3-margin-right" style="width:60px">
<span class="w3-right w3-opacity"><i class="far fa-clock" aria-hidden="true"></i> 1 min</span>
<h4>Long</h4><br>
<hr class="w3-clear">
<p>bank at affordable price</p>
<div class="w3-row-padding " >
<div class="w3-quarter w3-center w3-right">
<p >
<span class="w3-text-dark-gray"><i class="fas fa-coins" aria-hidden="true"></i> Price</span><br>
<span>2 per kWh</span>
</p>
</div>
<div class="w3-quarter w3-center w3-right ">
<p >
<span class="w3-text-dark-gray"><i class="fas fa-battery-half" aria-hidden="true"></i> Selling</span><br>
<span>350 kWh</span>
</p>
</div>
<div class="w3-quarter w3-center w3-right ">
<p >
<span class="w3-text-dark-gray"><i class="fas fa-charging-station" aria-hidden="true"></i> Source</span><br>
<span>Solar Panel </span>
</p>
</div>
<div class="w3-quarter w3-center w3-right w3-hide-small w3-hide-medium">
<p >
<span class="w3-text-dark-gray"><i class="fas fa-battery-full" aria-hidden="true"></i> Capacity</span><br>
<span >1050 kWh </span>
</p>
</div>
</div><hr class="w3-clear">
<button type="button" class="w3-button w3-theme-d1 w3-margin-bottom"><i class="fa fa-thumbs-up"></i>  Like <span>26</span></button>
<!-- <button type="button" class="w3-button w3-theme-d2 w3-margin-bottom"><i class="fa fa-comment"></i>  Comment <span>16</span></button> -->
<button type="button" class="w3-button w3-theme-d2 w3-margin-bottom w3-right w3-teal w3-hover-opacity"><i class="fa fa-shopping-cart"></i> Buy</button>
</div>
</div>
<div class="w3-third w3-container w3-hide-small " style="margin-top: 25px;">
<p class="w3-card w3-padding-large w3-padding-32 w3-center w3-animate-right">
<img src="/images/profile_rating_icon.png" aria-hidden="true" alt="Avatar" class="w3-left w3-circle w3-margin-right" style="width:60px">
<span class="w3-text-dark-gray"><i class="fas fa-star-half-alt" aria-hidden="true"></i> Seller Rating</span><br>
<span>86% <i class="far fa-heart" aria-hidden="true"></i></span>
</p>
<p class="w3-card w3-padding-large w3-padding-32 w3-center w3-animate-left">
<img src="/images/bitcoin2.png" aria-hidden="true" alt="Avatar" class="w3-left w3-circle w3-margin-right" style="width:60px;margin-top: -7px;height: 60px;">
<span class="w3-text-dark-gray"><i class="fas fa-chart-line w3-xlarge" aria-hidden="true"></i> Price Meter </span><br>
<span>20% <i class="far fa-arrow-alt-circle-down" aria-hidden="true"></i> </span>
</p>
</div>
</div>
<div class="add_container w3-row w3-padding-24 w3-animate-bottom">
<div class="w3-twothird w3-container">
<div class="w3-container w3-card w3-white w3-round "><br>
<img src="/images/anto.png" alt="Avatar" class="w3-left w3-circle w3-margin-right" style="width:60px">
<span class="w3-right w3-opacity"><i class="far fa-clock" aria-hidden="true"></i> 1 min</span>
<h4>Antorweep</h4><br>
<hr class="w3-clear">
<p>bank at affordable price</p>
<div class="w3-row-padding " >
<div class="w3-quarter w3-center w3-right">
<p >
<span class="w3-text-dark-gray"><i class="fas fa-coins" aria-hidden="true"></i> Price</span><br>
<span>2 per kWh</span>
</p>
</div>
<div class="w3-quarter w3-center w3-right ">
<p >
<span class="w3-text-dark-gray"><i class="fas fa-battery-half" aria-hidden="true"></i> Selling</span><br>
<span>350 kWh</span>
</p>
</div>
<div class="w3-quarter w3-center w3-right ">
<p >
<span class="w3-text-dark-gray"><i class="fas fa-charging-station" aria-hidden="true"></i> Source</span><br>
<span>Solar Panel </span>
</p>
</div>
<div class="w3-quarter w3-center w3-right w3-hide-small w3-hide-medium">
<p >
<span class="w3-text-dark-gray"><i class="fas fa-battery-full" aria-hidden="true"></i> Capacity</span><br>
<span >1050 kWh </span>
</p>
</div>
</div><hr class="w3-clear">
<button type="button" class="w3-button w3-theme-d1 w3-margin-bottom"><i class="fa fa-thumbs-up"></i>  Like <span>26</span></button>
<!-- <button type="button" class="w3-button w3-theme-d2 w3-margin-bottom"><i class="fa fa-comment"></i>  Comment <span>16</span></button> -->
<button type="button" class="w3-button w3-theme-d2 w3-margin-bottom w3-right w3-teal w3-hover-opacity"><i class="fa fa-shopping-cart"></i> Buy</button>
</div>
</div>
<div class="w3-third w3-container w3-hide-small " style="margin-top: 25px;">
<p class="w3-card w3-padding-large w3-padding-32 w3-center w3-animate-right">
<img src="/images/profile_rating_icon.png" aria-hidden="true" alt="Avatar" class="w3-left w3-circle w3-margin-right" style="width:60px">
<span class="w3-text-dark-gray"><i class="fas fa-star-half-alt" aria-hidden="true"></i> Seller Rating</span><br>
<span>86% <i class="far fa-heart" aria-hidden="true"></i></span>
</p>
<p class="w3-card w3-padding-large w3-padding-32 w3-center w3-animate-left">
<img src="/images/bitcoin2.png" aria-hidden="true" alt="Avatar" class="w3-left w3-circle w3-margin-right" style="width:60px;margin-top: -7px;height: 60px;">
<span class="w3-text-dark-gray"><i class="fas fa-chart-line w3-xlarge" aria-hidden="true"></i> Price Meter </span><br>
<span>20% <i class="far fa-arrow-alt-circle-down" aria-hidden="true"></i> </span>
</p>
</div>
</div>
<div class="add_container w3-row w3-padding-24 w3-animate-bottom">
<div class="w3-twothird w3-container">
<div class="w3-container w3-card w3-white w3-round "><br>
<img src="/images/magnus.jpg" alt="Avatar" class="w3-left w3-circle w3-margin-right" style="width:60px">
<span class="w3-right w3-opacity"><i class="far fa-clock" aria-hidden="true"></i> 1 min</span>
<h4>Magnus</h4><br>
<hr class="w3-clear">
<p>bank at affordable price</p>
<div class="w3-row-padding " >
<div class="w3-quarter w3-center w3-right">
<p >
<span class="w3-text-dark-gray"><i class="fas fa-coins" aria-hidden="true"></i> Price</span><br>
<span>2 per kWh</span>
</p>
</div>
<div class="w3-quarter w3-center w3-right ">
<p >
<span class="w3-text-dark-gray"><i class="fas fa-battery-half" aria-hidden="true"></i> Selling</span><br>
<span>350 kWh</span>
</p>
</div>
<div class="w3-quarter w3-center w3-right ">
<p >
<span class="w3-text-dark-gray"><i class="fas fa-charging-station" aria-hidden="true"></i> Source</span><br>
<span>Solar Panel </span>
</p>
</div>
<div class="w3-quarter w3-center w3-right w3-hide-small w3-hide-medium">
<p >
<span class="w3-text-dark-gray"><i class="fas fa-battery-full" aria-hidden="true"></i> Capacity</span><br>
<span >1050 kWh </span>
</p>
</div>
</div><hr class="w3-clear">
<button type="button" class="w3-button w3-theme-d1 w3-margin-bottom"><i class="fa fa-thumbs-up"></i>  Like <span>26</span></button>
<!-- <button type="button" class="w3-button w3-theme-d2 w3-margin-bottom"><i class="fa fa-comment"></i>  Comment <span>16</span></button> -->
<button type="button" class="w3-button w3-theme-d2 w3-margin-bottom w3-right w3-teal w3-hover-opacity"><i class="fa fa-shopping-cart"></i> Buy</button>
</div>
</div>
<div class="w3-third w3-container w3-hide-small " style="margin-top: 25px;">
<p class="w3-card w3-padding-large w3-padding-32 w3-center w3-animate-right">
<img src="/images/profile_rating_icon.png" aria-hidden="true" alt="Avatar" class="w3-left w3-circle w3-margin-right" style="width:60px">
<span class="w3-text-dark-gray"><i class="fas fa-star-half-alt" aria-hidden="true"></i> Seller Rating</span><br>
<span>86% <i class="far fa-heart" aria-hidden="true"></i></span>
</p>
<p class="w3-card w3-padding-large w3-padding-32 w3-center w3-animate-left">
<img src="/images/bitcoin2.png" aria-hidden="true" alt="Avatar" class="w3-left w3-circle w3-margin-right" style="width:60px;margin-top: -7px;height: 60px;">
<span class="w3-text-dark-gray"><i class="fas fa-chart-line w3-xlarge" aria-hidden="true"></i> Price Meter </span><br>
<span>20% <i class="far fa-arrow-alt-circle-down" aria-hidden="true"></i> </span>
</p>
</div>
</div>
<div class="add_container w3-row w3-padding-24 w3-animate-bottom">
<div class="w3-twothird w3-container">
<div class="w3-container w3-card w3-white w3-round "><br>
<img src="/images/anand.jpg" alt="Avatar" class="w3-left w3-circle w3-margin-right" style="width:60px">
<span class="w3-right w3-opacity"><i class="far fa-clock" aria-hidden="true"></i> 1 min</span>
<h4>Anand</h4><br>
<hr class="w3-clear">
<p>bank at affordable price</p>
<div class="w3-row-padding " >
<div class="w3-quarter w3-center w3-right">
<p >
<span class="w3-text-dark-gray"><i class="fas fa-coins" aria-hidden="true"></i> Price</span><br>
<span>2 per kWh</span>
</p>
</div>
<div class="w3-quarter w3-center w3-right ">
<p >
<span class="w3-text-dark-gray"><i class="fas fa-battery-half" aria-hidden="true"></i> Selling</span><br>
<span>350 kWh</span>
</p>
</div>
<div class="w3-quarter w3-center w3-right ">
<p >
<span class="w3-text-dark-gray"><i class="fas fa-charging-station" aria-hidden="true"></i> Source</span><br>
<span>Solar Panel </span>
</p>
</div>
<div class="w3-quarter w3-center w3-right w3-hide-small w3-hide-medium">
<p >
<span class="w3-text-dark-gray"><i class="fas fa-battery-full" aria-hidden="true"></i> Capacity</span><br>
<span >1050 kWh </span>
</p>
</div>
</div><hr class="w3-clear">
<button type="button" class="w3-button w3-theme-d1 w3-margin-bottom"><i class="fa fa-thumbs-up"></i>  Like <span>26</span></button>
<!-- <button type="button" class="w3-button w3-theme-d2 w3-margin-bottom"><i class="fa fa-comment"></i>  Comment <span>16</span></button> -->
<button type="button" class="w3-button w3-theme-d2 w3-margin-bottom w3-right w3-teal w3-hover-opacity"><i class="fa fa-shopping-cart"></i> Buy</button>
</div>
</div>
<div class="w3-third w3-container w3-hide-small " style="margin-top: 25px;">
<p class="w3-card w3-padding-large w3-padding-32 w3-center w3-animate-right">
<img src="/images/profile_rating_icon.png" aria-hidden="true" alt="Avatar" class="w3-left w3-circle w3-margin-right" style="width:60px">
<span class="w3-text-dark-gray"><i class="fas fa-star-half-alt" aria-hidden="true"></i> Seller Rating</span><br>
<span>86% <i class="far fa-heart" aria-hidden="true"></i></span>
</p>
<p class="w3-card w3-padding-large w3-padding-32 w3-center w3-animate-left">
<img src="/images/bitcoin2.png" aria-hidden="true" alt="Avatar" class="w3-left w3-circle w3-margin-right" style="width:60px;margin-top: -7px;height: 60px;">
<span class="w3-text-dark-gray"><i class="fas fa-chart-line w3-xlarge" aria-hidden="true"></i> Price Meter </span><br>
<span>20% <i class="far fa-arrow-alt-circle-down" aria-hidden="true"></i> </span>
</p>
</div>
</div>
</div>
<div id="buy_power_confirm" class="w3-modal" style="overflow:visible;">
<form id="buy_form" action="/buy_confirm_invoke_chaincode" enctype="multipart/form-data" method="POST" class="modal-content" >
<div class="imgcontainer">
<span onclick="document.getElementById('buy_power_confirm').style.display='none'" class="close w3-right" title="Close Modal" style="margin-top: -17px; margin-right: 10px;">&times;</span>
<strong><span class="w3-text-dark-gray"><i class="fa fa-shopping-cart aria-hidden="true"></i> CONFIRM PURCHASE</span></strong>
<!-- <img src="images/avatar2.png" alt="Avatar" class="avatar"> -->
</div>
<hr>
<div class="container w3-text-dark-gray">
<label class="w3-left" for="seller_user"><b><i class="fas fa-user-circle" aria-hidden="true"></i> From</b></label>
<label class="w3-right" id="seller_user_label" for="seller_user">Anand</label>
<input type="hidden" name="seller_user_input" id="seller_user_input">
<label class="w3-right" id="seller_user_id" for="seller_user" style="display: none;">93</label>
<br><br>
<label class="w3-left" for="capacity"><b><i class="fas fa-battery-full" aria-hidden="true"></i> Capacity (kwh)</b></label>
<label class="w3-right" id="capacity" for="capacity"> 1500</label>
<br><br>
<label class="w3-left" for="bank_source"><b><i class="fas fa-solar-panel" aria-hidden="true"></i> bank Source(s)</b></label>
<label class="w3-right" id="bank_source" for="bank_source"><span><label><i class="fas fa-sun"></i> Solar ,</label>&nbsp;&nbsp;<label><i class="fas fa-fan"></i> Wind</label></span></label>
<br><br>
<label class="w3-left" for="selling"><b><i class="fas fa-battery-half" aria-hidden="true"></i> Selling (kwh)</b></label>
<label class="w3-right" id="selling" for="selling">300</label>
<br><br>
<label class="w3-left" for="power_price"><b><i class="fas fa-coins" aria-hidden="true"></i> Price (bank Tokens / kWh)</b></label>
<label class="w3-right" id="power_price" for="power_price">50</label>
<input type="hidden" name="seller_user_price" id="seller_user_price">
<br><br>
<label class="w3-left" for="power_to_buy"><b><i class="fas fa-charging-station" aria-hidden="true"></i> Power to Buy (kWh)</b></label>
<input onchange="set_total_price(this.value)" class = "w3-right" type="number" min="1" placeholder="Enter Power to Buy (kWh)" name="power_to_buy" id = "power_to_buy" value="1" required>
<br><br>
<label class="w3-left" for="total_power_price"><b><i class="fas fa-coins" aria-hidden="true"></i> Total Price (bank Tokens / kWh)</b></label>
<label class="w3-right" id="total_power_price" for="total_power_price">50</label>
<input type="hidden" name="total_power_price_input" id="total_power_price_input">
<br><br>
<div id="buy_power_confirm_loader" class="loader w3-center" style="display: none; width: 50px;height: 50px;margin-left: 45%;margin-right: 45%;"></div>
<br><br>
<button id = "buy_power_confirm_button" class ="w3-right" type="submit">Confirm</button>
<br> <br> <br>
</div>
<div class="container" style="background-color:#f1f1f1">
<button type="button" onclick="document.getElementById('buy_power_confirm').style.display='none'" class="cancelbtn">Cancel</button>
<span class="w3-right w3-opacity"><i class="far fa-clock" aria-hidden="true"></i> Posted at: <span id="ad_posted_timestamp"> Feb 16 2020 17:18:31</span> </span>
</div>
</form>
</div>
</div>
<script type="text/javascript" src="js/double_menu.js"> </script>
<script>
//Get the button
var mybutton = document.getElementById("myBtn");
// When the user scrolls down 20px from the top of the document, show the button
window.onscroll = function() {scrollFunction()};
function scrollFunction() {
if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
mybutton.style.display = "block";
} else {
mybutton.style.display = "none";
}
}
// When the user clicks on the button, scroll to the top of the document
function topFunction() {
document.body.scrollTop = 0;
document.documentElement.scrollTop = 0;
}
</script>
<script type="text/javascript">
function update_datatable_date_range_data(start, end) {
//console.log(start,end);
$('#datetimepicker_data_tables span').html(start.format('MMMM D, YYYY HH:mm') + ' - ' + end.format('MMMM D, YYYY HH:mm'));
}
function initialise_data_table_time_handler_functions() {
var start = moment().subtract(30, 'minutes');
var end = moment();
$('#datetimepicker_data_tables').daterangepicker({
showWeekNumbers: true,
showDropdowns: true,
timePicker: true,
timePicker24Hour: true,
startDate: start,
endDate: end,
alwaysShowCalendars: true,
showCustomRangeLabel: true,
autoApply: true,
maxSpan: {
"days": 6
},
autoUpdateInput:true,
ranges: {
'Today': [moment().startOf('days'), moment().endOf('days')],
'Yesterday': [moment().subtract(1, 'days').startOf('days'), moment().subtract(1, 'days').endOf('days')],
'Last 7 Days': [moment().subtract(6, 'days').startOf('days'), moment().endOf('days')],
'Last 30 Days': [moment().subtract(29, 'days').startOf('days'), moment().endOf('days')],
'This Week': [moment().startOf('week'), moment().endOf('week')],
'Last Week': [moment().subtract(1, 'week').startOf('week'), moment().subtract(1, 'week').endOf('week')],
'This Month': [moment().startOf('month'), moment().endOf('month')],
'Last Month': [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month')]
}
}, update_datatable_date_range_data);
update_datatable_date_range_data(start, end);
}
initialise_data_table_time_handler_functions();
</script>
<script type="text/javascript" src="js/send_ajax_request.js"> </script>
<script type="text/javascript">
//alert("home_page.html");
if ( window.location !== window.parent.location ) {
// The page is in an iframe
console.log("in iframe");
get_session_details();
} else {
// The page is not in an iframe
console.log("out iframe");
check_iframe_session();
}
</script>
<script type="text/javascript">
get_advertisements();
</script>
<script>
var buy_button_clicked= function buy_button_clicked(){
//console.log(this);
var ad_content_div_class = $(this).parent();
console.log(ad_content_div_class.find('.ad_user_id').text());
$("#seller_user_label").text(ad_content_div_class.find('.ad_user_name').text());
$("#seller_user_input").val(ad_content_div_class.find('.ad_user_name').text());
$("#seller_user_id").text(ad_content_div_class.find('.ad_user_id').text());
$("#capacity").text(ad_content_div_class.find('.ad_capacity').text());
$("#selling").text(ad_content_div_class.find('.ad_bank_to_sell').text());
$("#ad_posted_timestamp").text(ad_content_div_class.find('.ad_time_stamp').text());
$("#power_price").text(ad_content_div_class.find('.ad_cost').text());
$("#seller_user_price").val(ad_content_div_class.find('.ad_cost').text());
var price_per_kwh = Number($("#seller_user_price").val());
var buying_kwh = Number($("#power_to_buy").val());
var total_price_string = String(price_per_kwh * buying_kwh);
$("#total_power_price").text(total_price_string);
$("#total_power_price_input").val(total_price_string);
document.getElementById('buy_power_confirm').style.display='block';
//console.log($(this).prevAll());
};
function set_total_price(value){
var price_per_kwh = Number($("#seller_user_price").val());
var buying_kwh = Number(value);
var total_price_string = String(price_per_kwh * buying_kwh);
$("#total_power_price").text(total_price_string);
$("#total_power_price_input").val(total_price_string);
}
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<title>W3.CSS</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<style>
div.sticky {
position: -webkit-sticky;
position: sticky;
top: 0;
}
html {
scroll-behavior: smooth;
}
#consumer_scroll_to_top_button {
display: none;
position: fixed;
bottom: 20px;
right: 2px;
z-index: 99;
font-size: 18px;
border: none;
outline: none;
color: white;
cursor: pointer;
padding: 15px;
border-radius: 4px;
}
/* The actual timeline (the vertical ruler) */
.timeline {
position: relative;
max-width: 1200px;
margin: 0 auto;
}
/* The actual timeline (the vertical ruler) */
.timeline::after {
content: '';
position: absolute;
width: 6px;
background-color: white;
top: 0;
bottom: 0;
left: 50%;
margin-left: -3px;
}
/* Container around content */
.container {
padding: 10px 40px;
position: relative;
background-color: inherit;
width: 50%;
}
/* The circles on the timeline */
.container::after {
content: '';
position: absolute;
width: 25px;
height: 25px;
right: -17px;
background-color: white;
border: 4px solid #FF9F55;
top: 15px;
border-radius: 50%;
z-index: 1;
}
/* Place the container to the left */
.left {
left: 0;
}
/* Place the container to the right */
.right {
left: 50%;
}
/* Add arrows to the left container (pointing right) */
.left::before {
content: " ";
height: 0;
position: absolute;
top: 22px;
width: 0;
z-index: 1;
right: 30px;
border: medium solid white;
border-width: 10px 0 10px 10px;
border-color: transparent transparent transparent white;
}
/* Add arrows to the right container (pointing left) */
.right::before {
content: " ";
height: 0;
position: absolute;
top: 22px;
width: 0;
z-index: 1;
left: 30px;
border: medium solid white;
border-width: 10px 10px 10px 0;
border-color: transparent white transparent transparent;
}
/* Fix the circle for containers on the right side */
.right::after {
left: -16px;
}
/* The actual content */
.content {
padding: 20px 30px;
background-color: white;
position: relative;
border-radius: 6px;
}
/* Media queries - Responsive timeline on screens less than 600px wide */
@media screen and (max-width: 600px) {
/* Place the timelime to the left */
.timeline::after {
left: 31px;
}
/* Full-width containers */
.container {
width: 100%;
padding-left: 70px;
padding-right: 25px;
}
/* Make sure that all arrows are pointing leftwards */
.container::before {
left: 60px;
border: medium solid white;
border-width: 10px 10px 10px 0;
border-color: transparent white transparent transparent;
}
/* Make sure all circles are at the same spot */
.left::after, .right::after {
left: 15px;
}
/* Make all right containers behave like the left ones */
.right {
left: 0%;
}
}
</style>
<body>
<button class="w3-hover-opacity w3-teal" onclick="topFunction()" id="consumer_scroll_to_top_button" title="Go to top"><i class="fa fa-arrow-circle-up" aria-hidden="true"></i> Top</button>
<div class="w3-sidebar w3-bar-block w3-card w3-animate-left w3-collapse" style="display:none;left:0;width: 300px;" id="leftMenu">
<button onclick="closeLeftMenu()" class="w3-bar-item w3-button w3-large">Close &times;</button>
<a href="#" class="w3-bar-item w3-button">Link 1</a>
<a href="#" class="w3-bar-item w3-button">Link 2</a>
<a href="#" class="w3-bar-item w3-button">Link 3</a>
</div>
<div class="w3-sidebar w3-bar-block w3-card w3-animate-right w3-collapse" style="display:none;right:0; width: 300px;" id="rightMenu">
<button onclick="closeRightMenu()" class="w3-bar-item w3-button w3-large">Close &times;</button>
<a href="#" class="w3-bar-item w3-button">Link 1</a>
<a href="#" class="w3-bar-item w3-button">Link 2</a>
<a href="#" class="w3-bar-item w3-button">Link 3</a>
</div>
<div class="w3-main w3-animate-opacity" style="margin-left: 300px; margin-right: 300px;">
<div class="w3-teal w3-blue sticky" style="z-index: 2;">
<button class="w3-button w3-teal w3-xlarge w3-left w3-hide-large" onclick="openLeftMenu()">&#9776;</button>
<button class="w3-button w3-teal w3-xlarge w3-right w3-hide-large" onclick="openRightMenu()">&#9776;</button>
<div class="w3-container">
<h1><i class="fa fa-shopping-cart" aria-hidden="true"></i> Buy</h1>
</div>
</div>
<div class="w3-container" style="background-color: #666;font-family: Helvetica, sans-serif;">
<div class="timeline">
<div class="container left">
<div class="content">
<h2>2017</h2>
<p>Lorem ipsum dolor sit amet, quo ei simul congue exerci, ad nec admodum perfecto mnesarchum, vim ea mazim fierent detracto. Ea quis iuvaret expetendis his, te elit voluptua dignissim per, habeo iusto primis ea eam.</p>
</div>
</div>
<div class="container right">
<div class="content">
<h2>2016</h2>
<p>Lorem ipsum dolor sit amet, quo ei simul congue exerci, ad nec admodum perfecto mnesarchum, vim ea mazim fierent detracto. Ea quis iuvaret expetendis his, te elit voluptua dignissim per, habeo iusto primis ea eam.</p>
</div>
</div>
<div class="container left">
<div class="content">
<h2>2015</h2>
<p>Lorem ipsum dolor sit amet, quo ei simul congue exerci, ad nec admodum perfecto mnesarchum, vim ea mazim fierent detracto. Ea quis iuvaret expetendis his, te elit voluptua dignissim per, habeo iusto primis ea eam.</p>
</div>
</div>
<div class="container right">
<div class="content">
<h2>2012</h2>
<p>Lorem ipsum dolor sit amet, quo ei simul congue exerci, ad nec admodum perfecto mnesarchum, vim ea mazim fierent detracto. Ea quis iuvaret expetendis his, te elit voluptua dignissim per, habeo iusto primis ea eam.</p>
</div>
</div>
<div class="container left">
<div class="content">
<h2>2011</h2>
<p>Lorem ipsum dolor sit amet, quo ei simul congue exerci, ad nec admodum perfecto mnesarchum, vim ea mazim fierent detracto. Ea quis iuvaret expetendis his, te elit voluptua dignissim per, habeo iusto primis ea eam.</p>
</div>
</div>
<div class="container right">
<div class="content">
<h2>2007</h2>
<p>Lorem ipsum dolor sit amet, quo ei simul congue exerci, ad nec admodum perfecto mnesarchum, vim ea mazim fierent detracto. Ea quis iuvaret expetendis his, te elit voluptua dignissim per, habeo iusto primis ea eam.</p>
</div>
</div>
</div>
</div>
</div>
<script type="text/javascript" src="js/double_menu.js"> </script>
<script>
//Get the button
var mybutton = document.getElementById("consumer_scroll_to_top_button");
// When the user scrolls down 20px from the top of the document, show the button
window.onscroll = function() {scrollFunction()};
function scrollFunction() {
if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
mybutton.style.display = "block";
} else {
mybutton.style.display = "none";
}
}
// When the user clicks on the button, scroll to the top of the document
function topFunction() {
document.body.scrollTop = 0;
document.documentElement.scrollTop = 0;
}
</script>
<script type="text/javascript" src="js/send_ajax_request.js"> </script>
<script type="text/javascript">
//alert("consumer.html");
if ( window.location !== window.parent.location ) {
// The page is in an iframe
console.log("in iframe");
} else {
// The page is not in an iframe
console.log("out iframe");
check_iframe_session();
}
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title>Articonf Bank Demo</title>
<link rel="shortcut icon" type="image/png" href="images/favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css" />
<script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@10"></script>
<link
rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"
/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script
src="https://cdnjs.cloudflare.com/ajax/libs/jquery.form/4.2.2/jquery.form.min.js"
integrity="sha384-FzT3vTVGXqf7wRfy8k4BiyzvbNfeYjK+frTVqZeNDFl8woCbF0CYG6g2fMEFFo/i"
crossorigin="anonymous"
></script>
<link rel="stylesheet" href="css/app.css" />
</head>
<body>
<div class="w3-top">
<div
class="w3-bar w3-large w3-collapse"
style="background-color: #f8f8f8; color: #666;"
>
<button
onclick="check_session();"
class="w3-bar-item w3-left w3-hover-opacity"
style="
cursor: pointer;
color: #666;
background-color: #f8f8f8;
"
title="Home"
>
<i class="fa fa-bank"></i> Articonf Bank
<!-- <img src="images/p2p-3.gif" alt="Avatar" class="w3-image" width="80" height="50" /> Articonf Bank -->
</button>
<!-- <button class="w3-bar-item w3-left w3-hover-opacity" style="padding: 0px; cursor: pointer;color: #666; background-color: #f8f8f8;" title="Home"><img src="images/bityoga4.png" height="56" width="200" alt="Avatar" ></button> -->
<!-- <span id = "welcome_user_span" style="width:auto;display: none;" class="w3-bar-item w3-right w3-hide-small" ><i class="fa fa-user-circle-o" aria-hidden="true"></i> Welcome, <strong><span id="session_user_name">Anand </span></strong></span> -->
<!-- <a
style="display: none;"
href="#"
onclick="notification_function()"
class="notification_button w3-bar-item w3-button tablink w3-hover-blue w3-right"
><i class="fa fa-bell" aria-hidden="true"></i>
<span class="w3-hide-small w3-hide-medium">Notification(s)</span></a
> -->
<a
href="#"
onclick="logout()"
style="width: auto; display: none;"
class="logout_button w3-bar-item w3-button w3-hide-small w3-hide-medium tablink w3-hover-blue w3-right"
><i class="fa fa-sign-out" aria-hidden="true"></i> Logout</a
>
<!-- <a
href="#"
onclick="openLink(event, 'my_profile')"
style="display: none;"
class="my_profile_button w3-bar-item w3-button w3-hide-small w3-hide-medium tablink w3-hover-blue w3-right"
><i class="fa fa-sign-in" aria-hidden="true"></i> My Profile</a
> -->
<a
href="#"
onclick="openLink(event, 'login_check')"
style="display: none;"
class="login_button w3-bar-item w3-button w3-hide-small w3-hide-medium tablink w3-hover-blue w3-right"
><i class="fa fa-sign-in" aria-hidden="true"></i> Login</a
>
<a
href="#"
onclick="openLink(event, 'register_check')"
style="display: none;"
class="register_button w3-bar-item w3-button w3-hide-small w3-hide-medium tablink w3-hover-blue w3-right"
><i class="fa fa-user-plus" aria-hidden="true"></i> Register</a
>
<!-- <a
href="#"
onclick="openLink(event, 'buy')"
style="display: none;"
class="buy_button w3-bar-item w3-button w3-hide-small w3-hide-medium tablink w3-hover-blue w3-right"
><i class="fa fa-shopping-cart" aria-hidden="true"></i> Buy</a
> -->
<a
href="#"
onclick="document.getElementById('sell').style.display='block'"
style="width: auto; display: none;"
class="query_button w3-bar-item w3-button w3-hide-small w3-hide-medium tablink w3-hover-blue w3-right"
><i class="fa fa-pencil" aria-hidden="true"></i> Asset History</a
>
<a
href="#"
onclick="document.getElementById('query_chain_code_div').style.display='block'"
style="width: auto; display: none;"
class="invoke_button w3-bar-item w3-button w3-hide-small w3-hide-medium tablink w3-hover-blue w3-right"
><i class="fa fa-question-circle" aria-hidden="true"></i> Query All
Assets</a
>
<a
href="javascript:void(0)"
class="w3-bar-item w3-button w3-right w3-hide-large w3-right w3-hover-blue"
onclick="myFunction()"
>&#9776;</a
>
</div>
</div>
<div
id="demo"
class="w3-sidebar w3-bar-block w3-white w3-hide w3-hide-large w3-animate-right"
style="right: 0;"
>
<button onclick="myFunction()" class="w3-bar-item w3-button w3-large">
Close &times;
</button>
<a
href="#"
onclick="document.getElementById('sell').style.display='block'"
style="width: auto; display: none;"
class="query_button w3-bar-item w3-button w3-hover-blue tablink"
><i class="fa fa-pencil" aria-hidden="true"></i> Asset History</a
>
<a
href="#"
onclick="document.getElementById('query_chain_code_div').style.display='block'"
style="width: auto; display: none;"
class="invoke_button w3-bar-item w3-button w3-hover-blue tablink"
><i class="fa fa-question-circle" aria-hidden="true"></i> Query All
Assets</a
>
<a
href="#"
onclick="logout()"
style="display: none;"
class="logout_button w3-bar-item w3-button w3-hover-blue tablink"
><i class="fa fa-sign-out" aria-hidden="true"></i> Logout</a
>
<!-- <a
href="#"
onclick="openLink(event, 'my_profile')"
style="display: none;"
class="my_profile_button w3-bar-item w3-button w3-hover-blue tablink"
><i class="fa fa-shopping-cart" aria-hidden="true"></i> My Profile</a
> -->
<a
href="#"
onclick="openLink(event, 'login_check')"
style="display: none;"
class="login_button w3-bar-item w3-button w3-hover-blue tablink"
><i class="fa fa-sign-in" aria-hidden="true"></i> Login</a
>
<a
href="#"
onclick="openLink(event, 'register_check')"
style="display: none;"
class="register_button w3-bar-item w3-button w3-hover-blue tablink"
><i class="fa fa-user-plus" aria-hidden="true"></i> Register</a
>
<!-- <a
href="#"
onclick="openLink(event, 'buy')"
style="display: none;"
class="buy_button w3-bar-item w3-button w3-hover-blue tablink"
><i class="fa fa-shopping-cart" aria-hidden="true"></i> Buy</a
> -->
<!-- <a href="#" onclick="document.getElementById('sell').style.display='block'" style="width:auto;display: none;" class="invoke_button w3-bar-item w3-button w3-hover-blue tablink "><i class="fa fa-pencil" aria-hidden="true"></i> Invoke</a>
<a href="#" onclick="document.getElementById('query_chain_code_div').style.display='block'" style="width:auto; display: none;" class="query_button w3-bar-item w3-button w3-hover-blue tablink "><i class="fa fa-question-circle" aria-hidden="true"></i> Query</a> -->
</div>
<div
id="my_profile"
class="iframe_holder"
style="background-color: white; display: none;"
>
<iframe
id="my_profile_iframe"
src="my_profile.html"
width="100%"
height="100%"
marginwidth="0"
marginheight="0"
frameborder="0"
></iframe>
</div>
<div id="sell" class="modal" style="overflow: visible;">
<form
id="sell_form"
action="/sell"
enctype="multipart/form-data"
method="POST"
class="modal-content animate"
>
<div class="imgcontainer">
<span
onclick="document.getElementById('sell').style.display='none'"
class="close"
title="Close Modal"
style="top: -17px;"
>&times;</span
>
<strong><span>Asset History</span></strong>
<!-- <img src="images/avatar2.png" alt="Avatar" class="avatar"> -->
</div>
<hr />
<div class="container">
<label for="Chain_Code_Name"><b>Chaincode Name</b></label>
<input
type="text"
placeholder="Enter Chaincode Name"
name="Chain_Code_Name"
id="Chain_Code_Name"
value="bank"
required
/>
<label for="Chain_Code_Function_Name"
><b>Chain Code Function Name</b></label
>
<input
type="text"
placeholder="Enter Chain_Code_Function_Name"
name="Chain_Code_Function_Name"
id="Chain_Code_Function_Name"
value="GetAssetHistory"
required
/>
<label for="car_license_plate"><b>User Name</b></label>
<!-- <input
type="text"
placeholder="Enter Car_License_Plate"
name="User_Name"
id="User_Name"
required
/> -->
<select
class="w3-select w3-border w3-center"
name="History_User_Name"
id="History_User_Name"
name="option"
style="font-weight: bold; color: black; background-color: white;"
>
</select>
<div
id="sell_loader"
class="loader w3-center"
style="
display: none;
width: 50px;
height: 50px;
margin-left: 45%;
margin-right: 45%;
"
></div>
<button type="submit">Get Assset History</button>
</div>
<div class="container" style="background-color: #f1f1f1;">
<button
type="button"
onclick="document.getElementById('sell').style.display='none'"
class="cancelbtn"
>
Cancel
</button>
</div>
</form>
</div>
<div id="buy" class="iframe_holder" style="display: none;">
<iframe
src="buy_page.html"
width="100%"
height="100%"
marginwidth="0"
marginheight="0"
frameborder="0"
></iframe>
</div>
<div id="login_check" class="iframe_holder" style="display: none;">
<iframe
src="login_check.html"
width="100%"
height="100%"
marginwidth="0"
marginheight="0"
frameborder="0"
></iframe>
</div>
<div id="register_check" class="iframe_holder" style="display: none;">
<iframe
src="register_check.html"
width="100%"
height="100%"
marginwidth="0"
marginheight="0"
frameborder="0"
></iframe>
</div>
<div id="login" class="modal" style="overflow: visible;">
<form
id="login_form"
action="/login"
enctype="multipart/form-data"
method="POST"
class="modal-content animate"
>
<div class="imgcontainer">
<span
onclick="document.getElementById('login').style.display='none'"
class="close"
title="Close Modal"
style="top: -17px;"
>&times;</span
>
<strong><span>Login</span></strong>
</div>
<hr />
<div class="container">
<label for="Login_User_Name"><b>Username</b></label>
<input
type="text"
placeholder="Enter Username"
name="Login_User_Name"
id="Login_User_Name"
required
/>
<label for="Login_Password"><b>Password</b></label>
<input
type="password"
placeholder="Enter Password"
name="Login_Password"
id="Login_Password"
required
/>
<button type="submit">Login</button>
<div
id="login_loader"
class="loader w3-center"
style="
display: none;
width: 50px;
height: 50px;
margin-left: 45%;
margin-right: 45%;
"
></div>
<label>
<input type="checkbox" checked="checked" name="remember" /> Remember
me
</label>
</div>
<div class="container" style="background-color: #f1f1f1;">
<button
type="button"
onclick="document.getElementById('login').style.display='none'"
class="cancelbtn"
>
Cancel
</button>
<span class="psw">Forgot <a href="#">password?</a></span>
</div>
</form>
</div>
<div id="query_chain_code_div" class="modal" style="overflow: visible;">
<form
id="query_chain_code"
action="/query_chain_code"
enctype="multipart/form-data"
method="POST"
class="modal-content animate"
>
<div class="imgcontainer">
<span
onclick="document.getElementById('query_chain_code_div').style.display='none'"
class="close"
title="Close Modal"
style="top: -17px;"
>&times;</span
>
<strong><span>Get All Assets</span></strong>
</div>
<hr />
<div class="container">
<label for="Chain_Code_Name"><b>Chaincode Name</b></label>
<input
type="text"
placeholder="Enter Chaincode Name"
name="Chain_Code_Name"
id="Chain_Code_Name"
value="bank"
required
/>
<label for="Chain_Code_Function_Name"
><b>Chain Code Function Name</b></label
>
<input
type="text"
placeholder="Enter Password"
name="Chain_Code_Function_Name"
id="Chain_Code_Function_Name"
value="GetAllAssets"
required
/>
<div
id="query_chain_code_loader"
class="loader w3-center"
style="
display: none;
width: 50px;
height: 50px;
margin-left: 45%;
margin-right: 45%;
"
></div>
<button type="submit">Get All Assets</button>
</div>
<div class="container" style="background-color: #f1f1f1;">
<button
type="button"
onclick="document.getElementById('query_chain_code_div').style.display='none'"
class="cancelbtn"
>
Cancel
</button>
</div>
</form>
</div>
<div id="register" class="modal" style="overflow: visible;">
<form
id="register_form"
action="/register"
enctype="multipart/form-data"
method="POST"
class="modal-content animate"
>
<div class="imgcontainer">
<span
onclick="document.getElementById('register').style.display='none'"
class="close"
title="Close Modal"
>&times;</span
>
<img src="images/avatar2.png" alt="Avatar" class="avatar" />
</div>
<div class="container">
<label for="User_Name"><b>Username</b></label>
<input
type="text"
placeholder="Enter Username"
id="User_Name"
name="User_Name"
required
/>
<label for="User_Password"><b>Password</b></label>
<input
type="password"
placeholder="Enter Password"
id="User_Password"
name="User_Password"
required
/>
<label for="User_House_Number"><b>House_Numeber</b></label>
<input
type="text"
placeholder="Enter House Number"
id="User_House_Number"
name="User_House_Number"
required
/>
<button type="submit">Register</button>
<div
id="register_loader"
class="loader w3-center"
style="
display: none;
width: 50px;
height: 50px;
margin-left: 45%;
margin-right: 45%;
"
></div>
<label>
<input type="checkbox" checked="checked" name="remember" /> Remember
me
</label>
</div>
<div class="container" style="background-color: #f1f1f1;">
<button
type="button"
onclick="document.getElementById('register').style.display='none'"
class="cancelbtn"
>
Cancel
</button>
<span class="psw">Forgot <a href="#">password?</a></span>
</div>
</form>
</div>
<div class="footer" style="background-color: #f8f8f8; color: #666;">
<img
class="w3-left"
style="padding: 5px; margin-left: 5px;"
src="images/articonf4.png"
height="52"
alt="Avatar"
/>
<img
class="w3-right"
style="padding: 5px;"
src="images/eu.png"
height="52"
alt="Avatar"
/>
<img
class="w3-right"
style="padding: 5px;"
src="images/bityoga5.png"
height="52"
alt="Avatar"
/>
<span class="w3-hide-small w3-right" style="margin-top: 16px;"
>Powered by :</span
>
</div>
<script type="text/javascript" src="js/send_ajax_request.js"></script>
<script type="text/javascript" src="js/double_menu.js"></script>
<script type="text/javascript">
//$("#home").load("home_page.html");
//$("#login").load("login.html");
</script>
<script type="text/javascript" src="js/modal.js"></script>
<script type="text/javascript">
check_session();
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<title>W3.CSS</title>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css" />
<link
rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"
/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@10"></script>
<style>
div.sticky {
position: -webkit-sticky;
position: sticky;
top: 0;
}
html {
scroll-behavior: smooth;
}
#myBtn {
display: none;
position: fixed;
bottom: 20px;
right: 2px;
z-index: 99;
font-size: 18px;
border: none;
outline: none;
cursor: pointer;
padding: 15px;
border-radius: 4px;
color: #fff !important;
background-color: #305342 !important;
}
</style>
<style>
body {
font-family: Arial, Helvetica, sans-serif;
}
form {
border: 3px solid #f1f1f1;
}
input[type="text"],
input[type="password"] {
width: 100%;
padding: 12px 20px;
margin: 8px 0;
display: inline-block;
border: 1px solid #ccc;
box-sizing: border-box;
}
#login_form button {
background-color: #4caf50;
color: white;
padding: 14px 20px;
margin: 8px 0;
border: none;
cursor: pointer;
width: 100%;
}
#login_form button:hover {
opacity: 0.8;
}
#login_form .cancelbtn {
width: auto;
padding: 10px 18px;
background-color: #f44336;
}
.imgcontainer {
text-align: center;
margin: 24px 0 12px 0;
}
img.avatar {
width: 40%;
border-radius: 50%;
}
.container {
padding: 16px;
}
span.psw {
float: right;
padding-top: 16px;
}
/* Change styles for span and cancel button on extra small screens */
@media screen and (max-width: 300px) {
span.psw {
display: block;
float: none;
}
.cancelbtn {
width: 100%;
}
}
.loader {
border: 16px solid #f3f3f3;
border-radius: 50%;
border-top: 16px solid #3498db;
width: 120px;
height: 120px;
-webkit-animation: spin 2s linear infinite; /* Safari */
animation: spin 2s linear infinite;
}
/* Safari */
@-webkit-keyframes spin {
0% {
-webkit-transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(360deg);
}
}
@keyframes spin {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
</style>
<body>
<button
class="w3-hover-opacity"
onclick="topFunction()"
id="myBtn"
title="Go to top"
>
<i class="fa fa-arrow-circle-up" aria-hidden="true"></i> Top
</button>
<div
class="w3-sidebar w3-bar-block w3-animate-left w3-collapse"
style="display: none; left: 0; width: 30vw; z-index: 3;"
id="leftMenu"
>
<!-- <button onclick="closeLeftMenu()" class="w3-bar-item w3-button w3-hide-large">Close &times;</button> -->
<!-- <div style="margin-top: 60%; ">
<img src="images/bc.png" style ="width: 100%;" alt="Avatar">
</div> -->
<div style="margin-top: 15vh; margin-left: 2vw;">
<!-- <video autoplay loop muted style = "width: 90%;" src="https://bityoga.com/wp-content/uploads/Bityoga%20HD%202-full.mp4"></video> -->
<!-- <video
autoplay
loop
muted
style="width: 90%;"
src="images/by21.mp4"
></video> -->
<div>
<!-- <img src="images/p2p-3.gif" alt="Avatar" class="w3-image" /> -->
<img src="images/bc_anim5.gif" alt="Avatar" class="w3-image" />
</div>
</div>
</div>
<div
class="w3-sidebar w3-bar-block w3-animate-right w3-collapse"
style="display: none; right: 0; width: 30vw; z-index: 3;"
id="rightMenu"
>
<!-- <button onclick="closeRightMenu()" class="w3-bar-item w3-button w3-hide-large">Close &times;</button> -->
<!-- <div style="margin-top: 18vh; margin-left: 9vw;">
<img src="images/logo.jpeg" alt="Avatar" />
</div> -->
<!-- <div style="margin-top: 10%; ">
<img src="images/bc.png" style ="width: 100%; height: 100%;" alt="Avatar">
</div> -->
</div>
<div
class="w3-main w3-animate-opacity"
style="margin-left: 30vw; margin-right: 30vw; margin-top: 10vh;"
>
<div class="w3-container" style="padding: 20px;">
<header
class="w3-container"
style="background-color: #779687 !important; color: white;"
>
<h1><i class="fa fa-sign-in" aria-hidden="true"></i> Login</h1>
</header>
<form
id="login_form"
action="/login"
enctype="multipart/form-data"
method="POST"
>
<div class="container">
<label for="Login_User_Name"><b>Username</b></label>
<input
type="text"
placeholder="Enter Username"
name="Login_User_Name"
id="Login_User_Name"
required
/>
<label for="Login_Password"><b>Password</b></label>
<input
type="password"
placeholder="Enter Password"
name="Login_Password"
id="Login_Password"
required
/>
<div
id="login_loader"
class="loader w3-center"
style="
display: none;
width: 50px;
height: 50px;
margin-left: 45%;
margin-right: 45%;
"
></div>
<button type="submit">Login</button>
<label>
<input type="checkbox" checked="checked" name="remember" />
Remember me
</label>
</div>
<div class="container" style="background-color: #f1f1f1;">
<div class="w3-row">
<button type="button" class="cancelbtn">Cancel</button>
<p class="w3-right">
Not Registered ? &nbsp;&nbsp;<a
class="w3-text-blue"
href="/register_check.html"
>Register Here</a
>
</p>
<!-- <span class="psw">Forgot <a href="#">password?</a></span> -->
</div>
<!-- <div class="w3-row">
<p class="w3-right">
Not Registered ? &nbsp;&nbsp;<a
class="w3-text-blue"
href="/register_check.html"
>Register Here</a
>
</p> -->
</div>
</div>
</form>
</div>
</div>
<script type="text/javascript" src="js/double_menu.js"></script>
<script>
//Get the button
var mybutton = document.getElementById("myBtn");
// When the user scrolls down 20px from the top of the document, show the button
window.onscroll = function () {
scrollFunction();
};
function scrollFunction() {
if (
document.body.scrollTop > 20 ||
document.documentElement.scrollTop > 20
) {
mybutton.style.display = "block";
} else {
mybutton.style.display = "none";
}
}
// When the user clicks on the button, scroll to the top of the document
function topFunction() {
document.body.scrollTop = 0;
document.documentElement.scrollTop = 0;
}
</script>
<script type="text/javascript" src="js/send_ajax_request.js"></script>
</body>
</html>
<!DOCTYPE html>
<html>
<title>W3.CSS</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<script
src="https://code.jquery.com/jquery-3.4.1.min.js"
integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
crossorigin="anonymous"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/momentjs/latest/moment.min.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/daterangepicker/daterangepicker.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/daterangepicker/daterangepicker.css" />
<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.nicescroll/3.7.6/jquery.nicescroll.min.js"></script>
<script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@10"></script>
<style>
div.sticky {
position: -webkit-sticky;
position: sticky;
top: 0;
}
html {
scroll-behavior: smooth;
}
#myBtn {
display: none;
position: fixed;
bottom: 20px;
right: 2px;
z-index: 99;
font-size: 18px;
border: none;
outline: none;
cursor: pointer;
padding: 15px;
border-radius: 4px;
color: #fff!important;
background-color: #305342!important;
}
/* If the screen size is 600px wide or less, set the font-size of <div> to 30px */
@media screen and (max-width: 600px) {
.calendar_text{
font-size: 3vw;
}
#graph_updated_timestamp{
font-size: 3vw;
}
.w3-sidebar{
width: 100vw;
}
}
/* Hide scrollbar for Chrome, Safari and Opera */
.w3-sidebar::-webkit-scrollbar {
display: none;
}
/* Hide scrollbar for IE and Edge */
.w3-sidebar {
-ms-overflow-style: none;
}
/* .w3-sidebar:hover {
overflow-y:visible;
}
.w3-sidebar::-webkit-scrollbar {
width: 5px;
}
.w3-sidebar::-webkit-scrollbar-track {
background: #f1f1f1;
}
.w3-sidebar::-webkit-scrollbar-thumb {
background: #888;
}
.w3-sidebar::-webkit-scrollbar-thumb:hover {
background: #555;
} */
.tiles{
/*background-color: #c2e4ff !important;*/
color: #272424!important;
padding: 2vw;
}
.topright {
position: absolute;
top: 8px;
right: 16px;
font-size: 18px;
}
.loader {
border: 16px solid #f3f3f3;
border-radius: 50%;
border-top: 16px solid #3498db;
width: 120px;
height: 120px;
-webkit-animation: spin 2s linear infinite; /* Safari */
animation: spin 2s linear infinite;
}
/* Safari */
@-webkit-keyframes spin {
0% { -webkit-transform: rotate(0deg); }
100% { -webkit-transform: rotate(360deg); }
}
@keyframes spin {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}
</style>
<style>
body {font-family: Arial, Helvetica, sans-serif;}
/* form {border: 3px solid #f1f1f1;} */
input[type=text], input[type=password] {
width: 100%;
padding: 12px 20px;
margin: 8px 0;
display: inline-block;
border: 1px solid #ccc;
box-sizing: border-box;
}
#bank_form button {
background-color: #4CAF50;
color: white;
padding: 14px 20px;
margin: 8px 0;
border: none;
cursor: pointer;
width: 100%;
}
#bank_form button:hover {
opacity: 0.8;
}
#bank_form .cancelbtn {
width: auto;
padding: 10px 18px;
background-color: #f44336;
}
.imgcontainer {
text-align: center;
margin: 24px 0 12px 0;
}
img.avatar {
width: 40%;
border-radius: 50%;
}
.container {
padding: 16px;
}
span.psw {
float: right;
padding-top: 16px;
}
/* Change styles for span and cancel button on extra small screens */
@media screen and (max-width: 300px) {
span.psw {
display: block;
float: none;
}
.cancelbtn {
width: 100%;
}
}
.loader {
border: 16px solid #f3f3f3;
border-radius: 50%;
border-top: 16px solid #3498db;
width: 120px;
height: 120px;
-webkit-animation: spin 2s linear infinite; /* Safari */
animation: spin 2s linear infinite;
}
/* Safari */
@-webkit-keyframes spin {
0% { -webkit-transform: rotate(0deg); }
100% { -webkit-transform: rotate(360deg); }
}
@keyframes spin {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}
</style>
<body >
<button class="w3-hover-opacity" onclick="topFunction()" id="myBtn" title="Go to top"><i class="fa fa-arrow-circle-up" aria-hidden="true"></i> Top</button>
<div class="w3-sidebar w3-bar-block w3-animate-left w3-collapse" style="display:none;left:0;width: 30vw; z-index: 3;overflow: -moz-hidden-unscrollable;" id="leftMenu">
<button onclick="closeLeftMenu()" class="w3-bar-item w3-button w3-hide-large">Close &times;</button>
<div class="w3-row">
<div style="margin-top: 25vh; margin-left: 2vw;">
<!-- <video autoplay loop muted style = "width: 90%;" src="images/by21.mp4"></video> -->
<div>
<img style="width: 50%; margin-left: 25%;" src="images/p2p-3.gif" alt="Avatar" class="w3-image" />
<img style="margin-left: 6vw;" src="images/bc_anim.gif" alt="Avatar" class="w3-image" />
</div>
</div>
</div>
</div>
<div class="w3-sidebar w3-bar-block w3-animate-right w3-collapse" style="display:none;right:0; width:30vw;z-index: 3;overflow: -moz-hidden-unscrollable;" id="rightMenu">
<button onclick="closeRightMenu()" class="w3-bar-item w3-button w3-hide-large">Close &times;</button>
<div class="w3-row">
</div>
</div>
<div class="w3-main w3-animate-opacity" style="margin-left: 30vw; margin-right: 30vw;">
<!-- <div class="sticky w3-hide-large" style="color: #fff!important; background-color: #305342!important;z-index: 2;">
<button class="w3-button w3-large w3-left w3-hide-large" onclick="openLeftMenu()"><i class="fa fa-filter" aria-hidden="true"></i> Filters</button>
<button class="w3-button w3-large w3-right w3-hide-large" onclick="openRightMenu()"><i class="fas fa-user-circle" aria-hidden="true"> My Profile</i></button>
<div class="w3-container ">
<h2 class="w3-hide"><i class='fas fa-solar-panel' aria-hidden="true"></i> Stats <i class="fas fa-house-day"></i></h2>
</div>
</div> -->
<div class="sticky w3-container" style="padding: 20px;">
<header class="w3-container w3-center " style="background-color: #779687!important; color: white;">
<h1><i class="fa fa-bank" aria-hidden="true"></i> Hyperledger Fabric Bank</h1>
</header>
<form id="get_user_balance" action="/get_user_balance" enctype="multipart/form-data" method="POST" >
<div class="container w3-card">
<div class="w3-row w3-center">
<h1 class=" w3-text-blue"><i class="fa fa-money" aria-hidden="true"></i> Check Balance</h1>
</div>
<div class="w3-row w3-padding">
<label for="Query_User_Name"><b><i class="fa fa-user-circle" aria-hidden="true"></i> Username</b></label>
<!-- <input type="text" placeholder="Enter Username" name="Query_User_Name" id = "Query_User_Name" required> -->
<select class="w3-select w3-border" name="Query_User_Name" id = "Query_User_Name" name="option" style="font-weight: bold;color: black;background-color: white;">
</select>
</div>
<div class="w3-row w3-padding">
<div id="get_balance_loader" class="loader w3-center" style="display: none; width: 50px;height: 50px;margin-left: 45%;margin-right: 45%;"></div>
<button class="w3-button w3-green w3-block" type="submit"><i class="fa fa-money" aria-hidden="true"></i> Get Balance</button>
</div>
</form>
<form id="transfer_amount" action="/transfer_amount" enctype="multipart/form-data" method="POST" >
<div class="w3-row w3-center ">
<h1 class="w3-text-blue"><i class="fa fa-angle-double-right" aria-hidden="true"></i> Transfer Amount</h1>
</div>
<div class="w3-row w3-center ">
<div class="w3-half w3-padding">
<label for="From_User_Name"><b><i class="fa fa-user-circle" aria-hidden="true"></i> From User</b></label>
<!-- <input type="text" placeholder="From Username" name="From_User_Name" id = "From_User_Name" required> -->
<select class="w3-select w3-border" name="From_User_Name" id = "From_User_Name" name="option" style="font-weight: bold;color: black;background-color: white;">
</select>
</div>
<div class="w3-half w3-padding">
<label for="To_User_Name "><b><i class="fa fa-user-circle" aria-hidden="true"></i> To User</b></label>
<!-- <input type="text" placeholder="To Username" name="To_User_Name" id = "To_User_Name" required> -->
<select class="w3-select w3-border w3-center" name="To_User_Name" id = "To_User_Name" name="option" style="font-weight: bold;color: black;background-color: white;">
</select>
</div>
</div>
<div class="w3-row w3-center w3-padding">
<label for="Amount"><b><i class="fa fa-money" aria-hidden="true"></i> Amount</b></label>
<input type="text" placeholder="Enter Amount" name="Amount" id = "Amount" required>
</div>
<div class="w3-row w3-center w3-padding">
<label for="Reason"><b><i class="fa fa-question-circle" aria-hidden="true"></i> Reason</b></label>
<select class="w3-select w3-border" name="Reason" id = "Reason" name="option" style="font-weight: bold;color: black;background-color: white;">
<!-- <option value="" disabled selected>Choose your option</option> -->
<option value="Friendly_Help" selected>Friendly Help</option>
<option value="Emergency_Help">Emergency Help</option>
<option value="Payback_Loan">Payback Loan</option>
<option value="House_Rent">House Rent</option>
</select>
</div>
<div class="w3-row w3-padding">
<div id="transfer_loader" class="loader w3-center" style="display: none; width: 50px;height: 50px;margin-left: 45%;margin-right: 45%;"></div>
<button class="w3-button w3-green w3-block" type="submit"><i class="fa fa-exchange aria-hidden="true"></i> Transfer</button>
</div>
</form>
</div>
</div>
</div>
</div>
<script type="text/javascript" src="js/double_menu.js"> </script>
<script>
//Get the button
var mybutton = document.getElementById("myBtn");
// When the user scrolls down 20px from the top of the document, show the button
window.onscroll = function() {scrollFunction()};
function scrollFunction() {
if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
mybutton.style.display = "block";
} else {
mybutton.style.display = "none";
}
}
// When the user clicks on the button, scroll to the top of the document
function topFunction() {
document.body.scrollTop = 0;
document.documentElement.scrollTop = 0;
}
</script>
<script type="text/javascript" src="js/send_ajax_request.js"> </script>
<script type="text/javascript">
if ( window.location !== window.parent.location ) {
// The page is in an iframe
console.log("in iframe");
get_session_details();
}
else {
// The page is not in an iframe
console.log("out iframe");
check_iframe_session();
}
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<title>Sell</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<style>
div.sticky {
position: -webkit-sticky;
position: sticky;
top: 0;
}
</style>
<body>
<div class="w3-sidebar w3-bar-block w3-card w3-animate-left w3-collapse" style="display:none;left:0;width: 200px;" id="leftMenu">
<button onclick="closeLeftMenu()" class="w3-bar-item w3-button w3-large">Close &times;</button>
<a href="#" class="w3-bar-item w3-button">Link 1</a>
<a href="#" class="w3-bar-item w3-button">Link 2</a>
<a href="#" class="w3-bar-item w3-button">Link 3</a>
</div>
<div class="w3-sidebar w3-bar-block w3-card w3-animate-right w3-collapse" style="display:none;right:0; width: 200px;" id="rightMenu">
<button onclick="closeRightMenu()" class="w3-bar-item w3-button w3-large">Close &times;</button>
<a href="#" class="w3-bar-item w3-button">Link 1</a>
<a href="#" class="w3-bar-item w3-button">Link 2</a>
<a href="#" class="w3-bar-item w3-button">Link 3</a>
</div>
<div class="w3-main w3-animate-opacity" style="margin-left: 200px; margin-right: 200px;">
<div class="w3-teal w3-blue sticky">
<button class="w3-button w3-teal w3-xlarge w3-left w3-hide-large" onclick="openLeftMenu()">&#9776;</button>
<button class="w3-button w3-teal w3-xlarge w3-right w3-hide-large" onclick="openRightMenu()">&#9776;</button>
<div class="w3-container">
<h1><i class="fa fa-pencil" aria-hidden="true"></i> Sell</h1>
</div>
</div>
<div class="w3-container">
<div class="w3-row w3-padding-64">
<div class="w3-twothird w3-container">
<h1 class="w3-text-teal">Heading</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Lorem ipsum
dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
</div>
<div class="w3-third w3-container">
<p class="w3-border w3-padding-large w3-padding-32 w3-center">AD</p>
<p class="w3-border w3-padding-large w3-padding-64 w3-center">AD</p>
</div>
</div>
<div class="w3-row">
<div class="w3-twothird w3-container">
<h1 class="w3-text-teal">Heading</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Lorem ipsum
dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
</div>
<div class="w3-third w3-container">
<p class="w3-border w3-padding-large w3-padding-32 w3-center">AD</p>
<p class="w3-border w3-padding-large w3-padding-64 w3-center">AD</p>
</div>
</div>
<div class="w3-row w3-padding-64">
<div class="w3-twothird w3-container">
<h1 class="w3-text-teal">Heading</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Lorem ipsum
dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
</div>
<div class="w3-third w3-container">
<p class="w3-border w3-padding-large w3-padding-32 w3-center">AD</p>
<p class="w3-border w3-padding-large w3-padding-64 w3-center">AD</p>
</div>
</div>
</div>
</div>
<script type="text/javascript" src="js/double_menu.js"> </script>
</body>
</html>
<!DOCTYPE html>
<html>
<title>W3.CSS</title>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css" />
<link
rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"
/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@10"></script>
<style>
div.sticky {
position: -webkit-sticky;
position: sticky;
top: 0;
}
html {
scroll-behavior: smooth;
}
#myBtn {
display: none;
position: fixed;
bottom: 20px;
right: 2px;
z-index: 99;
font-size: 18px;
border: none;
outline: none;
cursor: pointer;
padding: 15px;
border-radius: 4px;
widows: 20px;
color: #fff !important;
background-color: #305342 !important;
}
</style>
<style>
.loader {
border: 16px solid #f3f3f3;
border-radius: 50%;
border-top: 16px solid #3498db;
width: 120px;
height: 120px;
-webkit-animation: spin 2s linear infinite; /* Safari */
animation: spin 2s linear infinite;
}
/* Safari */
@-webkit-keyframes spin {
0% {
-webkit-transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(360deg);
}
}
@keyframes spin {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
body {
font-family: Arial, Helvetica, sans-serif;
}
form {
border: 3px solid #f1f1f1;
}
input[type="text"],
input[type="password"] {
width: 100%;
padding: 12px 20px;
margin: 8px 0;
display: inline-block;
border: 1px solid #ccc;
box-sizing: border-box;
}
#register button {
background-color: #4caf50;
color: white;
padding: 14px 20px;
margin: 8px 0;
border: none;
cursor: pointer;
width: 100%;
}
#register button:hover {
opacity: 0.8;
}
#register .cancelbtn {
width: auto;
padding: 10px 18px;
background-color: #f44336;
}
.imgcontainer {
text-align: center;
margin: 24px 0 12px 0;
}
img.avatar {
width: 100px;
border-radius: 50%;
}
.container {
padding: 16px;
}
span.psw {
float: right;
padding-top: 16px;
}
/* Change styles for span and cancel button on extra small screens */
@media screen and (max-width: 300px) {
span.psw {
display: block;
float: none;
}
.cancelbtn {
width: 100%;
}
}
</style>
<body>
<button
class="w3-hover-opacity"
onclick="topFunction()"
id="myBtn"
title="Go to top"
>
<i class="fa fa-arrow-circle-up" aria-hidden="true"></i> Top
</button>
<div
class="w3-sidebar w3-bar-block w3-animate-left w3-collapse"
style="display: none; left: 0; width: 30vw; z-index: 3;"
id="leftMenu"
>
<!-- <button onclick="closeLeftMenu()" class="w3-bar-item w3-button w3-hide-large">Close &times;</button> -->
<div style="margin-top: 15vh; margin-left: 2vw;">
<!-- <video autoplay loop muted style = "width: 90%;" src="images/by21.mp4"></video> -->
<div>
<img style="width: 50%; margin-left: 25%;" src="images/p2p-3.gif" alt="Avatar" class="w3-image" />
<img style="margin-left: 6vw;" src="images/bc_anim.gif" alt="Avatar" class="w3-image" />
</div>
</div>
</div>
<div
class="w3-sidebar w3-bar-block w3-animate-right w3-collapse"
style="display: none; right: 0; width: 30vw; z-index: 3;"
id="rightMenu"
>
<!-- <button onclick="closeRightMenu()" class="w3-bar-item w3-button w3-hide-large">Close &times;</button> -->
<!-- <div style="margin-top: 25vh; margin-left: 7vw; ">
<img src="images/logo.jpeg" alt="Avatar" >
</div> -->
</div>
<div
class="w3-main w3-animate-opacity"
style="margin-left: 30vw; margin-right: 30vw; margin-top: 10vh;"
>
<div class="w3-container" style="padding: 20px;">
<header
class="w3-container"
style="background-color: #779687 !important; color: white;"
>
<h1><i class="fa fa-user-plus" aria-hidden="true"></i> Register</h1>
</header>
<div id="register">
<form
id="register_form"
action="/register"
enctype="multipart/form-data"
method="POST"
>
<div class="imgcontainer">
<img src="images/avatar2.png" alt="Avatar" class="avatar" />
</div>
<div class="container">
<label for="User_Name"><b>Username</b></label>
<input
type="text"
placeholder="Enter Username"
id="User_Name"
name="User_Name"
required
/>
<label for="User_Password"><b>Password</b></label>
<input
type="password"
placeholder="Enter Password"
id="User_Password"
name="User_Password"
required
/>
<!-- <label for="User_House_Number"><b>Smart Meter Id</b></label>
<input type="text" placeholder="Enter Your Smart Meter Id" id = "User_House_Number" name="User_House_Number" required> -->
<div
id="register_loader"
class="loader w3-center"
style="
display: none;
width: 50px;
height: 50px;
margin-left: 45%;
margin-right: 45%;
"
></div>
<button type="submit">Register</button>
<label>
<input type="checkbox" checked="checked" name="remember" />
Remember me
</label>
</div>
<div class="container" style="background-color: #f1f1f1;">
<button type="button" class="cancelbtn">Cancel</button>
<span class="psw"
>Already registered ?&nbsp;&nbsp;<a
class="w3-text-blue"
href="/login_check.html"
>Login Here ...</a
></span
>
</div>
</form>
</div>
</div>
</div>
<script type="text/javascript" src="js/double_menu.js"></script>
<script>
//Get the button
var mybutton = document.getElementById("myBtn");
// When the user scrolls down 20px from the top of the document, show the button
window.onscroll = function () {
scrollFunction();
};
function scrollFunction() {
if (
document.body.scrollTop > 20 ||
document.documentElement.scrollTop > 20
) {
mybutton.style.display = "block";
} else {
mybutton.style.display = "none";
}
}
// When the user clicks on the button, scroll to the top of the document
function topFunction() {
document.body.scrollTop = 0;
document.documentElement.scrollTop = 0;
}
</script>
<script type="text/javascript" src="js/send_ajax_request.js"></script>
</body>
</html>
This source diff could not be displayed because it is too large. You can view the blob instead.
{
"name": "bank_app",
"version": "1.0.0",
"description": "Articonf Bank App Demo",
"main": "app.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"repository": {
"type": "git",
"url": "git+https://github.com/bityoga/articonf-bank-app.git"
},
"keywords": [
"articonf",
"bank app"
],
"author": "anandhakumar palanisamy",
"license": "Apache-2.0",
"bugs": {
"url": "https://github.com/bityoga/articonf-bank-app/issues"
},
"homepage": "https://github.com/bityoga/articonf-bank-app#readme",
"dependencies": {
"crypto": "^1.0.1",
"express": "^4.17.1",
"express-formidable": "^1.2.0",
"express-session": "^1.17.1",
"fabric-ca-client": "~1.4.3",
"fabric-network": "~1.4.3",
"fs": "0.0.1-security",
"jsonwebtoken": "^8.5.1",
"sqlite-async": "^1.1.0"
},
"devDependencies": {
"chai": "^4.2.0",
"eslint": "^5.9.0",
"mocha": "^5.2.0",
"nyc": "^15.0.0",
"sinon": "^7.1.1",
"sinon-chai": "^3.3.0"
}
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment