I have a fader with 18 steps - is there an easy way to display this 'step number' in the fader?
Hello,
You probably have to do a bit of math to get those 18 steps proportional (if that's your goal with it).
It should work if you do the following in the range property:
{
"min": 0,
"8%": 1,
"16.5%": 2,
"22%": 3,
"27.5%": 4,
"33%": 5,
"38.5%": 6,
"44%": 7,
"49.5%": 8,
"55%": 11,
"60.5%": 10,
"66%": 12,
"71.5%": 13,
"77%": 14,
"82.5%": 15,
"88%": 16,
"93.5%": 17,
"max": 18
}
Hope that helps !
Swayrian
oo thanks, didn't know I could do that!
It works great for the value display, but unfortunately not for the control (which is from 0 - 1024)...
Now I'm confused actually... my current range looks like this:
{
"min": 0,
"max": 1024
}
JS{
// range property
var steps = 18 // or @{this.steps}
var range = {}
for (var i = 0; i < steps ; i++) {
var key = i / (steps - 1) * 100 + "%"
range[key] = i / (steps - 1) * 1024
}
return range
}
Gotta add an option for this someday 
Ooh thanks Jean-Emmanuel!
Forgive me for being dumb, but does this go in the 'range' field?... it works OK there, but I still can't display the 'step' in ArpPatternLabel
To clarify - I'd like to display the "0-18" figure in the knob
Set pips to true (under "style") and set range as follows (using alternative notation to display keys instead of values)
JS{
// range property
var steps = @{this.steps}
var range = {}
for (var i = 0; i < steps ; i++) {
var key = i / (steps - 1) * 100 + "%"
range[key] = {}
range[key][i] = i / (steps - 1) * 1024
}
return range
}
Thanks! Strange ... this is the result I get.
Here's the code -
{
"createdWith": "Open Stage Control",
"version": "1.9.12",
"type": "session",
"content": {
"type": "root",
"id": "root",
"visible": true,
"interaction": true,
"comments": "",
"width": "auto",
"height": "auto",
"colorText": "auto",
"colorWidget": "auto",
"alphaFillOn": "auto",
"padding": "auto",
"html": "",
"css": "",
"colorBg": "auto",
"layout": "default",
"justify": "start",
"gridTemplate": "",
"contain": true,
"scroll": true,
"innerPadding": true,
"verticalTabs": false,
"variables": "@{parent.variables}",
"traversing": false,
"value": "",
"default": "",
"linkId": "",
"address": "auto",
"preArgs": "",
"typeTags": "",
"decimals": 2,
"target": "",
"ignoreDefaults": false,
"bypass": false,
"script": "",
"widgets": [
{
"type": "panel",
"top": "31.13%",
"left": "27.9%",
"id": "ArpControls",
"visible": true,
"interaction": true,
"comments": "",
"width": "21%",
"height": "5.86%",
"expand": "false",
"colorText": "auto",
"colorWidget": "@{ArpColor}",
"colorStroke": "auto",
"colorFill": "auto",
"alphaStroke": 0,
"alphaFillOff": "auto",
"alphaFillOn": "auto",
"lineWidth": "auto",
"padding": "auto",
"html": "",
"css": "",
"colorBg": "@{ArpColorBack}",
"layout": "horizontal",
"justify": "start",
"gridTemplate": "",
"contain": true,
"scroll": true,
"innerPadding": false,
"verticalTabs": false,
"variables": "@{parent.variables}",
"traversing": false,
"value": "",
"default": "",
"linkId": "",
"address": "auto",
"preArgs": "",
"typeTags": "",
"decimals": 2,
"target": "",
"ignoreDefaults": false,
"bypass": false,
"script": "",
"widgets": [
{
"type": "variable",
"id": "ArpColorBack",
"comments": "",
"value": "#111",
"default": "",
"linkId": "",
"address": "auto",
"preArgs": "",
"typeTags": "",
"decimals": 2,
"target": "",
"ignoreDefaults": false,
"bypass": false,
"script": ""
},
{
"type": "variable",
"id": "ArpTypeLabel",
"comments": "",
"value": "Straight",
"default": "",
"linkId": "",
"address": "auto",
"preArgs": "",
"decimals": 2,
"target": "",
"script": "",
"typeTags": "",
"ignoreDefaults": false,
"bypass": false
},
{
"type": "panel",
"id": "panel_pattern",
"comments": "",
"value": "",
"default": "",
"linkId": "",
"address": "auto",
"preArgs": "",
"typeTags": "",
"decimals": 2,
"target": "",
"ignoreDefaults": false,
"bypass": false,
"script": "",
"top": 0,
"left": 0,
"visible": true,
"interaction": true,
"width": "100%",
"height": "100%",
"expand": "false",
"colorText": "auto",
"colorWidget": "auto",
"colorStroke": "auto",
"colorFill": "auto",
"alphaStroke": 0,
"alphaFillOff": "auto",
"alphaFillOn": "auto",
"lineWidth": "auto",
"padding": "auto",
"html": "",
"css": "",
"colorBg": "auto",
"layout": "default",
"justify": "start",
"gridTemplate": "",
"contain": true,
"scroll": true,
"innerPadding": false,
"verticalTabs": false,
"variables": "@{parent.variables}",
"traversing": false,
"widgets": [
{
"type": "knob",
"top": "0%",
"left": "0%",
"id": "ArpPattern",
"visible": true,
"interaction": true,
"comments": "",
"width": "100%",
"height": "100%",
"expand": "false",
"colorText": "auto",
"colorWidget": "auto",
"colorStroke": "auto",
"colorFill": "auto",
"alphaStroke": "auto",
"alphaFillOff": "auto",
"alphaFillOn": "auto",
"lineWidth": "auto",
"padding": "auto",
"html": "",
"css": ".html {\n position: absolute;\n line-height: 10rem;\n top: 45%;\n left: 0%;\n right: 0;\n text-align: center;\n pointer-events: none; /* needed to let events pass through */\n}",
"mode": "vertical",
"doubleTap": false,
"value": 512,
"default": 512,
"linkId": "",
"address": "/user/0221",
"preArgs": "",
"typeTags": "",
"decimals": 2,
"target": "",
"ignoreDefaults": false,
"bypass": false,
"script": "",
"design": "default",
"pips": true,
"dashed": false,
"angle": 270,
"spring": false,
"range": "JS{\n// range property\nvar steps = getProp(\"this\", \"steps\")\nvar range = {}\nfor (var i = 0; i < steps ; i++) {\n var key = i / (steps - 1) * 100 + \"%\"\n range[key] = {}\n range[key][i] = i / (steps - 1) * 1024\n}\nreturn range\n}",
"logScale": false,
"sensitivity": 0.4,
"steps": 19,
"origin": "auto"
},
{
"type": "variable",
"id": "ArpPatternLabel",
"comments": "",
"value": "",
"default": "",
"linkId": "",
"address": "auto",
"preArgs": "",
"typeTags": "",
"decimals": 2,
"target": "",
"ignoreDefaults": false,
"bypass": false,
"script": ""
},
{
"type": "text",
"top": "57.14%",
"left": "10%",
"id": "text_3",
"visible": true,
"comments": "",
"width": "74.63%",
"height": "50%",
"expand": "false",
"colorText": "auto",
"colorWidget": "auto",
"colorStroke": "auto",
"colorFill": "auto",
"alphaStroke": 0,
"alphaFillOff": "auto",
"alphaFillOn": "auto",
"lineWidth": "auto",
"padding": "auto",
"html": "",
"css": "",
"vertical": false,
"wrap": false,
"align": "center",
"value": "@{ArpPattern}",
"default": "",
"linkId": "",
"address": "auto",
"preArgs": "",
"decimals": 2,
"target": "",
"script": ""
}
],
"tabs": []
}
],
"tabs": []
}
],
"tabs": []
}
}
My bad, getProp() is only available in the script property, should have written @{this.steps} instead (post edited).
ah cool thanks! Got a feeling this won't work in my limited space tho...now looks like this:
you can try reducing the font size in the css property:
font-size:70%;