google app slides pageElements bringToFront seem to be random

Question

I have read Bring the pageElements to front or back using apps script in Google Slides I loaded dice images in order to my slide. Based on load order I expect:

0 - page title
1 - dice image 1
2 - dice image 2
3 - dice image 3
4 - dice image 4
5 - dice image 5
6 - dice image 6
7 - blank shape to cover dice - could also use lose a turn text box

The element displayed by bringToFront seemed random so I add several checkDice items to the menu.

  SlidesApp.getUi()
      .createMenu( 'Ask ?')
      .addItem('Roll', 'flipDice')
      .addItem('BE1','BE1')
      .addItem('BE2','BE2')
      .addItem('BE3','BE3')
      .addItem('BE4','BE4')
      .addSeparator()
      .addSubMenu(SlidesApp.getUi().createMenu('Check Dice')
          .addItem('Check 1', 'checkDice1')
          .addItem('Check 2', 'checkDice2')
          .addItem('Check 3', 'checkDice3')
          .addItem('Check 4', 'checkDice4')
          .addItem('Check 5', 'checkDice5')
          .addItem('Check 6', 'checkDice6'))
      .addToUi(); 

Here is the check dice code.

function checkDice1() {
  checkDice(1);
}

function checkDice2()  {
  checkDice(2);
}

function checkDice3()  {
  checkDice(3);
}

function checkDice4()  {
  checkDice(4);
}

function checkDice5()  {
  checkDice(5);
}

function checkDice6()  {
  checkDice(6);
}

function checkDice(showMe) {  
  const diceStackId = 'gaaaa1aa1ce_0_128';
  let presentation = SlidesApp.getActivePresentation();
  let presId = presentation.getId();
  let slide = presentation.getSlideById(diceStackId);
  let pageElements = slide.getPageElements(); 
  // let selectedPageElements = slide.getPageElementRange().getPageElements();
  
  console.log('numberof elements: ' , pageElements.length );  // numberof elements:  8
    /*  0 = title 
        1 = dice 1
        2 = dice 2
        3 = dice 3
        4 = dice 4
        5 = dice 5
        6 = dice 6
        7 = white to cover dice - could be lose turn 
    */
  // do this once
  switch (showMe)  {
    case 1 :
      console.log('Rolled 1 pageElements[1].getTitle = ',pageElements[1].getTitle() )
      pageElements[1].setTitle('Rolled-1')
      SlidesApp.getUi().alert('Show me dice number: ' + showMe + ' set title Rolled-1 ');   
      break;
    case 2  :
      console.log('Rolled 2 pageElements[2].getTitle = ',pageElements[2].getTitle() )
      pageElements[2].setTitle('Rolled-2')
      SlidesApp.getUi().alert('Show me dice number: ' + showMe + ' set title Rolled-2 ');   
      break;
    case 3  :
      console.log('Rolled 3 pageElements[3].getTitle = ',pageElements[3].getTitle() )
      pageElements[3].setTitle('Rolled-3')
      SlidesApp.getUi().alert('Show me dice number: ' + showMe + ' set title Rolled-3 ');  
      break;
    case 4  :
      console.log('Rolled 4 pageElements[4].getTitle = ',pageElements[4].getTitle() )
      pageElements[4].setTitle('Rolled-4')
      SlidesApp.getUi().alert('Show me dice number: ' + showMe + ' set title Rolled-4 ');  
      break;
    case 5  :
      console.log('Rolled 5 pageElements[5].getTitle = ',pageElements[5].getTitle() )
      pageElements[5].setTitle('Rolled-5')
      SlidesApp.getUi().alert('Show me dice number: ' + showMe + ' set title Rolled-5 ');  
      break;
    case 6  :
      console.log('Rolled 6 pageElements[6].getTitle = ',pageElements[6].getTitle() )
      pageElements[6].setTitle('Rolled-6')
      SlidesApp.getUi().alert('Show me dice number: ' + showMe + ' set title Rolled-6 ');  
      break;
  }
  SlidesApp.getUi().alert('Show me dice number: ' + showMe + ' element title: ' + pageElements[showMe].getTitle() );   
  pageElements[showMe].bringToFront();
}

The alerts show exactly what I expect but the dice image shown appears to be random. It changes! If I run check any number over and over I get different images! Am I misunderstanding pageElements[showMe]? How can I get the desired image?

---

function onOpen() {
  console.log('In onOpen' );
  PropertiesService.getScriptProperties().setProperty(
    'sheetId', '1fmZCittj4ksstmhh8_t0O0csj8IDdwi9ohDDL5ZE7VA');
  const diceObj = {
    "1": "dice1", 
    "2": "dice2", 
    "3": "dice3", 
    "4": "dice4", 
    "5": "dice5", 
    "6": "dice6"
    };  
  PropertiesService.getScriptProperties().setProperty(
    'idDice', diceObj);

etc. then in the checkDice function:

function checkDice(showMe) {  
  const diceStackId = 'gaaafaff9f1_0_0';
  const idDice = PropertiesService.getScriptProperties().getProperty('idDice'); 
  let presentation = SlidesApp.getActivePresentation();
  let presId = presentation.getId();
  let slide = presentation.getSlideById(diceStackId);
  let pageElements = slide.getPageElements(); 
  SlidesApp.getUi().alert('Show me dice number: ' + showMe + ' element title: ' + pageElements[showMe].getTitle() );   
//  When a page element is moved to the front, the indexes are changed!
//  pageElements[showMe].bringToFront();
  const pageElement = pageElements.filter(e => e.getTitle() == idDice[showMe]);
  if (pageElement.length == 1) {
    pageElement[0].bringToFront();
  }
}

The dice is identified in the console.log but no change is made to the order of the images???

Answer 1

I believe your goal as follows.

• You want to move a page element to the front of the page by giving the value of showMe. showMe is from 1 to 6.
  • For example, when 3 is given as showMe, you want to move the page element with the title of dice 3 to the front of the page.

Modification points:

• In your script, showMe is used for the index of pageElements. In this case, when a page element is moved to the front, the indexes are changed. I thought that this might be the reason of your issue.
• From the comment of your script, it seems that the title of page element has already been given like 1 = dice 1,2 = dice 2,3 = dice 3,,,. I thought that this might be used for achieving your goal.

When above points are reflected to your script, it becomes as follows.

Modified script:

In this modification, checkDice() is modified.

function checkDice(showMe) {
  const diceStackId = 'gaaaa1aa1ce_0_128';
  let presentation = SlidesApp.getActivePresentation();
  let slide = presentation.getSlideById(diceStackId);
  let pageElements = slide.getPageElements();

  // I modified below script.
  const obj = {"1": "dice 1", "2": "dice 2", "3": "dice 3", "4": "dice 4", "5": "dice 5", "6": "dice 6"};
  const pageElement = pageElements.filter(e => e.getTitle() == obj[showMe]);
  if (pageElement.length == 1) {
    pageElement[0].bringToFront();
  }
}

• In this modified script, obj is used for searching the page element with the title. For example, when 3 is given as showMe, the page element which has the title of dice 3 is moved to the front.
• When the page elements with the same title are existing, the script is not run. Please be careful this.
• If you want to check other titles, please modify obj.

References:

• getPageElements()
• bringToFront()