CV.UI.deinit

[vsuhachev]

How to deinit CaveView? I am using Turbolinks library and seems to CV.UI.init is working only for first call. Removing div#scene is not helps

[aardgoose]

What are you trying to achieve call init() twice? It wasn't designed to be multiple times on a single page.

[vsuhachev]

I am using https://github.com/turbolinks/turbolinks on my site. It retrieve pages with xhr and replace body at existent page instead of full reload. Turbolinks fires event when body is replaced and CV.UI.init called multiple times to initialize #scene container. Would be great to split CV.UI.init to CV initialization and init/deinit of #scene container

[aardgoose]

OK, no a library I've used before, I'll look at how feasible it is to split things out.

[aardgoose]

Second thoughts,

if you keep a reference to your container object

, you can then add this back to the DOM after the new body and contents have been replaced. Tested here and works for me, along the lines of the following. You may need to send a resize event to the window object if box sizing has changed.

// grab reference to element

container = document.getElementById( 'scene' );

// library calls to replace document body etc.

// get new destination

var body = document.getElementsByTagName( 'body' )[ 0 ];

body.appendChild( container );

Obviously in this case you don't need to call CV.UI.init() again, just CV.UI.loadCave() etc.

[juliettefabre]

Hello,

My issue seems to be similar to this one but I don't manage to solve it with your method above.

I have a Leaflet map displaying caves positions. When the user clicks on a point, it displays the cave information in a leaflet container, and a link to visualize the corresponding lox file.

When the user clicks on a lox file link for the first time, Caveview is initialized with the corresponding lox file and is displayed in the same page in a division below the map.

Then, if the user clicks on another link (corresponding to another lox file), I just call CV.UI.loadCaves() with the previous lox files and the new one. I don't have any error in the console, Caveview seems to load properly, but my container disappears. If I rather call CV.UI.init() before calling CV.UI.loadCaves(), then I got an error because the container is already defined : can't redefine non-configurable property "container".

Any idea?

Thanks a lot, Juliette

[aardgoose]

Hi,

Do you have a link where I can see what is happening? I can then attempt to replicate and fix.

[juliettefabre]

Hello, You will find the development page here. Please :

• choose the language English (top right)
• click on a point, then on the right panel click on the "Visualize (3D)" button: Caveview is loaded with the corresponding survey
• click on the other point, then on the right panel click on the "New 3D view" button (to view only the corresponding survey) or on the "Add to 3D view" (to add survey to the previous one): Caveview division disappears. Thanks! Juliette

[aardgoose]

Juliette,

Thanks, I'll take a look tomorrow. I can see the problem you describe.

Angus

[aardgoose]

Juliette,

I can see what is causing the problem.

For the first call, the ajax callback populates the <div id="caveview_div"> with various html elements including <div id="caveview" >. CaveView then creates a 3d <canvas> element as a child of this <div>, i.e. ( $("#caveview_div).html( output ).

On the second call the contents of <div id="caveview_div"> are replaced including the <canvas> element, which is then invisible (but still present so no errors are displayed).

So to solve this a second call needs to either avoid overwriting the contents of <div id="caveview_div"> or grab a reference to the <canvas> element before overwriting and then insert back into the page.

As a side issue you can safely remove the CV.Viewer.addFormatter() and CV.Viewer.addOverlay() calls which are redundant for your use.

Angus

[juliettefabre]

Thanks a lot Angus! It finally works by grapping the reference to the caveview division, and inserting it back after :

if(!first) {
   var cv = $("#caveview");
   var width = cv.width();
   var height = cv.height();
}
$('#caveview_div').html(output); 
if(!first) {
   $("#col-md-8").append(cv);
   cv.width(width);
   cv.height(height);
}

Thanks again! Juliette

[aardgoose]

I'll close this issue, its rather old now. 1.13.0 is out now which will remove the failing requests for a file that you currently see ( .json), and fixes some usability issues.

[aardgoose]

Great

[aardgoose]

great