Google script string with style - string

I'm quite puzzled with how strings are handled in Google Script. In particular, it seems that strings can be styled, but I have no idea how to actually do this.
For instance: I create a Google Form, add a Short Text question, and copy paste a bold text generated here : https://lingojam.com/BoldTextGenerator
If I open this form with a script, I can recover this text with
var form = FormApp.openById(formID);
var Items = form.getItems();
var test = Items[0].getTitle();
This "test" variable is a string (I checked with Logger.log(typeof(test))), not a "Text" nor "RichText" and methods such as .isBold() won't work.
However, Logger.log(test) does output a bold text in the log journal - so this string does contain some information about its style.
Yet, I can't seem to define a styled string within Google Script. I have tried quite different things, but none worked
var dummy = "Hello World !"
Logger.log(dummy.bold())
Logger.log(dummy.setBold(true))
Logger.log(dummy.setFontWeight("bold"))
Logger.log("<b>"+dummy+"</b>")
Logger.log("**"+dummy+"**")
What can I do to have my dummy string to be logged in a bold font (my real objective being to use a .setTitle(dummy) method to have a bold font form item) ?

I believe your goal as follows.
You want to set the text with the bold type to the title of items on Google Form using Google Apps Script.
Issue and workaround:
Unfortunately, in the current stage, there are not methods for directly managing the rich texts to the title of each items on Google Form in Google Form service. But when the text with the bold type is directly copied and pasted to the title of item on Google Form, it can be done. So in this answer, using this, as a current workaround, I would like to propose to convert the text data to the text with the bold type with the unicode, and put the converted text to Google Form.
The flow of this workaround is as follows.
Convert the text to the bold type with the unicode.
In this conversion, each character in the text is converted to the bold type using the difference between the original character code and the bold character code.
Put to the converted text to the title of item on Google Form.
When above flow is reflected to the script, it becomes as follows.
Sample script:
function myFunction() {
// 1. Convert the text to the bold type with the unicode.
const conv = {
c: function(text, obj) {return text.replace(new RegExp(`[${obj.reduce((s, {r}) => s += r, "")}]`, "g"), e => {
const t = e.codePointAt(0);
if ((t >= 48 && t <= 57) || (t >= 65 && t <= 90) || (t >= 97 && t <= 122)) {
return obj.reduce((s, {r, d}) => {
if (new RegExp(`[${r}]`).test(e)) s = String.fromCodePoint(e.codePointAt(0) + d);
return s;
}, "")
}
return e;
})},
bold: function(text) {return this.c(text, [{r: "0-9", d: 120734}, {r: "A-Z", d: 120211}, {r: "a-z", d: 120205}])},
italic: function(text) {return this.c(text, [{r: "A-Z", d: 120263}, {r: "a-z", d: 120257}])},
boldItalic: function(text) {return this.c(text, [{r: "A-Z", d: 120315}, {r: "a-z", d: 120309}])},
};
var newTitle = "New title for item 1";
var convertedNewTitle = conv.bold(newTitle); // Bold type
// var convertedNewTitle = conv.italic(newTitle); // Italic type
// var convertedNewTitle = conv.boldItalic(newTitle); // Bold-italic type
// 2. Put to the converted text to the title of item on Google Form.
var formID = "###"; // Please set the Form ID.
var form = FormApp.openById(formID);
var Items = form.getItems();
Items[0].setTitle(convertedNewTitle);
}
In this sample script, the bold, italic and bold-italic types can be converted.
In this case, the numbers and the specific characters have no bold, italic and bold-italic types. Please be careful this.
Result:
When above sample script is used, the following result is obtained.
From:
To:
Testing
https://jsfiddle.net/7bL5r3em/
References:
Unicode font
https://lingojam.com/BoldTextGenerator
This is from your question.

Related

How can I add data to an existing PowerPoint presentation using Node?

