@breakside/jskit 2022.23.0 → 2022.25.1

package/Root/Frameworks/Foundation/JSTextFramesetter.js

@@ -18,15 +18,18 @@
 // #import "JSTextTypesetter.js"
 // #import "JSTextFrame.js"
 // #import "JSAttributedString.js"
+// #import "JSParagraphStyle.js"
 'use strict';
 
 (function(){
 
+var logger = JSLog("foundation", "text");
+
 JSClass("JSTextFramesetter", JSObject, {
 
     typesetter: JSReadOnlyProperty('_typesetter', null),
     attributedString: JSDynamicProperty(),
-    attributes: null,
+    defaultParagraphStyle: JSDynamicProperty("_defaultParagraphStyle", null),
 
     init: function(){
         this.initWithTypesetter(JSTextTypesetter.init());
@@ -34,7 +37,7 @@ JSClass("JSTextFramesetter", JSObject, {
 
     initWithTypesetter: function(typesetter){
         this._typesetter = typesetter;
-        this.attributes = Object.create(JSTextParagraphAttributes);
+        this._defaultParagraphStyle = JSParagraphStyle.init();
     },
 
     getAttributedString: function(){
@@ -45,8 +48,8 @@ JSClass("JSTextFramesetter", JSObject, {
         this._typesetter.attributedString = attributedString;
     },
 
-    constructFrame: function(lines, size, attributes){
-        return JSTextFrame.initWithLines(lines, size, attributes);
+    constructFrame: function(lines, size){
+        return JSTextFrame.initWithLines(lines, size);
     },
 
     createFrame: function(size, range, maximumLines){
@@ -61,35 +64,96 @@ JSClass("JSTextFramesetter", JSObject, {
         var widthLimit = size.width || Number.MAX_VALUE;
         var heightLimit = size.height || Number.MAX_VALUE;
         var lineLimit = maximumLines || Number.MAX_VALUE;
-        var spacing = 0;
+        var lineWidthLimit;
+        var attributes = this._typesetter.resolveAttributes(this._typesetter.attributedString.attributesAtIndex(remianingRange.location));
+        var paragraphStyle = this._defaultParagraphStyle.styleWithAttributes(attributes);
+        var characterIterator = this._typesetter.attributedString.string.userPerceivedCharacterIterator(remianingRange.location);
+        characterIterator.decrement();
         do{
-            lineRange = this._typesetter.suggestLineBreak(widthLimit, remianingRange, this.effectiveLineBreakMode(this.attributes.lineBreakMode, lines.length + 1, lineLimit));
+            lineWidthLimit = widthLimit;
+            if (lineWidthLimit < Number.MAX_VALUE){
+                if (characterIterator.isParagraphBreak){
+                    lineWidthLimit -= paragraphStyle.firstLineHeadIndent;
+                }else{
+                    lineWidthLimit -= paragraphStyle.headIndent;
+                }
+                lineWidthLimit -= paragraphStyle.tailIndent;
+            }
+            lineRange = this._typesetter.suggestLineBreak(lineWidthLimit, remianingRange, this.effectiveLineBreakMode(paragraphStyle.lineBreakMode, lines.length + 1, lineLimit));
             line = this._typesetter.createLine(lineRange);
             line.origin.y = y;
+            if (paragraphStyle.lineHeightMultiple > 0){
+                line.size.height *= paragraphStyle.lineHeightMultiple;
+            }
+            if (line.size.height < paragraphStyle.minimumLineHeight){
+                line.size.height = paragraphStyle.minimumLineHeight;
+            }
             y += line.size.height;
             if (y <= heightLimit){
-                spacing = Math.min(heightLimit - y, (this.attributes.lineSpacing - 1.0) * line.size.height);
-                line.size.height += Math.max(0, spacing);
-                y += spacing;
-                lines.push(line);
                 remianingRange.advance(line.range.length);
-            }else{
-                spacing = 0;
+                characterIterator = this._typesetter.attributedString.string.userPerceivedCharacterIterator(remianingRange.location);
+                characterIterator.decrement();
+                if (characterIterator.isParagraphBreak){
+                    y += Math.max(0, Math.min(heightLimit - y, paragraphStyle.paragraphSpacing));
+                    attributes = this._typesetter.resolveAttributes(this._typesetter.attributedString.attributesAtIndex(remianingRange.location));
+                    paragraphStyle = this._defaultParagraphStyle.styleWithAttributes(attributes);
+                    y += Math.max(0, Math.min(heightLimit - y, paragraphStyle.beforeParagraphSpacing));
+                }
+                y += Math.max(0, Math.min(heightLimit - y, paragraphStyle.lineSpacing));
+                lines.push(line);
             }
         } while (lineRange.length > 0 && remianingRange.length > 0 && y < heightLimit && lines.length < lineLimit);
 
-        if (this.attributes.lineBreakMode == JSLineBreakMode.truncateTail && lines.length > 0){
+        if (paragraphStyle.lineBreakMode == JSLineBreakMode.truncateTail && lines.length > 0){
             line = lines.pop();
             if (remianingRange.length > 0 && lineLimit > lines.length + 1){
                 // we got truncated because of height.  Re-run the last line so it
                 // gets broken according to truncation rules rather than word break
-                lineRange = this._typesetter.suggestLineBreak(widthLimit, JSRange(line.range.location, line.range.length + remianingRange.length), this.attributes.lineBreakMode);
+                lineRange = this._typesetter.suggestLineBreak(widthLimit, JSRange(line.range.location, line.range.length + remianingRange.length), paragraphStyle.lineBreakMode);
                 line = this._typesetter.createLine(lineRange);
             }
             var truncated = line.truncatedLine(widthLimit);
             lines.push(truncated);
         }
-        return this.constructFrame(lines, size, this.attributes);
+        var frame = this.constructFrame(lines, size);
+        this._alignLinesInFrame(frame);
+        return frame;
+    },
+
+    _resizeFrame: function(frame, size){
+        if (size.width < frame._usedSize.width || size.height < frame._usedSize.height){
+            throw new Error("Cannot adjust text frame to smaller than its used size");
+        }
+        frame._size = JSSize(size);
+        this._alignLinesInFrame(frame);
+    },
+
+    _alignLinesInFrame: function(frame){
+        var i, l;
+        var line;
+        var attributes;
+        var headIndent = 0;
+        var characterIterator;
+        var paragraphStyle;
+        for (i = 0, l = frame.lines.length; i < l; ++i){
+            line = frame.lines[i];
+            attributes = this._typesetter.resolveAttributes(this._typesetter.attributedString.attributesAtIndex(line.range.location));
+            paragraphStyle = this._defaultParagraphStyle.styleWithAttributes(attributes);
+            characterIterator = this._typesetter.attributedString.string.userPerceivedCharacterIterator(line.range.location);
+            characterIterator.decrement();
+            if (characterIterator.isParagraphBreak){
+                headIndent = paragraphStyle.firstLineHeadIndent;
+            }else{
+                headIndent = paragraphStyle.headIndent;
+            }
+            if (paragraphStyle.textAlignment === JSTextAlignment.left){
+                line.origin.x = headIndent;
+            }else if (paragraphStyle.textAlignment === JSTextAlignment.center){
+                line.origin.x = headIndent + (frame._size.width - headIndent - paragraphStyle.tailIndent - line.size.width + line.trailingWhitespaceWidth) / 2.0;
+            }else if (paragraphStyle.textAlignment === JSTextAlignment.right){
+                line.origin.x = (frame._size.width - line.size.width + line.trailingWhitespaceWidth) - paragraphStyle.tailIndent;
+            }
+        }
     },
 
     effectiveLineBreakMode: function(frameLineBreakMode, lineNumber, lineLimit){
@@ -104,15 +168,54 @@ JSClass("JSTextFramesetter", JSObject, {
             case JSLineBreakMode.characterWrap:
                 return frameLineBreakMode;
         }
+    },
+
+    // Deprecated:
+
+    attributes: JSReadOnlyProperty("_attributes", null),
+
+    getAttributes: function(){
+        logger.warn("JSTextFramesetter.attributes is deprecated");
+        if (this._attributes === null){
+            var framesetter = this;
+            this._attributes = Object.create({}, {
+                lineBreakMode: {
+                    get: function(){
+                        return framesetter._defaultParagraphStyle.lineBreakMode;
+                    },
+                    set: function(lineBreakMode){
+                        framesetter._defaultParagraphStyle.lineBreakMode = lineBreakMode;
+                    }
+                },
+                textAlignment: {
+                    get: function(){
+                        return framesetter._defaultParagraphStyle.textAlignment;
+                    },
+                    set: function(textAlignment){
+                        framesetter._defaultParagraphStyle.textAlignment = textAlignment;
+                    }
+                },
+                lineSpacing: {
+                    get: function(){
+                        return framesetter._defaultParagraphStyle.lineHeightMultiple > 0 ? framesetter._defaultParagraphStyle.lineHeightMultiple : 1.0;
+                    },
+                    set: function(lineSpacing){
+                        framesetter._defaultParagraphStyle.lineHeightMultiple = lineSpacing;
+                    }
+                },
+                minimumLineHeight: {
+                    get: function(){
+                        return framesetter._defaultParagraphStyle.minimumLineHeight;
+                    },
+                    set: function(minimumLineHeight){
+                        framesetter._defaultParagraphStyle.minimumLineHeight = minimumLineHeight;
+                    }
+                }
+            });
+        }
+        return this._attributes;
     }
 
 });
 
-var JSTextParagraphAttributes = {
-    minimumLineHeight: 0,
-    lineSpacing: 1.0,
-    textAlignment: JSTextAlignment.left,
-    lineBreakMode: JSLineBreakMode.truncateTail
-};
-
 })();

package/Root/Frameworks/Foundation/JSTextLayoutManager.js

@@ -17,6 +17,7 @@
 // #import "CoreTypes.js"
 // #import "JSAttributedString.js"
 // #import "JSColor.js"
+// #import "JSParagraphStyle.js"
 'use strict';
 
 (function(){
@@ -26,6 +27,7 @@ JSClass("JSTextLayoutManager", JSObject, {
     textStorage: JSDynamicProperty('_textStorage', null),
     defaultFont: JSDynamicProperty('_defaultFont', null),
     defaultTextColor: JSDynamicProperty('_defaultTextColor', null),
+    defaultParagraphStyle: JSDynamicProperty("_defaultParagraphStyle", null),
     includeEmptyFinalLine: false,
 
     delegate: null,
@@ -37,6 +39,7 @@ JSClass("JSTextLayoutManager", JSObject, {
     init: function(){
         this._textContainers = [];
         this._defaultTextColor = JSColor.black;
+        this._defaultParagraphStyle = JSParagraphStyle.init();
     },
 
     // MARK: - Managing Containers
@@ -106,6 +109,11 @@ JSClass("JSTextLayoutManager", JSObject, {
         this.setNeedsLayout();
     },
 
+    setDefaultParagraphStyle: function(paragraphStyle){
+        this._defaultParagraphStyle = paragraphStyle;
+        this.setNeedsLayout();
+    },
+
     // MARK: - Private Helpers for finalizing runs
 
     effectiveAttributedString: function(){
@@ -353,13 +361,13 @@ JSClass("JSTextLayoutManager", JSObject, {
                     rightX += 8;
                 }
             }else{
-                characterRect = line.rectForCharacterAtIndex(remainingRange.end - line.range.location);
+                characterRect = line.rectForCharacterAtIndex(remainingRange.end);
                 rightX = characterRect.origin.x;
             }
             if (remainingRange.location === line.range.location){
                 leftX = 0;
             }else{
-                characterRect = line.rectForCharacterAtIndex(remainingRange.location - line.range.location);
+                characterRect = line.rectForCharacterAtIndex(remainingRange.location);
                 leftX = characterRect.origin.x;
             }
             rect = JSRect(line.origin.x + leftX, line.origin.y, rightX - leftX, line.size.height);
@@ -406,7 +414,7 @@ var JSTextLayoutManagerLineEnumerator = function(layoutManager, index){
         this._containerIndex = layoutManager._textContainerIndexForCharacterAtIndex(index);
         var container = this.container;
         if (container !== null){
-            this._lineIndex = container.lineIndexForCharacterAtIndex(index - container.range.location);
+            this._lineIndex = container.lineIndexForCharacterAtIndex(index);
         }else{
             this._lineIndex = 0;
         }

package/Root/Frameworks/Foundation/JSTextLine.js

@@ -72,6 +72,7 @@ JSClass("JSTextLine", JSObject, {
         }
         var height = this._size.height;
         for (i = 0, l = this._runs.length; i < l; ++i){
+            run = this._runs[i];
             if (run.size.height - run.baseline + baseline > height){
                 height = run.size.height - run.baseline + baseline;
             }
@@ -105,7 +106,7 @@ JSClass("JSTextLine", JSObject, {
     rectForCharacterAtIndex: function(index){
         var run = this.runForCharacterAtIndex(index);
         if (run !== null){
-            var rect = run.rectForCharacterAtIndex(index - (run.range.location - this.range.location));
+            var rect = run.rectForCharacterAtIndex(index);
             rect.origin.x += run.origin.x;
             rect.origin.y += run.origin.y;
             return rect;
@@ -132,7 +133,7 @@ JSClass("JSTextLine", JSObject, {
         while (min < max){
             mid = Math.floor(min + (max - min) / 2);
             run = this._runs[mid];
-            i = run.range.location - this.range.location;
+            i = run.range.location;
             l = run.range.length;
             if (index < i){
                 max = mid;
@@ -178,7 +179,7 @@ JSClass("JSTextLine", JSObject, {
     },
 
     copy: function(){
-        var line = JSTextLine.init();
+        var line = this.$class.init();
         line._origin = JSPoint(this._origin);
         line._size = JSSize(this._size);
         line._trailingWhitespaceWidth = this._trailingWhitespaceWidth;

package/Root/Frameworks/Foundation/JSTextRun.js

@@ -39,7 +39,7 @@ JSClass("JSTextRun", JSObject, {
         this.attachment = attributes[JSAttributedString.Attribute.attachment] || null;
         if (this.attachment){
             this.baseline = this.attachment.baselineAdjustment;
-            this._size = JSSize(this.attachment.size.width, this.attachment.size.height - Math.min(0, this.attachment.baselineAdjustment));
+            this._size = JSSize(this.attachment.size);
         }else{
             this.font = font;
             this.baseline = -font.descender;
@@ -113,7 +113,7 @@ JSClass("JSTextRun", JSObject, {
         var glyph = null;
         var width;
         var characterLength;
-        var runningIndex = 0;
+        var runningIndex = this.range.location;
         for (var i = 0, l = this.glyphs.length; runningIndex < index && i < l; ++i){
             glyph = this.glyphs[i];
             width = this.font.widthOfGlyph(glyph);
@@ -130,11 +130,13 @@ JSClass("JSTextRun", JSObject, {
     },
 
     copy: function(){
-        var run = JSTextRun.init();
+        var run = this.$class.init();
         run._origin = JSPoint(this._origin);
         run._size = JSSize(this._size);
+        run.baseline = this.baseline;
         run._range = JSRange(this._range);
         run.attributes = this.attributes;
+        run.attachment = this.attachment;
         run.font = this.font;
         run.glyphs = [];
         run.glyphCharacterLengths = [];

package/Root/Frameworks/Foundation/JSTextTypesetter.js

@@ -14,6 +14,7 @@
 // limitations under the License.
 
 // #import "JSObject.js"
+// #import "JSProtocol.js"
 // #import "CoreTypes.js"
 // #import "JSAttributedString.js"
 // #import "JSFont.js"
@@ -26,6 +27,12 @@
 
 var logger = JSLog("foundation", "text");
 
+JSProtocol("JSTextTypesetterDelegate", JSProtocol, {
+
+    typesetterAttributesForStringAttributes: function(typesetter, stringAttributes){}
+
+});
+
 JSClass("JSTextTypesetter", JSObject, {
 
     attributedString: JSDynamicProperty('_attributedString'),
@@ -68,7 +75,8 @@ JSClass("JSTextTypesetter", JSObject, {
 
     _createEmptyLine: function(range){
         var attributes = this._attributedString.attributesAtIndex(range.location);
-        var font = JSTextTypesetter.FontFromAttributes(attributes);
+        attributes = this.resolveAttributes(attributes);
+        var font = attributes.font;
         return JSTextLine.initWithHeight(font.lineHeight, -font.descender, range.location);
     },
 
@@ -129,16 +137,18 @@ JSClass("JSTextTypesetter", JSObject, {
 
         var iterator = this._attributedString.string.userPerceivedCharacterIterator(range.location);
         var runIterator = this._attributedString.runIterator(range.location);
-        var initialLineAttributes = runIterator.attributes;
         var codeIterator;
         var attachment;
+        var attributes;
         // TODO: support mask character (only important if we need to rasterize a password field, which isn't a major use case)
         // Create run descriptors that at fill the line, maybe going a bit over
         do {
 
+            attributes = this.resolveAttributes(runIterator.attributes);
+
             // If we're at the start of a new run, make a new run descriptor
             if (runDescriptor === null){
-                runDescriptor = JSTextTypesetterRunDescriptor(remainingRange.location, runIterator.attributes);
+                runDescriptor = JSTextTypesetterRunDescriptor(remainingRange.location, attributes);
                 runDescriptors.push(runDescriptor);
                 preferredFont = runDescriptor.font;
             }
@@ -146,9 +156,10 @@ JSClass("JSTextTypesetter", JSObject, {
             // Check some properties of this character
             newline = iterator.isMandatoryLineBreak;
             printable = !newline && !iterator.isWhiteSpace;
+            attachment = runIterator.attachment;
 
             // Adjust the run's font if needed
-            if (runIterator.range.length == 1 && iterator.firstCharacter.code == JSAttributedString.SpecialCharacter.attachment){
+            if (attachment !== null){
                 // 1. Attachment font:
                 // Attachment runs use a special "attachment font" that can draw the attachment rather
                 // than draw a glyph.  It's perhaps a little strange to call an attachment a font, but
@@ -156,7 +167,6 @@ JSClass("JSTextTypesetter", JSObject, {
                 // here is actually a specially drawn attachment.  The attachment font has a single glyph
                 // that corresponds to the 0xFFFC attachment character code, whose width matches the
                 // attachment's width
-                attachment = runIterator.attributes[JSAttributedString.Attribute.attachment];
                 attachment.layout(preferredFont, width);
                 usedWidth += attachment.size.width;
                 runDescriptor.glyphs.push(0);
@@ -169,7 +179,7 @@ JSClass("JSTextTypesetter", JSObject, {
                     // If our preferred font has a glyph for the character, but we're in a run
                     // that is using a fallback font, create a new run, switching back to the preferred font
                     if (runDescriptor.font !== preferredFont){
-                        runDescriptor = JSTextTypesetterRunDescriptor(remainingRange.location, runIterator.attributes);
+                        runDescriptor = JSTextTypesetterRunDescriptor(remainingRange.location, attributes);
                         runDescriptors.push(runDescriptor);
                     }
                 }else{
@@ -179,7 +189,7 @@ JSClass("JSTextTypesetter", JSObject, {
                     // If the fallback doesn't match our run, adjust the run or create a new run depending on if it's emtpy
                     if (fallbackFont !== runDescriptor.font){
                         if (runDescriptor.length > 0){
-                            runDescriptor = JSTextTypesetterRunDescriptor(remainingRange.location, runIterator.attributes);
+                            runDescriptor = JSTextTypesetterRunDescriptor(remainingRange.location, attributes);
                             runDescriptors.push(runDescriptor);
                         }
                         runDescriptor.font = fallbackFont;
@@ -317,7 +327,27 @@ JSClass("JSTextTypesetter", JSObject, {
         if (ranges.length === 0){
             ranges.push(JSTextTypesetterPrintableRange(location, 0, 0));
         }
-    }
+    },
+
+    delegate: null,
+
+    resolveAttributes: function(attributes){
+        if (attributes.font){
+            if (attributes.bold || attributes.italic){
+                attributes = JSCopy(attributes);
+                if (attributes.bold){
+                    attributes.font = attributes.font.fontWithWeight(JSFont.Weight.bold);
+                }
+                if (attributes.italic){
+                    attributes.font = attributes.font.fontWithStyle(JSFont.Style.italic);
+                }
+            }
+        }
+        if (this.delegate && this.delegate.typesetterAttributesForStringAttributes){
+            attributes = this.delegate.typesetterAttributesForStringAttributes(this, attributes);
+        }
+        return attributes;
+    },
 
 });
 
@@ -329,8 +359,8 @@ var JSTextTypesetterRunDescriptor = function(location, attributes){
         this.location = location.location;
         this.attributes = location.attributes;
         this.length = location.length;
-        this.glyphs = location.glyphs;
-        this.glyphCharacterLengths = location.glyphCharacterLengths;
+        this.glyphs = JSCopy(location.glyphs);
+        this.glyphCharacterLengths = JSCopy(location.glyphCharacterLengths);
         this.font = location.font;
     }else{
         this.location = location;
@@ -338,7 +368,7 @@ var JSTextTypesetterRunDescriptor = function(location, attributes){
         this.length = 0;
         this.glyphs = [];
         this.glyphCharacterLengths = [];
-        this.font = JSTextTypesetter.FontFromAttributes(attributes);
+        this.font = attributes.font || null;
     }
 };
 
@@ -357,18 +387,4 @@ var JSTextTypesetterPrintableRange = function(location, length, width){
     }
 };
 
-JSTextTypesetter.FontFromAttributes = function(attributes){
-    var font = attributes[JSAttributedString.Attribute.font];
-    if (!font){
-        return null;
-    }
-    if (attributes[JSAttributedString.Attribute.bold]){
-        font = font.fontWithWeight(JSFont.Weight.bold);
-    }
-    if (attributes[JSAttributedString.Attribute.italic]){
-        font = font.fontWithStyle(JSFont.Style.italic);
-    }
-    return font;
-};
-
 })();

package/Root/Frameworks/Foundation/JSURL.js

@@ -523,6 +523,9 @@ JSClass("JSURL", JSObject, {
     },
 
     isEqual: function(url){
+        if (url === null || url === undefined){
+            return false;
+        }
         if (this._scheme !== url._scheme){
             return false;
         }