added get method and language()
This commit is contained in:
Yaman Qalieh
parent
ee25012598
commit
4c8fcc4eb1
@ -12,6 +12,7 @@ app.config.update(
|
||||
try:
|
||||
with open("save.p", "rb") as f:
|
||||
database = pickle.load(f)
|
||||
print("Loaded", database)
|
||||
except (FileNotFoundError) as e:
|
||||
database = {'languages': [],
|
||||
'phonemes': [],
|
||||
|
||||
@ -1,52 +1,76 @@
|
||||
var navSelect = "home";
|
||||
var serverURL = "http://0.0.0.0:5000";
|
||||
var data;
|
||||
|
||||
var navi = [ // Array containing navigation items in form [Font-Awesome class name, Display Text, Onclick function].
|
||||
["home", "Home", "home"],
|
||||
["bar-chart", "Data Values", "dataValues"],
|
||||
["database", "Database and Files", "files"],
|
||||
["bell", "Updates and Progress", "updates"]
|
||||
["home", "Home", "home"],
|
||||
["bar-chart", "Data Values", "dataValues"],
|
||||
["database", "Database and Files", "files"],
|
||||
["bell", "Updates and Progress", "updates"]
|
||||
];
|
||||
|
||||
for(var i = 0; i < navi.length; i++) { // Create navigation tabs.
|
||||
var side = document.getElementById("sidebar");
|
||||
var div = document.createElement("div");
|
||||
div.className = "navi transition";
|
||||
div.setAttribute("option", navi[i][2]);
|
||||
div.onclick = function() {
|
||||
var op = this.getAttribute("option");
|
||||
if(navSelect === op) return;
|
||||
updateMain(op);
|
||||
};
|
||||
var ic = document.createElement("i");
|
||||
ic.className = "fa fa-"+navi[i][0];
|
||||
ic["aria-hidden"] = true;
|
||||
var p = document.createElement("p");
|
||||
p.appendChild(document.createTextNode(navi[i][1]));
|
||||
div.appendChild(ic);
|
||||
div.appendChild(p);
|
||||
side.appendChild(div);
|
||||
for (var i = 0; i < navi.length; i++) { // Create navigation tabs.
|
||||
var side = document.getElementById("sidebar");
|
||||
var div = document.createElement("div");
|
||||
div.className = "navi transition";
|
||||
div.setAttribute("option", navi[i][2]);
|
||||
div.onclick = function() {
|
||||
var op = this.getAttribute("option");
|
||||
if (navSelect === op) return;
|
||||
updateMain(op);
|
||||
};
|
||||
var ic = document.createElement("i");
|
||||
ic.className = "fa fa-" + navi[i][0];
|
||||
ic["aria-hidden"] = true;
|
||||
var p = document.createElement("p");
|
||||
p.appendChild(document.createTextNode(navi[i][1]));
|
||||
div.appendChild(ic);
|
||||
div.appendChild(p);
|
||||
side.appendChild(div);
|
||||
}
|
||||
|
||||
updateNav(navSelect);
|
||||
|
||||
function updateMain(op) {
|
||||
updateNav(op);
|
||||
document.getElementById(navSelect).style.opacity = "0";
|
||||
setTimeout(function() {
|
||||
document.getElementById(navSelect).style.display = "none";
|
||||
document.getElementById(op).style.display = "grid";
|
||||
setTimeout(function() {
|
||||
document.getElementById(op).style.opacity = "1";
|
||||
}, 30);
|
||||
navSelect = op;
|
||||
}, 300);
|
||||
updateNav(op);
|
||||
document.getElementById(navSelect).style.opacity = "0";
|
||||
setTimeout(function() {
|
||||
document.getElementById(navSelect).style.display = "none";
|
||||
document.getElementById(op).style.display = "grid";
|
||||
setTimeout(function() {
|
||||
document.getElementById(op).style.opacity = "1";
|
||||
}, 30);
|
||||
navSelect = op;
|
||||
}, 300);
|
||||
}
|
||||
|
||||
function updateNav(op) {
|
||||
var oldNav = document.querySelectorAll("[option="+navSelect+"]")[0];
|
||||
var newNav = document.querySelectorAll("[option="+op+"]")[0];
|
||||
oldNav.style.backgroundColor = "rgba(0,0,0,0)";
|
||||
oldNav.style.color = "white";
|
||||
newNav.style.backgroundColor = "#F8F3F0";
|
||||
newNav.style.color = "#F47922";
|
||||
var oldNav = document.querySelectorAll("[option=" + navSelect + "]")[0];
|
||||
var newNav = document.querySelectorAll("[option=" + op + "]")[0];
|
||||
oldNav.style.backgroundColor = "rgba(0,0,0,0)";
|
||||
oldNav.style.color = "white";
|
||||
newNav.style.backgroundColor = "#F8F3F0";
|
||||
newNav.style.color = "#F47922";
|
||||
}
|
||||
|
||||
function getData() {
|
||||
$.ajax({
|
||||
url: serverURL + '/server',
|
||||
type: 'GET'
|
||||
})
|
||||
.then(
|
||||
function success(incoming) {
|
||||
data = incoming;
|
||||
},
|
||||
function error(e) {
|
||||
console.log(e);
|
||||
}
|
||||
);
|
||||
console.log(data);
|
||||
}
|
||||
|
||||
function language(language) {
|
||||
return data.languages.filter(function(element) {
|
||||
return element.name === language;
|
||||
});
|
||||
}
|
||||
|
||||
@ -1,58 +1,61 @@
|
||||
<!DOCTYPE html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="chrome=1">
|
||||
<title>SmearcarDB</title>
|
||||
<link rel="icon" href="/static/resources/favicon.ico?v=2">
|
||||
<link rel="stylesheet" href="{{ url_for('static', filename='index.css') }}">
|
||||
<link href="https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300" rel="stylesheet">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
|
||||
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
|
||||
<script src="{{ url_for('static', filename='velocity.min.js') }}"></script>
|
||||
<script src="https://use.fontawesome.com/c8d5486cd8.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="header1" class="colorFade">
|
||||
<h1>/smirkär/</h1>
|
||||
</div>
|
||||
<div id="header2">
|
||||
</div>
|
||||
<div id="sidebar">
|
||||
</div>
|
||||
<div id="mainContainer">
|
||||
<div id="home" class="optionContainer">
|
||||
<div id="langSelect" class="card">
|
||||
</div>
|
||||
<div id="dataInfo" class="card">
|
||||
</div>
|
||||
<div id="dataTable" class="card">
|
||||
</div>
|
||||
</div>
|
||||
<div id="dataValues" class="optionContainer">
|
||||
<div id="langSelect" class="card">
|
||||
</div>
|
||||
<div id="dataInfo" class="card">
|
||||
</div>
|
||||
<div id="dataTable" class="card">
|
||||
</div>
|
||||
</div>
|
||||
<div id="files" class="optionContainer">
|
||||
<div id="langSelect" class="card">
|
||||
</div>
|
||||
<div id="dataInfo" class="card">
|
||||
</div>
|
||||
<div id="dataTable" class="card">
|
||||
</div>
|
||||
</div>
|
||||
<div id="updates" class="optionContainer">
|
||||
<div id="langSelect" class="card">
|
||||
</div>
|
||||
<div id="dataInfo" class="card">
|
||||
</div>
|
||||
<div id="dataTable" class="card">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<script src="{{ url_for('static', filename='index.js') }}"></script>
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="chrome=1">
|
||||
<title>SmearcarDB</title>
|
||||
<link rel="icon" href="/static/resources/favicon.ico?v=2">
|
||||
<link rel="stylesheet" href="{{ url_for('static', filename='index.css') }}">
|
||||
<link href="https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300" rel="stylesheet">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
|
||||
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
|
||||
<script src="{{ url_for('static', filename='velocity.min.js') }}"></script>
|
||||
<script src="https://use.fontawesome.com/c8d5486cd8.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="header1" class="colorFade">
|
||||
<h1>/smirkär/</h1>
|
||||
</div>
|
||||
<div id="header2">
|
||||
</div>
|
||||
<div id="sidebar">
|
||||
</div>
|
||||
<div id="mainContainer">
|
||||
<div id="home" class="optionContainer">
|
||||
<div id="langSelect" class="card">
|
||||
</div>
|
||||
<div id="dataInfo" class="card">
|
||||
</div>
|
||||
<div id="dataTable" class="card">
|
||||
</div>
|
||||
</div>
|
||||
<div id="dataValues" class="optionContainer">
|
||||
<div id="langSelect" class="card">
|
||||
</div>
|
||||
<div id="dataInfo" class="card">
|
||||
</div>
|
||||
<div id="dataTable" class="card">
|
||||
</div>
|
||||
</div>
|
||||
<div id="files" class="optionContainer">
|
||||
<div id="langSelect" class="card">
|
||||
</div>
|
||||
<div id="dataInfo" class="card">
|
||||
</div>
|
||||
<div id="dataTable" class="card">
|
||||
</div>
|
||||
</div>
|
||||
<div id="updates" class="optionContainer">
|
||||
<div id="langSelect" class="card">
|
||||
</div>
|
||||
<div id="dataInfo" class="card">
|
||||
</div>
|
||||
<div id="dataTable" class="card">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<script src="{{ url_for('static', filename='index.js') }}"></script>
|
||||
|
||||
</html>
|
||||
Loading…
x
Reference in New Issue
Block a user