GM_config icon indicating copy to clipboard operation
GM_config copied to clipboard

Please allow options for select to be a "value":"title" mapping instead of plain array

Open the-vindicar opened this issue 9 years ago • 5 comments

It's literally the only thing that stops me from using your script.

the-vindicar avatar Aug 02 '15 13:08 the-vindicar

Also [0,1,2,3,4...N]

vanowm avatar Sep 02 '17 06:09 vanowm

this is my example of the custom select type with title: value keypairs:

GM_config.init({
    id: 'exampleCfg',
    title: 'Custom select example',
    fields: {
        example: {
            section: ['', 'Settings'],
            label: 'choose your favorite fruit',
            labelPos: 'left',
            type: 'select',
            options: {
                apple: 1, // you could use the strings instead
                banana: 2,
                pear: 3,
                orange: 4,
                lemon: 5,
                plum: 6,
                kiwi: 7
            },
            default: 2,
        }
    },
    types: {
        select: {
            toNode: function() {
                let field = this.settings,
                    value = this.value,
                    options = field.options,
                    id = this.id,
                    configId = this.configId,
                    labelPos = field.labelPos,
                    create = this.create;

                function addLabel(pos, labelEl, parentNode, beforeEl) {
                    if (!beforeEl) beforeEl = parentNode.firstChild;
                    switch (pos) {
                        case 'right': case 'below':
                            if (pos == 'below')
                                parentNode.appendChild(create('br', {}));
                            parentNode.appendChild(labelEl);
                            break;
                        default:
                            if (pos == 'above')
                                parentNode.insertBefore(create('br', {}), beforeEl);
                            parentNode.insertBefore(labelEl, beforeEl);
                    }
                }

                let retNode = create('div', { className: 'config_var',
                        id: `${configId}_${id}_var`,
                        title: field.title || '' }),
                    firstProp;
            
                for (let i in field) { firstProp = i; break; }
            
                let label = field.label ? create('label', {
                        id: `${configId}_${id}_field_label`,
                        for: `${configId}_field_${id}`,
                        className: 'field_label'
                    }, field.label) : null;
      
                let wrap = create('select', {
                    id: `${configId}_field_${id}`
                });
                this.node = wrap;

                for (let option in options) {
                    wrap.appendChild(create('option', {
                        value: options[option],
                        selected: options[option] == value
                    }, option));
                }

                retNode.appendChild(wrap);

                if (label) {
                    if (!labelPos)
                        labelPos = firstProp == "label" ? "left" : "right";
              
                    addLabel(labelPos, label, retNode);
                }
                
                return retNode;
            },
            toValue: function() {
                let node = this.node,
                    rval = null;

                if (!node) return rval;

                rval = node[node.selectedIndex].value;

                return rval;
            },
            reset: function() {
                let node = this.node,
                    options = node.options;

                for (index in options) {
                    if (options[index].value == this['default']) {
                        node.selectedIndex = index;
                        break;
                    }
                }
            }
        }
    },
});

almaceleste avatar May 12 '20 06:05 almaceleste

This functionality is still needed, no matter if "options" is a multi dimensional array or an dictionary. Dictionary is already a key/value pair "array" so to me it would be the most reasonable solution. Here I actually prefer a key: title pair (unlike almaceleste above). A multidimensional would stay closer to the old usage, and may not have a sort order issue.

Still a fallback for the old options format would be necessary, or define a new type 'select_with_name'.

maddes-b avatar Nov 05 '22 17:11 maddes-b

Pull request #107 submitted.

maddes-b avatar Nov 06 '22 00:11 maddes-b

Enhanced #107 to support a "Dictionary" Object with "optvalue": "optname" pairs

maddes-b avatar Nov 06 '22 00:11 maddes-b

GM_config has gone over a decade without this minor feature. It's not something that is really needed, and using a custom field already fills the gap. With that in mind, I've decided to reject this improvement.

sizzlemctwizzle avatar May 22 '23 18:05 sizzlemctwizzle