JSFiddle - React, Tailwind, and code Playground

by mowglisanu

HTML

<textarea id="t1"></textarea>
<br><br><br><br>
<textarea id="t2"></textarea>

JavaScript

jQuery.fn.test = function(options) {
    var defaults = {
        settings: {
            height: 0, // must be computed
            width: 0,  // must be computed
            scale: 0.20 // percentage of the >> height <<
        },
        simpleVar: "Hola hombre." // default is masqualine
    };
    
    var opts = jQuery.extend(defaults, options); // override defaults
    
    this.val(opts.simpleVar + "\nScale: " + opts.settings.scale);
};

$("#t1").test({simpleVar: "Hola senora."}); // overridden feminine
// this works fine in t1; text is overridden 

$("#t2").test({settings:{scale: 0.86}}); // attempt to override scale
// this does NOT work as scale is a property of "settings", but
// HOW do you set the property of another internal object?

/*
Things that do NOT work:
    {settings.scale: 0.86} (pisses JSLint off)
    {"settings.scale": 0.86} (pisses JSLint off)
*/