Editor for web (uhta3d_editor)

Hi all.
We are starting to test a plugin to create hotspots between scenes with 3dtransition, similar to krpanotools editor.

Archive to plugin: uhta3d_editor.zip (19.05.2024 rev.1120)
Link to video tutorial: https://youtu.be/yvcT7J5ahXA

Preparing the editor for work

• Unzip the archive and move uhta3d_editor to the plugins folder;

• Let's plug in the editor:

  Code

  <include url="plugins/uhta3d_editor/includer.xml" />

• Next, you need to put all the <scene> tags into a separate file named scenes.xml;

  

  This is required to save our changes to the tour during the editing process. Putting anything else in this file is not recommended, as the file will be completely overwritten.

• Add all necessary styles to the main tour file.

That's the end of the preparations.

Launch our tour in a browser and open the developer's console (at the moment the output of technical information about the progress of editing is made there, in the Console section).

After starting, in the center of the viewer will show crosshairs and in the console the editor hotkey hint:

Editor's help:
    Vertical alignment:
        Digit 1/2 - Architectural view: On/Off
        A/D - panorama rotation -/+ in degrees
        S - save panorama rotation for current scene
    Hotspot editor:
        Q - link start
        Е - link stop
        R - remove start
        T - remove stop
        F - styling start
        G - styling stop
        H - select style hs
    Save all changes:
        C - save all to xml

Vertical alignment on the panorama ("1", "2", "A", "S", "D")

1. Switch to architectural mode using the "1" key above the letter keys. (To turn off the mode, press the "2" key);
2. Using "A/D" and crosshair keys rotate the panorama so that vertical lines on the panorama become vertical in the viewing window. (rotation of the panorama is performed relative to the center of the crosshair on the screen);
3. Press the "S" key to save the changes. (Architectural mode will be automatically deactivated). A video of the alignment process can be seen at the link.

Creating a connection between panoramas ("Q", "E")

1. Aim the crosshairs at the location where the hotspot will be placed or where the scene to be connected will be shot;
2. Press the "Q" key to start the connection;
3. In the field that appears, enter the name of the scene to be connected.
   You can enter part of the name of the scene you are looking for, then the list will be filtered and only suitable scene names will remain.
   Use the up/down arrows or mouse to select the desired scene and press the "Enter" key;
4. The selected scene will be loaded, in which it is necessary to indicate with a crosshair the place of shooting the first scene or the location of the hotspot for transition in the opposite direction.
   P.S. The more precise the location of two positions relative to each other, the more accurate the transition will be visually.
5. Press the "E" key to complete the connection process.

Removing hotspot ("R")

1. Press the "R" key to start the delete mode;
2. Click on the desired hotspot with the mouse;
3. Repeat from step 1 if necessary.

Change hotspot style ("F", "G", "H")

1. First, you must select the desired style by pressing the "H" key;
2. Select the desired style in the input field that appears and confirm by pressing the "Enter" key;
3. Press the "F" key to start the hotspot style change;
4. Select the desired hotspot with the mouse;
5. Repeat from step 1 (if you need to change the style) or step 3.

Saving changes ("C")

1. Press the "C" key to save all changes;

2. In the window that opens, select the file named scenes.xml (where all our scenes are recorded).

   P.S. Just in case, create a copy of the scene.xml file. )))

3. Reboot the tour to verify.

There may be bugs and errors in the plugin. If any such bugs are found, please report them here for correction.
I'd be happy to get feedback on the work and suggestions)

Enjoy your work!

Quote from ramirox3

I have already finished generating the hotspots, how can I eliminate the crosshairs from the center of the screen

Hello, just remove the editor include line) It will continue to work here without an editor. An editor is needed only at the stage of arranging hotspots.

Can be used as follows:

Place the folder with the plugin one level higher than the folders with your tours. When necessary, you specify the relative path to it in the include and work. When you're done, just remove the inclusion from the code and you're done. And so with other tours. And you won’t have to first copy the folder with the editor to the tour and then delete it from the tour.

Thanks for the feedback. I try to be helpful to my colleagues)))

Quote from onair0410

Is there any way to save the scenes as I have them arranged?

For now it looks like this so that no extra empty lines appear. for me it is not a problem as I work in VSCode and it has auto formatting (shift+alt+F)

The beauty in formatting a file requires extra effort and time. At this stage, this task is not the main one for me. First of all, I want to fully transfer the functionality of the native editor to my version and make this functionality as convenient as possible. And secondary tasks a little later....

P.S. I have implemented and added functionality for aligning panoramas using A, S and D keys. I will probably post an update of the editor soon. in the meantime, here is mini video of the alignment process.

Quote from onair0410

I'm installing vs code now. And then I'm planning to test again. Thanks for the great tips.

Vscode Very convenient development tool

Quote from onair0410

I watched the video you shared. It seems like a groundbreaking idea. The current version is already excellent, but I am really looking forward to the sorting feature. One of the most inconvenient aspects of working with VR for me has been the inconsistent positioning of hotspots. For example, if a scene has four hotspots, I want to assign the same positional values for each direction. To do this, I currently have to manually edit each hotspot individually. It would be great if there was a way to uniformly assign values along the Y-axis. Just like the fixed Y-values for directions in Google Street View, having a feature to align hotspots on the Y-axis would be very helpful. While adding new features can be challenging, what do you think about this idea?

I guess you mean north orientation?
If yes, I have this functionality too. There are some nuances concerning the influence of hotspot position on the prealign parameter of the picture, but they are solvable) And so, in my version, you point the crosshair in the direction where you think "north" should be, and press the "W" key and north for the given scene is set in that direction).

Well, this is more related to the style of hotspot and not to the editor) But sometime I will think in this direction when I have time.
And in theory you can write a code for it to change the position of remoteness to a specified value for all spots in the scene when it is loaded and you will be happy).

Quote from onair0410

This is because some hotspots need to be in different positions.

then add an additional parameter to the ones that need to be aligned, and align only those that have this parameter)

Quote

I have just noticed a problem. When I press C to save, it erases all the tooltips for the hotspot I was working on. Can't I keep the tooltips?

This is how it works in the current version. Only the basic parameters are stored. So first you use the editor to arrange the transitions and then, when all the transitions are ready, you can enter your non-standard changes.

But I'll think about any structure to keep. But that's for later...

Quote

I see. If there are more scenes, it will be very difficult to create tooltips for a lot of hotspots created after work. Wouldn't it be necessary to automatically create tooltips?

What do you want to place in the tooltip on hotspots that are meant to transition between scenes?