Is possible to create and close ou delete the instance in initKeyShotVR?

Started by bisewski, March 28, 2013, 07:04:58 AM

Previous topic - Next topic

0 Members and 1 Guest are viewing this topic.

bisewski

Hi all.

Is possible to close the function keyshotVR before it was created?
I want to show two VRs in the same DIV. One show the entire engine, as boby and other show only interior, without body. But I dont create two pages. I want to show as was the two as something.

Sorry my english...

So, I put in function initKeyShotVR(folder) the variable Folder, that contains the images. I have to folders, body and interior. When I click in a button "With_Body", I call  initKeyShotVR("body"). But if I has iniciated the initKeyShotVR, in the second time anything happen.

Is possible?


Chad Holton

Yes, if I understand correctly, you should be able to create this. Just add the frames to the first VR frame folder (don't forget to update the file names) and update the frame amount in the HTML. Hope this helps.

bisewski

sorry for my english. I guess I was not clear. I want to use two different VRs, a body of a motor and the other of the interior of an motor. Already got it done. I took the folder that contains the images of the body along with the interior. So when I click a button on the page call the initKeyShotVR ("folder") passing the name of a folder. In the html where it has left as var folderName = folder; Thus, open two VRs with the same script.

But I can only do this once. If I click the button it opens the VR WithBody the engine with the body but then I click to show the interior, nothing happens.

I believe this happens why should assess whether the instance has already been created and closes it before creating it again.

Am I right? How do I do?

sds

bisewski

<script src="http://code.jquery.com/jquery-latest.js"></script>
<script language="JavaScript" type="text/javascript" src="files/KeyShotVR.js">
</script>
<script language="JavaScript" type="text/javascript">

var keyshotVR;

function initKeyShotVR(folder)
{
var nameOfDiv = "KeyShotVR";
var folderName = folder;
var imageWidth = 1023;
var imageHeight = 575;
var backgroundColor = "#FFFFFF";
var uCount = 35;
var vCount = 1;
var uWrap = true;
var vWrap = false;
var uMouseSensitivity = -0.097222;
var vMouseSensitivity = 1.000000;
var uStartIndex = 17;
var vStartIndex = 0;
var minZoom = 1.000000;
var maxZoom = 1.000000;
var rotationDamping = 0.960000;
var windowResizable = false;
var enableLOD = false;
var addResizableGUIButton = false;
var addPlayGUIButton = false;

keyshotVR = new keyshotVR(nameOfDiv,folderName,imageWidth,imageHeight,backgroundColor,uCount,vCount,uWrap,vWrap,uMouseSensitivity,vMouseSensitivity,uStartIndex,vStartIndex,minZoom,maxZoom,rotationDamping,windowResizable,enableLOD,addResizableGUIButton,addPlayGUIButton);
}
</script>
</head>
<body>
<!--<body oncontextmenu="return false;" onload="initKeyShotVR('bodycar');">-->

<button id="button_body">Body</button>
<button id="button_chassy">Chassy</button>
<script>
$("#button_body").click(function ()
{
    <!--var image_x = document.getElementById('backbuffer');
        <!--image_x.parentNode.removeChild(image_x);-->
$('#KeyShotVR').empty();
initKeyShotVR('bodycar')
})
$("#button_chassy").click(function ()
{
    <!--var image_x = document.getElementById('backbuffer');
        <!--image_x.parentNode.removeChild(image_x);-->
$('#KeyShotVR').empty();
initKeyShotVR('chassy')
})
</script>
     
<div id="KeyShotVR">
</div>


</body>
</html>


In the code above, I can click in any button that is go function perfectly.
But if i click one more time, I clen my div but I dont show the VR image.

more or less like this:
If (KeyShotVr.created= true)|
KeyShotVr.close();
KeyShotVr = new ......
}

bisewski

I cant create also two iFrame in the same page. Only one show de VR.

Morten Kristensen

The easiest way to achieve what you want is to use two iframes. Then when clicking a button you change the src attribute, which will make it load and show the selected VR. The JavaScript function keyshotVR() creates elements in the DOM with specific names, and those you can't change at the time of invocation.

Let's assume you have two VRs you want to show: untitled_VR.10 and untitled_VR.11

Now do the following steps:

  • Create a folder called "TwoVRs".
  • Copy the two VR folders "untitled_VR.10" and "untitled_VR.11" into the new folder.
  • Create a file named "index.html" in the "TwoVRs" folder.

Insert the following snippet of code into "index.html":

<html>
  <body>
    <script type="text/javascript">
      function show(vrUrl) {
        var frame = document.getElementById("frame");
        frame.src = vrUrl;
        frame.style["visibility"] = "visible";
      }
    </script>

    <button onclick="show('untitled_VR.10/untitled_VR.10.html');">Show VR 1</button>
    <button onclick="show('untitled_VR.11/untitled_VR.11.html');">Show VR 2</button>
    <br/>
    <iframe id="frame" style="width:800px; height:450px; visibility:hidden;"></iframe>
  </body>
</html>


Now load "TwoVRs/index.html" in your browser and observe how you can change the VR you want to show by clicking the buttons.

Let me know if you get it working. :)