[PowerPoint] (Shape) Add placeholder snippet (#1035)

* [PowerPoint] (Shape) Add placeholder snippet

* Fix typo

Author: ElizabethSamuel-MSFT

playlists-prod/powerpoint.yaml

@@ -97,7 +97,7 @@
     https://raw.githubusercontent.com/OfficeDev/office-js-snippets/prod/samples/powerpoint/shapes/get-shapes-by-type.yaml
   group: Shapes
   api_set:
-    PowerPointApi: '1.4'
+    PowerPointApi: '1.8'
 - id: powerpoint-shapes-add-modify-tables
   name: Add and modify tables
   fileName: add-modify-tables.yaml

playlists/powerpoint.yaml

@@ -97,7 +97,7 @@
     https://raw.githubusercontent.com/OfficeDev/office-js-snippets/main/samples/powerpoint/shapes/get-shapes-by-type.yaml
   group: Shapes
   api_set:
-    PowerPointApi: '1.4'
+    PowerPointApi: '1.8'
 - id: powerpoint-shapes-add-modify-tables
   name: Add and modify tables
   fileName: add-modify-tables.yaml

samples/powerpoint/shapes/get-shapes-by-type.yaml

@@ -4,12 +4,13 @@ name: Select shapes by type
 description: Gets shapes in a slide based on their type, such as GeometricShape or Line.
 host: POWERPOINT
 api_set:
-    PowerPointApi: '1.4'
+    PowerPointApi: '1.8'
 script:
-    content: |-
+    content: |
         document.getElementById("setup").addEventListener("click", () => tryCatch(setup));
         document.getElementById("change-lines").addEventListener("click", () => tryCatch(changeLines));
         document.getElementById("change-geometric-shapes").addEventListener("click", () => tryCatch(changeGeometricShapes));
+        document.getElementById("get-placeholder-shapes").addEventListener("click", () => tryCatch(getPlaceholderShapes));
 
         async function changeLines() {
           // Changes the dash style of every line in the slide.
@@ -48,6 +49,38 @@ script:
           });
         }
 
+        async function getPlaceholderShapes() {
+          // Gets the placeholder shapes in the slide.
+          await PowerPoint.run(async (context) => {
+            // Get properties for every shape in the collection.
+            const shapes: PowerPoint.ShapeCollection = context.presentation.slides.getItemAt(0).shapes;
+            shapes.load("type,name");
+            await context.sync();
+
+            const placeholderShapes = [];
+            console.log(`Number of shapes found: ${shapes.items.length}`);
+            shapes.items.forEach((shape) => {
+              if (shape.type === PowerPoint.ShapeType.placeholder) {
+                // Load placeholderFormat property.
+                // PowerPoint throws an exception if you try to load this property on a shape that isn't a placeholder type.
+                shape.load("placeholderFormat");
+                placeholderShapes.push(shape);
+              }
+            });
+            await context.sync();
+
+            console.log(`Number of placeholder shapes found: ${placeholderShapes.length}`);
+            for (let i = 0; i < placeholderShapes.length; i++) {
+              let currentPlaceholder: PowerPoint.PlaceholderFormat = placeholderShapes[i].placeholderFormat;
+              let placeholderType = currentPlaceholder.type as PowerPoint.PlaceholderType;
+              let placeholderContainedType = currentPlaceholder.containedType as PowerPoint.ShapeType;
+              console.log(`Shape "${placeholderShapes[i].name}" placeholder properties:`);
+              console.log(`\ttype: ${placeholderType}`);
+              console.log(`\tcontainedType: ${placeholderContainedType}`);
+            }
+          });
+        }
+
         async function setup() {
           await PowerPoint.run(async (context) => {
             // Create shapes of different types.
@@ -58,27 +91,27 @@ script:
               left: 100,
               top: 100,
               height: 150,
-              width: 150
+              width: 150,
             });
             shapes.addGeometricShape(PowerPoint.GeometricShapeType.octagon, {
               left: 400,
               top: 300,
               height: 150,
-              width: 150
+              width: 150,
             });
 
             // Create lines.
             shapes.addLine(PowerPoint.ConnectorType.elbow, {
               left: 400,
               top: 150,
               height: 20,
-              width: 150
+              width: 150,
             });
             shapes.addLine(PowerPoint.ConnectorType.curve, {
               left: 100,
               top: 300,
               height: 150,
-              width: 20
+              width: 20,
             });
 
             await context.sync();
@@ -98,7 +131,7 @@ script:
 template:
     content: |-
         <section>
-          <p>This sample shows how select and change shapes based on their types.</p>
+          <p>This sample shows how to select and change shapes based on their types.</p>
         </section>
         <section>
           <h3>Setup</h3>
@@ -112,6 +145,8 @@ template:
           <p />
           <button id="change-geometric-shapes">Change geometric shapes</button>
           <p />
+          <button id="get-placeholder-shapes">Get placeholder shapes</button>
+          <p />
         </section>
     language: html
 style:

snippet-extractor-metadata/powerpoint.xlsx

@@ -16657,6 +16657,78 @@ PowerPoint.ParagraphHorizontalAlignment:enum:
       });
       await context.sync();
     });
