|
|
@@ -1,490 +0,0 @@
|
|
|
-<!DOCTYPE html>
|
|
|
-<!--Modified index.html to support android stock browser on blacklisted devices with black screen,refresh and resize problems-->
|
|
|
-<!--I've added the possibility to resize demo elements only for practical reasons when working on smaller screens-->
|
|
|
-<!--fixed by cyborg-->
|
|
|
-<html lang="en">
|
|
|
- <head>
|
|
|
- <meta charset="utf-8"></meta>
|
|
|
- <title>three.js - examples</title>
|
|
|
-
|
|
|
- <style>
|
|
|
- div {
|
|
|
- border: 2px solid;
|
|
|
- resize: both;
|
|
|
- overflow: hidden;
|
|
|
- }
|
|
|
- @font-face {
|
|
|
- font-family: 'inconsolata';
|
|
|
- src: url('files/inconsolata.woff') format('woff');
|
|
|
- font-weight: normal;
|
|
|
- font-style: normal;
|
|
|
- }
|
|
|
-
|
|
|
- body {
|
|
|
- background-color: #ffffff;
|
|
|
- margin: 0px;
|
|
|
- font-family: 'inconsolata';
|
|
|
- font-size: 15px;
|
|
|
- overflow: hidden;
|
|
|
- }
|
|
|
-
|
|
|
-.marquee {
|
|
|
-width:130px;
|
|
|
-height:40px;
|
|
|
-padding:5px;
|
|
|
-background-color: yellowgreen;
|
|
|
-border: 20px solid rgba(0,0,0,0.3);
|
|
|
-white-space: nowrap;
|
|
|
-overflow: hidden;
|
|
|
-
|
|
|
-/* Safari and Chrome */
|
|
|
-overflow-x:-webkit-marquee;
|
|
|
--webkit-marquee-direction: backwards;
|
|
|
--webkit-marquee-style: scroll;
|
|
|
--webkit-marquee-speed: fast;
|
|
|
--webkit-marquee-increment: small;
|
|
|
--webkit-marquee-repetition: infinite;
|
|
|
-
|
|
|
-/* W3C */
|
|
|
-overflow-x: marquee-line;
|
|
|
-marquee-direction: forward;
|
|
|
-marquee-style: scroll;
|
|
|
-marquee-speed: fast;
|
|
|
-marquee-play-count: infinite;
|
|
|
-}
|
|
|
-
|
|
|
- a {
|
|
|
- color: #2194CE;
|
|
|
- text-decoration: none;
|
|
|
- }
|
|
|
-
|
|
|
- h1 {
|
|
|
- margin-top: 30px;
|
|
|
- margin-bottom: 40px;
|
|
|
- font-size: 25px;
|
|
|
- font-weight: normal;
|
|
|
- }
|
|
|
-
|
|
|
- h2 {
|
|
|
- font-size: 20px;
|
|
|
- font-weight: normal;
|
|
|
- }
|
|
|
-
|
|
|
- #panel {
|
|
|
- position: absolute;
|
|
|
- width: 310px;
|
|
|
- height: 100%;
|
|
|
- resize: both;
|
|
|
- overflow: scroll;
|
|
|
- background: #fafafa;
|
|
|
- }
|
|
|
-
|
|
|
- #panel #list {
|
|
|
- padding: 0px 20px;
|
|
|
- line-height: 18px;
|
|
|
- }
|
|
|
-
|
|
|
- #panel #list .link {
|
|
|
- color: #2194CE;
|
|
|
- text-decoration: none;
|
|
|
- resize: both;
|
|
|
- cursor: pointer;
|
|
|
- }
|
|
|
-
|
|
|
- #panel #list .selected {
|
|
|
- color: #ff0000;
|
|
|
- }
|
|
|
-
|
|
|
- #panel #list .link:hover {
|
|
|
- text-decoration: underline;
|
|
|
- }
|
|
|
-
|
|
|
- #viewer {
|
|
|
- position: absolute;
|
|
|
- left: 310px;
|
|
|
- width: -webkit-calc(100% - 310px); /* Safari */
|
|
|
- width: calc(100% - 310px);
|
|
|
- height: 100%;
|
|
|
- resize: both;
|
|
|
- border: 0px;
|
|
|
- }
|
|
|
-
|
|
|
- #button {
|
|
|
- position: fixed;
|
|
|
- top: 20px;
|
|
|
- right: 20px;
|
|
|
- padding: 8px;
|
|
|
- color: #fff;
|
|
|
- background-color: #555;
|
|
|
- opacity: 0.7;
|
|
|
- }
|
|
|
-
|
|
|
- #button:hover {
|
|
|
- cursor: pointer;
|
|
|
- opacity: 1;
|
|
|
- }
|
|
|
-
|
|
|
- </style>
|
|
|
- </head>
|
|
|
- <body>
|
|
|
- <div id="panel">
|
|
|
- <div id="list">
|
|
|
- <h1><a href="http://threejs.org">three.js</a> / examples</h1>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
-
|
|
|
-<article><iframe id="viewer" width="670" allowfullscreen></iframe>
|
|
|
-
|
|
|
- <script>
|
|
|
-
|
|
|
- var files = {
|
|
|
- "webgl": [
|
|
|
- "webgl_animation_cloth",
|
|
|
- "webgl_animation_skinning_blending",
|
|
|
- "webgl_animation_skinning_morph",
|
|
|
- "webgl_buffergeometry",
|
|
|
- "webgl_buffergeometry_custom_attributes_particles",
|
|
|
- "webgl_buffergeometry_lines",
|
|
|
- "webgl_buffergeometry_lines_indexed",
|
|
|
- "webgl_buffergeometry_particles",
|
|
|
- "webgl_buffergeometry_drawcalls",
|
|
|
- "webgl_buffergeometry_rawshader",
|
|
|
- "webgl_buffergeometry_uint",
|
|
|
- "webgl_camera",
|
|
|
- "webgl_camera_logarithmicdepthbuffer",
|
|
|
- "webgl_custom_attributes",
|
|
|
- "webgl_custom_attributes_lines",
|
|
|
- "webgl_custom_attributes_particles",
|
|
|
- "webgl_custom_attributes_particles2",
|
|
|
- "webgl_custom_attributes_particles3",
|
|
|
- "webgl_decals",
|
|
|
- "webgl_effects_anaglyph",
|
|
|
- "webgl_effects_parallaxbarrier",
|
|
|
- "webgl_effects_stereo",
|
|
|
- "webgl_geometries",
|
|
|
- "webgl_geometries2",
|
|
|
- "webgl_geometry_colors",
|
|
|
- "webgl_geometry_colors_blender",
|
|
|
- "webgl_geometry_colors_lookuptable",
|
|
|
- "webgl_geometry_convex",
|
|
|
- "webgl_geometry_cube",
|
|
|
- "webgl_geometry_dynamic",
|
|
|
- "webgl_geometry_extrude_shapes",
|
|
|
- "webgl_geometry_extrude_shapes2",
|
|
|
- "webgl_geometry_extrude_splines",
|
|
|
- "webgl_geometry_hierarchy",
|
|
|
- "webgl_geometry_hierarchy2",
|
|
|
- "webgl_geometry_large_mesh",
|
|
|
- "webgl_geometry_minecraft",
|
|
|
- "webgl_geometry_minecraft_ao",
|
|
|
- "webgl_geometry_normals",
|
|
|
- "webgl_geometry_nurbs",
|
|
|
- "webgl_geometry_shapes",
|
|
|
- "webgl_geometry_terrain",
|
|
|
- "webgl_geometry_terrain_fog",
|
|
|
- "webgl_geometry_terrain_raycast",
|
|
|
- "webgl_geometry_text",
|
|
|
- "webgl_geometry_text2",
|
|
|
- "webgl_gpgpu_birds",
|
|
|
- "webgl_hdr",
|
|
|
- "webgl_helpers",
|
|
|
- "webgl_interactive_buffergeometry",
|
|
|
- "webgl_interactive_cubes",
|
|
|
- "webgl_interactive_cubes_gpu",
|
|
|
- "webgl_interactive_cubes_ortho",
|
|
|
- "webgl_interactive_draggablecubes",
|
|
|
- "webgl_interactive_lines",
|
|
|
- "webgl_interactive_particles",
|
|
|
- "webgl_interactive_raycasting_pointcloud",
|
|
|
- "webgl_interactive_voxelpainter",
|
|
|
- "webgl_kinect",
|
|
|
- "webgl_lensflares",
|
|
|
- "webgl_lights_hemisphere",
|
|
|
- "webgl_lights_pointlights",
|
|
|
- "webgl_lights_pointlights2",
|
|
|
- "webgl_lines_colors",
|
|
|
- "webgl_lines_cubes",
|
|
|
- "webgl_lines_dashed",
|
|
|
- "webgl_lines_sphere",
|
|
|
- "webgl_lines_splines",
|
|
|
- "webgl_loader_assimp2json",
|
|
|
- "webgl_loader_awd",
|
|
|
- "webgl_loader_babylon",
|
|
|
- "webgl_loader_collada",
|
|
|
- "webgl_loader_collada_keyframe",
|
|
|
- "webgl_loader_collada_skinning",
|
|
|
- "webgl_loader_collada_kinematics",
|
|
|
- "webgl_loader_ctm",
|
|
|
- "webgl_loader_ctm_materials",
|
|
|
- "webgl_loader_gltf",
|
|
|
- "webgl_loader_json_blender",
|
|
|
- "webgl_loader_json_objconverter",
|
|
|
- "webgl_loader_msgpack",
|
|
|
- "webgl_loader_obj",
|
|
|
- "webgl_loader_obj_mtl",
|
|
|
- "webgl_loader_pdb",
|
|
|
- "webgl_loader_ply",
|
|
|
- "webgl_loader_scene",
|
|
|
- "webgl_loader_stl",
|
|
|
- "webgl_loader_utf8",
|
|
|
- "webgl_loader_vrml",
|
|
|
- "webgl_loader_vtk",
|
|
|
- "webgl_lod",
|
|
|
- "webgl_marchingcubes",
|
|
|
- "webgl_materials",
|
|
|
- "webgl_materials2",
|
|
|
- "webgl_materials_blending",
|
|
|
- "webgl_materials_blending_custom",
|
|
|
- "webgl_materials_bumpmap",
|
|
|
- "webgl_materials_bumpmap_skin",
|
|
|
- "webgl_materials_cars",
|
|
|
- "webgl_materials_cars_camaro",
|
|
|
- "webgl_materials_cubemap",
|
|
|
- "webgl_materials_cubemap_balls_reflection",
|
|
|
- "webgl_materials_cubemap_balls_refraction",
|
|
|
- "webgl_materials_cubemap_dynamic",
|
|
|
- "webgl_materials_cubemap_dynamic2",
|
|
|
- "webgl_materials_cubemap_escher",
|
|
|
- "webgl_materials_cubemap_refraction",
|
|
|
- "webgl_materials_envmaps",
|
|
|
- "webgl_materials_grass",
|
|
|
- "webgl_materials_lightmap",
|
|
|
- "webgl_materials_normalmap",
|
|
|
- "webgl_materials_normaldisplacementmap",
|
|
|
- "webgl_materials_parallaxmap",
|
|
|
- "webgl_materials_shaders_fresnel",
|
|
|
- "webgl_materials_skin",
|
|
|
- "webgl_materials_texture_anisotropy",
|
|
|
- "webgl_materials_texture_compressed",
|
|
|
- "webgl_materials_texture_filters",
|
|
|
- "webgl_materials_texture_manualmipmap",
|
|
|
- "webgl_materials_texture_pvrtc",
|
|
|
- "webgl_materials_texture_tga",
|
|
|
- "webgl_materials_video",
|
|
|
- "webgl_materials_wireframe",
|
|
|
- "webgl_mirror",
|
|
|
- "webgl_modifier_subdivision",
|
|
|
- "webgl_modifier_tessellation",
|
|
|
- "webgl_morphnormals",
|
|
|
- "webgl_morphtargets",
|
|
|
- "webgl_morphtargets_horse",
|
|
|
- "webgl_morphtargets_human",
|
|
|
- "webgl_morphtargets_md2",
|
|
|
- "webgl_morphtargets_md2_control",
|
|
|
- "webgl_multiple_canvases_circle",
|
|
|
- "webgl_multiple_canvases_complex",
|
|
|
- "webgl_multiple_canvases_grid",
|
|
|
- "webgl_multiple_views",
|
|
|
- "webgl_nearestneighbour",
|
|
|
- "webgl_octree",
|
|
|
- "webgl_octree_raycasting",
|
|
|
- "webgl_panorama_equirectangular",
|
|
|
- "webgl_particles_billboards",
|
|
|
- "webgl_particles_billboards_colors",
|
|
|
- "webgl_particles_dynamic",
|
|
|
- "webgl_particles_random",
|
|
|
- "webgl_particles_shapes",
|
|
|
- "webgl_particles_sprites",
|
|
|
- "webgl_performance",
|
|
|
- "webgl_performance_doublesided",
|
|
|
- "webgl_performance_static",
|
|
|
- "webgl_postprocessing",
|
|
|
- "webgl_postprocessing_advanced",
|
|
|
- "webgl_postprocessing_dof",
|
|
|
- "webgl_postprocessing_dof2",
|
|
|
- "webgl_postprocessing_godrays",
|
|
|
- "webgl_postprocessing_crossfade",
|
|
|
- "webgl_postprocessing_glitch",
|
|
|
- "webgl_rtt",
|
|
|
- "webgl_sandbox",
|
|
|
- "webgl_shader",
|
|
|
- "webgl_shader_lava",
|
|
|
- "webgl_shader2",
|
|
|
- "webgl_shaders_ocean",
|
|
|
- "webgl_shading_physical",
|
|
|
- "webgl_shaders_sky",
|
|
|
- "webgl_shaders_tonemapping",
|
|
|
- "webgl_shaders_vector",
|
|
|
- "webgl_shadowmap",
|
|
|
- "webgl_shadowmap_performance",
|
|
|
- "webgl_shadowmap_viewer",
|
|
|
- "webgl_shadowmesh",
|
|
|
- "webgl_sprites",
|
|
|
- "webgl_terrain_dynamic",
|
|
|
- "webgl_test_memory",
|
|
|
- "webgl_test_memory2",
|
|
|
- "webgl_trails",
|
|
|
- "webgl_video_panorama_equirectangular"
|
|
|
- ],
|
|
|
- "webgldeferred": [
|
|
|
- "webgldeferred_animation",
|
|
|
- "webgldeferred_arealights",
|
|
|
- "webgldeferred_pointlights"
|
|
|
- ],
|
|
|
- "vr": [
|
|
|
- "vr_cubes",
|
|
|
- "vr_video"
|
|
|
- ],
|
|
|
- "css3d": [
|
|
|
- "css3d_molecules",
|
|
|
- "css3d_panorama",
|
|
|
- "css3d_periodictable",
|
|
|
- "css3d_sandbox",
|
|
|
- "css3d_sprites",
|
|
|
- "css3d_youtube"
|
|
|
- ],
|
|
|
- "css3d stereo": [
|
|
|
- "css3dstereo_periodictable",
|
|
|
- ],
|
|
|
- "misc": [
|
|
|
- "misc_animation_keys",
|
|
|
- "misc_controls_deviceorientation",
|
|
|
- "misc_controls_fly",
|
|
|
- "misc_controls_orbit",
|
|
|
- "misc_controls_pointerlock",
|
|
|
- "misc_controls_trackball",
|
|
|
- "misc_controls_transform",
|
|
|
- "misc_lights_test",
|
|
|
- "misc_lookat",
|
|
|
- "misc_fps",
|
|
|
- "misc_sound",
|
|
|
- "misc_ubiquity_test",
|
|
|
- "misc_ubiquity_test2",
|
|
|
- "misc_uv_tests"
|
|
|
- ],
|
|
|
- "canvas": [
|
|
|
- "canvas_ascii_effect",
|
|
|
- "canvas_camera_orthographic",
|
|
|
- "canvas_camera_orthographic2",
|
|
|
- "canvas_effects_stereo",
|
|
|
- "canvas_geometry_birds",
|
|
|
- "canvas_geometry_cube",
|
|
|
- "canvas_geometry_earth",
|
|
|
- "canvas_geometry_hierarchy",
|
|
|
- "canvas_geometry_nurbs",
|
|
|
- "canvas_geometry_panorama",
|
|
|
- "canvas_geometry_panorama_fisheye",
|
|
|
- "canvas_geometry_shapes",
|
|
|
- "canvas_geometry_terrain",
|
|
|
- "canvas_geometry_text",
|
|
|
- "canvas_interactive_cubes",
|
|
|
- "canvas_interactive_cubes_tween",
|
|
|
- "canvas_interactive_particles",
|
|
|
- "canvas_interactive_voxelpainter",
|
|
|
- "canvas_lights_pointlights",
|
|
|
- "canvas_lines",
|
|
|
- "canvas_lines_colors",
|
|
|
- "canvas_lines_dashed",
|
|
|
- "canvas_lines_sphere",
|
|
|
- "canvas_materials",
|
|
|
- "canvas_materials_depth",
|
|
|
- "canvas_materials_normal",
|
|
|
- "canvas_materials_reflection",
|
|
|
- "canvas_materials_video",
|
|
|
- "canvas_morphtargets_horse",
|
|
|
- "canvas_particles_floor",
|
|
|
- "canvas_particles_random",
|
|
|
- "canvas_particles_shapes",
|
|
|
- "canvas_particles_sprites",
|
|
|
- "canvas_particles_waves",
|
|
|
- "canvas_performance",
|
|
|
- "canvas_sandbox"
|
|
|
- ],
|
|
|
- "raytracing": [
|
|
|
- "raytracing_sandbox"
|
|
|
- ],
|
|
|
- "software": [
|
|
|
- "software_geometry_earth",
|
|
|
- "software_sandbox"
|
|
|
- ],
|
|
|
- "svg": [
|
|
|
- "svg_sandbox"
|
|
|
- ]
|
|
|
- };
|
|
|
-
|
|
|
- //
|
|
|
-
|
|
|
- var list = document.getElementById( 'list' );
|
|
|
- var viewer = document.getElementById( 'viewer' );
|
|
|
-
|
|
|
- var container = document.createElement( 'div' );
|
|
|
- list.appendChild( container );
|
|
|
-
|
|
|
- var button = document.createElement( 'div' );
|
|
|
- button.id = 'button';
|
|
|
- button.textContent = 'View source';
|
|
|
- button.addEventListener( 'click', function ( event ) {
|
|
|
-
|
|
|
- var array = location.href.split( '/' );
|
|
|
- array.pop();
|
|
|
-
|
|
|
- window.open( 'view-source:' + array.join( '/' ) + '/' + selected + '.html' );
|
|
|
-
|
|
|
- }, false );
|
|
|
- button.style.display = 'none';
|
|
|
- document.body.appendChild( button );
|
|
|
-
|
|
|
- var divs = {};
|
|
|
- var selected = null;
|
|
|
-
|
|
|
- for ( var key in files ) {
|
|
|
-
|
|
|
- var section = files[ key ];
|
|
|
-
|
|
|
- var div = document.createElement( 'h2' );
|
|
|
- div.textContent = key;
|
|
|
- container.appendChild( div );
|
|
|
-
|
|
|
- for ( var i = 0; i < section.length; i ++ ) {
|
|
|
-
|
|
|
- ( function ( file ) {
|
|
|
-
|
|
|
- var name = file.split( '_' );
|
|
|
- name.shift();
|
|
|
- name = name.join( ' / ' );
|
|
|
-
|
|
|
- var div = document.createElement( 'div' );
|
|
|
- div.className = 'link';
|
|
|
- div.textContent = name;
|
|
|
- div.addEventListener( 'click', function () {
|
|
|
-
|
|
|
- load( file );
|
|
|
-
|
|
|
- } );
|
|
|
- container.appendChild( div );
|
|
|
-
|
|
|
- divs[ file ] = div;
|
|
|
-
|
|
|
- } )( section[ i ] );
|
|
|
-
|
|
|
- }
|
|
|
-
|
|
|
- }
|
|
|
-
|
|
|
- var load = function ( file ) {
|
|
|
-
|
|
|
- if ( selected !== null ) divs[ selected ].className = 'link';
|
|
|
-
|
|
|
- divs[ file ].className = 'link selected';
|
|
|
-
|
|
|
- window.location.hash = file;
|
|
|
- viewer.src = file + '.html';
|
|
|
- viewer.focus();
|
|
|
-
|
|
|
- button.style.display = '';
|
|
|
-
|
|
|
- selected = file;
|
|
|
-
|
|
|
- };
|
|
|
-
|
|
|
- if ( window.location.hash !== '' ) {
|
|
|
-
|
|
|
- load( window.location.hash.substring( 1 ) );
|
|
|
-
|
|
|
- }
|
|
|
-
|
|
|
- </script><div class="marquee"><p>refresh fix by cyborg</p></div></article>
|
|
|
-
|
|
|
- </body>
|
|
|
-</html>
|
Cy-Bo-Rg