none
Showing the tags of the shapes on a slide using office.js. RRS feed

  • Question

  • Hi there,

    I am developing an office.js content add-in for PowerPoint.

    As I am new to the API (did vsto before ms made it impossible to add life web pages to slides) I thought I'd go for something easy to get to know office.js.

    So the goal is to build a content add-in that list's all the tags of all the shapes that sit on the current slide (current as in "the slide that the user is currently seeing").

    Starting with current slide.

    It seems there is no way to determine the currently selected slide.

    The thing closest to that may be getSelectedDataAsync. But that function only gives you the current selection range. So if you have a presentation with slides A, B, C and the user selects A, C, B (in that order) she sees slide B. No way to know for my add-in.

    Am I overlooking something? Is the API actually not able to get me the most basic information about the current working state of my users?

    And now to the complicated stuff. How to read the tags.

    Is getFileAsync the way to go? I've followed the example code on the page. The example assumes it loads text. The data that I get is not text.

    So Now I have a buffer filled with some odd data that may or may not be of a some evenly odd type, named 'Office.FileType.Compressed'.

    How do I get to the slides, shapes, tags? Where is the documentation?

    Could you give me some pointers please?

    Wednesday, July 26, 2017 8:30 AM

Answers

  • Hi O.Hafn,

    Yes, that is a C# code sample to list the tags on the specific slide. In your scenario, you can post the presentation file and the slide index to a service. And in the service, you can use the Open XML SDK like the code sample provided above to return the result to the client.

    And to work with Linux, we can use the Open XML SDK for .Net core. Then you can develop an web API as a service using the .net core.

    Hope it is helpful.

    Regards & Fei

     


    We are trying to better understand customer views on social support experience, so your participation in this interview project would be greatly appreciated if you have time. Thanks for helping make community forums a great place.
    Click HERE to participate the survey.

    • Marked as answer by O. Hahn Wednesday, August 9, 2017 7:02 AM
    Tuesday, August 8, 2017 9:07 AM
    Moderator

