Need help MMM-touch MMM-pages MMM-page indicator

tburk32

@CurlyQ12391 @MMRIZE, I followed this thread to enable the swipe left and right to change pages but I’ve run into an issue that this only works when I have the dev console open, either using npm start dev or npm run start followed by ctrl+shift+i. Do you have any ideas why it would only work when the dev console is open?

sdetweil

@tburk32 no. the code doesn’t know

sdetweil

@tburk32 also, before 2.30

you could do

npm start dev

on 2.30, because of the different ui engine choices

npm run start:dev

tburk32

@sdetweil I agree, but it isn’t the way it’s acting. When I have it in the dev console, a grey circle also appears on the screen as a cursor and I’m wondering if that is part of the difference.

sdetweil

@tburk32 maybe the dev console gives you access under the z-index for touch

tburk32

@sdetweil I removed all of the other modules in my config.js file and experienced the same results. To go one step further with the z-index exploration, I added this to the custom.css.

.MMM-Touch (position: absolute; z-index -1)

Additionally, while having the dev console open, clicks with a mouse also register on MMM-Touch, so I it doesn’t seem like it’s unique to the display/touch function.

I really appreciate your responses so far.

sdetweil

@tburk32 you have an error there

css has

name : value ;

your z-index is missing both : and ;

and -1 means background, down/further away , in the 3d stack
so that puts other content on top of it, so touch wont work

tburk32

@sdetweil thanks for pointing out the -1 index, I saw it as a resolution on another topic and figured I’d try. No values in the z-index seem to make a difference.

While in devtools, I selected “restore defaults and reload” and the MMM-Touch inputs were no longer recognized, which aligns with the expectation that “the code doesn’t know”. This helped me realize that the Device toolbar (ctrl+shift+M) has to be displayed for the inputs to be recognized again, either with a touch or a click.

sdetweil

@tburk32 did you enable touch events in custom.css
cause they are disabled by default in main.css
main.css

html {
  cursor: none;

}

custom.css

html {
  cursor: default;
}

tburk32

@sdetweil changing the cursor value doesn’t seem to make a difference. The touch functionality works for mmm-Calendarext3, to select a day, clicking on the mmm-page-indicator to change pages and mmm-Microsofttodo to complete tasks, so it doesn’t seem to be a problem aside from mmm-Touch not registering the values unless in devtools with the device toolbar open.