diff options
| -rw-r--r-- | ext/data/schemas/dictionary-term-bank-v3-schema.json | 12 | ||||
| -rw-r--r-- | ext/js/dictionary/dictionary-importer.js | 9 | ||||
| -rw-r--r-- | ext/js/display/sandbox/structured-content-generator.js | 4 | ||||
| -rw-r--r-- | test/data/dictionaries/valid-dictionary1/term_bank_1.json | 2 | ||||
| -rw-r--r-- | types/ext/dictionary-data.d.ts | 2 | ||||
| -rw-r--r-- | types/ext/structured-content.d.ts | 14 |
6 files changed, 37 insertions, 6 deletions
diff --git a/ext/data/schemas/dictionary-term-bank-v3-schema.json b/ext/data/schemas/dictionary-term-bank-v3-schema.json index bcb1d5ed..f85f893b 100644 --- a/ext/data/schemas/dictionary-term-bank-v3-schema.json +++ b/ext/data/schemas/dictionary-term-bank-v3-schema.json @@ -152,7 +152,7 @@ }, "height": { "type": "number", - "description": "Preferred width of the image.", + "description": "Preferred height of the image.", "minimum": 0 }, "title": { @@ -204,6 +204,14 @@ "description": "The vertical alignment of the image.", "enum": ["baseline", "sub", "super", "text-top", "text-bottom", "middle", "top", "bottom"] }, + "border": { + "type": "string", + "description": "Shorthand for border width, style, and color." + }, + "borderRadius": { + "type": "string", + "description": "Roundness of the corners of the image's outer border edge." + }, "sizeUnits": { "type": "string", "description": "The units for the width and height.", @@ -485,7 +493,7 @@ }, "height": { "type": "integer", - "description": "Preferred width of the image.", + "description": "Preferred height of the image.", "minimum": 1 }, "title": { diff --git a/ext/js/dictionary/dictionary-importer.js b/ext/js/dictionary/dictionary-importer.js index c8f68d78..0feed8b2 100644 --- a/ext/js/dictionary/dictionary-importer.js +++ b/ext/js/dictionary/dictionary-importer.js @@ -486,9 +486,16 @@ export class DictionaryImporter { * @param {import('dictionary-database').DatabaseTermEntry} entry */ async _resolveStructuredContentImage(context, target, source, entry) { - const {verticalAlign, sizeUnits} = source; + const { + verticalAlign, + border, + borderRadius, + sizeUnits + } = source; await this._createImageData(context, target, source, entry); if (typeof verticalAlign === 'string') { target.verticalAlign = verticalAlign; } + if (typeof border === 'string') { target.border = border; } + if (typeof borderRadius === 'string') { target.borderRadius = borderRadius; } if (typeof sizeUnits === 'string') { target.sizeUnits = sizeUnits; } } diff --git a/ext/js/display/sandbox/structured-content-generator.js b/ext/js/display/sandbox/structured-content-generator.js index f73d790a..ee86a7f4 100644 --- a/ext/js/display/sandbox/structured-content-generator.js +++ b/ext/js/display/sandbox/structured-content-generator.js @@ -73,6 +73,8 @@ export class StructuredContentGenerator { collapsed, collapsible, verticalAlign, + border, + borderRadius, sizeUnits } = data; @@ -130,6 +132,8 @@ export class StructuredContentGenerator { } imageContainer.style.width = `${usedWidth}em`; + if (typeof border === 'string') { imageContainer.style.border = border; } + if (typeof borderRadius === 'string') { imageContainer.style.borderRadius = borderRadius; } if (typeof title === 'string') { imageContainer.title = title; } diff --git a/test/data/dictionaries/valid-dictionary1/term_bank_1.json b/test/data/dictionaries/valid-dictionary1/term_bank_1.json index 7f2af6dd..9472bf5c 100644 --- a/test/data/dictionaries/valid-dictionary1/term_bank_1.json +++ b/test/data/dictionaries/valid-dictionary1/term_bank_1.json @@ -81,7 +81,7 @@ "Image alt text tests.\n𬵪 = Unicode character\n", {"tag": "img", "alt": "𬵪", "path": "aosaba_mono.png", "height": 1.0, "width": 1.0, "background": false, "sizeUnits": "em", "collapsed": false, "collapsible": false, "appearance": "monochrome"}, " = monochrome PNG\n", - {"tag": "img", "alt": "𬵪", "path": "aosaba_auto.png", "height": 1.0, "width": 1.0, "background": false, "sizeUnits": "em", "collapsed": false, "collapsible": false, "appearance": "auto"}, + {"tag": "img", "alt": "𬵪", "path": "aosaba_auto.png", "height": 1.0, "width": 1.0, "background": false, "sizeUnits": "em", "collapsed": false, "collapsible": false, "appearance": "auto", "borderRadius": "20%", "border": "solid 1px red"}, " = color PNG" ]}, {"type": "structured-content", "content": [ diff --git a/types/ext/dictionary-data.d.ts b/types/ext/dictionary-data.d.ts index 45db55bb..434f5a27 100644 --- a/types/ext/dictionary-data.d.ts +++ b/types/ext/dictionary-data.d.ts @@ -113,6 +113,8 @@ export type TermGlossaryDeinflection = [ export type TermImage = StructuredContent.ImageElementBase & { // Compatibility properties verticalAlign?: undefined; + border?: undefined; + borderRadius?: undefined; sizeUnits?: undefined; }; diff --git a/types/ext/structured-content.d.ts b/types/ext/structured-content.d.ts index 4f613969..e40a6730 100644 --- a/types/ext/structured-content.d.ts +++ b/types/ext/structured-content.d.ts @@ -41,6 +41,8 @@ export type ImageAppearance = 'auto' | 'monochrome'; export type Image = DictionaryData.TermImage & { verticalAlign: VerticalAlign; + border: string; + borderRadius: string; sizeUnits: SizeUnits; }; @@ -142,7 +144,7 @@ export type ImageElementBase = { */ width?: number; /** - * Preferred width of the image. + * Preferred height of the image. */ height?: number; /** @@ -151,7 +153,7 @@ export type ImageElementBase = { */ preferredWidth?: number; /** - * Preferred width of the image. + * Preferred height of the image. * This is only used in the internal database. */ preferredHeight?: number; @@ -204,6 +206,14 @@ export type ImageElement = ImageElementBase & { */ verticalAlign?: VerticalAlign; /** + * Shorthand for border width, style, and color. + */ + border?: string; + /** + * Roundness of the corners of the image's outer border edge. + */ + borderRadius?: string; + /** * The units for the width and height. */ sizeUnits?: SizeUnits; |