nakidai
/
whoogle-search
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Updated js controller and config api route 

Controller was refactored to be a bit less monolithic.

Config route was updated to accept an html form data POST rather than
just a json object.
main
Ben Busby 2020-04-28 20:50:12 -06:00
parent 1cbe394e6f
commit 0a3da5cea4
4 changed files with 58 additions and 62 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
app/routes.py
View File

@ -71,13 +71,14 @@ def config():
if request.method == 'GET': if request.method == 'GET':
return json.dumps(user_config) return json.dumps(user_config)
else: else:
config_data = request.form.to_dict()
with open(app.config['STATIC_FOLDER'] + '/config.json', 'w') as config_file: with open(app.config['STATIC_FOLDER'] + '/config.json', 'w') as config_file:
config_file.write(json.dumps(json.loads(request.data), indent=4)) config_file.write(json.dumps(config_data, indent=4))
config_file.close() config_file.close()
user_config = json.loads(request.data) user_config = config_data
return 'New config: ' + str(request.data) return redirect('/')
@app.route('/url', methods=['GET']) @app.route('/url', methods=['GET'])

65
app/static/js/controller.js
View File

@ -1,8 +1,4 @@
document.addEventListener("DOMContentLoaded", function() { const setupSearchLayout = () => {
setTimeout(function() {
document.getElementById("main").style.display = "block";
}, 100);
// Setup search field // Setup search field
const searchBar = document.getElementById("search-bar"); const searchBar = document.getElementById("search-bar");
const searchBtn = document.getElementById("search-submit"); const searchBtn = document.getElementById("search-submit");
@ -17,7 +13,9 @@ document.addEventListener("DOMContentLoaded", function() {
searchBtn.click(); searchBtn.click();
} }
}); });
}
const setupConfigLayout = () => {
// Setup shoogle config // Setup shoogle config
const collapsible = document.getElementById("config-collapsible"); const collapsible = document.getElementById("config-collapsible");
collapsible.addEventListener("click", function() { collapsible.addEventListener("click", function() {
@ -32,11 +30,14 @@ document.addEventListener("DOMContentLoaded", function() {
content.classList.toggle("open"); content.classList.toggle("open");
}); });
const saveConfig = document.getElementById("config-submit"); const near = document.getElementById("config-near");
const nearConfig = document.getElementById("config-near"); const noJS = document.getElementById("config-nojs");
const noJSConfig = document.getElementById("config-nojs"); const dark = document.getElementById("config-dark");
const darkConfig = document.getElementById("config-dark");
fillConfigValues(near, noJS, dark);
}
const fillConfigValues = (near, nojs, dark) => {
// Request existing config info // Request existing config info
let xhrGET = new XMLHttpRequest(); let xhrGET = new XMLHttpRequest();
xhrGET.open("GET", "/config"); xhrGET.open("GET", "/config");
@ -49,38 +50,30 @@ document.addEventListener("DOMContentLoaded", function() {
// Allow for updating/saving config values // Allow for updating/saving config values
let configSettings = JSON.parse(xhrGET.responseText); let configSettings = JSON.parse(xhrGET.responseText);
nearConfig.value = configSettings["near"] ? configSettings["near"] : ""; near.value = configSettings["near"] ? configSettings["near"] : "";
nearConfig.addEventListener("keyup", function() { near.addEventListener("keyup", function() {
configSettings["near"] = nearConfig.value; configSettings["near"] = near.value;
}); });
noJSConfig.checked = !!configSettings["nojs"]; nojs.checked = !!configSettings["nojs"];
noJSConfig.addEventListener("change", function() { nojs.addEventListener("change", function() {
configSettings["nojs"] = noJSConfig.checked ? 1 : 0; configSettings["nojs"] = nojs.checked ? 1 : 0;
}); });
darkConfig.checked = !!configSettings["dark"]; dark.checked = !!configSettings["dark"];
darkConfig.addEventListener("change", function() { dark.addEventListener("change", function() {
configSettings["dark"] = darkConfig.checked ? 1 : 0; configSettings["dark"] = dark.checked ? 1 : 0;
}); });
saveConfig.onclick = function() {
let xhrPOST = new XMLHttpRequest();
xhrPOST.open("POST", "/config");
xhrPOST.setRequestHeader("Content-Type", "application/json;charset=UTF-8");
xhrPOST.send(JSON.stringify(configSettings));
xhrPOST.onload = function() {
if (xhrGET.readyState === 4 && xhrPOST.status !== 200) {
alert("Failure to save config file");
return;
}
if (confirm("Configuration saved. Reload now?")) {
window.location.reload();
}
}
}
}; };
xhrGET.send();
xhrGET.send();
}
document.addEventListener("DOMContentLoaded", function() {
setTimeout(function() {
document.getElementById("main").style.display = "block";
}, 100);
setupSearchLayout();
setupConfigLayout();
}); });

40
app/templates/index.html
View File

@ -35,25 +35,27 @@
<button id="config-collapsible" class="collapsible">Configuration</button> <button id="config-collapsible" class="collapsible">Configuration</button>
<div class="content"> <div class="content">
<div class="config-fields"> <div class="config-fields">
<div class="config-div"> <form action="/config" method="post">
<!-- TODO: Add option to regenerate user agent? --> <div class="config-div">
<span class="ua-span">User Agent: {{ ua }}</span> <!-- TODO: Add option to regenerate user agent? -->
</div> <span class="ua-span">User Agent: {{ ua }}</span>
<div class="config-div"> </div>
<label for="config-near">Near: </label> <div class="config-div">
<input type="text" name="config-near" id="config-near" placeholder="City Name"> <label for="config-near">Near: </label>
</div> <input type="text" name="near" id="config-near" placeholder="City Name">
<div class="config-div"> </div>
<label for="config-nojs">Show NoJS Links: </label> <div class="config-div">
<input type="checkbox" name="config-nojs" id="config-nojs"> <label for="config-nojs">Show NoJS Links: </label>
</div> <input type="checkbox" name="nojs" id="config-nojs">
<div class="config-div"> </div>
<label for="config-dark">Dark Mode: </label> <div class="config-div">
<input type="checkbox" name="config-dark" id="config-dark"> <label for="config-dark">Dark Mode: </label>
</div> <input type="checkbox" name="dark" id="config-dark">
<div class="config-div"> </div>
<button type="submit" id="config-submit">Save</button> <div class="config-div">
</div> <input type="submit" id="config-submit" value="Save">
</div>
</form>
</div> </div>
</div> </div>
</div> </div>

8
test/test_routes.py
View File

@ -3,8 +3,8 @@ import random
demo_config = { demo_config = {
'near': random.choice(['Seattle', 'New York', 'San Francisco']), 'near': random.choice(['Seattle', 'New York', 'San Francisco']),
'dark_mode': random.getrandbits(1), 'dark_mode': str(random.getrandbits(1)),
'nojs': random.getrandbits(1) 'nojs': str(random.getrandbits(1))
} }
@ -19,8 +19,8 @@ def test_search(client):
def test_config(client): def test_config(client):
rv = client.post('/config', data=json.dumps(demo_config)) rv = client.post('/config', data=demo_config)
assert rv._status_code == 200 assert rv._status_code == 302
rv = client.get('/config') rv = client.get('/config')
assert rv._status_code == 200 assert rv._status_code == 200