Add Web Vibration API and Genetic Algorithm entry
They are added to the list of experiments. Their links are also added in other pages.master
Muhammad Rifqi Priyo Susanto
parent
e79e4474eb
commit
a829c0bf05
|
|
@ -15,6 +15,8 @@
|
|||
<ul class="left-menu">
|
||||
<li><div><a href="/">Home</a></div></li>
|
||||
<li><div><a href="./">Experiments</a></div><ul>
|
||||
<li><a href="genetic_algorithm.html">Genetic Algorithm</a></li>
|
||||
<li><a href="vibration_test.html">Web Vibration API</a></li>
|
||||
<li class="active"><a href="addition_game.html">Addition Game</a></li>
|
||||
<li><a href="negative_lens.html">Negative Lens</a></li>
|
||||
<li><a href="positive_lens.html">Positive Lens</a></li>
|
||||
|
|
|
|||
|
|
@ -15,6 +15,8 @@
|
|||
<ul class="left-menu">
|
||||
<li><div><a href="/">Home</a></div></li>
|
||||
<li><div><a href="./">Experiments</a></div><ul>
|
||||
<li><a href="genetic_algorithm.html">Genetic Algorithm</a></li>
|
||||
<li><a href="vibration_test.html">Web Vibration API</a></li>
|
||||
<li><a href="addition_game.html">Addition Game</a></li>
|
||||
<li><a href="negative_lens.html">Negative Lens</a></li>
|
||||
<li><a href="positive_lens.html">Positive Lens</a></li>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,51 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Genetic Algorithm - Experiments - srifqi</title>
|
||||
<meta charset="utf-8">
|
||||
<meta name="author" content="srifqi">
|
||||
<meta name="description" content="An example of genetic algorithm in action">
|
||||
<meta name="viewport" content="width=device-width,height=device-height,initial-scale=1">
|
||||
<link rel="stylesheet" href="/main.css">
|
||||
</head>
|
||||
<body style="border: 0; max-width: 100%;">
|
||||
<header><h1>Genetic Algorithm Experiment</h1></header>
|
||||
<main>
|
||||
<nav>
|
||||
<ul class="left-menu">
|
||||
<li><div><a href="/">Home</a></div></li>
|
||||
<li><div><a href="./">Experiments</a></div><ul>
|
||||
<li class="active"><a href="genetic_algorithm.html">Genetic Algorithm</a></li>
|
||||
<li><a href="vibration_test.html">Web Vibration API</a></li>
|
||||
<li><a href="addition_game.html">Addition Game</a></li>
|
||||
<li><a href="negative_lens.html">Negative Lens</a></li>
|
||||
<li><a href="positive_lens.html">Positive Lens</a></li>
|
||||
<li><a href="waterdrop.html">Waterdrop</a></li>
|
||||
<li><a href="drive_a_car.html">Drive A Car</a></li>
|
||||
</ul></li>
|
||||
<li><div><a href="/minetest.html">Minetest</a></div></li>
|
||||
<li><div><a href="/library.html">Libraries</a></div></li>
|
||||
</ul>
|
||||
</nav>
|
||||
<section style="max-width: calc(100% - 16px);">
|
||||
<aside>
|
||||
<table>
|
||||
<thead>
|
||||
<tr><th colspan="2">Genetic Algorithm</th></tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr><th>Type</th><td>Simulation</td></tr>
|
||||
<tr><th>Date</th><td><time datetime="2020-08-20">20 August 2020</time></td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</aside>
|
||||
<p>This was created because I want to create a basic implementation of <a href="https://en.wikipedia.org/wiki/Genetic_algorithm" target="_blank">genetic algorithm</a>. I have seen things like this before, but I forget about the original web page.</p>
|
||||
<p>There are 25 individuals in each generation. Each new generation is created from top 5 individuals. No individual lives past its generation.</p>
|
||||
<p>You can read <a href="https://github.com/srifqi/srifqi.github.io/blob/master/experiment/bare/genetic_algorithm.html" target="_blank">its source code</a> and try to modify it yourself!</p>
|
||||
<p><span class="italic">Refresh for new initial gene pool</span></p>
|
||||
<p><a href="bare/genetic_algorithm.html" target="_blank">open in new window</a></p>
|
||||
<iframe style="width: 600px; height: 500px;" src="bare/genetic_algorithm.html"></iframe>
|
||||
</section>
|
||||
</main>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -15,6 +15,8 @@
|
|||
<ul class="left-menu">
|
||||
<li><div><a href="/">Home</a></div></li>
|
||||
<li class="active"><div><a href="./">Experiments</a></div><ul>
|
||||
<li><a href="genetic_algorithm.html">Genetic Algorithm</a></li>
|
||||
<li><a href="vibration_test.html">Web Vibration API</a></li>
|
||||
<li><a href="addition_game.html">Addition Game</a></li>
|
||||
<li><a href="negative_lens.html">Negative Lens</a></li>
|
||||
<li><a href="positive_lens.html">Positive Lens</a></li>
|
||||
|
|
@ -28,6 +30,8 @@
|
|||
<section>
|
||||
<p>I like to do coding and creating mini projects. Here are some of my projects.</p>
|
||||
<ul>
|
||||
<li><a href="genetic_algorithm.html">Genetic Algorithm</a> (<time datetime="2020-08-20">20 August 2020</time>)</li>
|
||||
<li><a href="vibration_test.html">Web Vibration API</a> (<time datetime="2020-08-08">8 August 2020</time>)</li>
|
||||
<li><a href="addition_game.html">Addition Game</a> (<time datetime="2014-09-29">29 September 2014</time>)</li>
|
||||
<li><a href="negative_lens.html">Negative Lens</a> (<time datetime="2014-06-20">20 June 2014</time>)</li>
|
||||
<li><a href="positive_lens.html">Positive Lens</a> (<time datetime="2014-06-15">15 June 2014</time>)</li>
|
||||
|
|
|
|||
|
|
@ -15,6 +15,8 @@
|
|||
<ul class="left-menu">
|
||||
<li><div><a href="/">Home</a></div></li>
|
||||
<li><div><a href="./">Experiments</a></div><ul>
|
||||
<li><a href="genetic_algorithm.html">Genetic Algorithm</a></li>
|
||||
<li><a href="vibration_test.html">Web Vibration API</a></li>
|
||||
<li><a href="addition_game.html">Addition Game</a></li>
|
||||
<li class="active"><a href="negative_lens.html">Negative Lens</a></li>
|
||||
<li><a href="positive_lens.html">Positive Lens</a></li>
|
||||
|
|
|
|||
|
|
@ -15,6 +15,8 @@
|
|||
<ul class="left-menu">
|
||||
<li><div><a href="/">Home</a></div></li>
|
||||
<li><div><a href="./">Experiments</a></div><ul>
|
||||
<li><a href="genetic_algorithm.html">Genetic Algorithm</a></li>
|
||||
<li><a href="vibration_test.html">Web Vibration API</a></li>
|
||||
<li><a href="addition_game.html">Addition Game</a></li>
|
||||
<li><a href="negative_lens.html">Negative Lens</a></li>
|
||||
<li class="active"><a href="positive_lens.html">Positive Lens</a></li>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,51 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Web Vibration API - Experiments - srifqi</title>
|
||||
<meta charset="utf-8">
|
||||
<meta name="author" content="srifqi">
|
||||
<meta name="description" content="Vibrate your device from Web!">
|
||||
<meta name="viewport" content="width=device-width,height=device-height,initial-scale=1">
|
||||
<link rel="stylesheet" href="/main.css">
|
||||
</head>
|
||||
<body style="border: 0; max-width: 100%;">
|
||||
<header><h1>Web Vibration API Experiment</h1></header>
|
||||
<main>
|
||||
<nav>
|
||||
<ul class="left-menu">
|
||||
<li><div><a href="/">Home</a></div></li>
|
||||
<li><div><a href="./">Experiments</a></div><ul>
|
||||
<li><a href="genetic_algorithm.html">Genetic Algorithm</a></li>
|
||||
<li class="active"><a href="vibration_test.html">Web Vibration API</a></li>
|
||||
<li><a href="addition_game.html">Addition Game</a></li>
|
||||
<li><a href="negative_lens.html">Negative Lens</a></li>
|
||||
<li><a href="positive_lens.html">Positive Lens</a></li>
|
||||
<li><a href="waterdrop.html">Waterdrop</a></li>
|
||||
<li><a href="drive_a_car.html">Drive A Car</a></li>
|
||||
</ul></li>
|
||||
<li><div><a href="/minetest.html">Minetest</a></div></li>
|
||||
<li><div><a href="/library.html">Libraries</a></div></li>
|
||||
</ul>
|
||||
</nav>
|
||||
<section style="max-width: calc(100% - 16px);">
|
||||
<aside>
|
||||
<table>
|
||||
<thead>
|
||||
<tr><th colspan="2">Web Vibration API</th></tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr><th>Type</th><td>API testing</td></tr>
|
||||
<tr><th>Date</th><td><time datetime="2020-08-08">8 August 2020</time></td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</aside>
|
||||
<p>I was browsing on the Web when suddenly an advertisement showed up and vibrate my phone. I was confused for a second because it said that there is a virus inside my phone. Knowing that it is an advertisement, I ignored that. But, I did not know that you can vibrate your device from Web!</p>
|
||||
<p>This was created to demonstrate <a href="https://developer.mozilla.org/docs/Web/API/Vibration_API" target="_blank">Web Vibration API</a>. It consists of a function, <code>navigator.vibrate()</code>, to do vibration for some amount of time.</p>
|
||||
<p>Since the API only allows to vibrate for a finite amount of time, a timer is scheduled to re-vibrate the device (using <code>setTimeout()</code> function). To prevent gap between vibration, the length of each vibration is doubled. It is fine because the <code>vibrate()</code> function will reset the duration.</p>
|
||||
<p><span class="italic">Try different vibration cycle</span></p>
|
||||
<p><a href="bare/vibration_test.html" target="_blank">open in new window</a></p>
|
||||
<iframe style="width: 500px; height: 600px;" src="bare/vibration_test.html"></iframe>
|
||||
</section>
|
||||
</main>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -15,6 +15,8 @@
|
|||
<ul class="left-menu">
|
||||
<li><div><a href="/">Home</a></div></li>
|
||||
<li><div><a href="./">Experiments</a></div><ul>
|
||||
<li><a href="genetic_algorithm.html">Genetic Algorithm</a></li>
|
||||
<li><a href="vibration_test.html">Web Vibration API</a></li>
|
||||
<li><a href="addition_game.html">Addition Game</a></li>
|
||||
<li><a href="negative_lens.html">Negative Lens</a></li>
|
||||
<li><a href="positive_lens.html">Positive Lens</a></li>
|
||||
|
|
|
|||
Loading…
Reference in New Issue