iwmlib/lib/pixi/graphics/label.js

import { Points } from '../../utils.js'

/* globals PIXI */

export class FlagType {
    static get bottomLeft() {
        return { x: 1, y: -1 }
    }
    static get bottomRight() {
        return { x: -1, y: -1 }
    }
    static get topLeft() {
        return { x: -1, y: 1 }
    }
    static get topRight() {
        return { x: 1, y: 1 }
    }

    static toString(flagType) {
        let str = ''
        if (flagType.x && flagType.y) {
            if (flagType.y == 1) str += 'bottom'
            else if (flagType.y == -1) str += 'top'
            else str += '_INVALID_Y_'

            if (flagType.x == 1) str += 'Right'
            else if (flagType.x == -1) str += 'Left'
            else str += '_INVALID_X_'
        } else str = 'Invalid FlagType: ' + flagType.toString()

        return str
    }
}

export class FlagPolygon extends PIXI.Polygon {
    constructor({
        type = FlagType.bottomLeft,
        width = 100,
        height = 30,
        notchSize = 10,
        notchWidth = null,
        notchHeight = null,
        originOffset = { x: 0, y: 0 }
    } = {}) {
        let points = []

        let dimensions = { x: width, y: height }
        dimensions = Points.multiply(dimensions, type)

        notchWidth = notchWidth == null ? notchSize : notchWidth
        notchHeight = notchHeight == null ? notchSize : notchHeight

        notchSize = { x: notchWidth, y: notchHeight }
        notchSize = Points.multiply(notchSize, type)

        originOffset = Points.multiply(originOffset, type)

        let point = new PIXI.Point(originOffset.x, originOffset.y)
        points.push(point.clone())

        point.y += notchSize.y
        points.push(point.clone())

        point.y += dimensions.y
        points.push(point.clone())

        point.x += dimensions.x
        points.push(point.clone())

        point.y -= dimensions.y
        points.push(point.clone())

        point.x -= dimensions.x - notchSize.x
        points.push(point.clone())

        // close polygon
        points.push(points[0].clone())

        super(points)

        this.type = type
        this.dimensions = dimensions
        this.notchSize = notchSize
        this.originOffset = originOffset
    }

    getPoint(i) {
        if (i >= 0) {
            let idx = i * 2
            return [this.points[idx], this.points[idx + 1]]
        } else {
            let idx = (Math.floor(this.points.length / 2) + i) * 2
            return [this.points[idx], this.points[idx + 1]]
        }
    }

    get notch() {
        let points = [this.getPoint(0), this.getPoint(1), this.getPoint(-2), this.getPoint(0)]
        let notchPolygon = []

        points.forEach(point => {
            notchPolygon = notchPolygon.concat(point)
        })

        return notchPolygon
    }
    get rect() {
        let points = [this.getPoint(1), this.getPoint(2), this.getPoint(3), this.getPoint(4), this.getPoint(1)]

        let rectPolygon = []
        points.forEach(point => {
            rectPolygon = rectPolygon.concat(point)
        })
        return rectPolygon
    }

    placeText(text, padding) {
        text.position = Points.add(this.originOffset, { x: 0, y: this.notchSize.y })
        padding = Points.multiply(padding, this.type)
        text.position = Points.add(text.position, padding)

        if (this.type.y == -1) text.position.y -= text.height

        if (this.type.x == -1) text.position.x -= text.width
    }
}

export class Flag extends PIXI.Graphics {
    constructor(
        {
            type = FlagType.bottomLeft,
            width = 100,
            height = 30,
            notchSize = 10,
            notchWidth = null,
            notchHeight = null,
            originOffset = { x: 0, y: 0 }
        } = {},
        nativeLines = false
    ) {
        super(nativeLines)

        this.flagPolygon = new FlagPolygon({
            type,
            width,
            height,
            notchSize,
            notchWidth,
            notchHeight,
            originOffset
        })

        this.draw()
    }

    draw() {
        this.drawPolygon(this.flagPolygon)
    }

    get typeName() {
        return FlagType.toString(this.type)
    }
}

export class Label extends PIXI.Graphics {
    constructor(text, textStyle = new PIXI.TextStyle(), nativeLines = false) {
        super(nativeLines)
        this._text = new PIXI.Text(text, textStyle)
        this.addChild(this._text)
    }

    get text() {
        return this._text
    }
}

export class FlagLabel extends Label {
    constructor(text, textStyle, flagStyle, nativeLines = false) {
        super(text, textStyle, nativeLines)
        this.flagPolygon = new FlagPolygon(flagStyle)
        this.draw()
    }

    draw() {
        this.drawPolygon(this.flagPolygon)
    }
}