JavaScript: How to Automate a Google Doc

Did you know Google Docs are equipped for macros?! Meaning you can script some automation right into Google. Best thing since sliced bread.

Google Apps Script is based on JavaScript, so if you already know that, you’re well ahead of the game.

I know nothing about JavaScript. But I know other stuff. So… Consider this a beginner’s guide for users of other languages.

Some Basics

1. JavaScript requires that you end your lines with semi-colons. They will be everywhere. Prepare to start having nightmares about them.
2. Comments are made with //.
3. Variables don’t need a type to be declared: var variableName = StuffInVariable;
4. Flow control statements are formatted with conditions in parentheses and blocks in brackets. For example:
   for (var i = 0; i<10; i++) {
   //Code Here
   };
   if (string == ‘A’) {
   //Code Here
   };
   while (x<20) {
   //Code Here
   };
5. Capitalization matters. You can’t use For instead of for. Block indentation is nice, but not required.

How to Get to the Script Editor

Ok, open a Google Doc. Go to Tools and hit Script Editor.

That’ll take you to a nice clean space where you can start writing scripts.

In word documents, I find my most common macros have to loop through each character to do something, so let’s start there.

How to Loop through Characters

First, you’ll need to declare a bunch of variables. One for the active document, one for the body, one for the paragraph we’re looking for (for my purposes, we’ll go with the first which is indexed at 0), and one for the text within that body.

 var doc = DocumentApp.getActiveDocument();
var body = doc.getBody();
var paragraph = body.getChild(0);
var txt = paragraph.asParagraph().getChild(0);
var len = txt.asText().getText().length;

That last variable, len, is to get the length or number of characters within that text.

Next you’ll plug in a for loop to run that length, using charAt() to pull out each character. Let’s say if a specific character is “A”, I want it to be blue.

for (var i = 0; i<len; i++) {
string = txt.asText().getText().charAt(i);
if ( string == 'A') {
txt.asText().setForegroundColor(i,i,'#0000FF');
};
};

Save the macro. To run it, hit this button here.

And this is what you’ll see.

Cool. Can I Add Other Functions To Work With My Functions?

Yes.

It’s important to remember that the internet already contains all manner of wonderful functions, mainly on StackExchange, just waiting to be incorporated into your scripts. I really like this one that turns RGB values into Hex values. Especially since so much color coding I do is more compatible with varying specific red, green, and blue values.

Adding other functions is real easy. You just pop them in, save, and go. Here’s the full script to gradually go from white characters to black in a paragraph incorporating the functions from StackExchange:

function myFunction() {

var doc = DocumentApp.getActiveDocument();
var body = doc.getBody();
var paragraph = body.getChild(0);
var txt = paragraph.asParagraph().getChild(0); //This returns the text in the first paragraph.
var len = txt.asText().getText().length; //This returns the number of characters in the first paragraph.
Logger.log(len);
var red = 250;
var green = 250;
var blue = 250;
var incrementVal = 250/len;
var x = 0;
var rgbHex = rgbToHex(red, green, blue);

for (var i = 0; i0 && string!=" ") {
rgbHex = rgbToHex(red, green, blue);
txt.asText().setForegroundColor(i,i,rgbHex);
x = x + incrementVal
if (x>1) {
red = red-1;
green = green-1;
blue = blue-1;
x = 0
};
};
};
}

function componentToHex(c) {
var hex = c.toString(16);
return hex.length == 1 ? "0" + hex : hex;
}

function rgbToHex(r, g, b) {
return "#" + componentToHex(r) + componentToHex(g) + componentToHex(b);
}

WordPress loves to mess with my coding format, so I’ve also popped it into a gist.

Here’s the result: