MagicMirror Forum
    • Recent
    • Tags
    • Unsolved
    • Solved
    • MagicMirror² Repository
    • Documentation
    • 3rd-Party-Modules
    • Donate
    • Discord
    • Register
    • Login
    A New Chapter for MagicMirror: The Community Takes the Lead
    Read the statement by Michael Teeuw here.

    Delete Fade In/Fade Out animation in the NewsFeed Module

    Scheduled Pinned Locked Moved Custom CSS
    11 Posts 2 Posters 877 Views 2 Watching
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • V Offline
      victorjim @sdetweil
      last edited by

      @sdetweil Hello
      This is my code, I use a single screen to display 4 news.

      /* Config Sample
       *
       * For more information on how you can configure this file
       * see https://docs.magicmirror.builders/configuration/introduction.html
       * and https://docs.magicmirror.builders/modules/configuration.html
       *
       * You can use environment variables using a `config.js.template` file instead of `config.js`
       * which will be converted to `config.js` while starting. For more information
       * see https://docs.magicmirror.builders/configuration/introduction.html#enviromnent-variables
       */
      let config = {
      	address: "localhost",	// Address to listen on, can be:
      							// - "localhost", "127.0.0.1", "::1" to listen on loopback interface
      							// - another specific IPv4/6 to listen on a specific interface
      							// - "0.0.0.0", "::" to listen on any interface
      							// Default, when address config is left out or empty, is "localhost"
      	port: 8080,
      	basePath: "/",	// The URL path where MagicMirror² is hosted. If you are using a Reverse proxy
      									// you must set the sub path here. basePath must end with a /
      	ipWhitelist: ["127.0.0.1", "::ffff:127.0.0.1", "::1"],	// Set [] to allow all IP addresses
      									// or add a specific IPv4 of 192.168.1.5 :
      									// ["127.0.0.1", "::ffff:127.0.0.1", "::1", "::ffff:192.168.1.5"],
      									// or IPv4 range of 192.168.3.0 --> 192.168.3.15 use CIDR format :
      									// ["127.0.0.1", "::ffff:127.0.0.1", "::1", "::ffff:192.168.3.0/28"],
      
      	useHttps: false,			// Support HTTPS or not, default "false" will use HTTP
      	httpsPrivateKey: "",	// HTTPS private key path, only require when useHttps is true
      	httpsCertificate: "",	// HTTPS Certificate path, only require when useHttps is true
      
      	language: "es",
      	locale: "es-ES",
      	logLevel: ["INFO", "LOG", "WARN", "ERROR"], // Add "DEBUG" for even more logging
      	timeFormat: 24,
      	units: "metric",
      
      	modules: [
      		
      		{
      			module: "newsfeed",
      			position: "top_bar",
      			reloadInterval: 60000,
      			animationSpeed: 5*1000,
      			config: {
      				feeds: [
      				{
      					title: "Portada Periodico de Aragon",
      					url: "https://www.elperiodicodearagon.com/rss/section/23500"
      				}
      				],
      				showSourceTitle: true,
      				showPublishDate: true,
      				showDescription: true,
      				broadcastNewsFeeds: true,
      				broadcastNewsUpdates: true
      			}
      		},
      		{
      			module: "newsfeed",
      			position: "top_bar",
      			reloadInterval: 60000,
      			animationSpeed: 5*1000,
      			config: {
      				feeds: [
      				{
      					title: "Portada Periodico ABC",
      					url: "https://www.abc.es/rss/2.0/portada/"
      				}
      				],
      				showSourceTitle: true,
      				showPublishDate: true,
      				showDescription: true,
      				broadcastNewsFeeds: true,
      				broadcastNewsUpdates: true
      			}
      		},
      		{
      			module: "newsfeed",
      			position: "top_bar",
      			reloadInterval: 60000,
      			animationSpeed: 5*1000,
      			config: {
      				feeds: [
      				{
      					title: "Portada El Mundo",
      					url: "http://estaticos.elmundo.es/elmundo/rss/espana.xml"
      				}
      				],
      				showSourceTitle: true,
      				showPublishDate: true,
      				showDescription: true,
      				broadcastNewsFeeds: true,
      				broadcastNewsUpdates: true
      			}
      		},
      		{
      			module: "newsfeed",
      			position: "top_bar",
      			reloadInterval: 60000,
      			animationSpeed: 5*1000,
      			config: {
      				feeds: [
      				{
      					title: "Portada Libertad Digital",
      					url: "http://feeds2.feedburner.com/libertaddigital/portada"
      				}
      				],
      				showSourceTitle: true,
      				showPublishDate: true,
      				showDescription: true,
      				broadcastNewsFeeds: true,
      				broadcastNewsUpdates: true
      			}
      		},
      	]
      };
      
      /*************** DO NOT EDIT THE LINE BELOW ***************/
      if (typeof module !== "undefined") { module.exports = config; }
      

      I hope I haven´t written this code wrong.
      The reason for putting the 4 modules separately is so that I can control the space between them a bit since, I have no experience with CSS.
      Thank you.

      S 1 Reply Last reply Reply Quote 0
      • S Do not disturb
        sdetweil @victorjim
        last edited by sdetweil

        @victorjim

            reloadInterval: 60000,
            animationSpeed: 5*1000,
        

        those two properties are for the module, not MagicMirror, so they should be inside the config:{ section, here is the doc for module parameters for MagicMirror,
        https://docs.magicmirror.builders/modules/configuration.html#example

        	animationSpeed: 5*1000,
        

        means 5 seconds for each news item to appear and disappear. longer animation

        you want it to be shorter or not at all

        	animationSpeed: 0,
        

        Sam

        How to add modules

        learning how to use browser developers window for css changes

        V 1 Reply Last reply Reply Quote 0
        • V Offline
          victorjim @sdetweil
          last edited by

          @sdetweil
          I changed the animationSpeed: value to 0, and it still does the Fade In/Fade Out animation.
          Nothing has changed. What I would like is to remove the animation and leave the text fixed.
          Thanks.

          S 1 Reply Last reply Reply Quote 0
          • S Do not disturb
            sdetweil @victorjim
            last edited by

            @victorjim said in Delete Fade In/Fade Out animation in the NewsFeed Module:

            I changed the animationSpeed: value to 0, and it still does the Fade In/Fade Out animation.

            did you MOVE the animationSpeed:0, INSIDE the config:{} section of the module definition??

            otherwise the module will not see that setting

            Sam

            How to add modules

            learning how to use browser developers window for css changes

            V 1 Reply Last reply Reply Quote 0
            • V Offline
              victorjim @sdetweil
              last edited by

              @sdetweil

              I don’t understand well, I have changed the variable animationSpeed: 0 in the config.js file inside the /MagicMirror/config/ folder

              Like this code:

              modules: [
              		
              		{
              			module: "newsfeed",
              			position: "top_bar",
              			reloadInterval: 60000,
              			animationSpeed: 0,  //  In this position
              			config: {
              				feeds: [
              				{
              					title: "Portada Periodico de Aragon",
              					url: "https://www.elperiodicodearagon.com/rss/section/23500"
              				}
              				],
              				showSourceTitle: true,
              				showPublishDate: true,
              				showDescription: true,
              				broadcastNewsFeeds: true,
              				broadcastNewsUpdates: true
              			}
              		},
              
              1 Reply Last reply Reply Quote 0
              • S Do not disturb
                sdetweil
                last edited by sdetweil

                @sdetweil said in Delete Fade In/Fade Out animation in the NewsFeed Module:

                in a prior post I said

                those two properties are for the module, not MagicMirror, so they should be inside the config:{ section, here is the doc for module parameters for MagicMirror,

                so

                		{
                			module: "newsfeed",
                			position: "top_bar",
                // move These TWO parameters
                			reloadInterval: 60000,   
                			animationSpeed: 0,
                // INSIDE the config:{ section 
                
                			config: {
                				feeds: [
                				{
                					title: "Portada Periodico de Aragon",
                					url: "https://www.elperiodicodearagon.com/rss/section/23500"
                				}
                				],
                				showSourceTitle: true,
                				showPublishDate: true,
                				showDescription: true,
                				broadcastNewsFeeds: true,
                				broadcastNewsUpdates: true,
                // like this 
                		        	reloadInterval: 60000,   
                			        animationSpeed: 0
                			}
                		},
                

                module: …to config: { belong to MagicMirror, NOT the module
                config: {… } belong to the module

                Sam

                How to add modules

                learning how to use browser developers window for css changes

                V 1 Reply Last reply Reply Quote 0
                • V Offline
                  victorjim @sdetweil
                  last edited by

                  @sdetweil

                  Ok
                  Now I understand.
                  The 2 variables must be set in the configuration of each news.
                  Now it is corrected and works.
                  Thank you very much.

                  1 Reply Last reply Reply Quote 0
                  • 1
                  • 2
                  • 2 / 2
                  • First post
                    Last post
                  Enjoying MagicMirror? Please consider a donation!
                  MagicMirror created by Michael Teeuw.
                  Forum managed by Sam, technical setup by Karsten.
                  This forum is using NodeBB as its core | Contributors
                  Contact | Privacy Policy