jpc-like-websites/src/sizeSide/border.js

/**
 * This file is part of the jps-like-websites lib
 * URL: https://git.labos.goip.de/chris/jpc-like-websites
 * @copyright by its creator Christian Martin 
 */

/**
 * 
 */
const LineStyles = Object.freeze({
    dotted: "dotted",
    dashed: "dashed",
    solid: "solid",
    double: "double",
    groove: "groove",
    ridge: "ridge",
    inset: "inset",
    outset: "outset",
    none: "none",
    hidden: "hidden"
})

class BorderDefinition {
    constructor(width = 0, color = Colors.black, style = LineStyles.solid) {
        this._width = width;
        this._color = color;
        this._style = style;
    }

    width(width) {
        this._width = width;
        return this;
    }
    color(color) {
        this._color = color;
        return this;
    }
    style(style) {
        this._style = style;
        return this;
    }
    join(def) {
        Object.keys(def)
            .forEach(key => this[key] = def[key]);
        return this;
    }
}

const Define = Object.freeze({
    width: new BorderDefinition().width,
    style: new BorderDefinition().style,
    color: new BorderDefinition().color
})

/**
 * @inheritdoc
 * @extends Sides
 */
class Border extends Sides {
    constructor(width = 0, color = Colors.black, style = LineStyles.solid, defaultUnit = SizeUnits.PIXEL, shape = Shapes.Rectangle) {
        super('border', 0, defaultUnit);
        this._fFirst = new BorderDefinition(width, color, style);
        this._fSecond = new BorderDefinition(width, color, style);
        this._fThird = new BorderDefinition(width, color, style);
        this._fForth = new BorderDefinition(width, color, style);
        this._shape = shape;
    }

    setByIndex(index, value) {
        if (value instanceof BorderDefinition) {
            this.getByIndex(index).join(value)
        } else {
            this.getByIndex(index)._width = value
        }
        return this;
    }

    /**
     * 
     * @param {string} key 
     * @param {*} value 
     * @returns {typeof Border}
     */
    setOnDirections(key, value) {
        let orderedAttributes = this.getOrderedAttributes()
        for (let i = 0; i < this.getOrderedAttributes.length; i++) {
            orderedAttributes[i][key] = value;
        }
        return this;
    }

    /**
     * 
     * @param {number} width 
     * @returns {typeof Border}
     */
    width(width) {
        this._fFirst._width = width;
        this._fSecond._width = width;
        this._fThird._width = width;
        this._fForth._width = width;
        return this;
    }

    /**
     * 
     * @param {*} color 
     * @returns {typeof Border}
    */
    color(color) {
        this._fFirst._color = color;
        this._fSecond._color = color;
        this._fThird._color = color;
        this._fForth._color = color;
        return this;
    }

    /**
     * 
     * @param {Shape} shape 
     * @returns {typeof Border}
     */
    shape(shape) {
        this._shape = shape;
        return this;
    }

    /**
     * Sets the border-style of all sides to the given. 
     * @param {LineStyles} lineStyle style of the border
     * @returns {typeof Border}
     */
    setStyleAll(lineStyle) {
        this._fFirst._style = lineStyle;
        this._fSecond._style = lineStyle;
        this._fThird._style = lineStyle;
        this._fForth._style = lineStyle;
        return this;
    }

    /**
     * 
     * @param {LineStyles} lineStyle 
     * @param {*} sidingRefSide 
     * @returns {typeof Border}
     */
    setLineStyle(lineStyle, sidingRefSide) {
        this._sidingStyles.setBySidingRef(sidingRefSide, lineStyle)
        return this;
    }

    /**
     * 
     * @param {Map<SidingRefSides, LineStyles} refSideStyleMap 
     * @returns {typeof Border}
     */
    setLineStyles(refSideStyleMap) {
        let rkeys = Object.keys(refSideStyleMap);
        for (let i = 0; i < array.length; i++) {
            this._sidingStyles.setBySidingRef(rkeys[i], refSideStyleMap[rkeys[i]]);
        }
        return this;
    }


    /**
     * 
     * @returns {Array<{key: string, value: string}>}
     */
    toModifications() {
        let names = ["left", "top", "right", "bottom"];
        return this.getOrderedAttributes()
            .flatMap((bdef, i) => {
                if (bdef.width == 0)
                    return []

                return [
                    { key: `border-${names[i]}-width`, value: bdef._width + this._unit },
                    { key: `border-${names[i]}-color`, value: bdef._color.cssRGBString() },
                    { key: `border-${names[i]}-style`, value: bdef._style }
                ]
            });
    }
}

/**
 * @inheritdoc
 * @extends Border
 */
class BorderChain extends mixinModSubChainEndings(Border) {
    /**
     * 
     * @param {Modifier} modifier 
     */
    constructor(modifier) {
        super(modifier);
    }
}


/**
 * @inheritdoc
 * @extends BorderChain
 */
class BorderChainedModifier extends mixinModSubChainComponentMethods(Border) {
    /**
     * 
     * @param {ChainableModifier} modifier 
     */
    constructor(modifier) {
        super(modifier);
    }
}