+PowerPoint.PlaceholderFormat:class:
+  - >-
+    // Link to full sample:
+    https://raw.githubusercontent.com/OfficeDev/office-js-snippets/prod/samples/powerpoint/shapes/get-shapes-by-type.yaml
+
+
+    // Gets the placeholder shapes in the slide.
+
+    await PowerPoint.run(async (context) => {
+      // Get properties for every shape in the collection.
+      const shapes: PowerPoint.ShapeCollection = context.presentation.slides.getItemAt(0).shapes;
+      shapes.load("type,name");
+      await context.sync();
+
+      const placeholderShapes = [];
+      console.log(`Number of shapes found: ${shapes.items.length}`);
+      shapes.items.forEach((shape) => {
+        if (shape.type === PowerPoint.ShapeType.placeholder) {
+          // Load placeholderFormat property.
+          // PowerPoint throws an exception if you try to load this property on a shape that isn't a placeholder type.
+          shape.load("placeholderFormat");
+          placeholderShapes.push(shape);
+        }
+      });
+      await context.sync();
+
+      console.log(`Number of placeholder shapes found: ${placeholderShapes.length}`);
+      for (let i = 0; i < placeholderShapes.length; i++) {
+        let currentPlaceholder: PowerPoint.PlaceholderFormat = placeholderShapes[i].placeholderFormat;
+        let placeholderType = currentPlaceholder.type as PowerPoint.PlaceholderType;
+        let placeholderContainedType = currentPlaceholder.containedType as PowerPoint.ShapeType;
+        console.log(`Shape "${placeholderShapes[i].name}" placeholder properties:`);
+        console.log(`\ttype: ${placeholderType}`);
+        console.log(`\tcontainedType: ${placeholderContainedType}`);
+      }
+    });
+PowerPoint.PlaceholderType:enum:
+  - >-
+    // Link to full sample:
+    https://raw.githubusercontent.com/OfficeDev/office-js-snippets/prod/samples/powerpoint/shapes/get-shapes-by-type.yaml
+
+
+    // Gets the placeholder shapes in the slide.
+
+    await PowerPoint.run(async (context) => {
+      // Get properties for every shape in the collection.
+      const shapes: PowerPoint.ShapeCollection = context.presentation.slides.getItemAt(0).shapes;
+      shapes.load("type,name");
+      await context.sync();
+
+      const placeholderShapes = [];
+      console.log(`Number of shapes found: ${shapes.items.length}`);
+      shapes.items.forEach((shape) => {
+        if (shape.type === PowerPoint.ShapeType.placeholder) {
+          // Load placeholderFormat property.
+          // PowerPoint throws an exception if you try to load this property on a shape that isn't a placeholder type.
+          shape.load("placeholderFormat");
+          placeholderShapes.push(shape);
+        }
+      });
+      await context.sync();
+
+      console.log(`Number of placeholder shapes found: ${placeholderShapes.length}`);
+      for (let i = 0; i < placeholderShapes.length; i++) {
+        let currentPlaceholder: PowerPoint.PlaceholderFormat = placeholderShapes[i].placeholderFormat;
+        let placeholderType = currentPlaceholder.type as PowerPoint.PlaceholderType;
+        let placeholderContainedType = currentPlaceholder.containedType as PowerPoint.ShapeType;
+        console.log(`Shape "${placeholderShapes[i].name}" placeholder properties:`);
+        console.log(`\ttype: ${placeholderType}`);
+        console.log(`\tcontainedType: ${placeholderContainedType}`);
+      }
+    });
 PowerPoint.Presentation:class:
   - >-
     // Link to full sample:
@@ -17219,6 +17291,42 @@ PowerPoint.Shape#left:member:
       currentLeft = 0;
       if (currentTop > slideHeight - 200) currentTop = 0;
     });
+PowerPoint.Shape#placeholderFormat:member:
+  - >-
+    // Link to full sample:
+    https://raw.githubusercontent.com/OfficeDev/office-js-snippets/prod/samples/powerpoint/shapes/get-shapes-by-type.yaml
+
+
+    // Gets the placeholder shapes in the slide.
+
+    await PowerPoint.run(async (context) => {
+      // Get properties for every shape in the collection.
+      const shapes: PowerPoint.ShapeCollection = context.presentation.slides.getItemAt(0).shapes;
+      shapes.load("type,name");
+      await context.sync();
+
+      const placeholderShapes = [];
+      console.log(`Number of shapes found: ${shapes.items.length}`);
+      shapes.items.forEach((shape) => {
+        if (shape.type === PowerPoint.ShapeType.placeholder) {
+          // Load placeholderFormat property.
+          // PowerPoint throws an exception if you try to load this property on a shape that isn't a placeholder type.
+          shape.load("placeholderFormat");
+          placeholderShapes.push(shape);
+        }
+      });
+      await context.sync();
+
+      console.log(`Number of placeholder shapes found: ${placeholderShapes.length}`);
+      for (let i = 0; i < placeholderShapes.length; i++) {
+        let currentPlaceholder: PowerPoint.PlaceholderFormat = placeholderShapes[i].placeholderFormat;
+        let placeholderType = currentPlaceholder.type as PowerPoint.PlaceholderType;
+        let placeholderContainedType = currentPlaceholder.containedType as PowerPoint.ShapeType;
+        console.log(`Shape "${placeholderShapes[i].name}" placeholder properties:`);
+        console.log(`\ttype: ${placeholderType}`);
+        console.log(`\tcontainedType: ${placeholderContainedType}`);
+      }
+    });
 PowerPoint.Shape#top:member:
   - >-
     // Link to full sample: