Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
3D Camera Record for ArcGIS JS API 4.0beta1
define([
'dojo/_base/declare',
'dojo/on',
'dojo/dom-class',
'dijit/_WidgetBase',
'dijit/_TemplatedMixin',
'esri/core/watchUtils',
'esri/core/Scheduler',
'dojo/text!./templates/widget.html',
'xstyle/css!./css/widget.css'
], function(
declare, on, domClass, _WidgetBase, _TemplatedMixin,
watchUtils, Scheduler,
template
) {
var CameraRecorder = declare([_WidgetBase, _TemplatedMixin], {
templateString: template,
constructor: function() {
this.cameras = [null];
this.timer = null;
this.watcher = null;
this.handler = null;
this.intervalID = null;
this.isPlaying = false;
},
clear: function() {
if (this.watcher) {
this.watcher.remove();
}
if (this.handler) {
this.handler.remove();
}
if (this.timer) {
this.timer.remove();
}
this.recordStart();
},
recordStart: function() {
if (this.isPlaying || this.isPaused) {
return;
}
this.timer = Scheduler.schedule(function() {
this._cameraWatch();
this._sliderWatch();
}.bind(this));
},
play: function() {
if (this.isPlaying) {
return;
}
domClass.toggle(this.playBtn, 'btn-info btn-success');
this._play(false);
},
stop: function() {
this.isPaused = !this.isPaused;
domClass.toggle(this.stopBtn, 'btn-info btn-danger');
if (!this.isPaused) {
this.recordStart();
}
},
playReverse: function() {
if (this.isPlaying) {
return;
}
domClass.toggle(this.reverseBtn, 'btn-info btn-success');
this._play(true);
},
_cameraWatch: function() {
var view = this.get('view');
var cameras = this.cameras;
var slider = this.slider;
this.watcher = view.watch('camera', function(val) {
cameras.push(val.clone());
slider.max = slider.value = cameras.length;
this.clear();
}.bind(this));
},
_sliderWatch: function() {
var view = this.get('view');
var cameras = this.cameras;
this.handler = on(this.slider, 'input', function(e) {
var val = parseInt(e.target.value);
view.camera = cameras[val] || view.camera.clone();
this.clear();
}.bind(this));
},
_play: function(inReverse) {
this.isPlaying = true;
var intervalID = this.intervalID;
var slider = this.slider;
var view = this.view;
var cameras = this.cameras;
var len = cameras.length;
var i = 0;
intervalID = setInterval(function() {
if (!inReverse) {
slider.value = i;
view.camera = cameras[i++] || view.camera.clone();
if (i === len) {
clearInterval(intervalID);
domClass.toggle(this.playBtn, 'btn-info btn-success');
this.isPlaying = false;
this.recordStart();
}
} else {
slider.value = len;
view.camera = cameras[len--] || view.camera.clone();
if (len < 1) {
clearInterval(intervalID);
domClass.toggle(this.reverseBtn, 'btn-info btn-success');
this.isPlaying = false;
this.recordStart();
}
}
}.bind(this), 15);
}
});
return CameraRecorder;
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment