diff --git a/app/Resources/assets/javascripts/ModelViewer.js b/app/Resources/assets/javascripts/ModelViewer.js new file mode 100644 index 0000000..ba6409a --- /dev/null +++ b/app/Resources/assets/javascripts/ModelViewer.js @@ -0,0 +1,109 @@ +$(document).ready(function () { + var container; + var camera, cameraTarget, scene, renderer, controls; + var stats; + + init(); + animate(); +}); + +function init() { + container = document.getElementById('model'); + + modelView = $('#model'); + + camera = new THREE.PerspectiveCamera(45, modelView.innerWidth() / modelView.innerHeight(), 0.1, 2000); + camera.position.set(4, 1.5, 4); + camera.lookAt(new THREE.Vector3(0, -0.7, 0)); + + scene = new THREE.Scene(); + scene.fog = new THREE.Fog(0x72645b, 2, 15); + + + var loader = new THREE.STLLoader(); + loader.load('./resources/30000.stl', function (geometry) { + var material = new THREE.MeshPhongMaterial({color: 0xaaaaaa, shininess:200, specular: 0x333333, shading: THREE.FlatShading}); + var mesh = new THREE.Mesh(geometry, material); + mesh.position.set(0, 0, 0); + mesh.rotation.set(Math.PI, 0, 0); + mesh.castShadow = true; + mesh.receiveShadow = true; + scene.add(mesh); + }); + + + // Lights + + light = new THREE.DirectionalLight( 0xffffff ); + light.position.set( 1, 1, 1 ); + scene.add( light ); + + light = new THREE.DirectionalLight( 0x002288 ); + light.position.set( -1, -1, -1 ); + scene.add( light ); + + + scene.add( new THREE.AmbientLight( 0xf0f0f0 )); + scene.background = new THREE.Color( 0x000000 ); + + // renderer + renderer = new THREE.WebGLRenderer(); + renderer.setClearColor( scene.fog.color ); + renderer.setPixelRatio( window.devicePixelRatio ); + renderer.setSize( modelView.innerWidth(), modelView.innerHeight() ); + renderer.gammaInput = true; + renderer.gammaOutput = true; + renderer.shadowMap.enabled = true; + renderer.shadowMap.renderReverseSided = false; + + container.appendChild(renderer.domElement); + + // Stats + + stats = new Stats(); + container.appendChild( stats.dom ); + + window.addEventListener('resize', onWindowResize, false); +} + +function addShadowedLight(x, y, z, color, intensity) { + var directionalLight = new THREE.DirectionalLight(color, intensity); + directionalLight.position.set(x, y, z); + scene.add(directionalLight); + directionalLight.castShadow = true; + var d = 1; + directionalLight.shadow.camera.left = -d; + directionalLight.shadow.camera.right = d; + directionalLight.shadow.camera.top = d; + directionalLight.shadow.camera.bottom = -d; + directionalLight.shadow.camera.near = 1; + directionalLight.shadow.camera.far = 4; + directionalLight.shadow.mapSize.width = 1024; + directionalLight.shadow.mapSize.height = 1024; + directionalLight.shadow.bias = -0.005; +} + +function onWindowResize() { + + // camera.aspect = window.innerWidth / window.innerHeight; + // camera.updateProjectionMatrix(); + // renderer.setSize(window.innerWidth, window.innerHeight); + +} + +function animate() { + + requestAnimationFrame(animate); + + stats.update(); + + render(); + +} + +function render() { + + + renderer.render(scene, camera); + +} \ No newline at end of file diff --git a/app/Resources/assets/javascripts/STLLoader.js b/app/Resources/assets/javascripts/STLLoader.js deleted file mode 100644 index bbcff10..0000000 --- a/app/Resources/assets/javascripts/STLLoader.js +++ /dev/null @@ -1,491 +0,0 @@ -/** - * @author aleeper / http://adamleeper.com/ - * @author mrdoob / http://mrdoob.com/ - * @author gero3 / https://github.com/gero3 - * - * Description: A THREE loader for STL ASCII files, as created by Solidworks and other CAD programs. - * - * Supports both binary and ASCII encoded files, with automatic detection of type. - * - * Limitations: - * Binary decoding supports "Magics" color format (http://en.wikipedia.org/wiki/STL_(file_format)#Color_in_binary_STL). - * There is perhaps some question as to how valid it is to always assume little-endian-ness. - * ASCII decoding assumes file is UTF-8. Seems to work for the examples... - * - * Usage: - * var loader = new THREE.STLLoader(); - * loader.load( './models/stl/slotted_disk.stl', function ( geometry ) { - * scene.add( new THREE.Mesh( geometry ) ); - * }); - * - * For binary STLs geometry might contain colors for vertices. To use it: - * // use the same code to load STL as above - * if (geometry.hasColors) { - * material = new THREE.MeshPhongMaterial({ opacity: geometry.alpha, vertexColors: THREE.VertexColors }); - * } else { .... } - * var mesh = new THREE.Mesh( geometry, material ); - */ - - -THREE.STLLoader = function ( manager ) { - - this.manager = ( manager !== undefined ) ? manager : THREE.DefaultLoadingManager; - -}; - -THREE.STLLoader.prototype = { - - constructor: THREE.STLLoader, - - load: function ( url, onLoad, onProgress, onError ) { - - var scope = this; - - var loader = new THREE.XHRLoader( scope.manager ); - loader.setResponseType( 'arraybuffer' ); - loader.load( url, function ( text ) { - - onLoad( scope.parse( text ) ); - - }, onProgress, onError ); - - }, - - parse: function ( data ) { - - var isBinary = function () { - - var expect, face_size, n_faces, reader; - reader = new DataView( binData ); - face_size = ( 32 / 8 * 3 ) + ( ( 32 / 8 * 3 ) * 3 ) + ( 16 / 8 ); - n_faces = reader.getUint32( 80, true ); - expect = 80 + ( 32 / 8 ) + ( n_faces * face_size ); - - if ( expect === reader.byteLength ) { - - return true; - - } - - // some binary files will have different size from expected, - // checking characters higher than ASCII to confirm is binary - var fileLength = reader.byteLength; - for ( var index = 0; index < fileLength; index ++ ) { - - if ( reader.getUint8( index, false ) > 127 ) { - - return true; - - } - - } - - return false; - - }; - - var binData = this.ensureBinary( data ); - - return isBinary() - ? this.parseBinary( binData ) - : this.parseASCII( this.ensureString( data ) ); - - }, - - parseBinary: function ( data ) { - - var reader = new DataView( data ); - var faces = reader.getUint32( 80, true ); - - var r, g, b, hasColors = false, colors; - var defaultR, defaultG, defaultB, alpha; - - // process STL header - // check for default color in header ("COLOR=rgba" sequence). - - for ( var index = 0; index < 80 - 10; index ++ ) { - - if ( ( reader.getUint32( index, false ) == 0x434F4C4F /*COLO*/ ) && - ( reader.getUint8( index + 4 ) == 0x52 /*'R'*/ ) && - ( reader.getUint8( index + 5 ) == 0x3D /*'='*/ ) ) { - - hasColors = true; - colors = new Float32Array( faces * 3 * 3 ); - - defaultR = reader.getUint8( index + 6 ) / 255; - defaultG = reader.getUint8( index + 7 ) / 255; - defaultB = reader.getUint8( index + 8 ) / 255; - alpha = reader.getUint8( index + 9 ) / 255; - - } - - } - - var dataOffset = 84; - var faceLength = 12 * 4 + 2; - - var offset = 0; - - var geometry = new THREE.BufferGeometry(); - - var vertices = new Float32Array( faces * 3 * 3 ); - var normals = new Float32Array( faces * 3 * 3 ); - - for ( var face = 0; face < faces; face ++ ) { - - var start = dataOffset + face * faceLength; - var normalX = reader.getFloat32( start, true ); - var normalY = reader.getFloat32( start + 4, true ); - var normalZ = reader.getFloat32( start + 8, true ); - - if ( hasColors ) { - - var packedColor = reader.getUint16( start + 48, true ); - - if ( ( packedColor & 0x8000 ) === 0 ) { - - // facet has its own unique color - - r = ( packedColor & 0x1F ) / 31; - g = ( ( packedColor >> 5 ) & 0x1F ) / 31; - b = ( ( packedColor >> 10 ) & 0x1F ) / 31; - - } else { - - r = defaultR; - g = defaultG; - b = defaultB; - - } - - } - - for ( var i = 1; i <= 3; i ++ ) { - - var vertexstart = start + i * 12; - - vertices[ offset ] = reader.getFloat32( vertexstart, true ); - vertices[ offset + 1 ] = reader.getFloat32( vertexstart + 4, true ); - vertices[ offset + 2 ] = reader.getFloat32( vertexstart + 8, true ); - - normals[ offset ] = normalX; - normals[ offset + 1 ] = normalY; - normals[ offset + 2 ] = normalZ; - - if ( hasColors ) { - - colors[ offset ] = r; - colors[ offset + 1 ] = g; - colors[ offset + 2 ] = b; - - } - - offset += 3; - - } - - } - - geometry.addAttribute( 'position', new THREE.BufferAttribute( vertices, 3 ) ); - geometry.addAttribute( 'normal', new THREE.BufferAttribute( normals, 3 ) ); - - if ( hasColors ) { - - geometry.addAttribute( 'color', new THREE.BufferAttribute( colors, 3 ) ); - geometry.hasColors = true; - geometry.alpha = alpha; - - } - - return geometry; - - }, - - parseASCII: function ( data ) { - - var geometry, length, normal, patternFace, patternNormal, patternVertex, result, text; - geometry = new THREE.Geometry(); - patternFace = /facet([\s\S]*?)endfacet/g; - - while ( ( result = patternFace.exec( data ) ) !== null ) { - - text = result[ 0 ]; - patternNormal = /normal[\s]+([\-+]?[0-9]+\.?[0-9]*([eE][\-+]?[0-9]+)?)+[\s]+([\-+]?[0-9]*\.?[0-9]+([eE][\-+]?[0-9]+)?)+[\s]+([\-+]?[0-9]*\.?[0-9]+([eE][\-+]?[0-9]+)?)+/g; - - while ( ( result = patternNormal.exec( text ) ) !== null ) { - - normal = new THREE.Vector3( parseFloat( result[ 1 ] ), parseFloat( result[ 3 ] ), parseFloat( result[ 5 ] ) ); - - } - - patternVertex = /vertex[\s]+([\-+]?[0-9]+\.?[0-9]*([eE][\-+]?[0-9]+)?)+[\s]+([\-+]?[0-9]*\.?[0-9]+([eE][\-+]?[0-9]+)?)+[\s]+([\-+]?[0-9]*\.?[0-9]+([eE][\-+]?[0-9]+)?)+/g; - - while ( ( result = patternVertex.exec( text ) ) !== null ) { - - geometry.vertices.push( new THREE.Vector3( parseFloat( result[ 1 ] ), parseFloat( result[ 3 ] ), parseFloat( result[ 5 ] ) ) ); - - } - - length = geometry.vertices.length; - - geometry.faces.push( new THREE.Face3( length - 3, length - 2, length - 1, normal ) ); - - } - - geometry.computeBoundingBox(); - geometry.computeBoundingSphere(); - - return geometry; - - }, - - ensureString: function ( buf ) { - - if ( typeof buf !== "string" ) { - - var array_buffer = new Uint8Array( buf ); - var strArray = []; - for ( var i = 0; i < buf.byteLength; i ++ ) { - - strArray.push(String.fromCharCode( array_buffer[ i ] )); // implicitly assumes little-endian - - } - return strArray.join(''); - - } else { - - return buf; - - } - - }, - - ensureBinary: function ( buf ) { - - if ( typeof buf === "string" ) { - - var array_buffer = new Uint8Array( buf.length ); - for ( var i = 0; i < buf.length; i ++ ) { - - array_buffer[ i ] = buf.charCodeAt( i ) & 0xff; // implicitly assumes little-endian - - } - return array_buffer.buffer || array_buffer; - - } else { - - return buf; - - } - - } - -}; - -if ( typeof DataView === 'undefined' ) { - - DataView = function( buffer, byteOffset, byteLength ) { - - this.buffer = buffer; - this.byteOffset = byteOffset || 0; - this.byteLength = byteLength || buffer.byteLength || buffer.length; - this._isString = typeof buffer === "string"; - - }; - - DataView.prototype = { - - _getCharCodes: function( buffer, start, length ) { - - start = start || 0; - length = length || buffer.length; - var end = start + length; - var codes = []; - for ( var i = start; i < end; i ++ ) { - - codes.push( buffer.charCodeAt( i ) & 0xff ); - - } - return codes; - - }, - - _getBytes: function ( length, byteOffset, littleEndian ) { - - var result; - - // Handle the lack of endianness - if ( littleEndian === undefined ) { - - littleEndian = this._littleEndian; - - } - - // Handle the lack of byteOffset - if ( byteOffset === undefined ) { - - byteOffset = this.byteOffset; - - } else { - - byteOffset = this.byteOffset + byteOffset; - - } - - if ( length === undefined ) { - - length = this.byteLength - byteOffset; - - } - - // Error Checking - if ( typeof byteOffset !== 'number' ) { - - throw new TypeError( 'DataView byteOffset is not a number' ); - - } - - if ( length < 0 || byteOffset + length > this.byteLength ) { - - throw new Error( 'DataView length or (byteOffset+length) value is out of bounds' ); - - } - - if ( this.isString ) { - - result = this._getCharCodes( this.buffer, byteOffset, byteOffset + length ); - - } else { - - result = this.buffer.slice( byteOffset, byteOffset + length ); - - } - - if ( ! littleEndian && length > 1 ) { - - if ( Array.isArray( result ) === false ) { - - result = Array.prototype.slice.call( result ); - - } - - result.reverse(); - - } - - return result; - - }, - - // Compatibility functions on a String Buffer - - getFloat64: function ( byteOffset, littleEndian ) { - - var b = this._getBytes( 8, byteOffset, littleEndian ), - - sign = 1 - ( 2 * ( b[ 7 ] >> 7 ) ), - exponent = ( ( ( ( b[ 7 ] << 1 ) & 0xff ) << 3 ) | ( b[ 6 ] >> 4 ) ) - ( ( 1 << 10 ) - 1 ), - - // Binary operators such as | and << operate on 32 bit values, using + and Math.pow(2) instead - mantissa = ( ( b[ 6 ] & 0x0f ) * Math.pow( 2, 48 ) ) + ( b[ 5 ] * Math.pow( 2, 40 ) ) + ( b[ 4 ] * Math.pow( 2, 32 ) ) + - ( b[ 3 ] * Math.pow( 2, 24 ) ) + ( b[ 2 ] * Math.pow( 2, 16 ) ) + ( b[ 1 ] * Math.pow( 2, 8 ) ) + b[ 0 ]; - - if ( exponent === 1024 ) { - - if ( mantissa !== 0 ) { - - return NaN; - - } else { - - return sign * Infinity; - - } - - } - - if ( exponent === - 1023 ) { - - // Denormalized - return sign * mantissa * Math.pow( 2, - 1022 - 52 ); - - } - - return sign * ( 1 + mantissa * Math.pow( 2, - 52 ) ) * Math.pow( 2, exponent ); - - }, - - getFloat32: function ( byteOffset, littleEndian ) { - - var b = this._getBytes( 4, byteOffset, littleEndian ), - - sign = 1 - ( 2 * ( b[ 3 ] >> 7 ) ), - exponent = ( ( ( b[ 3 ] << 1 ) & 0xff ) | ( b[ 2 ] >> 7 ) ) - 127, - mantissa = ( ( b[ 2 ] & 0x7f ) << 16 ) | ( b[ 1 ] << 8 ) | b[ 0 ]; - - if ( exponent === 128 ) { - - if ( mantissa !== 0 ) { - - return NaN; - - } else { - - return sign * Infinity; - - } - - } - - if ( exponent === - 127 ) { - - // Denormalized - return sign * mantissa * Math.pow( 2, - 126 - 23 ); - - } - - return sign * ( 1 + mantissa * Math.pow( 2, - 23 ) ) * Math.pow( 2, exponent ); - - }, - - getInt32: function ( byteOffset, littleEndian ) { - - var b = this._getBytes( 4, byteOffset, littleEndian ); - return ( b[ 3 ] << 24 ) | ( b[ 2 ] << 16 ) | ( b[ 1 ] << 8 ) | b[ 0 ]; - - }, - - getUint32: function ( byteOffset, littleEndian ) { - - return this.getInt32( byteOffset, littleEndian ) >>> 0; - - }, - - getInt16: function ( byteOffset, littleEndian ) { - - return ( this.getUint16( byteOffset, littleEndian ) << 16 ) >> 16; - - }, - - getUint16: function ( byteOffset, littleEndian ) { - - var b = this._getBytes( 2, byteOffset, littleEndian ); - return ( b[ 1 ] << 8 ) | b[ 0 ]; - - }, - - getInt8: function ( byteOffset ) { - - return ( this.getUint8( byteOffset ) << 24 ) >> 24; - - }, - - getUint8: function ( byteOffset ) { - - return this._getBytes( 1, byteOffset )[ 0 ]; - - } - - }; - -} diff --git a/app/Resources/views/default/index.html.twig b/app/Resources/views/default/index.html.twig index aa88ca9..4355adc 100644 --- a/app/Resources/views/default/index.html.twig +++ b/app/Resources/views/default/index.html.twig @@ -1,76 +1,19 @@ {% extends 'base.html.twig' %} {% block body %} -
-
-
-

Welcome to Symfony {{ constant('Symfony\\Component\\HttpKernel\\Kernel::VERSION') }}

-
+ {{ dump(set) }} -
-

- - Your application is now ready. You can start working on it at: - {{ base_dir }} -

-
+
- - -
-
{% endblock %} -{% block stylesheets %} - + + + {% endblock %} diff --git a/app/Resources/views/parts/detail.html.twig b/app/Resources/views/parts/detail.html.twig index e626c3c..71b485e 100644 --- a/app/Resources/views/parts/detail.html.twig +++ b/app/Resources/views/parts/detail.html.twig @@ -2,6 +2,9 @@ {% block body %} + + {{ dump(part) }} + {{ dump(reb_part) }} {% endblock %} \ No newline at end of file diff --git a/app/Resources/views/sets/detail.html.twig b/app/Resources/views/sets/detail.html.twig index 4f9c062..e6326b8 100644 --- a/app/Resources/views/sets/detail.html.twig +++ b/app/Resources/views/sets/detail.html.twig @@ -4,4 +4,7 @@ {{ dump(set) }} + {% for part in parts %} + {{ dump(part) }} + {% endfor %} {% endblock %} \ No newline at end of file diff --git a/gulpfile.js b/gulpfile.js index 6b6b82b..e68c778 100644 --- a/gulpfile.js +++ b/gulpfile.js @@ -17,11 +17,33 @@ gulp.task('css', function() { .pipe(gulp.dest('web/resources/css')); }); +gulp.task('three', function() { + gulp.src([ + 'node_modules/three/build/three.js', + 'node_modules/three/examples/js/libs/stats.min.js', + 'node_modules/three/examples/js/loaders/STLLoader.js', + 'node_modules/three/examples/js/controls/TrackballControls.js', + ]) + .pipe(plugins.concat('three.js')) + .pipe(gulp.dest('web/resources/js')); + + gulp.src([ + 'node_modules/three/examples/js/libs/stats.min.js', + ]) + .pipe(plugins.concat('stats.js')) + .pipe(gulp.dest('web/resources/js')); + + gulp.src([ + 'app/Resources/assets/javascripts/ModelViewer.js', + ]) + .pipe(plugins.concat('ModelViewer.js')) + .pipe(gulp.dest('web/resources/js')); +}); + gulp.task('js', function() { return gulp.src([ 'node_modules/jquery/dist/jquery.js', 'app/Resources/assets/semantic/dist/semantic.js', - 'node_modules//three/build/three.js' ]) .pipe(plugins.concat('main.js')) .pipe(gulp.dest('web/resources/js')); diff --git a/src/AppBundle/Controller/DefaultController.php b/src/AppBundle/Controller/DefaultController.php index 5216afe..468f92c 100644 --- a/src/AppBundle/Controller/DefaultController.php +++ b/src/AppBundle/Controller/DefaultController.php @@ -5,17 +5,22 @@ namespace AppBundle\Controller; use Sensio\Bundle\FrameworkExtraBundle\Configuration\Route; use Symfony\Bundle\FrameworkBundle\Controller\Controller; use Symfony\Component\HttpFoundation\Request; +use Symfony\Component\HttpFoundation\Response; class DefaultController extends Controller { - /** - * @Route("/", name="homepage") - */ - public function indexAction(Request $request) - { - // replace this example code with whatever you need - return $this->render('default/index.html.twig', [ - 'base_dir' => realpath($this->getParameter('kernel.root_dir').'/..').DIRECTORY_SEPARATOR, - ]); - } + /** + * @Route("/", name="homepage") + */ + public function indexAction(Request $request) + { + $set = $this->get('doctrine.orm.entity_manager')->getRepository('AppBundle:BuildingKit')->findOneBy(['number' => '4488-1']); + + $part = $this->get('doctrine.orm.entity_manager')->getRepository('AppBundle:Part')->findOneBy(['number' => '3006']); + + return $this->render('default/index.html.twig', [ + 'set' => $set, + ]); + } + } diff --git a/src/AppBundle/Controller/PartsController.php b/src/AppBundle/Controller/PartsController.php index 07c9b1c..b5d19ac 100644 --- a/src/AppBundle/Controller/PartsController.php +++ b/src/AppBundle/Controller/PartsController.php @@ -15,10 +15,12 @@ class PartsController extends Controller */ public function detailAction($id) { - $part = $this->get('manager.rebrickable')->getPartById($id); + $rebrickable_part = $this->get('manager.rebrickable')->getPart($id); + $part = $this->get('app.collection_service')->getPart($id); return $this->render('parts/detail.html.twig', [ 'part' => $part, + 'reb_part' => $rebrickable_part, ]); } -} \ No newline at end of file +} diff --git a/src/AppBundle/Service/CollectionService.php b/src/AppBundle/Service/CollectionService.php index 8cdd0e3..c48a866 100644 --- a/src/AppBundle/Service/CollectionService.php +++ b/src/AppBundle/Service/CollectionService.php @@ -2,6 +2,7 @@ namespace AppBundle\Service; +use AppBundle\Api\Client\Rebrickable\Entity\Part; use AppBundle\Api\Client\Rebrickable\Rebrickable; use AppBundle\Api\Manager\BricksetManager; use Doctrine\ORM\EntityManager; @@ -36,4 +37,14 @@ class CollectionService $this->bricksetManager = $bricksetManager; $this->rebrickableManager = $rebrickableManager; } + + public function getSet($number) + { + return $this->em->getRepository('AppBundle:BuildingKit')->findOneBy(['number' => $number]); + } + + public function getPart($number) + { + return $this->em->getRepository('AppBundle:Part')->findOneBy(['number' => $number]); + } }