Touch UI v/s Classic UI in AEM

Question

How do we check whether the html page in Adobe Experience Manager/CQ5 is opened in touch mode or classic mode?

Answer 1

You can add dependency to /libs/wcm/foundation/components/utils/AuthoringUtils.js and then call AuthoringUtils.isTouch and AuthoringUtils.isClassic to check whether it is currently in touch or the classic mode. For e.g., your JS Use API would look something like below.

"use strict";

use(["/libs/wcm/foundation/components/utils/AuthoringUtils.js"], function (AuthoringUtils) {
    if (AuthoringUtils.isTouch) {
        // do something
    } else {
        // do something else
    }

    // rest of the things
}