001/*
002 * This library is part of OpenCms -
003 * the Open Source Content Management System
004 *
005 * Copyright (c) Alkacon Software GmbH & Co. KG (http://www.alkacon.com)
006 *
007 * This library is free software; you can redistribute it and/or
008 * modify it under the terms of the GNU Lesser General Public
009 * License as published by the Free Software Foundation; either
010 * version 2.1 of the License, or (at your option) any later version.
011 *
012 * This library is distributed in the hope that it will be useful,
013 * but WITHOUT ANY WARRANTY; without even the implied warranty of
014 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
015 * Lesser General Public License for more details.
016 *
017 * For further information about Alkacon Software, please see the
018 * company website: http://www.alkacon.com
019 *
020 * For further information about OpenCms, please see the
021 * project website: http://www.opencms.org
022 *
023 * You should have received a copy of the GNU Lesser General Public
024 * License along with this library; if not, write to the Free Software
025 * Foundation, Inc., 59 Temple Place, Suite 330, Boston, MA  02111-1307  USA
026 */
027
028package org.opencms.gwt.client;
029
030import org.opencms.gwt.client.util.CmsMediaQuery;
031
032import com.google.gwt.dom.client.Element;
033import com.google.gwt.user.client.ui.RootPanel;
034
035/**
036 * Singleton class that evaluates, and keeps track of changes for, a fixed set of media queries and sets CSS classes
037 * on the body element depending on which of the media queries match.
038 */
039public class CmsMediaQueryRuleManager {
040
041    /** The instance. */
042    protected static CmsMediaQueryRuleManager instance;
043
044    /**
045     * Initializes the rules.
046     */
047    protected CmsMediaQueryRuleManager() {
048
049        addRule("oc-touch-only", CmsCoreProvider.TOUCH_ONLY_RULE);
050        addRule("oc-screensize-small", "(max-width: " + CmsWidthConstants.smallHigh() + ")");
051        addRule(
052            "oc-screensize-medium",
053            "(min-width: "
054                + CmsWidthConstants.mediumLow()
055                + ") and (max-width: "
056                + CmsWidthConstants.mediumHigh()
057                + ")");
058        addRule("oc-screensize-large", "(min-width: " + CmsWidthConstants.largeLow() + ")");
059    }
060
061    /**
062     * Gets the instance.
063     *
064     * @return the instance
065     */
066    public static CmsMediaQueryRuleManager get() {
067
068        if (instance == null) {
069            instance = new CmsMediaQueryRuleManager();
070        }
071        return instance;
072    }
073
074    /** Initializes the manager and sets up the rules. */
075    public static void initialize() {
076
077        CmsMediaQueryRuleManager.get();
078
079    }
080
081    /**
082     * Installs a new media query rule.
083     *
084     * @param cssClass the CSS class to add if the media query matches
085     * @param mediaQueryText the text of the media query
086     */
087    public void addRule(String cssClass, String mediaQueryText) {
088
089        CmsMediaQuery mediaQuery = CmsMediaQuery.parse(mediaQueryText);
090        updateBodyClass(cssClass, mediaQuery.matches());
091        mediaQuery.addListener(match -> {
092            updateBodyClass(cssClass, match.booleanValue());
093        });
094    }
095
096    /**
097     * Adds or removes a CSS class from the body.
098     *
099     * @param cssClass the CSS class
100     * @param enabled true if the class should be added, false to remove it
101     */
102    public void updateBodyClass(String cssClass, boolean enabled) {
103
104        Element body = RootPanel.getBodyElement();
105        if (enabled) {
106            body.addClassName(cssClass);
107        } else {
108            body.removeClassName(cssClass);
109        }
110    }
111
112}