<div ng-controller="Umbraco.Editors.EmbedController as vm">
    <form name="embedForm">

        <umb-editor-view>
                
            <umb-editor-header
                name="model.title"
                name-locked="true"
                hide-alias="true"
                hide-icon="true"
                hide-description="true">
            </umb-editor-header>

            <umb-editor-container class="block-form">
                <umb-box>
                    <umb-box-content>

                        <umb-control-group label="@general_url">
                            <input id="url" class="umb-property-editor input-block-level" type="text" style="margin-bottom: 10px;" ng-model="model.embed.url" ng-keyup="$event.keyCode == 13 ? vm.showPreview() : null" required />
                            <umb-button
                                type="button"
                                action="vm.showPreview()"
                                button-style="info"
                                label-key="general_retrieve">
                            </umb-button>
                        </umb-control-group>
                
                        <umb-control-group>
                            <p ng-bind="model.embed.info"></p>
                            <div ng-bind-html="vm.trustedPreview"></div>
                        </umb-control-group>
                
                        <div ng-show="model.embed.supportsDimensions">
                            <umb-control-group label="@general_width">
                                <input type="number" pattern="[0-9]*" min="0" ng-model="model.embed.width" ng-blur="vm.changeSize('width')" />
                            </umb-control-group>
                
                            <umb-control-group label="@general_height">
                                <input type="number" pattern="[0-9]*" min="0" ng-model="model.embed.height" ng-blur="vm.changeSize('height')" />
                            </umb-control-group>
                
                            <umb-control-group label="@general_constrain">
                                <input id="constrain" type="checkbox" ng-model="model.embed.constrain" />
                            </umb-control-group>
                        </div>
                        
                    </umb-box-content>
                </umb-box>
            </umb-editor-container>

            <umb-editor-footer>
                <umb-editor-footer-content-right>
                    <umb-button
                        type="button"
                        button-style="link"
                        label-key="general_close"
                        shortcut="esc"
                        action="vm.close()">
                    </umb-button>
                    <umb-button
                        type="button"
                        button-style="success"
                        label-key="general_submit"
                        state="vm.saveButtonState"
                        action="vm.submit(model)">
                    </umb-button>
                </umb-editor-footer-content-right>
            </umb-editor-footer>

        </umb-editor-view>

    </form>

</div>
