InsertAndReplaceContentControls don't load images with CreateImage

[lorenzoale]

Do you want to request a feature or report a bug?

What is the current behavior? When I use createimage with CallCommand, the image is created (either with url as the example: Api.CreateImage("https://api.onlyoffice.com/content/img/docbuilder/examples/coordinate_aspects.png", 60 36000, 35 36000); or with base64) However when I add the same line of code inside InsertAndReplaceContentcontrols script, it creates the control, but doesn't load the image, even if it allows me to load it afterwards. I may be doing something wrong? The idea is to replace several content controls dinamycally by texts or images. I could do it one by one going through the content controls in this case I would need to deal with the callbacks after each replacement. The insertAndReplace seems to be perfect for this task. I tried:

• creating a picture control: window.Asc.plugin.executeMethod("AddContentControlPicture", [{"Lock" : 3}]);
• creating a normal one: window.Asc.plugin.executeMethod("AddContentControl", [2, {"Lock" : 3}]); And then
• the script : _script = "var oDocument = Api.GetDocument(); var oParagraph =Api.CreateParagraph();var oDrawing = Api.CreateImage('https://api.onlyoffice.com/content/img/docbuilder/examples/coordinate_aspects.png', 60 * 36000, 35 * 36000); oParagraph.AddDrawing(oDrawing); oDocument.InsertContent([oParagraph]);";
• or the script inserts the image inside the control: _script = "var oDocument = Api.GetDocument(); var oDrawing = Api.CreateImage('https://api.onlyoffice.com/content/img/docbuilder/examples/coordinate_aspects.png', 60 * 36000, 35 * 36000); oDrawing.InsertInContentControl(1);";
• or even others combinations.

If the current behavior is a bug, please provide the steps to reproduce and if possible a minimal demo of the problem.

What is the expected behavior?

Which versions of sdkjs-plugins, and which browser / OS are affected by this issue? Did this work in previous versions of sdkjs-plugins? As recomended I installed 7.1.1 Many thanks in advance

[askonev]

@lorenzoale Hi! At the moment there is no way to install an image using the InsertAndReplaceContentControls method. Created a bug #58521 in our private repository.

[fr3fou]

Any updates on this?

[zahari00]

Any updates?

[askonev]

@fr3fou @zahari00 I am applying the correct js to install the image in BlockLvlSdt

/**
 *
 * (c) Copyright Ascensio System SIA 2020
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *     http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 *
 */

// Example insert text into editors (different implementations)
(function(window, undefined){

    let _plugin = window.Asc.plugin

    const _placeholderPlainRich = "{\r\n\
    \"commonPr\" :\r\n\
    {\r\n\
        \"Id\" : 1,\r\n\
        \"Tag\" : \"{Document1}\",\r\n\
        \"Lock\" : 3,\r\n\
        \"Appearance\" : 1,\r\n\
        \"PlaceHolderText\":\"Place holder example\"\r\n\
    },\r\n\
    \"type\":1\r\n\
}";

    _plugin.init = function()
    {
        document.getElementById('textArea').value = _placeholderPlainRich;

        document.getElementById('buttonIDInsert').onclick = function() {
            let _val = document.getElementById("textArea").value;
            _val = _val.replaceAll("\r\n", "");
            _val = _val.replaceAll("\n", "");
            let _obj = JSON.parse(_val);

            _plugin.executeMethod('AddContentControl', [_obj.type, _obj.commonPr]);
        };

        document.getElementById('buttonIDInsertAndReplace').onclick = function() {
            _plugin.executeMethod('GetAllContentControls', null, function(data) {

                var sInternalId = data[0].InternalId.toString();

                _plugin.executeMethod('InsertAndReplaceContentControls', [
                    [{
                        "Props": {
                            "InternalId": sInternalId
                        },
                        "Script": "var oDocument = Api.GetDocument();\n" +
                            "var oBlockLvlSdt = oDocument.GetElement(0);\n" +
                            "var oPar = Api.CreateParagraph();\n"+
                            "var oDrawing = Api.CreateImage(\"https://api.onlyoffice.com/content/img/docbuilder/examples/coordinate_aspects.png\", 60 * 36000, 35 * 36000);\n" +
                            "oPar.AddDrawing(oDrawing);\n" +
                            "oBlockLvlSdt.AddElement(oPar, 0);\n"+
                            "var sClassType = oDrawing.GetClassType();\n" +
                            "var oParagraph = Api.CreateParagraph();\n" +
                            "oParagraph.AddText(\"Class Type = \" + sClassType);\n"+
                            "oDocument.AddElement(1, oParagraph);\n"
                    }]
                ]);
            });
        }
    };

    _plugin.button = function(id) {};

})(window, undefined);

<!--
 (c) Copyright Ascensio System SIA 2020

 Licensed under the Apache License, Version 2.0 (the "License");
 you may not use this file except in compliance with the License.
 You may obtain a copy of the License at

     http://www.apache.org/licenses/LICENSE-2.0

 Unless required by applicable law or agreed to in writing, software
 distributed under the License is distributed on an "AS IS" BASIS,
 WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 See the License for the specific language governing permissions and
 limitations under the License.
 -->
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8" />
    <title>Is Inside mode</title>
    <script type="text/javascript" src="https://onlyoffice.github.io/sdkjs-plugins/v1/plugins.js"></script>
    <script type="text/javascript" src="https://onlyoffice.github.io/sdkjs-plugins/v1/plugins-ui.js"></script>
    <link rel="stylesheet" href="https://onlyoffice.github.io/sdkjs-plugins/v1/plugins.css">
    <script type="text/javascript" src="scripts/isinsidemode.js"></script>
</head>
<body>
<div>
    <p><b>Insert test:</b></p>
    <p><textarea id="textArea" rows="10" cols="45" name="text" style="tab-size: 5; margin: 0px; padding: 0px; width:100%; height:100%;"></textarea></p>
    <p><input id="buttonIDInsert" type="submit" value="Send button"></p>
    <p><input id="buttonIDInsertAndReplace" type="submit" value="Replace button"></p>
</div>
</body>
</html>

[askonev]

correct_plugin.zip