Google script to automatically detect the cell containing a button, and change the background of that cell? - button

Question

I'm a teacher working on creating a Jeopardy-style game to use in my classroom. I'm very new to Google scripts and coding in general. I'm creating "buttons" for the point values in each category using transparent images and attaching script to change the background color of the cell to grey on click to indicate which point values have already been used, as in this example.
What I would like to do is be able to assign the same exact script to each "button," so that it will automatically detect which cell to change to grey based on which button is pushed. I haven't been able to figure this out, and instead have created a separate script for each button (Category 1, 100 pts; Category 2, 100 pts; Category 3, 100 pts, etc etc). It's complicated and time-consuming, and it just seems like there has to be a better way!
function colorCat1100(){
var ss = SpreadsheetApp.getActiveSpreadsheet();
var sheet = ss.getSheets()[0];
var colors = [
["#e0e0e0"]
];
var cell = sheet.getRange("A3:A3");
cell.setBackgrounds(colors);
}
function colorCat2100(){
var ss = SpreadsheetApp.getActiveSpreadsheet();
var sheet = ss.getSheets()[0];
var colors = [
["#e0e0e0"]
];
var cell = sheet.getRange("B3:B3");
cell.setBackgrounds(colors);
}
function colorCat3100(){
var ss = SpreadsheetApp.getActiveSpreadsheet();
var sheet = ss.getSheets()[0];
var colors = [
["#e0e0e0"]
];
var cell = sheet.getRange("C3:C3");
cell.setBackgrounds(colors);
}
function colorCat4100(){
var ss = SpreadsheetApp.getActiveSpreadsheet();
var sheet = ss.getSheets()[0];
var colors = [
["#e0e0e0"]
];
var cell = sheet.getRange("D3:D3");
cell.setBackgrounds(colors);
}
function colorCat5100(){
var ss = SpreadsheetApp.getActiveSpreadsheet();
var sheet = ss.getSheets()[0];
var colors = [
["#e0e0e0"]
];
var cell = sheet.getRange("E3:E3");
cell.setBackgrounds(colors);
}
...and this is just the first row of points values. I would greatly appreciate any help you wonderful people might have to offer! Thanks in advance!

Answer 1

Issue:
Images can be inserted to a sheet either (1) belonging to a cell (Insert > Image > Image in cell, or using IMAGE), and to which scripts cannot be attached, or (2) not belonging to a specific cell (Insert > Image > Image over cells), to which scripts can be attached.
Assuming you are using Image over cells, you cannot pass parameters to a function that is attached to the image. And considering that images inserted via Image over cells don’t belong to a specific cell, there is no way for the called function to get information on which image has been clicked via getCurrentCell() or getActiveRange().
Workaround: onSelectionChange trigger:
Thanks to the recently added onSelectionChange(e) trigger, you could use the cells themselves as “buttons”: you can run the script when a cell is clicked, instead of attaching the script to over-cell images.
The idea is that, when there is a change on which cell is selected, the script will run and check whether the currently selected cell is one of the ones with "buttons" (this condition is needed to avoid all cells to change background when they're clicked, but only the "button" ones). And if it is, the cell background will be changed.
Just copy and paste the following code:
function onSelectionChange(e) {
var buttonRanges = ["A3", "B3", "C3"]; // Cells with "buttons" (please change)
var range = e.range;
if (buttonRanges.includes(range.getA1Notation())) {
range.setBackground("#e0e0e0");
}
}
Of course, you could add the images themselves to the cells, but instead of using Image over cells, you should add inline cells, either via Image in cell or with =IMAGE.
Note:
In the beginning of this function, the A1 notations of the cells with buttons are defined. In the provided sample, these cells are A3, B3 and C3. Please change according to your preferences.
This will not work if the clicked cell is not the previously selected cell one (only cell selection changes are tracked by this trigger).
Reference:
onSelectionChange(e)