Search in sources :

Example 6 with CSSStyleDeclaration

use of elemental.css.CSSStyleDeclaration in project che by eclipse.

the class PositionController method resetElementPosition.

/**
     * Resets an element's position by removing top/right/bottom/left and setting position to
     * absolute.
     */
private void resetElementPosition() {
    CSSStyleDeclaration style = element.getStyle();
    style.setPosition("absolute");
    style.clearTop();
    style.clearRight();
    style.clearBottom();
    style.clearLeft();
    elementPositioner.appendElementToContainer(element);
}
Also used : CSSStyleDeclaration(elemental.css.CSSStyleDeclaration)

Example 7 with CSSStyleDeclaration

use of elemental.css.CSSStyleDeclaration in project che by eclipse.

the class PositionController method ensureVisibleAndGetRect.

/**
     * Ensures that an element is not display: none and is just visibility hidden so we can get an
     * accurate client rect.
     */
private static ClientRect ensureVisibleAndGetRect(Element element) {
    // Try to get rect and see if it isn't all 0's
    ClientRect rect = element.getBoundingClientRect();
    double rectSum = rect.getBottom() + rect.getTop() + rect.getLeft() + rect.getRight() + rect.getHeight() + rect.getWidth();
    if (rectSum != 0) {
        return rect;
    }
    // We make an attempt to get an accurate measurement of the element
    CSSStyleDeclaration style = element.getStyle();
    String visibility = CssUtils.setAndSaveProperty(element, "visibility", "hidden");
    String display = style.getDisplay();
    // if display set to none we remove it and let its normal style show through
    if (style.getDisplay().equals("none")) {
        style.removeProperty("display");
    } else {
        // it's likely display: none in a css class so we just have to guess.
        // We guess display:block since that's common on containers.
        style.setDisplay("block");
    }
    rect = element.getBoundingClientRect();
    style.setDisplay(display);
    style.setVisibility(visibility);
    return rect;
}
Also used : ClientRect(elemental.html.ClientRect) RelativeClientRect(org.eclipse.che.ide.util.RelativeClientRect) CSSStyleDeclaration(elemental.css.CSSStyleDeclaration)

Example 8 with CSSStyleDeclaration

use of elemental.css.CSSStyleDeclaration in project che by eclipse.

the class AnimationController method hide.

/**
     * Animate the element out of view. Do not enable transitions in the CSS for this element, or the
     * animations may not work correctly. AnimationController will enable animations automatically.
     *
     * @see #hideWithoutAnimating(Element)
     */
public void hide(final Element element) {
    // Early exit if the element is hidden or hiding.
    if (isAnyState(element, State.HIDDEN, State.HIDING)) {
        return;
    }
    if (!isAnimated) {
        hideWithoutAnimating(element);
        return;
    }
    // Cancel pending transition event listeners.
    showEndHandler.unhandleEndFor(element);
    final CSSStyleDeclaration style = element.getStyle();
    if (options.collapse) {
        // Set height because the CSS transition requires one
        int height = getCurrentHeight(element);
        style.setHeight(height + CSSStyleDeclaration.Unit.PX);
    }
    // Give the browser a chance to accept the height set above
    setState(element, State.HIDING);
    schedule(element, new ScheduledCommand() {

        @Override
        public void execute() {
            // The user changed the state before this command executed.
            if (!clearLastCommand(element, this) || !isAnyState(element, State.HIDING)) {
                return;
            }
            if (options.collapse) {
                /*
           * Hide overflow if changing height, or the overflow will be visible
           * even as the element collapses.
           */
                AnimationUtils.backupOverflow(style);
            }
            AnimationUtils.enableTransitions(style);
            if (options.collapse) {
                // Animate all properties that could affect height if collapsing.
                style.setHeight("0");
                style.setMarginTop("0");
                style.setMarginBottom("0");
                style.setPaddingTop("0");
                style.setPaddingBottom("0");
                CssUtils.setBoxShadow(element, "0 0");
            }
            if (options.fade) {
                style.setOpacity(0);
            }
        }
    });
    // For webkit based browsers.
    hideEndHandler.handleEndFor(element);
}
Also used : ScheduledCommand(com.google.gwt.core.client.Scheduler.ScheduledCommand) CSSStyleDeclaration(elemental.css.CSSStyleDeclaration)

Example 9 with CSSStyleDeclaration

use of elemental.css.CSSStyleDeclaration in project che by eclipse.

the class AnimationController method cancel.

/** Cancel the currently executing animation without completing it. */
private void cancel(Element element) {
    // Cancel all handlers.
    setLastCommandImpl(element, null);
    hideEndHandler.unhandleEndFor(element);
    showEndHandler.unhandleEndFor(element);
    // Disable animations.
    CSSStyleDeclaration style = element.getStyle();
    AnimationUtils.removeTransitions(style);
    if (options.collapse) {
        AnimationUtils.restoreOverflow(style);
    }
    // Remove the height and properties we set.
    if (options.collapse) {
        style.removeProperty("height");
        style.removeProperty("margin-top");
        style.removeProperty("margin-bottom");
        style.removeProperty("padding-top");
        style.removeProperty("padding-bottom");
    }
    if (options.fade) {
        style.removeProperty("opacity");
    }
    CssUtils.removeBoxShadow(element);
}
Also used : CSSStyleDeclaration(elemental.css.CSSStyleDeclaration)

Aggregations

CSSStyleDeclaration (elemental.css.CSSStyleDeclaration)9 ScheduledCommand (com.google.gwt.core.client.Scheduler.ScheduledCommand)2 Element (elemental.dom.Element)2 ClientRect (elemental.html.ClientRect)1 RelativeClientRect (org.eclipse.che.ide.util.RelativeClientRect)1