Changeset 1563556

Timestamp:

12/28/2016 03:41:07 PM (8 years ago)

Author:

goldsounds

Message:

Added gltf_scene post type

Location:

gltf-media-type/trunk

Files:

• README.txt (modified) (3 diffs)
• admin/class-gltf-admin.php (modified) (2 diffs)
• admin/js/gltf-admin-select-model-metabox.js (added)
• gltf.php (modified) (2 diffs)
• includes/class-gltf-activator.php (modified) (1 diff)
• includes/class-gltf-deactivator.php (modified) (1 diff)
• includes/class-gltf-model-utils.php (added)
• includes/class-gltf.php (modified) (2 diffs)
• js/gltf-model-preview.js (modified) (1 diff)
• public/class-gltf-public.php (modified) (1 diff)
• public/js/gltf-public.js (modified) (1 diff)
• public/templates (added)
• public/templates/single-gltf_scene-notheme.php (added)
• public/templates/single-gltf_scene.php (added)

gltf-media-type/trunk/README.txt

@@ -4 +4 @@
 Requires at least: 4.5
 Tested up to: 4.7
-Stable tag: 1.0.1
+Stable tag: 1.1
 License: GPLv2 or later
 License URI: http://www.gnu.org/licenses/gpl-2.0.html
@@ -18 +18 @@
 == Installation ==
 
