Rtl labels support #5771
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -8,6 +8,7 @@ define([ | |
| '../Core/defineProperties', | ||
| '../Core/DeveloperError', | ||
| '../Core/DistanceDisplayCondition', | ||
| '../Core/freezeObject', | ||
| '../Core/NearFarScalar', | ||
| './Billboard', | ||
| './HeightReference', | ||
|
|
@@ -24,6 +25,7 @@ define([ | |
| defineProperties, | ||
| DeveloperError, | ||
| DistanceDisplayCondition, | ||
| freezeObject, | ||
| NearFarScalar, | ||
| Billboard, | ||
| HeightReference, | ||
|
|
@@ -147,6 +149,9 @@ define([ | |
|
|
||
| this._clusterShow = true; | ||
|
|
||
| this._rtl = defaultValue(options.rtl, false); | ||
| this.text = defaultValue(options.text, ''); | ||
|
|
||
| this._updateClamping(); | ||
| } | ||
|
|
||
|
|
@@ -279,6 +284,15 @@ define([ | |
| } | ||
| //>>includeEnd('debug'); | ||
|
|
||
| if (this.rtl) { | ||
| if (this._originalValue === value) { | ||
| value = this._text; | ||
| return; | ||
| } | ||
| this._originalValue = value; | ||
| value = this.reverseRtl(value); | ||
| } | ||
|
|
||
| if (this._text !== value) { | ||
| this._text = value; | ||
| rebindAllGlyphs(this); | ||
|
|
@@ -1030,6 +1044,42 @@ define([ | |
| } | ||
| } | ||
| } | ||
| }, | ||
|
|
||
| /** | ||
| * Determines whether or not run the reverseRtl algorithm on the text of the label | ||
| * @memberof Label.prototype | ||
| * @type {Boolean} | ||
| * @default false | ||
| * | ||
| * @example | ||
| * // Example 1. | ||
| * // Set a label's rtl during init | ||
| * var myLabelEntity = viewer.entities.add({ | ||
| * id: 'my label', | ||
| * text: 'זה טקסט בעברית \n ועכשיו יורדים שורה', | ||
| * rtl: true | ||
| * }); | ||
| * | ||
| * @example | ||
| * // Example 2. | ||
| * var myLabelEntity = viewer.entities.add({ | ||
| * id: 'my label', | ||
| * text: 'English text' | ||
| * }); | ||
| * // Set a label's rtl after init | ||
| * myLabelEntity.rtl = true; | ||
| * myLabelEntity.text = 'טקסט חדש' | ||
| */ | ||
| rtl : { | ||
| get : function() { | ||
| return this._rtl; | ||
| }, | ||
| set : function(value) { | ||
| if (this._rtl !== value) { | ||
| this._rtl = value; | ||
|
There was a problem hiding this comment. I think you should call There was a problem hiding this comment. Thank you @ggetz for your comments. I will fix them after the weekend. There was a problem hiding this comment. Thanks @hodbauer! If I understand correctly, if That may be confusing to people using this feature. |
||
| } | ||
| } | ||
| } | ||
| }); | ||
|
|
||
|
|
@@ -1196,5 +1246,171 @@ define([ | |
| return false; | ||
| }; | ||
|
|
||
| function declareTypes() { | ||
| var TextTypes = { | ||
|
There was a problem hiding this comment. I would just declare this at the top of the file instead of creating it every time. Then just use There was a problem hiding this comment. @mramato If I understand you, you want me to change the code to something like: var TextTypes = freezeObject({
LTR : 0,
RTL : 1,
WEAK : 2,
BRACKETS : 3
});
return TextTypes;and put it inside the define near to the glyph functions as is (without a function scope)? There was a problem hiding this comment. Yes, though you won't need the |
||
| LTR : 0, | ||
| RTL : 1, | ||
| WEAK : 2, | ||
| BRACKETS : 3 | ||
| }; | ||
| return freezeObject(TextTypes); | ||
| } | ||
|
|
||
| function convertTextToTypes(text, rtlDir, rtlChars) { | ||
| var ltrChars = /[a-zA-Z0-9]/; | ||
| var bracketsChars = /[()[\]{}<>]/; | ||
| var parsedText = []; | ||
| var word = ''; | ||
| var types = declareTypes(); | ||
| var lastType = rtlDir ? types.RTL : types.LTR; | ||
| var currentType = ''; | ||
| var textLength = text.length; | ||
| for (var textIndex = 0; textIndex < textLength; ++textIndex) { | ||
| var character = text.charAt(textIndex); | ||
| if (rtlChars.test(character)) { | ||
| currentType = types.RTL; | ||
| } | ||
| else if (ltrChars.test(character)) { | ||
| currentType = types.LTR; | ||
| } | ||
| else if (bracketsChars.test(character)) { | ||
| currentType = types.BRACKETS; | ||
| } | ||
| else { | ||
| currentType = types.WEAK; | ||
| } | ||
|
|
||
| if (lastType === currentType && currentType !== types.BRACKETS) { | ||
| word += character; | ||
| } | ||
| else { | ||
| parsedText.push({Type : lastType, Word : word}); | ||
| lastType = currentType; | ||
| word = character; | ||
| } | ||
| } | ||
| parsedText.push({Type : currentType, Word : word}); | ||
| return parsedText; | ||
| } | ||
|
|
||
| function reverseWord(word) { | ||
| return word.split('').reverse().join(''); | ||
| } | ||
|
|
||
| function spliceWord(result, pointer, word) { | ||
| return result.slice(0, pointer) + word + result.slice(pointer); | ||
| } | ||
|
|
||
| function reverseBrackets(bracket) { | ||
| switch(bracket) { | ||
| case '(': | ||
| return ')'; | ||
| case ')': | ||
| return '('; | ||
| case '[': | ||
| return ']'; | ||
| case ']': | ||
| return '['; | ||
| case '{': | ||
| return '}'; | ||
| case '}': | ||
| return '{'; | ||
| case '<': | ||
| return '>'; | ||
| case '>': | ||
| return '<'; | ||
| } | ||
| } | ||
|
|
||
| /** | ||
| * | ||
| * @param {String} text the text to parse and reorder | ||
| * @returns {String} the text as rtl direction | ||
| */ | ||
| Label.prototype.reverseRtl = function(value) { | ||
|
There was a problem hiding this comment. This function should be private, I don't think anyone should be calling this directly. |
||
| var rtlChars = /[א-ת]/; | ||
| var texts = value.split('\n'); | ||
| var result = ''; | ||
| for (var i = 0; i < texts.length; i++) { | ||
| var text = texts[i]; | ||
| var rtlDir = rtlChars.test(text.charAt(0)); | ||
| var parsedText = convertTextToTypes(text, rtlDir, rtlChars); | ||
|
|
||
| var types = declareTypes(); | ||
|
|
||
| var splicePointer = 0; | ||
| for(var wordIndex = 0; wordIndex < parsedText.length; ++wordIndex) { | ||
| var subText = parsedText[wordIndex]; | ||
| var reverse = subText.Type === types.BRACKETS ? reverseBrackets(subText.Word) : subText.Word; | ||
| if(rtlDir) { | ||
| if (subText.Type === types.RTL) { | ||
| result = reverseWord(subText.Word) + result; | ||
| splicePointer = 0; | ||
| } | ||
| else if (subText.Type === types.LTR) { | ||
| result = spliceWord(result,splicePointer, subText.Word); | ||
| splicePointer += subText.Word.length; | ||
| } | ||
| else if (subText.Type === types.WEAK || subText.Type ===types.BRACKETS) { | ||
| if (parsedText[wordIndex -1].Type === types.RTL) { | ||
|
There was a problem hiding this comment. Add a space after the operator here and throughout. |
||
| result = reverse + result; | ||
| splicePointer = 0; | ||
| } | ||
| else if (parsedText.length > wordIndex +1) { | ||
| if (parsedText[wordIndex +1].Type === types.RTL) { | ||
| result = reverse + result; | ||
| splicePointer = 0; | ||
| } | ||
| else { | ||
| result = spliceWord(result,splicePointer, subText.Word); | ||
| splicePointer += subText.Word.length; | ||
| } | ||
| } | ||
| else { | ||
| result = spliceWord(result,splicePointer, subText.Word); | ||
| } | ||
| } | ||
| } | ||
| else if (subText.Type === types.RTL) { | ||
| result = spliceWord(result, splicePointer, reverseWord(subText.Word)); | ||
| } | ||
| else if (subText.Type === types.LTR) { | ||
| result += subText.Word; | ||
| splicePointer = result.length; | ||
| } | ||
| else if (subText.Type === types.WEAK || subText.Type ===types.BRACKETS) { | ||
|
|
||
| if (wordIndex > 0) { | ||
| if (parsedText[wordIndex -1].Type === types.RTL) { | ||
| if (parsedText.length > wordIndex +1) { | ||
| if (parsedText[wordIndex +1].Type === types.LTR) { | ||
| result += subText.Word; | ||
| splicePointer = result.length; | ||
| } | ||
| else if (parsedText[wordIndex +1].Type === types.RTL) { | ||
| result = spliceWord(result, splicePointer, reverse); | ||
| } | ||
| } | ||
| else { | ||
| result += subText.Word; | ||
| } | ||
| } | ||
| else { | ||
| result += subText.Word; | ||
| splicePointer = result.length; | ||
| } | ||
| } | ||
| else { | ||
| result += subText.Word; | ||
| splicePointer = result.length; | ||
| } | ||
| } | ||
| } | ||
| if (i < texts.length - 1) { | ||
| result += '\n'; | ||
| } | ||
| } | ||
| return result; | ||
| }; | ||
|
|
||
| return Label; | ||
| }); | ||
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Can you be more descriptive for the button label? Maybe
Set label with right-to-left language