Skip to content

Commit

Permalink
Add support for more HTML attributes and style declarations in struct…
Browse files Browse the repository at this point in the history 
…ured content (#450)

* Add support for more HTMl attributes and style declarations

* Update test term to use new `margin` property

* Allow string values for 'padding' and 'margin' properties

* Remove newly added default 'unset' values from term bank schema

---------

Co-authored-by: stephenmk <stephenmk@users.noreply.github.com>
  • Loading branch information
@stephenmk
stephenmk and stephenmk authored Dec 27, 2023
1 parent 8e95d99 commit adc17f4
Show file tree
Hide file tree
Showing 7 changed files with 904 additions and 13 deletions.
3 changes: 2 additions & 1 deletion .eslintrc.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -559,7 +559,8 @@
},
{
"files": [
"test/data/dictionaries/valid-dictionary1/term_bank_1.json"
"test/data/dictionaries/valid-dictionary1/term_bank_1.json",
"test/data/dictionaries/valid-dictionary1/term_bank_2.json"
],
"rules": {
"jsonc/array-element-newline": [
Expand Down
69 changes: 65 additions & 4 deletions ext/data/schemas/dictionary-term-bank-v3-schema.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -115,6 +115,10 @@
"style": {
"$ref": "#/definitions/structuredContentStyle"
},
"title": {
"type": "string",
"description": "Hover text for the element."
},
"lang": {
"type": "string",
"description": "Defines the language of an element in the format defined by RFC 5646."
Expand Down Expand Up @@ -263,6 +267,12 @@
"type": "string",
"default": "medium"
},
"color": {
"type": "string"
},
"backgroundColor": {
"type": "string"
},
"textDecorationLine": {
"oneOf": [
{
Expand All @@ -280,6 +290,26 @@
}
]
},
"textDecorationStyle": {
"type": "string",
"enum": ["solid", "double", "dotted", "dashed", "wavy"],
"default": "solid"
},
"textDecorationColor": {
"type": "string"
},
"borderColor": {
"type": "string"
},
"borderStyle": {
"type": "string"
},
"borderRadius": {
"type": "string"
},
"borderWidth": {
"type": "string"
},
"verticalAlign": {
"type": "string",
"enum": ["baseline", "sub", "super", "text-top", "text-bottom", "middle", "top", "bottom"],
Expand All @@ -290,22 +320,53 @@
"enum": ["start", "end", "left", "right", "center", "justify", "justify-all", "match-parent"],
"default": "start"
},
"margin": {
"type": "string"
},
"marginTop": {
"type": "number",
"type": ["number", "string"],
"default": 0
},
"marginLeft": {
"type": "number",
"type": ["number", "string"],
"default": 0
},
"marginRight": {
"type": "number",
"type": ["number", "string"],
"default": 0
},
"marginBottom": {
"type": "number",
"type": ["number", "string"],
"default": 0
},
"padding": {
"type": "string"
},
"paddingTop": {
"type": "string"
},
"paddingLeft": {
"type": "string"
},
"paddingRight": {
"type": "string"
},
"paddingBottom": {
"type": "string"
},
"wordBreak": {
"type": "string",
"enum": ["normal", "break-all", "keep-all"],
"default": "normal"
},
"whiteSpace": {
"type": "string",
"default": "normal"
},
"cursor": {
"type": "string",
"default": "auto"
},
"listStyleType": {
"type": "string",
"default": "disc"
Expand Down
45 changes: 44 additions & 1 deletion ext/js/display/sandbox/structured-content-generator.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -321,10 +321,11 @@ export class StructuredContentGenerator {
break;
}
if (hasStyle) {
const {style} = /** @type {import('structured-content').StyledElement} */ (content);
const {style, title} = /** @type {import('structured-content').StyledElement} */ (content);
if (typeof style === 'object' && style !== null) {
this._setStructuredContentElementStyle(node, style);
}
if (typeof title === 'string') { node.title = title; }
}
if (hasChildren) {
this._appendStructuredContent(node, content.content, dictionary, language);
Expand All @@ -342,29 +343,71 @@ export class StructuredContentGenerator {
fontStyle,
fontWeight,
fontSize,
color,
backgroundColor,
textDecorationLine,
textDecorationStyle,
textDecorationColor,
borderColor,
borderStyle,
borderRadius,
borderWidth,
verticalAlign,
textAlign,
margin,
marginTop,
marginLeft,
marginRight,
marginBottom,
padding,
paddingTop,
paddingLeft,
paddingRight,
paddingBottom,
wordBreak,
whiteSpace,
cursor,
listStyleType
} = contentStyle;
if (typeof fontStyle === 'string') { style.fontStyle = fontStyle; }
if (typeof fontWeight === 'string') { style.fontWeight = fontWeight; }
if (typeof fontSize === 'string') { style.fontSize = fontSize; }
if (typeof color === 'string') { style.color = color; }
if (typeof backgroundColor === 'string') { style.backgroundColor = backgroundColor; }
if (typeof verticalAlign === 'string') { style.verticalAlign = verticalAlign; }
if (typeof textAlign === 'string') { style.textAlign = textAlign; }
if (typeof textDecorationLine === 'string') {
style.textDecoration = textDecorationLine;
} else if (Array.isArray(textDecorationLine)) {
style.textDecoration = textDecorationLine.join(' ');
}
if (typeof textDecorationStyle === 'string') {
style.textDecorationStyle = textDecorationStyle;
}
if (typeof textDecorationColor === 'string') {
style.textDecorationColor = textDecorationColor;
}
if (typeof borderColor === 'string') { style.borderColor = borderColor; }
if (typeof borderStyle === 'string') { style.borderStyle = borderStyle; }
if (typeof borderRadius === 'string') { style.borderRadius = borderRadius; }
if (typeof borderWidth === 'string') { style.borderWidth = borderWidth; }
if (typeof margin === 'string') { style.margin = margin; }
if (typeof marginTop === 'number') { style.marginTop = `${marginTop}em`; }
if (typeof marginTop === 'string') { style.marginTop = marginTop; }
if (typeof marginLeft === 'number') { style.marginLeft = `${marginLeft}em`; }
if (typeof marginLeft === 'string') { style.marginLeft = marginLeft; }
if (typeof marginRight === 'number') { style.marginRight = `${marginRight}em`; }
if (typeof marginRight === 'string') { style.marginRight = marginRight; }
if (typeof marginBottom === 'number') { style.marginBottom = `${marginBottom}em`; }
if (typeof marginBottom === 'string') { style.marginBottom = marginBottom; }
if (typeof padding === 'string') { style.padding = padding; }
if (typeof paddingTop === 'string') { style.paddingTop = paddingTop; }
if (typeof paddingLeft === 'string') { style.paddingLeft = paddingLeft; }
if (typeof paddingRight === 'string') { style.paddingRight = paddingRight; }
if (typeof paddingBottom === 'string') { style.paddingBottom = paddingBottom; }
if (typeof wordBreak === 'string') { style.wordBreak = wordBreak; }
if (typeof whiteSpace === 'string') { style.whiteSpace = whiteSpace; }
if (typeof cursor === 'string') { style.cursor = cursor; }
if (typeof listStyleType === 'string') { style.listStyleType = listStyleType; }
}

Expand Down
Loading

0 comments on commit adc17f4

Please sign in to comment.