Program to test hint() with transparency

hamoid · October 11, 2018, 2:24pm

A small Processing program to test the effect on transparency of enabling and disabling these settings:

hint(DISABLE_DEPTH_TEST); // or ENABLE_
hint(DISABLE_DEPTH_SORT); // or ENABLE_
hint(DISABLE_DEPTH_MASK); // or ENABLE_

boolean b[] = new boolean[3];

void setup() {
  size(800, 600, P3D);
  hint(DISABLE_DEPTH_TEST);
  hint(DISABLE_DEPTH_SORT);
  hint(DISABLE_DEPTH_MASK);
}

void draw() {
  background(255);

  fill(0);
  text("DEPTH_TEST " + b[0], 20, 20);
  text("DEPTH_SORT " + b[1], 20, 40);
  text("DEPTH_MASK " + b[2], 20, 60);
  
  text("<- use the mouse to toggle settings", 200, 40);

  fill(255, 40, 20, 100);  
  translate(width/2, height/2);
  rotateY(frameCount * 0.005);

  for (int x = -200; x<=200; x+=200) {
    for (int y = -200; y<=200; y+=200) {
      pushMatrix();
      translate(x, 0, y);
      box(180);
      popMatrix();
    }
  }
}
void mousePressed() {
  int id = mouseY / 20;
  if (id < b.length) {
    b[id] ^= true; // same as b[id] = !b[id]
  }
  hint(b[0] ? ENABLE_DEPTH_TEST : DISABLE_DEPTH_TEST);
  hint(b[1] ? ENABLE_DEPTH_SORT : DISABLE_DEPTH_SORT);
  hint(b[2] ? ENABLE_DEPTH_MASK : DISABLE_DEPTH_MASK);
}

villares · November 19, 2019, 2:59am

Thank you so much @hamoid!

I have ported your code to Python Mode and added 2 more hints from https://processing.org/reference/hint_.html

# port of Hamoid's work!
# https://discourse.processing.org/t/program-to-test-hint-with-transparency/4361
# plus a few hints from https://processing.org/reference/hint_.html

b = [False] * 5 # list of booleans to toggle hints

def setup():
    size(800, 600, P3D)
    hint(DISABLE_DEPTH_TEST)
    hint(DISABLE_DEPTH_SORT)
    hint(DISABLE_DEPTH_MASK)
    hint(DISABLE_OPTIMIZED_STROKE)
    hint(DISABLE_STROKE_PERSPECTIVE)
    
def draw():
    background(255)

    fill(0)
    text("DEPTH_TEST " + str(b[0]), 20, 20)
    text("DEPTH_SORT " + str(b[1]), 20, 40)
    text("DEPTH_MASK " + str(b[2]), 20, 60)
    text("OPTIMIZED_STROKE " + str(b[3]), 20, 80)
    text("STROKE_PERSPECTIVE " + str(b[4]), 20, 100)
    text("<- use the mouse to toggle settings", 200, 40)

    fill(255, 40, 20, 100)
    translate(width / 2, height / 2)
    rotateY(frameCount * 0.005)

    for x in range(-200, 201, 200):
        for y in range(-200, 201, 200):
            pushMatrix()
            translate(x, 0, y)
            box(180)
            popMatrix()

def mousePressed():
    id = mouseY / 20
    if id < len(b):
        b[id] = not b[id]

    hint(ENABLE_DEPTH_TEST if b[0] else DISABLE_DEPTH_TEST)
    hint(ENABLE_DEPTH_SORT if b[1] else DISABLE_DEPTH_SORT)
    hint(ENABLE_DEPTH_MASK if b[2] else DISABLE_DEPTH_MASK)
    hint(ENABLE_OPTIMIZED_STROKE if b[3] else DISABLE_OPTIMIZED_STROKE)
    hint(ENABLE_STROKE_PERSPECTIVE if b[4] else DISABLE_STROKE_PERSPECTIVE)

hamoid · November 19, 2019, 9:15am

That’s great!

This makes me think that I should maybe write another example showing all the things that are affected by DISABLE_OPTIMIZED_STROKE. For instance the matrices in the vertex shader, the use of uniforms and textures in shaders, the use of more than one shader in your sketch and more. Soon

GoToLoop · November 19, 2019, 11:29am

Here’s my own Python Mode remix using a class Hint for keeping hint()'s text() name & coords and its current state:

EDIT: update (v2.0)

