Read the statement by Michael Teeuw here.
How to Swipe between pages
-
I have MagicMirror2 installed on a Raspberry PI 4 with a Pi Touch Display2. I am trying to Swipe between pages using MMM-SmartTouch and MMM-Pages. The config looks right but I can’t figure out what I am doing wrong? Here is a copy of my config.
let config = { address: "0.0.0.0", port: 8080, basePath: "/", ipWhitelist: ["127.0.0.1", "::ffff:127.0.0.1", "::1", "192.168.4.0/24"], useHttps: false, httpsPrivateKey: "", httpsCertificate: "", language: "en", locale: "en-US", logLevel: ["INFO", "LOG", "WARN", "ERROR"], timeFormat: 12, units: "imperial", modules: [ { module: "alert", }, { module: "updatenotification", position: "top_bar" }, { module: "clock", position: "top_left", classes: "page-1" }, { module: "calendar", header: "US Holidays", position: "top_left", classes: "page-1", config: { calendars: [ { fetchInterval: 7 * 24 * 60 * 60 * 1000, symbol: "calendar-check", url: "https://ics.calendarlabs.com/76/mm3137/US_Holidays.ics" } ] } }, { module: "compliments", position: "lower_third", classes: "page-1" }, { module: "weather", position: "top_right", classes: "page-2", config: { weatherProvider: "openmeteo", type: "current", lat: 40.776676, lon: -73.971321 } }, { module: "weather", position: "top_right", header: "Weather Forecast", classes: "page-2", config: { weatherProvider: "openmeteo", type: "forecast", lat: 40.776676, lon: -73.971321 } }, { module: "MMM-MyWeather", position: "top_right", classes: "page-2", config: { // Your MyWeather configuration } }, { module: "newsfeed", position: "bottom_bar", classes: "page-2", config: { feeds: [ { title: "New York Times", url: "https://rss.nytimes.com/services/xml/rss/nyt/HomePage.xml" } ], showSourceTitle: true, showPublishDate: true, broadcastNewsFeeds: true, broadcastNewsUpdates: true } }, { module: "MMM-HomeAssistantDisplay", position: "middle_center", classes: "page-3", config: { // Your Home Assistant configuration } }, { module: "MMM-Cursor", config: { timeout: 3000 // Increased timeout for better touch experience } }, { module: 'MMM-BackgroundSlideshow', position: 'fullscreen_below', config: { imagePaths: ['modules/MMM-BackgroundSlideshow/exampleImages/'], transitionImages: true, randomizeImageOrder: true, slideshowSpeed: 30000 // 30 seconds per background } }, { module: "MMM-Pages", config: { modules: [ ["page-1"], // Page 1: Clock, Calendar, Compliments ["page-2"], // Page 2: Weather and News ["page-3"] // Page 3: Home Assistant ], fixed: ["alert", "updatenotification", "MMM-page-indicator", "MMM-SmartTouch", "MMM-Cursor", "MMM-BackgroundSlideshow"], animationTime: 1000, // Smooth transition between pages rotationTime: 0, // No automatic rotation rotationDelay: 10000, touchMode: true, // Enable touch support useSwipe: true, swipeSensitivity: 30 } }, { module: "MMM-page-indicator", position: "bottom_bar", config: { pages: 3, // Now 3 pages total activeBrightness: 100, inactiveBrightness: 30 } }, { module: "MMM-SmartTouch", position: "fullscreen_above", config: { debug: true, enableCursor: true, cursorTimeout: 3000, // Hide cursor after 3 seconds gesture: { sensitivity: 15, // Better for Raspberry Pi Touch Display minSwipeDistance: 30, // Lower threshold for easier swiping maxTimeThreshold: 1000 // More time allowed to complete swipe }, touches: [ { gesture: "swipeleft", command: "NEXT_PAGE" }, { gesture: "swiperight", command: "PREVIOUS_PAGE" }, { gesture: "tap", command: "SHOW_CURSOR" }, { gesture: "doubletap", command: "REFRESH" // Allows refreshing the mirror if needed } ] } } ] }; /*************** DO NOT EDIT THE LINE BELOW ***************/ if (typeof module !== "undefined") { module.exports = config; } -
@TheSteveBennett where is smarttouch from? only one i see doesn’t have any config, and doesn’t do swipe
-
@TheSteveBennett also you should install
MMM-ViewNotifications
so you can see what events are being processed -
@sdetweil That is the one I installed. How can you tell that it doesn’t support swipe and could you recommend one that does.
-
@TheSteveBennett it has no config, i looked at the code
i dont know where you got the config from.
id look at the 3rd party list (linked above) and search on swipe
there have bern a few posts recently(last monthish) on this topicsadly MagicMirror forum search stinks
-
@sdetweil said in How to Swipe between pages:
sadly MagicMirror forum search stinks
:-)
what I’m using regularly and works pretty well is external search via Google with limitation to site forum.mgicmirror.builders …
Astonishing…Regards,
Ralf -
@rkorell i tried that a long time ago , but wasnt happy
this time better, ill have to figure out some parms cause 2017 results before 2025 is not helpful either
-
@TheSteveBennett MMM-Touch was the module i was thinking of
-
@sdetweil
Hi Sam, were you able to get the swipe functionality working and did you use the MMM-SmartTouch along with the MMM-Touch modules? If so, could you provide your code to get this working as I’m new to the Magic Mirror community and struggling to get this swipe functionality working.Thanks!
Seabass
-
@seabass wasnt me trying to do swipe. i was trying to help the OP debug and find out what was going on.
-
@sdetweil Sorry about that.
@TheSteveBennett were you able to get the swipe functionality working and did you use the MMM-SmartTouch along with the MMM-Touch modules? If so, could you provide your code to get this working as I’m new to the Magic Mirror community and struggling to get this swipe functionality working.
-
@seabass If you add MMM-ViewNotifications, does it show any notifications being sent?
-
@seabass neither of those modules support swipe
MMM-Swipe maybe but it requires hardware sensor
-
@seabass you can use the MMM-PageIndicator module to put buttons on the screen to provide manual nav (and you can customize the buttons using css)
its not swipe tho
also, are you talking mouse swipe, finger swipe, hand waving swipe?
they all have different requirements for implementation -
@sdetweil I seem to only see the onIdle notification from the MMM-Touch module. When I use the MMM-SmartTouch module it works as it should so I know the touch screen is working fine. Here’s my config for MMM-Touch.
module: "MMM-Touch", position: "fullscreen_above", config: { debug: false, useDisplay: true, autoMode: false, threshold: { moment_ms: 1000 * 0.5, double_ms: 1000 * 0.75, press_ms: 1000 * 3, move_px: 50, pinch_px: 50, rotate_dg: 20, idle_ms: 30000, }, defaultMode: "default", onTouchStart: "TOUCH_ACTIVITY_STARTED", onTouchEnd: null, onTouchEnd: "TOUCH_ACTIVITY_ENDED" onIdle: "TOUCH_IDLE_TRIGGERED", gestureCommands: { "default": { "SWIPE-LEFT": (commander, gesture) => { commander.sendNotification("NEW_PAGE"), commander.sendNotification("PAGE_INCREMENT") }, "SWIPE-RIGHT": (commander, gesture) => { commander.sendNotification("NEW_PAGE"), commander.sendNotification("PAGE_DECREMENT") } } } } -
@sdetweil I’ve been trying to use MMM-Touch (https://github.com/gfischershaw/MMM-Touch/tree/master) which says it’s a plugin for touch gesture commander using touchscreen. Regarding what type of swipe, I’m wanting to use finger swipe on the touchscreen. For testing purposes, mouse swipe when using VNC would be nice.
-
@seabass so, using MMM-ViewNotifications module
do you see the notifications going out?
if you look in the developers window console tab (ctrl-shift-i) do you see any errors related to the touch module?what other modules are loaded besides pages?
-
@sdetweil The only notification from MMM-Touch I saw was that onIdle one I mentioned earlier. I saw a css error in the dev console. I’m not in front of the Pi right now so I can’t get the exact message but I don’t think it has anything to do with this issue. I have the MMM-Pages, MMM-page-indicator and standard modules loaded. I initially had the MMM-SmartTouch loaded which worked but I removed it for now until I can get the MMM-Touch working.
-
@seabass For me the following cofiguration ist working fine with every Touch Display I’m using. (Surface, Dell Touch Monitor, HP AIO Touch)
I using this module. MMM-Touch and also MMM-Pages{ module: "MMM-Touch", position: "top_center", classes: "", disabled: false, config: { debug: false, useDisplay: false, autoMode: false, defaultMode: "default", gestureCommands: { "default":{ "TAP_1": (commander) => {commander.sendNotification("USER_PRESENCE", true);}, "SWIPE_RIGHT_1": (commander) => {commander.sendNotification("PAGE_DECREMENT", null);}, "SWIPE_LEFT_1": (commander) => {commander.sendNotification("PAGE_INCREMENT", null);}, "SWIPE_DOWN_1": (commander, gesture) => {commander.sendNotification("ARTICLE_PREVIOUS")}, "SWIPE_UP_1": (commander, gesture) => {commander.sendNotification("ARTICLE_NEXT")}, "SWIPE_DOWN_2": (commander, gesture) => {commander.sendNotification("BACKGROUNDSLIDESHOW_PREV")}, "SWIPE_UP_2": (commander, gesture) => {commander.sendNotification("BACKGROUNDSLIDESHOW_NEXT")}, //"DOUBLE_TAP_1": (commander) => {commander.sendNotification("LOAD_NEXT_WALLPAPER", null);}, "SWIPE_LEFT_2": (commander) => {commander.sendNotification('CX3_GET_CONFIG', {callback: (before) => {commander.sendNotification('CX3_SET_CONFIG', {monthIndex: before.monthIndex + 1,callback: (after) => {setTimeout(() => { commander.sendNotification('CX3_RESET') }, 60_000)}})}})}, "SWIPE_RIGHT_2": (commander) => {commander.sendNotification('CX3_GET_CONFIG', {callback: (before) => {commander.sendNotification('CX3_SET_CONFIG', {monthIndex: before.monthIndex - 1,callback: (after) => {setTimeout(() => { commander.sendNotification('CX3_RESET') }, 60_000)}})}})}, }, } }, },
Hello! It looks like you're interested in this conversation, but you don't have an account yet.
Getting fed up of having to scroll through the same posts each visit? When you register for an account, you'll always come back to exactly where you were before, and choose to be notified of new replies (either via email, or push notification). You'll also be able to save bookmarks and upvote posts to show your appreciation to other community members.
With your input, this post could be even better 💗
Register Login