xinaesthete / dat.guivr Goto Github PK

Small numbers format as 0 in slider boxes.
Replace roundToDecimal with something like:

function roundToDecimal(value, decimals) {
    if (Math.abs(value) < 0.01 && value !== 0) return value.toExponential(3);  
    var tenTo = Math.pow(10, decimals); 
    return Math.round(value * tenTo) / tenTo;
}

n.b. do NOT use value.toExponential(decimals)

If you press a 'detach' button with one controller while the panel is grabbed by another controller, various strange & bad things happen...

text on the gui can be lost if logarithmicDepthBuffer set on the renderer.
For example, CSynth default camera settings and VR mode.

Because the code for creating tooltips relies on the presence a property interaction on the object, which by convention most types of widget have but dropdowns don't.

This is a problem that can particularly emerge when you detach a folder, close the folder it came from and then re-attach it. The controller that you use for pressing the button to reattach will now no longer be interact with anything until the folder becomes visible again.

This also applies if you're doing something like moving a slider when it gets hidden.

I think it results from interaction.update() not being called for anything that's not visible.

There is already code to centre text in box if no textX specified.
imagebuttongrid around line 149.

This is wrong because w = text.computeWidth(); gives wrong answer where it is.
For simple cases, w = text.computeWidth(); is correct if moved before text.constrainBounds(BUTTON_WIDTH - _margin, BUTTON_HEIGHT - _margin);

Not sure exactly how the logic should flow to allow for long text/ wrapped text, etc.

Would be desirable to constrain these, somewhat similarly to what I now do in imagebuttongrid with text (at some point I should improve naming, documentation... might want to do more thorough refactor). Maybe show the full string as tooltip.

The checkbox generated by showInFolderHeader() does not always update when the underlying gui element (typically 'visible') changes.

When working with a 2d GUI, holding left button then pressing and releasing right button before releasing left, will lead to the system behaving as if left has been released (stop moving folder around).

Subsequent left drag that doesn't hit GUI then erroneously drags the GUI...

clearAll() fails when a controller does not have a parent (eg top level controller)

This does not apply to other 'modal' (wrong terminology really, but it's what I use internally) editors like color picker.

For example, in imagebutton.html

1. click the 'scale' dropdown
2. click elsewhere so the dropdown is no longer visible
3. click somewhere where the invisible dropdown was

For some reason, setting folder.modalEditor.visible = false is not doing enough to prevent dropdown options being filtered by getVisibleHitscanObjects().

eg given a gui and material
gui.add(material, 'color').listen();
throws exception

There is a small but significant overhead in setting up and serving each update() callback by requestAnimationFrame. This can be eliminated by a flag for user control of update()

• make update() call in datguivr/index.js optional depending on flag
• and update() visible externally when that flag is set (eg as dat.GUIVR.update)
• make requestAnimationFrame( update ) optional depending on flag
• when flag set, user code calls dat.GUIVR.update() as needed, eg from its animationFrame callback

When folders with ortho camera are reordered they are pushed to the back.
This can have issues with big depths.
It would be best to preserve the specified z-values as far as possible.
see e.g. code below

function orthographicFolderLayout() {
  var cam = topFolderStack[0].userData.isOrthographic;
  if (!cam || topFolderStack.length <= 1) return;
    //camBoxSetup(cam);

    // original code laid them out right at back,
    // so odd z-buffer effects made them white on black, and often hidden anyway
    // This respects the original z values as much as possible, but applies them in appropriate order
    // If there is a clash of x values then the originals are (slightly) modified
    var near = cam.near,
      far = cam.far,
      n = topFolderStack.length,
      zs = topFolderStack.map(f => f.position.z).sort((a,b)=>a-b);  // old z values small to big
      zs[-1] = -9999;
      zs.forEach( (z,i) => zs[i] = Math.max(zs[i], zs[i-1] + 10*Layout.PANEL_DEPTH));  // in case of equals

  topFolderStack.forEach(function (f, i) {
    // var z = -0.9 * far + i * 10 * Layout.PANEL_DEPTH;    // original code, too near back
    // var z = - (near + (n-i) * 10 * Layout.PANEL_DEPTH);  // variant code stacking from front
    var z = zs[i];                                          // use sorted (?modified) old z-values
    if (z !== f.position.z) {
      f.position.z = z;
      f.updateMatrix();
      f.fixFolderPosition();
    }
  });
  if (topFolderStack[n - 1].position.z >= near - Layout.PANEL_DEPTH) {
    console.log("GUIVR Warning: likely problem with z-order in orthographicFolderLayout");
  }
  //console.log(`[${topFolderStack.map(f=>f.folderName + '\t: ' + f.position.z).join('\n')}]`);
}

In addInputObject()