diff --git a/examples/example/games/planky.js b/examples/example/games/planky.js index 5232201449..6733749317 100644 --- a/examples/example/games/planky.js +++ b/examples/example/games/planky.js @@ -65,7 +65,7 @@ SettingsWindow = function() { case 'loaded': _this.sendData({action: 'load', options: _this.plankyStack.options.getJSON()}) break; - case 'value_change': + case 'value-change': _this.plankyStack.onValueChanged(data.option, data.value); break; case 'factory-reset': @@ -148,6 +148,7 @@ PlankyStack = function() { this.ground = false; this.editLines = []; this.options = new PlankyOptions(); + this.deRez = function() { _this.planks.forEach(function(plank) { Entities.deleteEntity(plank.entity); @@ -159,13 +160,14 @@ PlankyStack = function() { _this.editLines.forEach(function(line) { Entities.deleteEntity(line); }) + _this.editLines = []; if (_this.centerLine) { Entities.deleteEntity(_this.centerLine); } _this.ground = false; _this.centerLine = false; - _this.editLines = []; }; + this.rez = function() { if (_this.planks.length > 0) { _this.deRez(); @@ -192,7 +194,7 @@ PlankyStack = function() { } // move ground to rez position/rotation Entities.editEntity(_this.ground, {dimensions: _this.options.baseDimension, position: Vec3.sum(_this.basePosition, {y: -(_this.options.baseDimension.y / 2)}), rotation: _this.baseRotation}); - } + }; var refreshLines = function() { if (_this.editLines.length === 0) { @@ -206,7 +208,8 @@ PlankyStack = function() { })); return; } - } + }; + var trimDimension = function(dimension, maxIndex) { _this.planks.forEach(function(plank, index, object) { if (plank[dimension] > maxIndex) { @@ -215,6 +218,7 @@ PlankyStack = function() { } }); }; + var createOrUpdate = function(layer, row) { var found = false; var layerRotated = layer % 2 === 0; @@ -256,17 +260,19 @@ PlankyStack = function() { _this.planks.push({layer: layer, row: row, entity: Entities.addEntity(newProperties)}) } }; + this.onValueChanged = function(option, value) { _this.options[option] = value; if (['numLayers', 'blocksPerLayer', 'blockSize', 'blockSpacing', 'blockHeightVariation'].indexOf(option) !== -1) { _this.refresh(); } }; + this.refresh = function() { refreshGround(); refreshLines(); - trimDimension('layer', _this.options.numLayers); - trimDimension('row', _this.options.blocksPerLayer); + trimDimension('layer', _this.options.numLayers - 1); + trimDimension('row', _this.options.blocksPerLayer - 1); _this.offsetRot = Quat.multiply(_this.baseRotation, Quat.fromPitchYawRollDegrees(0.0, _this.options.blockYawOffset, 0.0)); for (var layer = 0; layer < _this.options.numLayers; layer++) { for (var row = 0; row < _this.options.blocksPerLayer; row++) { @@ -280,6 +286,7 @@ PlankyStack = function() { }); } }; + this.isFound = function() { //TODO: identify entities here until one is found return _this.planks.length > 0; diff --git a/examples/html/plankySettings.html b/examples/html/plankySettings.html index 0a79df6c7b..0eea4948ad 100644 --- a/examples/html/plankySettings.html +++ b/examples/html/plankySettings.html @@ -42,10 +42,11 @@ PropertyInput = function(key, label, value, attributes) { }; var valueChangeHandler = function() { + sendWebEvent({ - action: 'value_change', - option: $(this).attr('name'), - value: properties[$(this).attr('name')].getValue() + action: 'value-change', + option: $(this).data('var-name'), + value: properties[$(this).data('var-name')].getValue() }); }; @@ -55,14 +56,14 @@ NumberInput = function(key, label, value, attributes) { NumberInput.prototype = Object.create(PropertyInput.prototype); NumberInput.prototype.constructor = NumberInput; NumberInput.prototype.createValue = function() { - this.input = $('').attr('name', this.key).attr('type', 'number').val(this.value).on('change', valueChangeHandler); + this.input = $('').data('var-name', this.key).attr('name', this.key).attr('type', 'number').val(this.value).on('change', valueChangeHandler); if (this.attributes !== undefined) { this.input.attr(this.attributes); } return this.input; }; NumberInput.prototype.getValue = function() { - return this.input.val(); + return parseFloat(this.input.val()); }; CoordinateInput = function(key, label, value, attributes) { @@ -71,9 +72,9 @@ CoordinateInput = function(key, label, value, attributes) { CoordinateInput.prototype = Object.create(PropertyInput.prototype); CoordinateInput.prototype.constructor = CoordinateInput; CoordinateInput.prototype.createValue = function() { - this.inputX = $('').attr('name', this.key + '-x').attr('type', 'number').addClass('coord').val(this.value.x); - this.inputY = $('').attr('name', this.key + '-y').attr('type', 'number').addClass('coord').val(this.value.y); - this.inputZ = $('').attr('name', this.key + '-z').attr('type', 'number').addClass('coord').val(this.value.z); + this.inputX = $('').data('var-name', this.key).attr('name', this.key + '-x').attr('type', 'number').addClass('coord').val(this.value.x).on('change', valueChangeHandler); + this.inputY = $('').data('var-name', this.key).attr('name', this.key + '-y').attr('type', 'number').addClass('coord').val(this.value.y).on('change', valueChangeHandler); + this.inputZ = $('').data('var-name', this.key).attr('name', this.key + '-z').attr('type', 'number').addClass('coord').val(this.value.z).on('change', valueChangeHandler); if (this.attributes !== undefined) { this.inputX.attr(this.attributes); this.inputY.attr(this.attributes); @@ -82,7 +83,7 @@ CoordinateInput.prototype.createValue = function() { return [encapsulateInput(this.inputX, 'X'), encapsulateInput(this.inputY, 'Y'), encapsulateInput(this.inputZ, 'Z')]; }; CoordinateInput.prototype.getValue = function() { - return {x: this.inputX.val(), y: this.inputY.val(), z: this.inputZ.val()}; + return {x: parseFloat(this.inputX.val()), y: parseFloat(this.inputY.val()), z: parseFloat(this.inputZ.val())}; }; function encapsulateInput(input, label) { return $('
').addClass('input-area').append(label + ' ').append(input); @@ -95,7 +96,6 @@ function addHeader(label) { $(function() { addHeader('Stack Settings'); properties['numLayers'] = new NumberInput('numLayers', 'Layers', 17, {'min': 0, 'max': 300, 'step': 1}); - properties['baseDimension'] = new CoordinateInput('baseDimension', 'Base dimension', {x: 7, y: 2, z: 7}, {'min': 0.5, 'max': 200, 'step': 0.1}); properties['blocksPerLayer'] = new NumberInput('blocksPerLayer', 'Blocks per layer', 4, {'min': 1, 'max': 100, 'step': 1}); properties['blockSize'] = new CoordinateInput('blockSize', 'Block size', {x: 0.2, y: 0.1, z: 0.8}, {'min': 0.05, 'max': 20, 'step': 0.1}); properties['blockSpacing'] = new NumberInput('blockSpacing', 'Block spacing', properties['blockSize'].getValue().x / properties['blocksPerLayer'].getValue(), {'min': 0, 'max': 20, 'step': 0.01}); @@ -114,6 +114,7 @@ $(function() { addHeader('Spawn Settings'); properties['spawnDistance'] = new NumberInput('spawnDistance', 'Spawn distance (meters)', 3); properties['blockYawOffset'] = new NumberInput('blockYawOffset', 'Block yaw offset (degrees)', 45, {'min': 0, 'max': 360, 'step': 1}); + properties['baseDimension'] = new CoordinateInput('baseDimension', 'Base dimension', {x: 7, y: 2, z: 7}, {'min': 0.5, 'max': 200, 'step': 0.1}); addHeader('Actions'); $('#properties-list') .append($('').val('factory reset').attr('type', 'button').on('click', function() { sendWebEvent({action: 'factory-reset'}); }))