All replies

  • Hi,

    I notice that you are looking for developing an App for Office application. This forum is for the general Office feature issue.

    Therefore, I would move the thread to App for Office forum for better suggestion:

    https://social.msdn.microsoft.com/Forums/office/en-US/home?forum=appsforoffice

    Hope you can find the solution there.

    Best Regards,

    Winnie Liang


    Please remember to mark the replies as answers if they help. If you have feedback for TechNet Subscriber Support, contact tnmff@microsoft.com.

    Thursday, July 27, 2017 3:19 AM
  • The App for Office Forum is the place I originally posted this question to. There I was told to post it here.

    So if neither microsoft at "App for Office" nor microsoft at TechNet actually knows how to use office.js who can I ask?


    • Edited by O. Hahn Thursday, July 27, 2017 7:48 AM
    Thursday, July 27, 2017 7:46 AM
  • Hello,

    >>build a content add-in that list's all the tags of all the shapes that sit on the current slide

    Office JavaScript API doesnt work with Shape object now and the coercionType of Document.getSelectedDataAsync method only support Text and SlideRange for powerpoint. I think there is no way to get all tags of all shapes in current slide using Office JS API.

    Please visit https://officespdev.uservoice.com/forums/224641-feature-requests-and-feedback/suggestions/11161365-getselecteddataasync-for-powerpoint-shapes, you could visit https://blogs.msdn.microsoft.com/officeapps/ to see if any news.

    Regards,

    Celeste


    MSDN Community Support
    Please remember to click "Mark as Answer" the responses that resolved your issue, and to click "Unmark as Answer" if not. This can be beneficial to other community members reading this thread. If you have any compliments or complaints to MSDN Support, feel free to contact MSDNFSF@microsoft.com.

    Monday, July 31, 2017 3:34 AM
    Moderator
  • >>build a content add-in that list's all the tags of all the shapes that sit on the current slide


    >Office JavaScript API doesnt work with Shape object now and the coercionType >of Document.getSelectedDataAsync method only support Text and SlideRange for powerpoint. I >think there is no way to get all tags of all shapes in current slide using Office JS API.

    I think this information is outdated.
    getFileAsync used with Office.FileType.Compressed does return data. It definitely does not return an error.
    I am not certain about returned file's format though. Quite possible it's the whole office document consisting of these zipped xmls. 
    Microsoft surely provides an api to read and work with these. Oddly enough I wasn't able to find it yet. Do you know where to find it?


    Wednesday, August 2, 2017 7:11 AM
  • Hi Hahn,

    >It seems there is no way to determine the currently selected slide.

    >The thing closest to that may be getSelectedDataAsync. But that function only gives you the current selection range. So if you have a presentation with slides A, B, C and the user selects A, C, B (in that order) she sees slide B. No way to know for my add-in.

    When you select the multiple slides and click the button on the content add-in, only the slide which contains the content add-in is active. So in this scenario, the method getSelectedDataAsync should work for get the active slide users are operating.

    And then we can get the XML file via the Office.context.document.getFileAsync and get the tags from the XML via the slide index get from getSelectedDataAsync method. And since the Office.context.document.getFileAsync method only get the content of presentation file, a more easy way to get the tags is post this file to the server and using OpenXML to analyze the file and return the result based on the requirement.

    Hope it is helpful.

    Regards & Fei



    We are trying to better understand customer views on social support experience, so your participation in this interview project would be greatly appreciated if you have time. Thanks for helping make community forums a great place.
    Click HERE to participate the survey.

    Thursday, August 3, 2017 9:10 AM
    Moderator
  • Could you please elaborate on the "and get the tags from the xml via the slide index". I am not aware of a office.js function that would return xml containing tags of slides or shapes. Where can that be found? Could you point me to some source code that shows how to get to the tags?

    About "using OpenXML to analyze". I haven't found any example on how to connect open-xml-sdk to (whatever that data is) which I get from getFileAsync with FileTyle.Compressed. I  am not sure if that is possible at all. Could you point me to some source code examples that explain how to use open xml sdk with office.js?

    • Edited by O. Hahn Friday, August 4, 2017 7:47 AM Format
    Friday, August 4, 2017 7:46 AM
  • Hi Hahn,

    Here is the code to get the tags from specific slide:

            public static void ReadTags(string filePath, int slideIndex)
            {
                using (PresentationDocument ppt = PresentationDocument.Open(filePath, false))
                {
                    SlideIdList slideIdList = ppt.PresentationPart.Presentation.SlideIdList;
                    SlideId slideId = slideIdList.ChildElements[slideIndex] as SlideId;
                    // Get the relationship ID of the slide.
                    string slideRelId = slideId.RelationshipId;
    
                    SlidePart slidePart=ppt.PresentationPart.GetPartById(slideRelId) as SlidePart;
                    foreach (var tag in slidePart.UserDefinedTagsParts.FirstOrDefault().TagList)
                    {
                        Tag _tag = tag as Tag;
                        Console.WriteLine($"{_tag.Name}:{_tag.Val}");
                    }
                }
            }

    However, the index in office.js and OpenXML is different. It starts from 1 from office.js and from 0 in OpenXML. The office.js gets file and sent it to the server side. And you can get the content of file and modify the code above to open the file with stream.

    Regards & Fei


    We are trying to better understand customer views on social support experience, so your participation in this interview project would be greatly appreciated if you have time. Thanks for helping make community forums a great place.
    Click HERE to participate the survey.

    Friday, August 4, 2017 10:39 AM
    Moderator
  • Thanks a lot.

    The code you supplied looks like c# to me. Currently (see my initial post) I am working on a content add-in for PowerPoint. So I am using office.js. That is java script. The function I use to get the document is getFileAsync. That produces (following the example on the documentation page) an array of (maybe) binary data.
    I have absolutely no clue on how to connect that with your source code.

    Assuming your source code is c#. What is this PresentationDocument object? What do I have to reference? Where is the documentation? How do I combine the web page java script stuff (quite possibly hosted on a linux server) with a c# programm?

    Friday, August 4, 2017 11:01 AM
  • Hi O.Hafn,

    Yes, that is a C# code sample to list the tags on the specific slide. In your scenario, you can post the presentation file and the slide index to a service. And in the service, you can use the Open XML SDK like the code sample provided above to return the result to the client.

    And to work with Linux, we can use the Open XML SDK for .Net core. Then you can develop an web API as a service using the .net core.

    Hope it is helpful.

    Regards & Fei

     


    We are trying to better understand customer views on social support experience, so your participation in this interview project would be greatly appreciated if you have time. Thanks for helping make community forums a great place.
    Click HERE to participate the survey.

    • Marked as answer by O. Hahn Wednesday, August 9, 2017 7:02 AM
    Tuesday, August 8, 2017 9:07 AM
    Moderator
  • Thank you.

    I think asking about how to set up such an service is out of bounds for this question. So I've marked you response as answer.

    Wednesday, August 9, 2017 7:04 AM