@daign/2d-graphics
Version:
Two dimensional graphics library that implements the daign-2d-pipeline.
471 lines (470 loc) • 16 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.GraphicStyle = void 0;
/**
* Implementation of IStyleDeclaration.
*/
var GraphicStyle = /** @class */ (function () {
/**
* Constructor.
* @param fill - Optional.
* @param fillOpacity - Optional.
* @param fillRule - Optional.
* @param stroke - Optional.
* @param strokeWidth - Optional.
* @param strokeOpacity - Optional.
* @param strokeLinecap - Optional.
* @param strokeLinejoin - Optional.
* @param strokeMiterlimit - Optional.
* @param strokeDasharray - Optional.
* @param strokeDashoffset - Optional.
* @param vectorEffect - Optional.
* @param display - Optional.
* @param visibility - Optional.
* @param opacity - Optional.
* @param paintOrder - Optional.
* @param mask - Optional.
* @param fontFamily - Optional.
* @param fontSize - Optional.
* @param fontStyle - Optional.
* @param fontVariant - Optional.
* @param fontWeight - Optional.
* @param fontStretch - Optional.
* @param letterSpacing - Optional.
* @param wordSpacing - Optional.
* @param textDecoration - Optional.
* @param pointerEvents - Optional.
* @param cursor - Optional.
*/
function GraphicStyle(fill, fillOpacity, fillRule, stroke, strokeWidth, strokeOpacity, strokeLinecap, strokeLinejoin, strokeMiterlimit, strokeDasharray, strokeDashoffset, vectorEffect, display, visibility, opacity, paintOrder, mask, fontFamily, fontSize, fontStyle, fontVariant, fontWeight, fontStretch, letterSpacing, wordSpacing, textDecoration, pointerEvents, cursor) {
// Fill.
this.fill = null;
this.fillOpacity = null;
this.fillRule = null;
// Stroke.
this.stroke = null;
this.strokeWidth = null;
this.strokeOpacity = null;
this.strokeLinecap = null;
this.strokeLinejoin = null;
this.strokeMiterlimit = null;
this.strokeDasharray = null;
this.strokeDashoffset = null;
this.vectorEffect = null;
// Display.
this.display = null;
this.visibility = null;
this.opacity = null;
this.paintOrder = null;
this.mask = null;
// Text.
this.fontFamily = null;
this.fontSize = null;
this.fontStyle = null;
this.fontVariant = null;
this.fontWeight = null;
this.fontStretch = null;
this.letterSpacing = null;
this.wordSpacing = null;
this.textDecoration = null;
// Interactivity.
this.pointerEvents = null;
this.cursor = null;
if (fill) {
this.fill = fill;
}
if (fillOpacity) {
this.fillOpacity = fillOpacity;
}
if (fillRule) {
this.fillRule = fillRule;
}
if (stroke) {
this.stroke = stroke;
}
if (strokeWidth) {
this.strokeWidth = strokeWidth;
}
if (strokeOpacity) {
this.strokeOpacity = strokeOpacity;
}
if (strokeLinecap) {
this.strokeLinecap = strokeLinecap;
}
if (strokeLinejoin) {
this.strokeLinejoin = strokeLinejoin;
}
if (strokeMiterlimit) {
this.strokeMiterlimit = strokeMiterlimit;
}
if (strokeDasharray) {
this.strokeDasharray = strokeDasharray;
}
if (strokeDashoffset) {
this.strokeDashoffset = strokeDashoffset;
}
if (vectorEffect) {
this.vectorEffect = vectorEffect;
}
if (display) {
this.display = display;
}
if (visibility) {
this.visibility = visibility;
}
if (opacity) {
this.opacity = opacity;
}
if (paintOrder) {
this.paintOrder = paintOrder;
}
if (mask) {
this.mask = mask;
}
if (fontFamily) {
this.fontFamily = fontFamily;
}
if (fontSize) {
this.fontSize = fontSize;
}
if (fontStyle) {
this.fontStyle = fontStyle;
}
if (fontVariant) {
this.fontVariant = fontVariant;
}
if (fontWeight) {
this.fontWeight = fontWeight;
}
if (fontStretch) {
this.fontStretch = fontStretch;
}
if (letterSpacing) {
this.letterSpacing = letterSpacing;
}
if (wordSpacing) {
this.wordSpacing = wordSpacing;
}
if (textDecoration) {
this.textDecoration = textDecoration;
}
if (pointerEvents) {
this.pointerEvents = pointerEvents;
}
if (cursor) {
this.cursor = cursor;
}
}
Object.defineProperty(GraphicStyle.prototype, "isEmpty", {
/**
* Returns whether the declaration is empty (all attributes are equal null).
*/
get: function () {
return (this.fill === null &&
this.fillOpacity === null &&
this.fillRule === null &&
this.stroke === null &&
this.strokeWidth === null &&
this.strokeOpacity === null &&
this.strokeLinecap === null &&
this.strokeLinejoin === null &&
this.strokeMiterlimit === null &&
this.strokeDasharray === null &&
this.strokeDashoffset === null &&
this.vectorEffect === null &&
this.display === null &&
this.visibility === null &&
this.opacity === null &&
this.paintOrder === null &&
this.mask === null &&
this.fontFamily === null &&
this.fontSize === null &&
this.fontStyle === null &&
this.fontVariant === null &&
this.fontWeight === null &&
this.fontStretch === null &&
this.letterSpacing === null &&
this.wordSpacing === null &&
this.textDecoration === null &&
this.pointerEvents === null &&
this.cursor === null);
},
enumerable: false,
configurable: true
});
/**
* Parse the value of an attribute from string.
* @param name - The name of the attribute.
* @param value - The value as a string.
*/
GraphicStyle.prototype.parseAttribute = function (name, value) {
if (name === 'fill') {
this.fill = value;
}
else if (name === 'fill-opacity') {
this.fillOpacity = parseFloat(value);
}
else if (name === 'fill-rule') {
this.fillRule = value;
}
else if (name === 'stroke') {
this.stroke = value;
}
else if (name === 'stroke-width') {
this.strokeWidth = parseFloat(value);
}
else if (name === 'stroke-opacity') {
this.strokeOpacity = parseFloat(value);
}
else if (name === 'stroke-linecap') {
this.strokeLinecap = value;
}
else if (name === 'stroke-linejoin') {
this.strokeLinejoin = value;
}
else if (name === 'stroke-miterlimit') {
this.strokeMiterlimit = parseFloat(value);
}
else if (name === 'stroke-dasharray') {
this.strokeDasharray = value;
}
else if (name === 'stroke-dashoffset') {
this.strokeDashoffset = parseFloat(value);
}
else if (name === 'vector-effect') {
this.vectorEffect = value;
}
else if (name === 'display') {
this.display = value;
}
else if (name === 'visibility') {
this.visibility = value;
}
else if (name === 'opacity') {
this.opacity = parseFloat(value);
}
else if (name === 'paint-order') {
this.paintOrder = value;
}
else if (name === 'mask') {
this.mask = value;
}
else if (name === 'font-family') {
this.fontFamily = value;
}
else if (name === 'font-size') {
this.fontSize = value;
}
else if (name === 'font-style') {
this.fontStyle = value;
}
else if (name === 'font-variant') {
this.fontVariant = value;
}
else if (name === 'font-weight') {
this.fontWeight = value;
}
else if (name === 'font-stretch') {
this.fontStretch = value;
}
else if (name === 'letter-spacing') {
this.letterSpacing = value;
}
else if (name === 'word-spacing') {
this.wordSpacing = value;
}
else if (name === 'text-decoration') {
this.textDecoration = value;
}
else if (name === 'pointer-events') {
this.pointerEvents = value;
}
else if (name === 'cursor') {
this.cursor = value;
}
};
/**
* Copy style attributes from given style declaration but don't override already existing values.
* @param declaration - The style declaration whose values to use.
*/
GraphicStyle.prototype.complementWith = function (declaration) {
if (this.fill === null) {
this.fill = declaration.fill;
}
if (this.fillOpacity === null) {
this.fillOpacity = declaration.fillOpacity;
}
if (this.fillRule === null) {
this.fillRule = declaration.fillRule;
}
if (this.stroke === null) {
this.stroke = declaration.stroke;
}
if (this.strokeWidth === null) {
this.strokeWidth = declaration.strokeWidth;
}
if (this.strokeOpacity === null) {
this.strokeOpacity = declaration.strokeOpacity;
}
if (this.strokeLinecap === null) {
this.strokeLinecap = declaration.strokeLinecap;
}
if (this.strokeLinejoin === null) {
this.strokeLinejoin = declaration.strokeLinejoin;
}
if (this.strokeMiterlimit === null) {
this.strokeMiterlimit = declaration.strokeMiterlimit;
}
if (this.strokeDasharray === null) {
this.strokeDasharray = declaration.strokeDasharray;
}
if (this.strokeDashoffset === null) {
this.strokeDashoffset = declaration.strokeDashoffset;
}
if (this.vectorEffect === null) {
this.vectorEffect = declaration.vectorEffect;
}
if (this.display === null) {
this.display = declaration.display;
}
if (this.visibility === null) {
this.visibility = declaration.visibility;
}
if (this.opacity === null) {
this.opacity = declaration.opacity;
}
if (this.paintOrder === null) {
this.paintOrder = declaration.paintOrder;
}
if (this.mask === null) {
this.mask = declaration.mask;
}
if (this.fontFamily === null) {
this.fontFamily = declaration.fontFamily;
}
if (this.fontSize === null) {
this.fontSize = declaration.fontSize;
}
if (this.fontStyle === null) {
this.fontStyle = declaration.fontStyle;
}
if (this.fontVariant === null) {
this.fontVariant = declaration.fontVariant;
}
if (this.fontWeight === null) {
this.fontWeight = declaration.fontWeight;
}
if (this.fontStretch === null) {
this.fontStretch = declaration.fontStretch;
}
if (this.letterSpacing === null) {
this.letterSpacing = declaration.letterSpacing;
}
if (this.wordSpacing === null) {
this.wordSpacing = declaration.wordSpacing;
}
if (this.textDecoration === null) {
this.textDecoration = declaration.textDecoration;
}
if (this.pointerEvents === null) {
this.pointerEvents = declaration.pointerEvents;
}
if (this.cursor === null) {
this.cursor = declaration.cursor;
}
};
/**
* Return the concatenated style declaration as string.
* @returns The concatenated style declaration as string.
*/
GraphicStyle.prototype.printStyle = function () {
var attributes = [];
if (this.fill) {
attributes.push("fill: ".concat(this.fill));
}
if (this.fillOpacity) {
attributes.push("fill-opacity: ".concat(this.fillOpacity));
}
if (this.fillRule) {
attributes.push("fill-rule: ".concat(this.fillRule));
}
if (this.stroke) {
attributes.push("stroke: ".concat(this.stroke));
}
if (this.strokeWidth) {
attributes.push("stroke-width: ".concat(this.strokeWidth));
}
if (this.strokeOpacity) {
attributes.push("stroke-opacity: ".concat(this.strokeOpacity));
}
if (this.strokeLinecap) {
attributes.push("stroke-linecap: ".concat(this.strokeLinecap));
}
if (this.strokeLinejoin) {
attributes.push("stroke-linejoin: ".concat(this.strokeLinejoin));
}
if (this.strokeMiterlimit) {
attributes.push("stroke-miterlimit: ".concat(this.strokeMiterlimit));
}
if (this.strokeDasharray) {
attributes.push("stroke-dasharray: ".concat(this.strokeDasharray));
}
if (this.strokeDashoffset) {
attributes.push("stroke-dashoffset: ".concat(this.strokeDashoffset));
}
if (this.vectorEffect) {
attributes.push("vector-effect: ".concat(this.vectorEffect));
}
if (this.display) {
attributes.push("display: ".concat(this.display));
}
if (this.visibility) {
attributes.push("visibility: ".concat(this.visibility));
}
if (this.opacity) {
attributes.push("opacity: ".concat(this.opacity));
}
if (this.paintOrder) {
attributes.push("paint-order: ".concat(this.paintOrder));
}
if (this.mask) {
attributes.push("mask: ".concat(this.mask));
}
if (this.fontFamily) {
attributes.push("font-family: ".concat(this.fontFamily));
}
if (this.fontSize) {
attributes.push("font-size: ".concat(this.fontSize));
}
if (this.fontStyle) {
attributes.push("font-style: ".concat(this.fontStyle));
}
if (this.fontVariant) {
attributes.push("font-variant: ".concat(this.fontVariant));
}
if (this.fontWeight) {
attributes.push("font-weight: ".concat(this.fontWeight));
}
if (this.fontStretch) {
attributes.push("font-stretch: ".concat(this.fontStretch));
}
if (this.letterSpacing) {
attributes.push("letter-spacing: ".concat(this.letterSpacing));
}
if (this.wordSpacing) {
attributes.push("word-spacing: ".concat(this.wordSpacing));
}
if (this.textDecoration) {
attributes.push("text-decoration: ".concat(this.textDecoration));
}
if (this.pointerEvents) {
attributes.push("pointer-events: ".concat(this.pointerEvents));
}
if (this.cursor) {
attributes.push("cursor: ".concat(this.cursor));
}
return attributes.join('; ');
};
return GraphicStyle;
}());
exports.GraphicStyle = GraphicStyle;