Modules (181)

InlineWidget

Description

Dependencies

Classes

Constructor

InlineWidget

    function InlineWidget() {
        var self = this;

        // create the outer wrapper div
        this.htmlContent = window.document.createElement("div");
        this.$htmlContent = $(this.htmlContent).addClass("inline-widget").attr("tabindex", "-1");
        this.$htmlContent.append("<div class='shadow top' />")
            .append("<div class='shadow bottom' />")
            .append("<a href='#' class='close no-focus'>&times;</a>");

        // create the close button
        this.$closeBtn = this.$htmlContent.find(".close");
        this.$closeBtn.click(function (e) {
            self.close();
            e.stopImmediatePropagation();
        });

        this.$htmlContent.on("keydown", function (e) {
            if (e.keyCode === KeyEvent.DOM_VK_ESCAPE) {
                self.close();
                e.stopImmediatePropagation();
            }
        });
    }
    InlineWidget.prototype.htmlContent = null;
    InlineWidget.prototype.$htmlContent = null;
    InlineWidget.prototype.id = null;
    InlineWidget.prototype.hostEditor = null;
    EventDispatcher.makeEventDispatcher(InlineWidget.prototype);

Properties

height

Initial height of inline widget in pixels. Can be changed later via hostEditor.setInlineWidgetHeight()

Type
number
    InlineWidget.prototype.height = 0;

Methods

close

Closes this inline widget and all its contained Editors

Returns: $.Promise
A promise that's resolved when the widget is fully closed.
    InlineWidget.prototype.close = function () {
        return EditorManager.closeInlineWidget(this.hostEditor, this);
        // closeInlineWidget() causes our onClosed() handler to be called
    };

hasFocus

Returns: boolean
True if any part of the inline widget is focused
    InlineWidget.prototype.hasFocus = function () {
        var focusedItem = window.document.activeElement,
            htmlContent = this.$htmlContent[0];
        return $.contains(htmlContent, focusedItem) || htmlContent === focusedItem;
    };

load

hostEditor Editor
    InlineWidget.prototype.load = function (hostEditor) {
        this.hostEditor = hostEditor;
    };

onAdded

Called once content is parented in the host editor's DOM. Useful for performing tasks like setting focus or measuring content, which require htmlContent to be in the DOM tree.

IMPORTANT: onAdded() MUST be overridden to call hostEditor.setInlineWidgetHeight() at least once to set the initial height (required to animate it open). The widget will never open otherwise.

    InlineWidget.prototype.onAdded = function () {
        this.trigger("add");
    };

onClosed

Called any time inline is closed, whether manually or automatically.

    InlineWidget.prototype.onClosed = function () {
        this.trigger("close");
    };

onParentShown

Called when the editor containing the inline is made visible.

    InlineWidget.prototype.onParentShown = function () {
        // do nothing - base implementation
    };

refresh

Called when the parent editor does a full refresh--for example, when the font size changes.

    InlineWidget.prototype.refresh = function () {
        // do nothing - base implementation
    };

    exports.InlineWidget = InlineWidget;

});