Comments (Ooxml).WORD.yaml

name: Comments (Ooxml)
description: ''
host: WORD
api_set: {}
script:
  content: |
    $("#run").click(() => tryCatch(insertComment));

    $("#get").click(() => tryCatch(getOoxml));
    $("#set").click(() => tryCatch(setOoxml));

    async function getOoxml() {
      $("#ooxmlraw").val('');

      Office.context.document.getSelectedDataAsync(Office.CoercionType.Ooxml, async function(result) {
        if (result.status == "succeeded") {
          var ooxml = result.value;

          var ooxmlFriendly = ooxml.replace(/\>\</gi, ">\n<");

          console.log(ooxmlFriendly.substr(0, 50));

          $("#ooxmlraw").val(ooxmlFriendly);
        }
      });
    }

    async function setOoxml() {
      var ooxml = $("#ooxmlraw").val();

      ooxml = ooxml.replace(/\>\s+\</g, "><");

      // console.log(ooxml);

      Office.context.document.setSelectedDataAsync(ooxml, { coercionType: Office.CoercionType.Ooxml }, function(result) {
        if (result.status === "succeeded") {
          console.log("Set SelectedDataAsync");
        } else if (result.status == "failed") {
          console.error("Action failed with error: " + result.error.message);
        }
      });
    }

    async function insertComment() {
      Office.context.document.getSelectedDataAsync(Office.CoercionType.Ooxml, async function(result) {
        if (result.status == "succeeded") {
          var ooxml = result.value;

          // var ooxmlFriendly = ooxml.replace(/\>\</gi, ">\n<");

          // $("#ooxmlpre").text(ooxmlFriendly);

          // return;

          // $("#ooxmlpre").text(ooxml);z

          var ooxmlComment = await getAsOoxmlComment4(ooxml);

          var ooxmlFriendly = ooxmlComment.replace(/\>\</gi, ">\n<");

          $("#ooxml").text(ooxmlFriendly);

          Office.context.document.setSelectedDataAsync(ooxmlComment, { coercionType: Office.CoercionType.Ooxml }, function(
            result
          ) {
            if (result.status === "succeeded") {
              console.log("Set SelectedDataAsync");
            } else if (result.status == "failed") {
              console.error("Action failed with error: " + result.error.message);
            }
          });
        }
      });
    }

    // '<w:t>It was selected text!</w:t>'

    async function getAsOoxmlComment1(ooxml) {
      return ooxml;
    }

    async function getAsOoxmlComment4(ooxml) {

      // var xml = document.evaluate();


      var regex = /(<w:body.*?>)(<w:p.*?>)(.*)(<\/w:p>)(.*?)(<\/w:body>)/;

      // var commentPre = `<w:r><w:t>CommentPre</w:t></w:r>`;
      // var commentPost = `<w:r><w:t>CommentPost</w:t></w:r>`;

      var commentPre = `<w:commentRangeStart w:id="0" />`;

      var commentPost = `<w:commentRangeEnd w:id="0" />
                            <w:r>
                                <w:rPr>
                                    <w:rStyle w:val="CommentReference" />
                                </w:rPr>
                                <w:commentReference w:id="0" />
                            </w:r>`;

      commentPre = commentPre.replace(/\>\s+\</g, "><");
      commentPost = commentPost.replace(/\>\s+\</g, "><");

      var newOoxml = ooxml.replace(regex, "$1$2" + commentPre + "$3" + commentPost + "$4$5$6");

      var commentPackage = `<pkg:part xmlns:pkg="http://schemas.microsoft.com/office/2006/xmlPackage" pkg:name="/word/comments.xml" pkg:contentType="application/vnd.openxmlformats-officedocument.wordprocessingml.comments+xml">
            <pkg:xmlData>
                <w:comments xmlns:w="http://schemas.openxmlformats.org/wordprocessingml/2006/main">
                    <w:comment xmlns:w="http://schemas.openxmlformats.org/wordprocessingml/2006/main" w:id="0">
                        <w:p>
                            <w:r>
                                <w:t>MyComment</w:t>
                            </w:r>
                        </w:p>
                    </w:comment>
                </w:comments>
            </pkg:xmlData>
        </pkg:part>
        <pkg:part pkg:name="/word/_rels/comments.xml.rels" pkg:contentType="application/vnd.openxmlformats-package.relationships+xml">
            <pkg:xmlData>
                <Relationships xmlns="http://schemas.openxmlformats.org/package/2006/relationships"></Relationships>
            </pkg:xmlData>
        </pkg:part>`;

      commentPackage = commentPackage.replace(/\>\s+\</g, "><");

      // console.log(newOoxml);

      // console.log("=========");

      newOoxml = newOoxml.replace(/(<\/pkg:package>)/, commentPackage + "$1");

      console.log(newOoxml);

      return newOoxml;
    }

    /** Default helper for invoking an action and handling errors. */
    async function tryCatch(callback) {
      try {
        await callback();
      } catch (error) {
        // Note: In a production add-in, you'd want to notify the user through your add-in's UI.
        console.error(error);
      }
    }
  language: typescript
template:
  content: "<div>\n\t<button id=\"get\" class=\"ms-Button\">\n    <span class=\"ms-Button-label\">Get</span>\n</button>\n\t<button id=\"set\" class=\"ms-Button\">\n    <span class=\"ms-Button-label\">Set</span>\n</button>\n</div>\n<textarea id=\"ooxmlraw\" style=\"width:100%; height: 400px\"></textarea>\n\n<div>\n\t<button id=\"run\" class=\"ms-Button\">\n    <span class=\"ms-Button-label\">Run</span>\n</button>\n\t<pre id=\"ooxmlpre\" style=\"border: 1px solid red;\">\n&lt;Blank&gt;\n</pre>\n\t<pre id=\"ooxml\" style=\"border: 1px solid blue;\">\n&lt;Blank&gt;\n</pre>\n</div>"
  language: html
style:
  content: "section.samples {\n    margin-top: 20px;\n}\n\nsection.samples .ms-Button, section.setup .ms-Button {\n    display: block;\n    margin-bottom: 5px;\n    margin-left: 20px;\n    min-width: 80px;\n}\n\n\tpre {\n\t\toverflow-x: auto;\n\t\twhite-space: pre-wrap;\n\t\twhite-space: -moz-pre-wrap;\n\t\twhite-space: -pre-wrap;\n\t\twhite-space: -o-pre-wrap;\n\t\tword-wrap: break-word;\n\t}"
  language: css
libraries: |
  https://appsforoffice.microsoft.com/lib/1/hosted/office.js
  @types/office-js

  [email protected]/dist/css/fabric.min.css
  [email protected]/dist/css/fabric.components.min.css

  [email protected]/client/core.min.js
  @types/core-js

  [email protected]
  @types/[email protected]