Click at canvas’ bottom -> toggles sphere()/box()
Click mouseButton CENTER -> toggles noLoop()/loop()
Click mouseButton RIGHT -> toggles rotateY()'s clockwise/counter-clockwise

"""
 Hint 3D Settings (v2.0.3) [Python Mode Remix w/ Class]
 by Hamoid (2018-Oct-11)
 mod GoToLoop (2019-Nov-19)
 Discourse.Processing.org/t/program-to-test-hint-with-transparency/4361/4
"""

W, H = 1200, 600
H3 = H/3

HINTS, OFFSET = 5, 20
BOX_SIZE, SPHERE_SIZE, ROT_STEP = 180, 90, 5e-3
BG, FG, TXT_COL = -1, 0x64FF2814, 0

FPS, MSG = 'FPS: %2.f  -  Frames: %.5d', '%d: %s'
PAUSED = 'Paused: %s  -  Frame: %d  -  Millis: %d'
CLOCKWISE, SPHERE_SHAPE = 'Clockwise:', '%d: Sphere: %s'

TIP = '<- use the mouse to toggle hint settings'
TIP_X, TIP_Y = 200, OFFSET * 3

SHAPE_TIP = 'click here to toggle shape'
SHAPE_X, SHAPE_Y = W >> 1, H - OFFSET

HINTS_RANGE = tuple(range(HINTS))
COORDS_RANGE = tuple(range(-H3, H3 + 1, H3))

TITLES = (
    'DEPTH_TEST: ', 'DEPTH_SORT: ', 'DEPTH_MASK: ',
    'OPTIMIZED_STROKE: ', 'STROKE_PERSPECTIVE: ' )

ONS = (
    ENABLE_DEPTH_TEST, ENABLE_DEPTH_SORT, ENABLE_DEPTH_MASK,
    ENABLE_OPTIMIZED_STROKE, ENABLE_STROKE_PERSPECTIVE )

OFFS = (
    DISABLE_DEPTH_TEST, DISABLE_DEPTH_SORT, DISABLE_DEPTH_MASK,
    DISABLE_OPTIMIZED_STROKE, DISABLE_STROKE_PERSPECTIVE )

useSphere, clockwise = False, 1

def setup():
    size(W, H, P3D)

    global hints

    hints = tuple(
        Hint(TITLES[i], ONS[i], OFFS[i], y = i*OFFSET + OFFSET)
        for i in HINTS_RANGE )

    for idx, h in enumerate(hints): print MSG % (idx, h)
    print


def draw():
    this.surface.title = FPS % (frameRate, frameCount)

    background(BG)
    fill(TXT_COL)
    text(TIP, TIP_X, TIP_Y)

    for h in hints: h.text()

    with pushStyle():
        textAlign(CENTER)
        text(SHAPE_TIP, SHAPE_X, SHAPE_Y)

    fill(FG)
    translate(width >> 1, height >> 1)
    rotateY(frameCount * clockwise * ROT_STEP)

    for z in COORDS_RANGE:
        for x in COORDS_RANGE:
            with pushMatrix():
                translate(x, 0, z)
                sphere(SPHERE_SIZE) if useSphere else box(BOX_SIZE)


def mousePressed():
    global useSphere, clockwise

    isCenter = mouseButton == CENTER
    this.looping ^= isCenter

    if isCenter or not this.looping:
        print PAUSED % (not this.looping, frameCount, millis())
        return

    if mouseButton == RIGHT:
        clockwise *= -1
        print CLOCKWISE, clockwise < 0
        return

    idx = mouseY // OFFSET

    if 0 <= idx < HINTS:
        h = hints[idx]
        h.toggle()
        h.hint()
        print MSG % (idx, h)

    elif mouseY >= SHAPE_Y - OFFSET:
        useSphere ^= True
        print SPHERE_SHAPE % (idx, useSphere)

    else: print idx


class Hint:
    def __init__(h, title, on, off, x=OFFSET, y=OFFSET, active=False):
        h.title = title
        h.on = on
        h.off = off
        h.x = x
        h.y = y
        h.active = active

        h.hint()


    def __str__(h, INFO='[ %s%s, x=%d, y=%d ]'):
        return INFO % (h.title, h.active, h.x, h.y)


    def toggle(h): h.active ^= True
    def hint(h): hint(h.on if h.active else h.off)
    def text(h): text(h.title + `h.active`, h.x, h.y)

hamoid · November 19, 2019, 12:28pm

