Update example with Axios version
This commit is contained in:
parent
3ff1f5c953
commit
17ca343b45
4 changed files with 58 additions and 7 deletions
10
servant-js/examples/www/axios/axios.min.js
vendored
Normal file
10
servant-js/examples/www/axios/axios.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
40
servant-js/examples/www/axios/index.html
Normal file
40
servant-js/examples/www/axios/index.html
Normal file
|
@ -0,0 +1,40 @@
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<title>Servant: counter</title>
|
||||||
|
<style>
|
||||||
|
body { text-align: center; }
|
||||||
|
#counter { color: green; }
|
||||||
|
#inc { margin: 0px 20px; background-color: green; color: white; }
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<h1>Axios version</h1>
|
||||||
|
<span id="counter">Counter: 0</span>
|
||||||
|
<button id="inc">Increase</button>
|
||||||
|
|
||||||
|
<script src="axios.min.js" type="text/javascript"></script>
|
||||||
|
<script src="api.js" type="text/javascript"></script>
|
||||||
|
<script type="text/javascript">
|
||||||
|
window.addEventListener('load', function() {
|
||||||
|
// we get the current value stored by the server when the page is loaded
|
||||||
|
getcounter().then(updateCounter).catch(alert);
|
||||||
|
|
||||||
|
// we update the value every 1sec, in the same way
|
||||||
|
window.setInterval(function() {
|
||||||
|
getcounter().then(updateCounter).catch(alert);
|
||||||
|
}, 1000);
|
||||||
|
});
|
||||||
|
|
||||||
|
function updateCounter(response)
|
||||||
|
{
|
||||||
|
document.getElementById('counter').innerHTML = 'Counter: ' + response.data.value;
|
||||||
|
}
|
||||||
|
|
||||||
|
// when the button is clicked, ask the server to increase
|
||||||
|
// the value by one
|
||||||
|
document.getElementById('inc').addEventListener('click', function() {
|
||||||
|
postcounter().then(updateCounter).catch(alert);
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
|
@ -5,13 +5,15 @@
|
||||||
body { text-align: center; }
|
body { text-align: center; }
|
||||||
#counter { color: green; }
|
#counter { color: green; }
|
||||||
#inc { margin: 0px 20px; background-color: green; color: white; }
|
#inc { margin: 0px 20px; background-color: green; color: white; }
|
||||||
|
iframe { height: 20%; width: 80%}
|
||||||
</style>
|
</style>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
|
||||||
<iframe src="vanilla/" width="80%" height="25%"></iframe>
|
<iframe src="vanilla/"></iframe>
|
||||||
<iframe src="jquery/" width="80%" height="25%"></iframe>
|
<iframe src="jquery/"></iframe>
|
||||||
<iframe src="angular/" width="80%" height="25%"></iframe>
|
<iframe src="angular/"></iframe>
|
||||||
<iframe src="angular/service.html" width="80%" height="25%"></iframe>
|
<iframe src="angular/service.html"></iframe>
|
||||||
|
<iframe src="axios/"></iframe>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
|
@ -24,9 +24,8 @@ generateAxiosJSWith :: CommonGeneratorOptions -> AjaxReq -> String
|
||||||
generateAxiosJSWith opts req = "\n" <>
|
generateAxiosJSWith opts req = "\n" <>
|
||||||
fname <> " = function(" <> argsStr <> ")\n"
|
fname <> " = function(" <> argsStr <> ")\n"
|
||||||
<> "{\n"
|
<> "{\n"
|
||||||
<> " return axios(" <> url <> ",\n"
|
<> " return axios({ url: " <> url <> "\n"
|
||||||
<> " {\n"
|
<> " , method: '" <> method <> "'\n"
|
||||||
<> " method: '" <> method <> "'\n"
|
|
||||||
<> dataBody
|
<> dataBody
|
||||||
<> reqheaders
|
<> reqheaders
|
||||||
<> " });\n"
|
<> " });\n"
|
||||||
|
|
Loading…
Reference in a new issue