Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Dev to dev_Dropdown #17

Merged
merged 5 commits into from
Oct 9, 2018
Merged

Dev to dev_Dropdown #17

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
f05483a
Set theme jekyll-theme-minimal
danijanos Sep 29, 2018
f3b90d3
Merge pull request #3 from danijanos/dev
danijanos Sep 29, 2018
f367f68
Add files via upload
jozsf Oct 3, 2018
8e65fb9
Add files via upload
jozsf Oct 3, 2018
99e6d40
Merge pull request #15 from danijanos/dev_carousel
danijanos Oct 9, 2018
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions _config.yml
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
theme: jekyll-theme-minimal
Binary file added header1.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added header2.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added header3.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
350 changes: 191 additions & 159 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,160 +1,192 @@
<!doctype html>
<html lang="en">

<head>
<title>CsCs-CryptoTrader</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">

<!-- Optional JavaScript -->

<!-- jQuery first, then Popper.js, then Bootstrap JS -->
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>

<style>
@import url('https://fonts.googleapis.com/css?family=Work+Sans:300&subset=latin-ext');
body {
font-family: 'Work sans';
height: 100vh;
min-height: 100vh;
margin: 10px;
padding: 20px;
}
.f-grow-0 {
flex-grow: 0;
}
.f-grow-1 {
flex-grow: 1;
}
.column-spacer {
margin: 0 0 10px 0;
}
</style>

</head>

<body>

<nav class="navbar navbar-expand-lg navbar-light bg-light">

<a class="navbar-brand" onclick="" href="index.html">Home</a>

<!-- Responsive navbar -->
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>

<div class="collapse navbar-collapse" id="navbarSupportedContent">

<ul class="navbar-nav mr-auto">
<li class="nav-item">
<a class="nav-link" onclick="" href="#">Balance<span class="sr-only">(current)</span></a>
</li>

<li class="nav-item">
<a class="nav-link" href="#">Buy</a>
</li>

<li class="nav-item">
<a class="nav-link" href="#">Sell</a>
</li>

<li class="nav-item">
<a class="nav-link" href="#">Chart</a>
</li>

</ul>

<!-- not necessary -->
<form class="form-inline my-2 my-lg-0">
<input class="form-control mr-sm-2" type="search" placeholder="Search" aria-label="Search">
<button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button>
</form>
</div>
</nav>

<div class="jumbotron jumbotron-fluid">
<div class="container">
<h1 class="display-4">Welcome to CsCs's Crypto Trader!</h1>
<p class="lead">You can manage and exchange your currencies, follow the price of each, chart them and trade.</p>
</div>
</div>

<div id="main-content">

<div class="container">

<div class="row">

<div class="col column-spacer">

<div class="input-group mb-3">
<input id="currency_type" name="CurrencyType" type="text" class="form-control" placeholder="Type the name of the currency here" aria-label="Type the name of the currency here" aria-describedby="basic-addon2">
<div class="input-group-append">
<button class="btn btn-outline-secondary" type="button" onclick="GetCurrency()">Get currency</button>
</div>
</div>

</div>

</div>

<div class="row">

<div class="col">

<table class="table table-bordered thead-dark table-hover">
<thead>
<tr>
<th>Currency Name</th>
<th>Value</th>
</tr>
</thead>
<tbody>
<tr>
<td id="currency_name"></td>
<td id="currency_value"></td>
</tr>
</tbody>
</table>

</div>

</div>

</div>

</div>

<script>
const url = "https://obudai-api.azurewebsites.net/api/exchange/";
const CsCs_APIKEY = "F98143CD-1DAF-4D4A-A929-E6588AD72C8B";

function GetCurrency() {
var currency = document.getElementById('currency_type').value;
var resource = url + currency;

var oReq = new XMLHttpRequest();
oReq.addEventListener("load", reqListener);
oReq.open("GET", resource, true);
oReq.setRequestHeader("X-Access-Token", CsCs_APIKEY)
oReq.send();
}

function reqListener() {
var currency = JSON.parse(this.responseText);
// if error?
document.getElementById("currency_name").innerHTML = currency.symbol;
document.getElementById("currency_value").innerHTML = currency.currentRate;
}

</script>

</body>

<!doctype html>
<html lang="en">

<head>
<title>CsCs-CryptoTrader</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">

<!-- Optional JavaScript -->

<!-- jQuery first, then Popper.js, then Bootstrap JS -->
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>

<style>
@import url('https://fonts.googleapis.com/css?family=Work+Sans:300&subset=latin-ext');
body {
font-family: 'Work sans';
height: 100vh;
min-height: 100vh;
margin: 10px;
padding: 20px;
}
.f-grow-0 {
flex-grow: 0;
}
.f-grow-1 {
flex-grow: 1;
}
.column-spacer {
margin: 0 0 10px 0;
}
</style>

</head>

<body>

<nav class="navbar navbar-expand-lg navbar-light bg-light">

<a class="navbar-brand" onclick="" href="index.html">Home</a>

<!-- Responsive navbar -->
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>

<div class="collapse navbar-collapse" id="navbarSupportedContent">

<ul class="navbar-nav mr-auto">
<li class="nav-item">
<a class="nav-link" onclick="" href="#">Balance<span class="sr-only">(current)</span></a>
</li>

<li class="nav-item">
<a class="nav-link" href="#">Buy</a>
</li>

<li class="nav-item">
<a class="nav-link" href="#">Sell</a>
</li>

<li class="nav-item">
<a class="nav-link" href="#">Chart</a>
</li>

</ul>

<!-- not necessary -->
<form class="form-inline my-2 my-lg-0">
<input class="form-control mr-sm-2" type="search" placeholder="Search" aria-label="Search">
<button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button>
</form>
</div>
</nav>

<!-- Carousel................................................. -->
<div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel">
<ol class="carousel-indicators">
<li data-target="#carouselExampleIndicators" data-slide-to="0" class="active"></li>
<li data-target="#carouselExampleIndicators" data-slide-to="1"></li>
<li data-target="#carouselExampleIndicators" data-slide-to="2"></li>
</ol>
<div class="carousel-inner">
<div class="carousel-item active">
<img class="d-block w-100" src="header1.png" alt="First slide">
<div class="carousel-caption">
<h3>BTC</h3>
<p>6441 USD</p>
</div>
</div>
<div class="carousel-item">
<img class="d-block w-100" src="header2.png" alt="Second slide">
<div class="carousel-caption">
<h3>ETH</h3>
<p>217 USD</p>
</div>
</div>
<div class="carousel-item">
<img class="d-block w-100" src="header3.png" alt="Third slide">
<div class="carousel-caption">
<h3>ETX</h3>
<p>125 USD</p>
</div>
</div>
</div>
<a class="carousel-control-prev" href="#carouselExampleIndicators" role="button" data-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="carousel-control-next" href="#carouselExampleIndicators" role="button" data-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>

<div id="main-content">

<div class="container">

<div class="row">

<div class="col column-spacer">

<div class="input-group mb-3">
<input id="currency_type" name="CurrencyType" type="text" class="form-control" placeholder="Type the name of the currency here" aria-label="Type the name of the currency here" aria-describedby="basic-addon2">
<div class="input-group-append">
<button class="btn btn-outline-secondary" type="button" onclick="GetCurrency()">Get currency</button>
</div>
</div>

</div>

</div>

<div class="row">

<div class="col">

<table class="table table-bordered thead-dark table-hover">
<thead>
<tr>
<th>Currency Name</th>
<th>Value</th>
</tr>
</thead>
<tbody>
<tr>
<td id="currency_name"></td>
<td id="currency_value"></td>
</tr>
</tbody>
</table>

</div>

</div>

</div>

</div>

<script>
const url = "https://obudai-api.azurewebsites.net/api/exchange/";
const CsCs_APIKEY = "F98143CD-1DAF-4D4A-A929-E6588AD72C8B";

function GetCurrency(){
var currency = document.getElementById('currency_type').value;
var resource = url + currency;
var oReq = new XMLHttpRequest();
oReq.addEventListener("load", reqListener);
oReq.open("GET", resource, true);
oReq.setRequestHeader("X-Access-Token", CsCs_APIKEY)
oReq.send();
}

function reqListener() {
var currency = JSON.parse(this.responseText);
// if error?
document.getElementById("currency_name").innerHTML = currency.symbol;
document.getElementById("currency_value").innerHTML = currency.currentRate;
}

</script>

</body>

</html>