Commit 3aa40a09 by Florian Shllaku

Ajax/jquery Live data implemented from JSON file

parent b2525742
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use App\CurrencyListing;
class API extends Controller
{
public function index()
{
$data = CurrencyListing::all('iso', 'rates');
return $data;
}
}
{
"USD": [
{
"iso": "USD",
"rates": 1.12
}],
"JPY": [
{
"iso": "JPY",
"rates": 124.4
}],
"BGN": [
{
"iso": "BGN",
"rates": 1.96
}],
"CZK": [
{
"iso": "CZK",
"rates": 25.71
}],
"DKK": [
{
"iso": "DKK",
"rates": 7.47
}],
"GBP": [
{
"iso": "GBP",
"rates": 0.86
}],
"HUF": [
{
"iso": "HUF",
"rates": 323.38
}],
"PLN": [
{
"iso": "PLN",
"rates": 4.29
}],
"RON": [
{
"iso": "RON",
"rates": 4.76
}],
"SEK": [
{
"iso": "SEK",
"rates": 10.7
}],
"CHF": [
{
"iso": "CHF",
"rates": 1.1400000000000001
}],
"ISK": [
{
"iso": "ISK",
"rates": 136.6
}],
"NOK": [
{
"iso": "NOK",
"rates": 9.78
}],
"HRK": [
{
"iso": "HRK",
"rates": 7.41
}],
"RUB": [
{
"iso": "RUB",
"rates": 72.87
}],
"TRY": [
{
"iso": "TRY",
"rates": 6.66
}],
"AUD": [
{
"iso": "AUD",
"rates": 1.5899999999999999
}],
"BRL": [
{
"iso": "BRL",
"rates": 4.42
}],
"CAD": [
{
"iso": "CAD",
"rates": 1.5
}],
"CNY": [
{
"iso": "CNY",
"rates": 7.51
}],
"HDK": [
{
"iso": "HKD",
"rates": 8.75
}],
"IDR": [
{
"iso": "IDR",
"rates": 15901.45
}],
"ILS": [
{
"iso": "ILS",
"rates": 4.01
}],
"INR": [
{
"iso": "INR",
"rates": 77.26
}],
"KRW": [
{
"iso": "KRW",
"rates": 1305.08
}],
"MXN": [
{
"iso": "MXN",
"rates": 21.34
}],
"MYR": [
{
"iso": "MYR",
"rates": 4.62
}],
"NZD": [
{
"iso": "NZD",
"rates": 1.69
}],
"PHP": [
{
"iso": "PHP",
"rates": 57.86
}],
"SGD": [
{
"iso": "SGD",
"rates": 1.52
}],
"THB": [
{
"iso": "THB",
"rates": 35.72
}],
"ZAR": [
{
"iso": "ZAR",
"rates": 16.21
}],
"EUR": [
{
"iso": "EUR",
"rates": 1
}]
}
\ No newline at end of file
$.getJSON( "/currency.json", function( data ) {
var From;
var To;
var Amount;
var From_iso_value;
var To_iso_value;
// $('#From').on("change",function(){
// From = $("#From option:selected").attr('value');
// return data[From][0]['rates'];
// });
$('#Form').on("change",function(){
Amount = document.getElementById("Amount").value;
From_iso_value = $("#From option:selected").attr('value');
From = data[From_iso_value][0]['rates'];
To_iso_value = $("#To option:selected").attr('value');
To = data[To_iso_value][0]['rates'];
console.log((Amount/From) * To);
});
});
\ No newline at end of file
...@@ -6,7 +6,7 @@ ...@@ -6,7 +6,7 @@
<label for="FormControlSelect1">Convert From</label> <label for="FormControlSelect1">Convert From</label>
<div class="input-group"> <div class="input-group">
<br> <br>
<form action="/currency" method="GET"> <form action="/currency" method="GET" id="Form">
<input type="number" step="0.01" min="0" id="Amount" name="Amount" class="form-control form-control-lg mx-3" value=""> <input type="number" step="0.01" min="0" id="Amount" name="Amount" class="form-control form-control-lg mx-3" value="">
<select class="form-control" id="From" name="From"> <select class="form-control" id="From" name="From">
@foreach ($currencies as $item) @foreach ($currencies as $item)
...@@ -27,36 +27,69 @@ ...@@ -27,36 +27,69 @@
<button class="btn btn--pill" type="submit">Convert!</button> <button class="btn btn--pill" type="submit">Convert!</button>
</form> </form>
<?php <?php
if( isset($_GET["From"]) && isset($_GET["Amount"]) && isset($_GET["To"])) // if( isset($_GET["From"]) && isset($_GET["Amount"]) && isset($_GET["To"]))
{ // {
if (!empty($_GET["From"]) && !empty($_GET["Amount"]) && !empty($_GET["To"])){ // if (!empty($_GET["From"]) && !empty($_GET["Amount"]) && !empty($_GET["To"])){
$value = $_GET['Amount']; // $value = $_GET['Amount'];
$arrFrom = (DB::table('currency')->select('rates')->where('iso', '=', $_GET['From'])->get())->pluck('rates'); // $arrFrom = (DB::table('currency')->select('rates')->where('iso', '=', $_GET['From'])->get())->pluck('rates');
$From = $arrFrom[0]; // $From = $arrFrom[0];
$arrTo = (DB::table('currency')->select('rates')->where('iso', '=', $_GET['To'])->get())->pluck('rates'); // $arrTo = (DB::table('currency')->select('rates')->where('iso', '=', $_GET['To'])->get())->pluck('rates');
$To = $arrTo[0]; // $To = $arrTo[0];
$rez = ($value/$From) * $To; // $rez = ($value/$From) * $To;
echo $rez; // echo $rez;
} // }
} // }
?> ?>
</div> </div>
</div> </div>
</div> </div>
<script> {{-- <script>
function swapValues(){ function swapValues(){
var tmp = document.getElementById("From").value; var tmp = document.getElementById("From").value;
document.getElementById("From").value = document.getElementById("To").value; document.getElementById("From").value = document.getElementById("To").value;
document.getElementById("To").value = tmp; document.getElementById("To").value = tmp;
} }
</script>
var request = new XMLHttpRequest()
// Open a new connection, using the GET request on the URL endpoint
request.open('GET', 'http://127.0.0.1:8000/api', true)
request.onload = function() {
// Begin accessing JSON data here
var data = JSON.parse(this.response)
if (request.status >= 200 && request.status < 400) {
// for(var i = 0; i < 33; i++){
// console.log(data[i]['iso']);
// }
var From = document.getElementById("From").value;
var To = document.getElementById("To").value;
var Fromjs = data[0]['rates'];
var Tojs = data[1]['rates'];
var value = document.getElementById("Amount");
console.log(calculate(Fromjs, Tojs, Value));
}
else{
console.log('error')
}
// Send request
request.send()
}
function calculate(one, two, thre){
return (three/one) * two;
}
</script> --}}
@include('footer') @include('footer')
......
...@@ -14,6 +14,7 @@ ...@@ -14,6 +14,7 @@
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" 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>
<!-- Main Custom styles for the website --> <!-- Main Custom styles for the website -->
<link href="css\main.css" rel="stylesheet"> <link href="css\main.css" rel="stylesheet">
<script src="{{ URL::to('js/main.js') }}"></script>
@if(\Request::is('contact')) <link href="css\contact.css" rel="stylesheet"> @endif @if(\Request::is('contact')) <link href="css\contact.css" rel="stylesheet"> @endif
@if(\Request::is('crypto'))<link href="css\crypto.css" rel="stylesheet"> @endif @if(\Request::is('crypto'))<link href="css\crypto.css" rel="stylesheet"> @endif
@if(\Request::is('currency'))<link href="css\crypto.css" rel="stylesheet"> @endif @if(\Request::is('currency'))<link href="css\crypto.css" rel="stylesheet"> @endif
......
...@@ -16,3 +16,5 @@ use Illuminate\Http\Request; ...@@ -16,3 +16,5 @@ use Illuminate\Http\Request;
Route::middleware('auth:api')->get('/user', function (Request $request) { Route::middleware('auth:api')->get('/user', function (Request $request) {
return $request->user(); return $request->user();
}); });
Route::get("/", "API@index");
...@@ -38,8 +38,9 @@ Route::post('/contact/send', 'SendEmailController@send'); ...@@ -38,8 +38,9 @@ Route::post('/contact/send', 'SendEmailController@send');
Auth::routes(); Auth::routes();
Route::get('/home', 'HomeController@index')->name('home'); // Route::get('/home', 'HomeController@index')->name('home');
Route::get('/subscribe', 'NewsLetterController@create'); Route::get('/subscribe', 'NewsLetterController@create');
Route::post('/subscribe', 'NewsLetterController@store'); Route::post('/subscribe', 'NewsLetterController@store');
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 sign in to comment