[IMPLEMENTED] Add the insert Assets button to the custom editor

Feature Requests Implemented Features
1

Hi Sebastian,

May I know how to insert the insert Assets button in my custom editor?

image
image1071×557 7.61 KB

For my custom editor, it’s similar to the default because I’m using TINY, but currently I just using a html file as the reference of the custom editor. I saw your source code, you are using typescript to build the editor, can I add the button just using a simple html file?

Many Thanks!

2

Hi Sebastian, is there any methods? Many thanks!

3

No, sorry. I will change it to a feature request.

4

It’s ok, thanks for your reply!

5

I mean you can write your own asset selector. It is not that hard.

6

Sorry I missed the important thing …
What I actually want is a asset button which can open the linked assets in squidex, just like your default “insert Assets” button, this will pop up when the button was clicked:

image
image1088×831 15.7 KB

7

Yes, I got that. But right now it is not possible. So the only option is to write a custom selector.

8

Got it. Thank you for your reply again!

9

Hi,

I have implemented this feature request and have done a little bit extra:

image
image903×327 3.65 KB

You have 4 new functions now:

  • Show an error alert
  • Show an info alert
  • Show confirm dialog
  • Show asset dialog.

It is documented with a sample.

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">

    <!-- Load the editor sdk from the local folder or https://cloud.squidex.io/scripts/editor-sdk.js -->
    <script src="editor-sdk.js"></script>
</head>

<body>
    <button id="alert">
        ALERT
    </button>

    <button id="info">
        INFO
    </button>

    <button id="confirm">
        CONFIRM
    </button>

    <button id="pickAssets">
        PICK ASSETS
    </button>

    <script>
        // When the field is instantiated it notifies the UI that it has been loaded.
        //
        // Furthermore it sends the current size to the parent.
        var field = new SquidexFormField();

        document.getElementById('alert').addEventListener('click', function () {
            field.notifyError('ERROR Text');
        });

        document.getElementById('info').addEventListener('click', function () {
            field.notifyInfo('INFO Text');
        });

        document.getElementById('confirm').addEventListener('click', function () {
            field.confirm('CONFIRM Title', 'CONFIRM Text', function (confirmed) {
                console.log('CONFIRMED: ' + confirmed);
            });
        });

        document.getElementById('pickAssets').addEventListener('click', function () {
            field.pickAssets(function (assets) {
                console.log('ASSETS: ' + JSON.stringify(assets, undefined, 2));
            });
        });
    </script>
</body>

</html>
10

This topic was automatically closed after 2 days. New replies are no longer allowed.