123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929 |
- IPE.app = {};
- IPE.helper = {};
- IPE.interceptors = {};
- String.prototype.endsWith = function(suffix) {
- return this.indexOf(suffix, this.length - suffix.length) !== -1;
- };
- Array.prototype.last = function() {
- return this[this.length-1];
- }
- IPE.app = {
- init : function(config) {
- var headerHeight = $('header').height();
- if($(window).height() < 500) {
- $("body").animate({ scrollTop: headerHeight }, "slow");
- }
- $.each(IPE.interceptors, function(index, interceptor) {
- interceptor.init();
- });
- Globals.init();
- IPE.app.initializeHelper();
- IPE.app.bindEvents();
- IPE.app.initData();
- tempRenderer = new THREE.WebGLRenderer();
- maximumTextureSize = tempRenderer.context.getParameter(tempRenderer.context.MAX_TEXTURE_SIZE);
- // we have to take an power of 2 less
- maximumTextureSize /= 2;
- if(config.defaultSize > maximumTextureSize) {
- config.defaultSize = maximumTextureSize;
- }
- // Getting info file
- $.ajax({
- url: infoUrl + config.defaultSize,
- success: function (data) {
- textureInfo = data;
- originalSizeArray[0] = textureInfo.originalSize.sizex;
- originalSizeArray[1] = textureInfo.originalSize.sizey;
- originalSizeArray[2] = textureInfo.originalSize.sizez;
- imgInfo = data.info;
- currentVolumeDimension.xmin = 0;
- currentVolumeDimension.xmax = textureInfo.originalSize.sizex;
- currentVolumeDimension.ymin = 0;
- currentVolumeDimension.ymax = textureInfo.originalSize.sizey;
- currentVolumeDimension.zmin = imgInfo.imgMin;
- currentVolumeDimension.zmax = imgInfo.imgMax;
- // downloading first image and starting
- helper.downloadImage(spriteUrl + textureInfo.sprites[0][0].$oid, 0, 0, true);
- $(document).trigger('basicsReady');
- },
- dataType: 'json'
- });
- container = document.getElementById( 'container' );
- $container = $(container);
- containerHeader = document.getElementById( 'container-header' );
- $containerHeader = $(containerHeader);
- containerOverview = document.getElementById('container-overview');
- $containerOverview = $(containerOverview);
- statsHelper = new StatsHelper($containerHeader.children('#container-stats'));
- // until now, it has to be initialized here, needs a new internal structure
- zoomHelper = new ZoomHelper();
- $(window).on('scroll', function(e) {
- if($(this).scrollTop() >= headerHeight) {
- $container.css('position', 'relative');
- $container.css('top', $(this).scrollTop() - headerHeight);
- } else {
- $container.css('top', 0);
- }
- });
- },
- initializeHelper: function() {
- helper = new Helper();
- geometryHelper = new GeometryHelper();
- stepHelper = new StepHelper();
- overviewHelper = new OverviewHelper();
- transferHelper = new TransferHelper();
- opacityPlotter = new OpacityPlotter();
- },
- initData: function() {
- volumeId = $('#volumeId').val();
- $resSpan = $('span#currentRes');
- volumeUrl = IPE.util.buildUrl('volumes/' + volumeId + '/');
- infoUrl = volumeUrl + 'texture-info/';
- spriteUrl = volumeUrl + 'sprite/';
- waitDiv = $('div#wait');
- helper.initializeShaders(IPE.util.buildUrl('static/shaders/three-shader.vert'), function(script) {
- vertexShader = script
- });
- helper.initializeShaders(IPE.util.buildUrl('static/shaders/three-shader-simple.frag'), function(script) {
- fragmentSimleShader = script
- });
- helper.initializeShaders(IPE.util.buildUrl('static/shaders/three-shader.frag'), function(script) {
- fragmentShader = script
- });
- },
- bindEvents : function() {
- $(document).on('firstImageOnLoad',function (e, firstImageParams){
- initTextures(imgInfo, firstImageParams, true);
- initFrameControls();
- stepHelper.initStepControls();
- initSliders();
- });
- $(document).on('imageOnLoad', function(e, imageParams) {
- initTextures(imgInfo, imageParams, false);
- if(useDownloadedTextureImmediately) {
- updateTexture();
- useDownloadedTextureImmediately = false;
- updateFrameControls();
- }
- });
- $(document).on('firstFrameSpritesCompleted', function() {
- init();
- addResolutionLinks();
- overviewHelper.initOverview(containerOverview);
- animate();
- });
- showPopup = false;
- $('#save-canvas').click(function(e, params) {
- if(params != undefined && params.source != undefined && params.source == 'animate-function') {
- window.open(params.imageUrl);
- return false;
- } else {
- saveImage = true;
- return false;
- }
- });
- $(window).on('resize', function() {
- var rendererSizeHolder = calculateWidthHeight();
- width = rendererSizeHolder.width.px;
- height = rendererSizeHolder.height.px;
- cameraRTT.aspect = width / height;
- cameraRTT.updateProjectionMatrix();
- camera.aspect = width / height;
- camera.updateProjectionMatrix();
- renderer.setSize( width, height );
- renderer.domElement.style.width = rendererSizeHolder.width.percent + '%';
- renderer.domElement.style.height = rendererSizeHolder.height.percent + '%';
- });
- $resolutionLinks.on('click', 'a', function(e) {
- e.preventDefault();
- e.stopPropagation();
- var $this = $(this);
- if($this.attr('href') == undefined) {
- return false;
- }
- requestedSize = $this.attr('data');
- $('.res-link').each(function(index, value) {
- var $value = $(value);
- $value.attr('href', '#');
- });
- $this.removeAttr('href');
- $.ajax({
- // todo test after remove of sync flag
- url: infoUrl + requestedSize,
- success: function (data) {
- framesDownloaded = 0;
- textures = {};
- currentTexture = 0;
- textureInfo = data;
- imgInfo = data.info;
- imgMin = imgInfo.imgMin;
- imgMax = imgInfo.imgMax;
- useDownloadedTextureImmediately = true;
- helper.downloadImage(spriteUrl + textureInfo.sprites[0][0].$oid, 0, 0, false);
- $resSpan.text(requestedSize);
- if($('input#hide-content-small-devices').is(':visible')) {
- $('input#hide-content-small-devices').trigger('click');
- }
- },
- dataType: 'json'
- });
- return false;
- });
- $('div.controls').on('click', function() {
- var $this = $(this),
- bottomControlsContainer = $('div#bottom-controls-container'),
- bottomControls = $('div#bottom-controls'),
- filledById = '',
- thisControlHolder = null;
- filledById = hideBottomControlsContainer();
- if(filledById === $this.attr('id')) {
- return;
- }
- thisControlHolder = $this.children('.control-holder')[0];
- thisControlHolder = $(thisControlHolder);
- bottomControls.append(thisControlHolder.children());
- bottomControls.attr('filledBy', $this.attr('id'));
- bottomControlsContainer.removeClass('hidden');
- // inform, that it is showed
- $this.trigger('controlsShowed');
- });
- $('input#hide-bottom-controls-container').on('click', function() {
- hideBottomControlsContainer();
- });
- $('div#menu-buttons-small-devices input').on('click', function() {
- var $this = $(this),
- target = $this.attr('data'),
- $target = $('#' + target),
- $overlay = $('div#overlay-small-devices'),
- $content = $('div#content-small-devices');
- $overlay.attr('source', target);
- $content.append($target.children());
- $overlay.show();
- });
- $('input#hide-content-small-devices').on('click', function() {
- var $overlay = $('div#overlay-small-devices'),
- $content = $('div#content-small-devices'),
- source = $overlay.attr('source'),
- $source = $('#' + source);
- $overlay.hide();
- $overlay.attr('source', '');
- $source.append($content.children());
- });
- var buttonAdvCons = $('input#show-adv-con');
- buttonAdvCons.on('click', function() {
- var advCons = $('div#advanced-controls');
- if(advCons.hasClass('hidden')) {
- advCons.removeClass('hidden');
- buttonAdvCons.val('hide adv cons');
- } else {
- advCons.addClass('hidden');
- buttonAdvCons.val('show adv cons');
- }
- });
- $(document).on('initFinished', function() {
- $canvas.addClass('context-menu');
- $.contextMenu({
- selector: 'canvas.context-menu',
- callback: function(key, options) {
- if(key === 'save') {
- saveImage = true;
- }
- },
- items: {
- "save": {name: "Open image in new tab"}
- }
- });
- });
- }
- }
- function initTextures(imgInfo, imageParams, whileInit) {
- // set initial array to index
- if(textures[imageParams.textureIndex] == undefined
- || textures[imageParams.textureIndex] == null) {
- textures[imageParams.textureIndex] = [];
- }
- // using texture
- texture = initTexture(imageParams.texture);
- textures[imageParams.textureIndex].push(texture);
- // fetch new sprites of same time frame
- if(imageParams.spriteIndex < imgInfo.numberOfSprites - 1) {
- nextSpriteIndex = imageParams.spriteIndex + 1;
- nextSpriteId = textureInfo.sprites[imageParams.textureIndex][nextSpriteIndex].$oid
- helper.downloadImage(spriteUrl + nextSpriteId, imageParams.textureIndex, nextSpriteIndex, whileInit);
- return;
- }
- // inform the rest, that the first frame is loaded completely
- if(whileInit && imageParams.textureIndex == 0) {
- $(document).trigger('firstFrameSpritesCompleted');
- }
- // todo some logic
- if(!imgInfo.multipleFrames) {
- currentTexture = 0;
- return;
- } else {
- var numberOfFrames = Object.keys(textureInfo.sprites).length,
- nextIndex = null,
- nextFrameName = null,
- nextFramePath = null;
- framesDownloaded++;
- if(framesDownloaded == 1) {
- currentTexture = 0;
- }
- currentMaxFrame = imgInfo.frameFrom + framesDownloaded - 1;
- if(framesDownloaded > 1) {
- // updating frame control maximums
- updateFrameControlsMaxFrame();
- }
- if(numberOfFrames == framesDownloaded) {
- return;
- } else {
- nextIndex = framesDownloaded;
- nextFrameName = textureInfo.sprites[nextIndex][0].$oid;
- var framePath = spriteUrl + nextFrameName;
- helper.downloadImage(framePath, nextIndex, false);
- }
- }
- }
- function initTexture(texture) {
- texture.magFilter = THREE.LinearFilter;
- texture.minFilter = THREE.LinearFilter;
- texture.needsUpdate = true;
- return texture;
- }
- function getCurrentTexture() {
- return textures[currentTexture];
- }
- function useFrameControls() {
- return (imgInfo.multipleFrames && (imgInfo.frameTo - imgInfo.frameFrom) != 0);
- }
- function initFrameControls() {
- if(!useFrameControls()) {
- return;
- }
- $('#frame-controls').removeClass('hidden');
- var $frameSlider = $('#frame-slider'),
- $playButton = $('#frame-play'),
- $pauseButton = $('#frame-pause'),
- $currentFrameInput = $('#currentFrame'),
- playId = $playButton.attr('id'),
- pauseId = $pauseButton.attr('id'),
- minFrame = imgInfo.frameFrom;
- $currentFrameInput.val(minFrame);
- var play = function() {
- if(Object.keys(textures).length == 1) {
- console.warn('only one texture loaded, can not play yet');
- return;
- }
- $playButton.addClass('hidden');
- $pauseButton.removeClass('hidden');
- playFrames = true;
- $frameSlider.slider({disabled: true});
- $currentFrameInput.prop('disabled', true);
- }
- var pause = function() {
- $playButton.removeClass('hidden');
- $pauseButton.addClass('hidden');
- playFrames = false;
- $frameSlider.slider({disabled: false});
- $currentFrameInput.prop('disabled', false);
- }
- $('.frame-button').click(function() {
- var $this = $(this),
- thisId = $this.attr('id');
- if(thisId == playId) {
- play();
- } else if(thisId == pauseId) {
- pause();
- }
- });
- $(document).on('zoomActionFinished', function(e, params) {
- zoomedIn = params.zoomAction == 'zoomIn';
- if(zoomedIn) {
- pause();
- currentTexture = minFrame + params.textureNumber;
- updateFrameControls();
- $frameSlider.slider({disabled: true});
- $currentFrameInput.prop('disabled', true);
- $playButton.prop('disabled', true);
- $pauseButton.prop('disabled', true);
- } else {
- $frameSlider.slider({disabled: false});
- $currentFrameInput.prop('disabled', false);
- $playButton.prop('disabled', false);
- $pauseButton.prop('disabled', false);
- }
- });
- $frameSlider.slider(
- {
- min: minFrame,
- max: currentMaxFrame,
- slide: function( event, ui ) {
- currentTexture = ui.value - minFrame;
- updateTexture();
- $currentFrameInput.val(ui.value);
- }
- }
- );
- $currentFrameInput.change(function() {
- var value = parseInt($(this).val());
- if(value >= imgInfo.frameFrom && currentMaxFrame >= value) {
- currentTexture = value - minFrame;
- updateTexture();
- $frameSlider.slider('value', value);
- } else {
- $(this).val($frameSlider.slider('value'));
- }
- });
- }
- function updateFrameControlsMaxFrame() {
- if(!useFrameControls()) {
- return;
- }
- var $frameSlider = $('#frame-slider');
- $frameSlider.slider('option', 'max', currentMaxFrame);
- }
- function updateFrameControls() {
- if(!useFrameControls()) {
- return;
- }
- var $frameSlider = $('#frame-slider'),
- $currentFrameInput = $('#currentFrame'),
- minFrame = imgInfo.frameFrom,
- value = currentTexture + minFrame;
- $frameSlider.slider('value', value);
- $currentFrameInput.val(value);
- }
- function init() {
- rendererSizeHolder = calculateWidthHeight();
- width = rendererSizeHolder.width.px;
- height = rendererSizeHolder.height.px;
- //width = window.innerWidth;
- //height = window.innerHeight;
- camera = new THREE.PerspectiveCamera( 45, width / height, .1, 1000 );
- camera.position.z = 2;
- cameraRTT = new THREE.PerspectiveCamera( 45, width / height, .1, 1000 );
- cameraRTT.position.z = 2;
- scene = new THREE.Scene();
- sceneRTT = new THREE.Scene();
- rtTexture = new THREE.WebGLRenderTarget( width, height, { minFilter: THREE.LinearFilter, magFilter: THREE.LinearFilter, format: THREE.RGBAFormat } );
- var geometry = geometryHelper.createBoxGeometry(originalDimension, currentVolumeDimension);
- var attributes = {
- frontColor: {type: 'c', value: [] }
- }
- material = new THREE.ShaderMaterial({
- attributes: attributes,
- vertexShader: vertexShader,
- fragmentShader: fragmentSimleShader,
- side: THREE.FrontSide
- });
- var spriteMaps = getCurrentTexture();
- var transferImageData = transferHelper.getCurrentTransferFunction();
- var transferTexture = new THREE.Texture(transferImageData);
- transferTexture.needsUpdate = true;
- var uniforms = {
- tBackground: {type: 't', value: rtTexture},
- tvSlices: {type: 'tv', value: spriteMaps},
- tTransfer: { type: 't', value: transferTexture},
- steps: {type: 'f', value: 100},
- numberOfSlices: {type: 'f', value: imgInfo.numberOfSlices },
- numberOfSprites: {type: 'f', value: imgInfo.numberOfSprites },
- slicesPerSprite: {type: 'f', value: imgInfo.slicesPerSprite },
- slicesOverX: {type: 'f', value: imgInfo.slicesOverX },
- slicesOverY: {type: 'f', value: imgInfo.slicesOverY },
- };
- materialScreen = new THREE.ShaderMaterial({
- attributes: attributes,
- uniforms: uniforms,
- vertexShader: vertexShader,
- fragmentShader: fragmentShader,
- side: THREE.BackSide,
- transparent: true
- });
- backgroundBox = new THREE.Mesh(geometry, material);
- sceneRTT.add(backgroundBox);
- frontBox = new THREE.Mesh(geometry, materialScreen);//
- scene.add(frontBox);
- objectsToIntersect.push(frontBox);
- translateBoxes(-0.5, -0.5, -0.5);
- rotateBoxesX(Math.PI / -2);
- //rotateBoxesY(Math.PI);
- //rotateBoxesZ(Math.PI);
- renderer = new THREE.WebGLRenderer();
- renderer.setSize(width, height);
- renderer.domElement.style.width = rendererSizeHolder.width.percent + '%';
- renderer.domElement.style.height = rendererSizeHolder.height.percent + '%';
- renderer.setClearColor(0xffffff, 1);
- container.appendChild(renderer.domElement);
- $canvas = $('canvas', $container);
- controls1 = new THREE.OrbitControls( camera, renderer.domElement );
- controls1.damping = 0.2;
- controls2 = new THREE.OrbitControls( cameraRTT, renderer.domElement );
- controls2.damping = 0.2;
- rendererContext = renderer.context;
- raycaster = new THREE.Raycaster();
- $(document).trigger('initFinished');
- }
- function rotateBoxesX(radian) {
- rotationMatrix = new THREE.Matrix4().makeRotationX(radian);
- rotateBoxes(rotationMatrix);
- }
- function rotateBoxesY(radian) {
- rotationMatrix = new THREE.Matrix4().makeRotationY(radian);
- rotateBoxes(rotationMatrix);
- }
- function rotateBoxesZ(radian) {
- rotationMatrix = new THREE.Matrix4().makeRotationZ(radian);
- rotateBoxes(rotationMatrix);
- }
- function rotateBoxes(matrix) {
- backgroundBox.applyMatrix(rotationMatrix);
- frontBox.applyMatrix(rotationMatrix);
- }
- function translateBoxes(x, y, z) {
- translationMatrix = new THREE.Matrix4().makeTranslation(x, y, z);
- backgroundBox.applyMatrix(translationMatrix);
- frontBox.applyMatrix(translationMatrix);
- }
- function initSliders() {
- initLayerSliders();
- // init gray value slider
- GenericSlider.initSlider(
- slider = $( "#gray-slider" ),
- sliderInputs = $('input.gray'),
- minGray,
- maxGray,
- function(values) {
- $(document).trigger(
- 'opacityBordersChanged',
- {
- minGray: values[0],
- maxGray : values[1]
- }
- );
- }
- );
- $('#gray-slider-container').on('controlsShowed', function() {
- var values = $("#gray-slider").slider('values');
- $(document).trigger('opacityBordersChanged', { minGray: values[0], maxGray: values[1] });
- });
- GenericSlider.initSimpleSlider(
- slider = $('#background-slider'),
- sliderInput = $('#background-input'),
- startVal = 255,
- 0,
- 255,
- function(value) {
- var colorFloat = calculateGrayFloat(value);
- renderer.setClearColor(
- new THREE.Color(colorFloat, colorFloat, colorFloat),
- 1
- );
- }
- );
- }
- function initLayerSliders() {
- // init xlayer slider
- GenericSlider.initSlider(
- $( "#xlayer-slider" ),
- sliderInputs = $('input.xlayer'),
- currentVolumeDimension.xmin,
- currentVolumeDimension.xmax,
- function(values) {
- dimMin = currentVolumeDimension.xmin;
- dimMax = currentVolumeDimension.xmax;
- currentDimension.xmin = calculateLayerFloat(values[0], dimMin, dimMax);
- currentDimension.xmax = calculateLayerFloat(values[1], dimMin, dimMax);
- updateCubeLayers(currentDimension);
- },
- function() {
- values = Array(2);
- values[0] = calculateLayerInt(currentDimension.xmin, currentVolumeDimension.xmin, currentVolumeDimension.xmax );
- values[1] = calculateLayerInt(currentDimension.xmax, currentVolumeDimension.xmin, currentVolumeDimension.xmax );
- return values;
- }
- );
- // init ylayer slider
- GenericSlider.initSlider(
- $( "#ylayer-slider" ),
- sliderInputs = $('input.ylayer'),
- currentVolumeDimension.ymin,
- currentVolumeDimension.ymax,
- function(values) {
- dimMin = currentVolumeDimension.ymin;
- dimMax = currentVolumeDimension.ymax;
- currentDimension.ymin = calculateLayerFloat(values[0], dimMin, dimMax);
- currentDimension.ymax = calculateLayerFloat(values[1], dimMin, dimMax);
- updateCubeLayers(currentDimension);
- },
- function() {
- values = Array(2);
- values[0] = calculateLayerInt(currentDimension.ymin, currentVolumeDimension.ymin, currentVolumeDimension.ymax );
- values[1] = calculateLayerInt(currentDimension.ymax, currentVolumeDimension.ymin, currentVolumeDimension.ymax );
- return values;
- }
- );
- // init zlayer slider
- GenericSlider.initSlider(
- $( "#zlayer-slider" ),
- sliderInputs = $('input.zlayer'),
- currentVolumeDimension.zmin,
- currentVolumeDimension.zmax,
- function(values) {
- dimMin = currentVolumeDimension.zmin;
- dimMax = currentVolumeDimension.zmax;
- currentDimension.zmin = calculateLayerFloat(values[0], dimMin, dimMax),
- currentDimension.zmax = calculateLayerFloat(values[1], dimMin, dimMax);
- updateCubeLayers(currentDimension);
- },
- function() {
- values = Array(2);
- values[0] = calculateLayerInt(currentDimension.zmin, currentVolumeDimension.zmin, currentVolumeDimension.zmax );
- values[1] = calculateLayerInt(currentDimension.zmax, currentVolumeDimension.zmin, currentVolumeDimension.zmax );
- return values;
- }
- );
- }
- function repositionLayerSliders() {
- initLayerSliders();
- $.each($('.slider.layer'), function(index, value) {
- $(value).trigger('reposition');
- });
- updateCubeLayers(currentDimension);
- }
- var prevTime = Date.now();
- var fps = 0;
- var frames = 0;
- function animate() {
- requestAnimationFrame( animate );
- $container.trigger('animation');
- var numberOfTextures = Object.keys(textures).length;
- var now = Date.now();
- frames++;
- if(now > prevTime + 1000) {
- fps = (frames * 1000) / (now - prevTime);
- if(adjustSteps) {
- if(fps < 10) {
- stepHelper.decreaseSteps();
- } else if(fps > 15) {
- stepHelper.increaseSteps();
- }
- }
- prevTime = now;
- frames = 0;
- }
- if(playFrames && numberOfTextures > 1) {
- var timeStamp = (new Date()).getTime();
- if(timeStamp - textureTimestamp > 400) {
- currentTexture++;
- if(currentTexture >= numberOfTextures) {
- currentTexture = 0;
- }
- updateTexture();
- textureTimestamp = timeStamp;
- updateFrameControls();
- }
- }
- if(nextCubeDeletionTimeStamp == null && intersectCubesTimeStamps.length != 0) {
- nextCubeDeletionTimeStamp = intersectCubesTimeStamps.shift();
- }
- if((Date.now() - nextCubeDeletionTimeStamp) > 1500) {
- cubeToDelete = intersectCubes.shift();
- scene.remove(cubeToDelete);
- nextCubeDeletionTimeStamp = null;
- }
- if(transferHelper.transferFunctionChanged()) {
- var transfer = new THREE.Texture(transferHelper.getCurrentTransferFunction());
- transfer.needsUpdate = true;
- materialScreen.uniforms.tTransfer.value = transfer;
- }
- cameraPoint = camera.position.clone();
- overviewHelper.updateCameraPosition(cameraPoint);
- statsHelper.update();
- controls1.update();
- controls2.update();
- render();
- if(saveImage) {
- $('#save-canvas').trigger('click', { source: 'animate-function', imageUrl: renderer.domElement.toDataURL() });
- saveImage = false;
- }
- }
- function updateTexture(textures) {
- if(textures == undefined || textures == null) {
- textures = getCurrentTexture();
- }
- $.each(textures, function(index, texture) {
- value.needsUpdate = true;
- });
- materialScreen.uniforms.tvSlices.value = textures;
- }
- function render() {
- renderer.clear();
- renderer.context.clearDepth(-50.0);
- renderer.context.depthFunc(renderer.context.GEQUAL);
- renderer.render(sceneRTT, cameraRTT, rtTexture, true);
- renderer.context.clearDepth(50.0);
- renderer.context.depthFunc(renderer.context.LEQUAL);
- renderer.render(scene, camera);
- overviewHelper.render();
- }
- function updateCubeLayers(geometryDimension) {
- var geometry = geometryHelper.createBoxGeometry(geometryDimension, currentVolumeDimension);
- var colorArray = geometry.attributes.frontColor.array,
- positionArray = geometry.attributes.position.array;
- frontBox.geometry.attributes.frontColor.array = colorArray;
- frontBox.geometry.attributes.frontColor.needsUpdate = true;
- frontBox.geometry.attributes.position.array = positionArray;
- frontBox.geometry.attributes.position.needsUpdate = true;
- }
- // invert function of calculateLayerFloat
- function calculateLayerInt(position, dimMin, dimMax) {
- if(position <= 0.005) {
- return dimMin;
- }
- if(position >= 0.995) {
- return dimMax;
- }
- value = Math.round(position * (dimMax - dimMin) + dimMin);
- return value;
- }
- // calculate the float value for a layer input integer
- // 150 of [0, 299] will be 0.5
- function calculateLayerFloat(value, dimMin, dimMax) {
- var floatVal = (value - dimMin) / (dimMax - dimMin);
- if (floatVal == 0) {
- return 0.005;
- }
- if (floatVal == 1) {
- return 0.995;
- }
- return floatVal;
- }
- function calculateGrayFloat(value) {
- return value / 255.0;
- }
- function distance (v1, v2) {
- dx = v1.x - v2.x;
- dy = v1.y - v2.y;
- dz = v1.z - v2.z;
- return Math.sqrt(dx*dx+dy*dy+dz*dz);
- }
- function calculateWidthHeight() {
- downScaleFactor = 0.66;
- valueholder = {
- height: {},
- width: {}
- }
- containerHeight = $container.height();
- volumeInfoHeight = $('#volume-information').height();
- headerHeight = $('header').height();
- valueholder.height.px = (containerHeight - volumeInfoHeight) * downScaleFactor;
- volumeInfoHeightPercent = Math.floor(volumeInfoHeight / containerHeight * 100);
- valueholder.height.percent = 100 - volumeInfoHeightPercent;
- valueholder.width.px = $container.width() * downScaleFactor;
- valueholder.width.percent = 100;
- return valueholder;
- }
- function hideBottomControlsContainer() {
- var bottomControlsContainer = $('div#bottom-controls-container'),
- bottomControls = $('div#bottom-controls'),
- filledById = bottomControls.attr('filledBy'),
- filledBy = $('#' + filledById);
- // writing data back to original, because append MOVES the children
- if(filledBy.length == 1) {
- filledBy = $(filledBy[0]);
- filledByControlHolder = filledBy.children('.control-holder')[0];
- $(filledByControlHolder).append(bottomControls.children());
- }
- bottomControls.attr('filledBy', '');
- bottomControlsContainer.addClass('hidden');
- return filledById;
- }
- function addResolutionLinks() {
- $resSpan.text(config.defaultSize);
- textureSizes = config.textureSizes;
- textureSizes.forEach(function(size) {
- if(size > maximumTextureSize) {
- return;
- }
- href = size == config.defaultSize ? '' : 'href="#"';
- $resolutionLinks.append('<a '+href+' class="res-link" data="'+size+'">'+size+'</a> ');
- });
- }
|