Ok, thanks to your examples I made version 2

Main change is subtle but important: show spheres. With spheres performance and sorting issues are much more obvious.

class Hint {
  private int y;
  private String name;
  private boolean active;
  private int ON_CONST;
  private int OFF_CONST;
  Hint(int y, String name, boolean active, int ON, int OFF) {
    this.y = y;
    this.name = name;
    this.active = active;
    this.ON_CONST = ON;
    this.OFF_CONST = OFF;
    call_hint();
  }
  void toggle() {
    active = !active;
  }
  void call_hint() {
    hint(active ? ON_CONST : OFF_CONST);
  }
  void draw() {
    text(name + " " + active, 20, y);
  }
  void mousePressed() {
    if (mouseY > y - 15 && mouseY < y + 5) {
      toggle();
      call_hint();
    }
  }
}

Hint[] hints;
boolean useSphere;

void setup() {
  size(800, 600, P3D);

  hints = new Hint[] {
    new Hint(40, "DEPTH_TEST", false, ENABLE_DEPTH_TEST, DISABLE_DEPTH_TEST), 
    new Hint(60, "DEPTH_SORT", false, ENABLE_DEPTH_SORT, DISABLE_DEPTH_SORT), 
    new Hint(80, "DEPTH_MASK", false, ENABLE_DEPTH_MASK, DISABLE_DEPTH_MASK), 
    new Hint(100, "OPTIMIZED_STROKE", true, ENABLE_OPTIMIZED_STROKE, DISABLE_OPTIMIZED_STROKE), 
    new Hint(120, "STROKE_PERSPECTIVE", false, ENABLE_STROKE_PERSPECTIVE, DISABLE_STROKE_PERSPECTIVE)
  };
}

void draw() {
  background(255);

  fill(0);
  for (Hint h : hints) {
    h.draw();
  }
  text("<- use the mouse to toggle settings", 200, 40);
  text("click here to toggle shape", 300, 580);

  fill(255, 40, 20, 100);  
  translate(width/2, height/2);
  rotateY(frameCount * 0.005);

  for (int x = -200; x<=200; x+=200) {
    for (int y = -200; y<=200; y+=200) {
      pushMatrix();
      translate(x, 0, y);
      if (useSphere) {
        sphere(90);
      } else {
        box(180);
      }
      popMatrix();
    }
  }
}
void mousePressed() {
  if (mouseY > 150) {
    useSphere = !useSphere;
  } else {
    for (Hint h : hints) {
      h.mousePressed();
    }
  }
}

villares · November 19, 2019, 8:49pm

Very cool! Also, thanks @GoToLoop!

I have tried some refactoring, avoiding OO, now I’ll study your new ideas

EDIT: Added the sphere thing too!

github.com

villares/py.processing-play/blob/master/3D/hint_settings/hint_settings.pyde

# port of aBe Hamoid's work!
# https://discourse.processing.org/t/program-to-test-hint-with-transparency/4361
# plus a few hints from https://processing.org/reference/hint_.html
# 19/11/2019 update: plus some ideas from GoToLoop

# ["name", hint_enabled, hint_disable_constant, hint_enable_constant]
hints = (["DEPTH_TEST", False,
          DISABLE_DEPTH_TEST, ENABLE_DEPTH_TEST],
         ["DEPTH_SORT", False,
          DISABLE_DEPTH_SORT, ENABLE_DEPTH_SORT],
         ["DEPTH_MASK", False,
          DISABLE_DEPTH_MASK, ENABLE_DEPTH_MASK],
         ["OPTIMIZED_STROKE", True,
          DISABLE_OPTIMIZED_STROKE, ENABLE_OPTIMIZED_STROKE],
         ["STROKE_PERSPECTIVE", False,
          DISABLE_STROKE_PERSPECTIVE, ENABLE_STROKE_PERSPECTIVE],
         )
use_sphere = False

This file has been truncated. show original

Topic		Replies	Views
DISABLE_DEPTH_TEST not working in P3D Processing	2	602	November 29, 2018
hint(DISABLE_DEPTH_TEST) in P5 p5.js	13	2711	November 16, 2018
hint(ENABLE_DEPTH_SORT) issues Coding Questions	4	801	January 2, 2020
P3D hint() with 2D depth sort not working Coding Questions	1	348	November 1, 2019
Hooray! New hint() documentation is available! Processing	1	321	August 5, 2019

Program to test hint() with transparency

Related topics