How do I determine current mode client side

Avatar

Avatar

James_Lelyveld

Avatar

James_Lelyveld

James_Lelyveld

15-10-2015

In CQ 5.6.1 the author would add .cq-wcm-edit & .cq-wcm-preview classes to the body tag (depending on current mode). This was added client side so you could add CSS classes that would only affect the page in edit mode. 

In AEM 6 this doesn't appear to happen any more, as the switch from Edit mode to Preview mode doesn't require a page refresh is there anyway to detect  when the mode changes?

( The aim of this is to make sure any CSS to enhance the author experience doesn't show when the author is previewing what the end site will look like).

View Entire Topic

Avatar

Avatar

akashs51893872

Avatar

akashs51893872

akashs51893872

24-10-2018

This is what worked for me:

STEP 1 : creating a cq:ClientLibraryFolder node with category="[cq.authoring.editor]":

1606284_pastedImage_0.png

STEP 2: Add the script for listening in on the `cq-layer-activated` event:

1606289_pastedImage_0.png

Good Luck...