-1. Upload `gltf.php` to the `/wp-content/plugins/` directory
-1. Activate the plugin through the 'Plugins' menu in WordPress
+1. U the `/wp-content/plugins/` directory
+1. Activate the plugin through the 'Plugins' menu in WordPress
 1. Upload .gltf or .glb files via the Media browser, or via the Add Media button for posts/pages.
 1. Embed the 3D object in posts using a shortcode, like `[gltf_model scale="1.0" url="http://mywordpresssite.com/wp-content/uploads/2016/12/model.gltf"]. Note: You may get that full URL from the Media browser by selecting the file and copying the link.
@@ -33 +33 @@
 == Changelog ==
 
+
+
+
 = 1.0 =
 * First version, just basic rendering

gltf-media-type/trunk/admin/class-gltf-admin.php

@@ -52 +52 @@
         $this->plugin_name = $plugin_name;
         $this->version = $version;
-
     }
 
@@ -83 +82 @@
      * @since    1.0.0
      */
-    public function enqueue_scripts() {
-        wp_enqueue_script( $this->plugin_name, plugin_dir_url( dirname( __FILE__ ) ) . 'js/three.min.js', null, $this->version, false );
+    public function enqueue_scripts() {
+        wp_enqueue_script( , plugin_dir_url( dirname( __FILE__ ) ) . 'js/three.min.js', null, $this->version, false );
         wp_enqueue_script( $this->plugin_name, plugin_dir_url( __FILE__ ) . 'js/gltf-admin.js', array( 'jquery' ), $this->version, false );
 
+
+
+
+
+
+
+
+
+
     }
 

gltf-media-type/trunk/gltf.php

@@ -12 +12 @@
  * Plugin URI:        http://goldsounds.com/plugins/gltf
  * Description:       A plugin to upload and render glTF 3D models in WordPress.
- * Version:           1.0.1
+ * Version:           1.1
  * Author:            Daniel Walmsley
  * Author URI:        http://goldsounds.com
@@ -51 +51 @@
  * admin-specific hooks, and public-facing site hooks.
  */
-require plugin_dir_path( __FILE__ ) . 'includes/class-gltf.php';
+require plugin_dir_path( __FILE__ ) . 'includes/class-gltf.php';
 
 /**

gltf-media-type/trunk/includes/class-gltf-activator.php

@@ -31 +31 @@
      */
     public static function activate() {
-
+        require_once plugin_dir_path( __FILE__ ) . 'class-gltf.php';
+        $plugin = new Gltf();
+        $plugin->register_scene_post_type();
+        flush_rewrite_rules();
     }
 

gltf-media-type/trunk/includes/class-gltf-deactivator.php

@@ -31 +31 @@
      */
     public static function deactivate() {
-
+        flush_rewrite_rules();
     }
 

gltf-media-type/trunk/includes/class-gltf.php

@@ -140 +140 @@
         // add three.js if the current post has our shortcode
         add_action( 'wp_enqueue_scripts', array( $this, 'enqueue_model_render_script' ) );
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
     }
 
@@ -165 +180 @@
     }
 
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
     public function enqueue_model_render_script() {
         global $post;
-        if( is_a( $post, 'WP_Post' ) && has_shortcode( $post->post_content, 'gltf_model') ) {
-            wp_enqueue_script( 'threejs', plugin_dir_url( dirname( __FILE__ ) ) . 'js/three.min.js', null, $this->version, false );
-            wp_enqueue_script( 'gltf-loader', plugin_dir_url( dirname( __FILE__ ) ) . 'js/loaders/GLTFLoader.js', array( 'threejs' ), $this->version, false );
-            wp_enqueue_script( 'orbitcontrols', plugin_dir_url( dirname( __FILE__ ) ) . 'js/OrbitControls.js', array( 'threejs' ), $this->version, false );
-            wp_enqueue_script( 'gltf-model-preview', plugin_dir_url( dirname( __FILE__ ) ) . 'js/gltf-model-preview.js', array( 'jquery', 'gltf-loader', 'orbitcontrols' ), $this->version, false );
-        }
+        if( is_a( $post, 'WP_Post' ) && has_shortcode( $post->post_content, 'gltf_model') ) {
+            require_once dirname( __FILE__ ) . '/class-gltf-model-utils.php';
+            Gltf_Model_Utils::enqueue_scripts( $this->version );
+        }
     }
 

gltf-media-type/trunk/js/gltf-model-preview.js

@@ -12 +12 @@
 
     function addLights() {
-        var ambient = new THREE.AmbientLight( 0x101030 );
+        // var ambient = new THREE.AmbientLight( 0x101030 );
+        var ambient = new THREE.AmbientLight( 0xFFFFFF, 1 );
         scene.add( ambient );
 

gltf-media-type/trunk/public/class-gltf-public.php

@@ -96 +96 @@
          * class.
          */
-
-        wp_enqueue_script( $this->plugin_name, plugin_dir_url( __FILE__ ) . 'js/gltf-public.js', array( 'jquery' ), $this->version, false );
+        require_once dirname( dirname( __FILE__ ) ) . '/includes/class-gltf-model-utils.php';
+        Gltf_Model_Utils::enqueue_common_gltf_scripts( $this->version );
+        wp_enqueue_script( $this->plugin_name, plugin_dir_url( __FILE__ ) . 'js/gltf-public.js', array( 'jquery', 'orbitcontrols' ), $this->version, false );
 
     }

gltf-media-type/trunk/public/js/gltf-public.js

@@ -2 +2 @@
     'use strict';
 
-    /**
-     * All of the code for your public-facing JavaScript source
-     * should reside in this file.
-     *
-     * Note: It has been assumed you will write jQuery code here, so the
-     * $ function reference has been prepared for usage within the scope
-     * of this function.
-     *
-     * This enables you to define handlers, for when the DOM is ready:
-     *
-     * $(function() {
-     *
-     * });
-     *
-     * When the window is loaded:
-     *
-     * $( window ).load(function() {
-     *
-     * });
-     *
-     * ...and/or other possibilities.
-     *
-     * Ideally, it is not considered best practise to attach more than a
-     * single DOM-ready or window-load handler for a particular page.
-     * Although scripts in the WordPress core, Plugins and Themes may be
-     * practising this, we should strive to set a better example in our own work.
-     */
+     window.GltfScene = function() {
+
+        var container, camera, scene, renderer, controls;
+
+        function addCamera() {
+            camera = new THREE.PerspectiveCamera( 75, container.offsetWidth / container.offsetHeight, 1, 2000 );
+            camera.position.set(0, 2, 3);
+            scene.add( camera );
+        }
+
+        function addLights() {
+            // var ambient = new THREE.AmbientLight( 0x101030 );
+            var ambient = new THREE.AmbientLight( 0xFFFFFF, 1 );
+            scene.add( ambient );
+
+            var directionalLight = new THREE.DirectionalLight( 0xffeedd );
+            directionalLight.position.set( 0, 0, 1 );
+            scene.add( directionalLight );
+        }
+
+        function addControls() {
+            controls = new THREE.OrbitControls( camera, renderer.domElement );
+            controls.userPan = false;
+            controls.userPanSpeed = 0.0;
+            controls.maxDistance = 5000.0;
+            controls.maxPolarAngle = Math.PI * 0.495;
+            controls.autoRotate = false;
+            // controls.autoRotateSpeed = -10.0;
+        }
+
+        function addRenderer() {
+            renderer = new THREE.WebGLRenderer({antialias:true});
+            renderer.setClearColor( 0x222222 );
+            renderer.setPixelRatio( window.devicePixelRatio );
+            renderer.setSize( container.offsetWidth, container.offsetHeight );
+        }
+
+        function addLoadingLogger() {
+            var manager = new THREE.LoadingManager();
+            manager.onProgress = function ( item, loaded, total ) {
+                console.log( item, loaded, total );
+            };
+        }
+
+        function loadModel( modelUrl, modelScale ) {
+            THREE.GLTFLoader.Shaders.removeAll(); // remove all previous shaders
+            var loader = new THREE.GLTFLoader;
+            loader.load( modelUrl, function( data ) {
+                var object = data.scene;
+                object.scale.set(modelScale, modelScale, modelScale);
+
+                var animations = data.animations;
+                if ( animations && animations.length ) {
+                    mixer = new THREE.AnimationMixer( object );
+                    for ( var i = 0; i < animations.length; i ++ ) {
+                        var animation = animations[ i ];
+                        mixer.clipAction( animation ).play();
+                    }
+                }
+
+                scene.add( object );
+            } );
+        }
+
+        function render() {
+            renderer.render( scene, camera );
+        }
+
+        function animate() {
+            requestAnimationFrame( animate );
+            THREE.GLTFLoader.Animations.update();
+            THREE.GLTFLoader.Shaders.update(scene, camera);
+            render();
+            controls.update();
+        }
+
+        function initScene( id ) {
+            container = jQuery( '#'+id ).get(0);
+
+            scene = new THREE.Scene();
+
+            addLights(); // LIGHTS!
+            addCamera(); // CAMERA!
+            addRenderer(); // ACTION! :)
+            addControls();
+            addLoadingLogger();
+
+            container.appendChild( renderer.domElement );
+        }
+
+        return {
+            render: function( id, scene ) {
+                console.log("rendering "+id+": "+JSON.stringify( scene ));
+
+                initScene( id );
+                loadModel( scene.main_model, scene.main_model_scale );
+                animate();
+            }
+        }
+     }();
 
 })( jQuery );