I have a PowerPoint template with placeholder data. I need to swap out the placeholder text with some numbers using Node, but I'm having trouble finding a package that supports this. Has anyone seen anything along these lines?
Have you looked into the PowerPoint JavaScript API?
For example:
Call the ShapeCollection.getItem(key) method to get your Shape object
Update the text value via Shape.textFrame.textRange.text
Related example from Microsoft's docs:
// This sample creates a light blue rectangle with braces ("{}") on the left and right ends
// and adds the purple text "Shape text" to the center.
await PowerPoint.run(async (context) => {
const shapes = context.presentation.slides.getItemAt(0).shapes;
const braces = shapes.addGeometricShape(PowerPoint.GeometricShapeType.bracePair);
braces.left = 100;
braces.top = 400;
braces.height = 50;
braces.width = 150;
braces.name = "Braces";
braces.fill.setSolidColor("lightblue");
braces.textFrame.textRange.text = "Shape text";
braces.textFrame.textRange.font.color = "purple";
braces.textFrame.verticalAlignment = PowerPoint.TextVerticalAlignment.middleCentered;
await context.sync();
});

How Do I Remove a String that I Added Using svg.appendChild?

I am trying to build a program that will take a user input in a text box and display it. My problem is that when I enter a new input into the text box hat input overlaps the first text. What I want is that original text to be removed and replaced by the new input. The code I am using is below.
function eccentricityChanged() {
let svg = document.getElementById('diagram');
let text = document.createElementNS('http://www.w3.org/2000/svg', 'text');
text.setAttribute('x', 585);
text.setAttribute('y', 275);
text.setAttribute('fill', 'red');
svg.appendChild(text);
svg.selectAll('*').remove();
let txt = document.getElementById("eccentricity").value;
parseFloat('text', txt);
text.innerHTML = txt;

How to find bit length of text with specific font and font size

I'm developing NativeScript JavaScript code to create dynamic text marker for maps. I have the code working that creates a marker for a specific string. My next step is to take any given string, determine its height and width in bits, and create the marker sized to contain the text.
My problem is finding the size of the text, given the text string itself, the font size, and the font family.
It looks like getMeasuredWidth could work, except that the string must already be loaded on a page before that function will return a value. In my case, I simply need to compute the size; the text won't otherwise appear as such on a page (the text in the marker becomes an image).
Is there a way to do this?
var bmp = BitmapFactory.create(200);
bmp.dispose(function (b) {
try {
b.drawRect(
"100,34", // size
'0,0', // upper-left coordinate
KnownColors.Black, // border color
KnownColors.Cornsilk // fill color
);
b.writeText(
"Parking",
"2,25",
{ color: KnownColors.Black, size: 8, name: 'fontawesome-webfont', });
...
In the code above, the width of "100" of the bounding rectangle actually represents the bit width of "Parking" with a small amount of padding. What I want to does calculate the rectangle's height and width and not hard-code it.
Try this, finding label size without adding it to Page upon button click
export function onFindButtonTap(args: EventData) {
const button = <any>args.object;
const label = new Label();
label.text = "Hello, found my size?"
label.fontSize = 20;
(<any>label)._setupAsRootView(button._context);
label.onLoaded();
label.measure(0, 0);
console.log(`Width : ${label.getMeasuredWidth()} x Height : ${label.getMeasuredHeight()}`);
}
Playground Sample
Note: I didn't get a chance to test it with iOS yet, let me know if you hit any issues.

How to make a part of string bold in a in a UI label

I want to make bold some part of a big string. I am using Xamarin iOS and getting a big string from API. I need to make some part of the string as bold I tried <b>some text </b> this will not work for mono touch. What is the best option to make a string bold in run time in xamrin. iOS or in winforms applications?
Use AttributedString to apply attributes to different parts of the string. See example below that will only make the first half of the string bold
var BoldString = new NSMutableAttributedString (original_string);
var BoldTextAttributes = new UIStringAttributes {
Font = UIFont.FromName ("Helvetica-Bold", 20f)
};
BoldString.SetAttributes (BoldTextAttributes.Dictionary, new NSRange (0, OutOfStock.Length / 2)); // this range will apply the attribute only to the first half of the string
MyLabel.AttributedText = BoldString; // Assign the attributed text to your label

Change color instead of background color of text in etherpad

I am trying to find solution for "Authorship color" in etherpad. People who never used etherpad, please ignore this question as they will not understand.
So normally "Authorship Color" is the color provided as a background-color of the text and it can be given as parameter when initializing the pad. It helps recognizing who has written what in pad.
I want to have white background for all text and change the text-color instead of background color depending upon the user. So its like if I provided red color when initializing the pad, I want to have red writing in pad instead of red background and white writing in pad(as usual).
Please dont put this question on hold as I dont have any specific code to provide related to this problem. Ask in comment instead, i will clear whatever is not understandable.
Thanks,
First of all, Thanks to everyone for not blocking or making this question on Post as no piece of code was provided.
I was about to put bounty on this question when I decided to try myself one more time and well I have resolved the problem after going through a lot. Though, it helped me understand etherpad better.
I want to list two important links related to etherpad:
https://github.com/ether/etherpad-lite/wiki
About src - https://github.com/ether/etherpad-lite/wiki/Introduction-to-the-source
They can be very important if you are trying to understand etherpad or want to do some modification yourself.
So here is how you do it:
In src/static/js/ace2_inner.js , go to setAuthorStyle function and Replace:
// author color
authorStyle.backgroundColor = bgcolor;
parentAuthorStyle.backgroundColor = bgcolor;
// text contrast
if(colorutils.luminosity(colorutils.css2triple(bgcolor)) < 0.5)
{
authorStyle.color = '#ffffff';
parentAuthorStyle.color = '#ffffff';
}else{
authorStyle.color = null;
parentAuthorStyle.color = null;
}
// anchor text contrast
if(colorutils.luminosity(colorutils.css2triple(bgcolor)) < 0.55)
{
anchorStyle.color = colorutils.triple2css(colorutils.complementary(colorutils.css2triple(bgcolor)));
}else{
anchorStyle.color = null;
}
With:
authorStyle.backgroundColor = '#ffffff';
parentAuthorStyle.backgroundColor = '#ffffff';
authorStyle.color = bgcolor;
parentAuthorStyle.color = bgcolor;
And comment Out:
if ((typeof info.fade) == "number")
{
bgcolor = fadeColor(bgcolor, info.fade);
}
Ofcource dont forget to restart process by bin/run.sh for changes to take place.
People, who are interested to understand how it works can keep reading.
So etherpad receives parameters with which etherpad has been initialized in src/static/js/pad.js so if you have defined: 'userColor' when you have initialized the pad, it will go in globalUserColor in mentioned file.
Then this variable globalUserColor populates pad.myUserInfo.colorId in same file.
Now in collab_client.js , this colorId gets stored in cssColor in function tellAceAuthorInfo and editor.setAuthorInfo is being called by giving parameter bgcolor: cssColor.
Now this function setAuthorInfo exists in src/static/js/ace2_inner.js which calls to other native function(same file) setAuthorStyle where we have made changes.
What I did is that instead of changing background color with provided variable bgcolor which actually holds userColor :
authorStyle.backgroundColor = bgcolor;
parentAuthorStyle.backgroundColor = bgcolor;
I changed backgroundColor to white(#ffffff) and color of text to bgcolor :
authorStyle.backgroundColor = '#ffffff';
parentAuthorStyle.backgroundColor = '#ffffff';
authorStyle.color = bgcolor;
parentAuthorStyle.color = bgcolor;
I also deleted:
// text contrast
if(colorutils.luminosity(colorutils.css2triple(bgcolor)) < 0.5)
{
authorStyle.color = '#ffffff';
parentAuthorStyle.color = '#ffffff';
}else{
authorStyle.color = null;
parentAuthorStyle.color = null;
}
// anchor text contrast
if(colorutils.luminosity(colorutils.css2triple(bgcolor)) < 0.55)
{
anchorStyle.color = colorutils.triple2css(colorutils.complementary(colorutils.css2triple(bgcolor)));
}else{
anchorStyle.color = null;
}
Because, these lines set the contrast of text color depending upon the background chosen color. But I have made background white and set text color to given userColor so I don't need the contrast functionality anymore.
Ultimately I also commented:
if ((typeof info.fade) == "number")
{
bgcolor = fadeColor(bgcolor, info.fade);
}
Because it makes the text fade when user is not online, at least for me it did.
So that's it. I hope it will help someone who wants same functionality as I did.

Resources