source: js/standard_expdef_demo/index.html @ 1326

Last change on this file since 1326 was 1326, checked in by Maciej Komosinski, 2 months ago

Updated standard.expdef animated demo: uses the most recent Framsticks SDK, supports 6 genetic encodings, adjustable mutation and crossover probabilities, shows colored genotypes, allows user to manually increase/decrease fitness of the current individual, displays its neural network
File size: 3.3 KB
Line 
1<!DOCTYPE html>
2<html>
3  <head>
4                <meta charset=utf-8>
5    <meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
6    <link rel="stylesheet" type="text/css" href="static/styles.css">
7                <title>Standard.expdef demo animation</title>
8        <script type="importmap">
9                {
10                        "imports": {
11                                "three": "./node_modules/three/build/three.module.js",
12                                "three/addons/OrbitControls.js": "./node_modules/three/examples/jsm/controls/OrbitControls.js",
13                                "three/addons/CSS3DRenderer.js": "./node_modules/three/examples/jsm/renderers/CSS3DRenderer.js",
14                                "three/addons/Sky.js": "./node_modules/three/examples/jsm/objects/Sky.js",
15                                "tween": "./node_modules/three/examples/jsm/libs/tween.module.js"
16                        }
17                }
18        </script>
19        <script type="module">
20                import * as TWEEN from 'tween';
21                import * as THREE from 'three';
22                import {OrbitControls} from "three/addons/OrbitControls.js";
23                import {CSS3DObject, CSS3DSprite, CSS3DRenderer} from "three/addons/CSS3DRenderer.js";
24                import {Sky} from "three/addons/Sky.js";
25
26                // this trick is done to avoid refactoring the entire app
27                window.THREE = THREE;
28                window.Sky = Sky;
29                window.OrbitControls = OrbitControls;
30                window.CSS3DRenderer = CSS3DRenderer;
31                window.CSS3DObject = CSS3DObject;
32                window.CSS3DSprite = CSS3DSprite;
33                window.TWEEN = TWEEN;
34        </script>
35
36
37   
38               
39        </head>
40        <body style="margin: 0; overflow: hidden;">
41                <div class="column controls">
42                        <div class="row control-container" id="fitness-rater">
43                                <span>Rate creature:</span>
44                        </div>
45                        <div class="row control-container">
46                                <span>Genotype: </span>
47                                <select id="genotype-selector">
48                                </select>
49                        </div>
50                       
51                </div>
52                <!--External dependencies-->
53               
54                <!-- <script src="js/external/threejs/three.min.js"></script>
55                <script src="js/external/threejs/CSS3DRenderer.js"></script>
56                <script src="js/external/threejs/OrbitControls.js"></script>
57                <script src="js/external/threejs/Sky.js"></script> -->
58                <!-- <script src="js/external/tweenjs/tween.min.js"></script> -->
59                <script src="sdk/frams-sdk.js"></script>
60                <script src="js/external/framsjs/visualization/jointmeshfactory.js" defer></script>
61                <script src="js/external/framsjs/visualization/partmeshfactory.js" defer></script>
62                <script src="js/external/framsjs/visualization/transformations.js" defer></script>
63                <!--Project sources-->
64                <script src="js/config.js" defer></script>
65                <script src="js/utils.js" defer></script>
66                <script src="js/world/core.js" defer></script>
67                <script src="js/world/object/framstick.js" defer></script>
68                <script src="js/world/object/table.js"></script>
69                <script src="js/world/object/text.js" defer></script>
70                <script src="js/world/object/arrow.js" defer></script>
71                <script src="js/neuroviewer/view.js" defer></script>
72                <script src="js/neuroviewer/neurofactory.js" defer></script>
73                <script src="js/neuroviewer/neurons/basedrawableneuron.js" defer></script>
74                <script src="js/neuroviewer/neurons/genericdrawableneuron.js" defer></script>
75                <script src="js/neuroviewer/neurons/receptordrawableneuron.js" defer></script>
76                <script src="js/components/slider.js" defer></script>
77                <script src="js/components/option.js" defer></script>
78                <script src="js/components/button.js" defer></script>
79                <script src="js/simulation/core.js" defer></script>
80                <script src="js/app.js" defer></script>
81        </body>
82</html>
Note: See TracBrowser for help on using the repository browser.