• Recent
  • Tags
  • Unsolved
  • Solved
  • MagicMirror² Repository
  • Documentation
  • 3rd-Party-Modules
  • Donate
  • Discord
  • Register
  • Login
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.

MMM-DumpsterDay

Scheduled Pinned Locked Moved Utilities
83 Posts 11 Posters 37.2k Views 12 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.
  • B Offline
    BD0G @mrdenmark
    last edited by BD0G Nov 12, 2019, 5:15 AM Nov 12, 2019, 5:07 AM

    @mrdenmark
    Try this setup in your MagicMirror/config/config.js

    enableBasic: true, 				// Enable basic trashcan 
    		basicStartDate: "11.11.2019", 	// The first dumpster day (Always use 2 digit dates (01 instead of 1))
    		basicDateDiff_1: 7,			// Trashday reoccurance - Default: 14 (every 14 days)
    		basicNotifyDayBefore: true,		//Default: true - If you want the notification to appear also the day before the dumpster day
    		
    		enablePlastic: true,			// Same values as basic but for Plastic
    		plasticStartDate: "11.11.2019", 
    		plasticDateDiff_1: 28,
    		plasticNotifyDayBefore: true,	
    
    		enableLandscape: true,			// Same values as basic but for Landscape
    		landscapeStartDate: "11.11.2019",
    		landscapeDateDiff_1: 7,		
    		landscapeNotifyDayBefore: true,
    		}		
    		},
    

    Then just modify the MagicMirror/modules/MMM-DumpsterDay/MMM-DumpsterDay.css file to have the Landscape setting display a blue can.

    .landscapeDiv{
    	height:70px;
    	width:20%;
    	background-image: url(imgs/recycle_blue.png);
    	background-repeat: no-repeat;
    	background-position: center center;
    	background-size: contain;
    	overflow: auto;
    	display:inline-block;
    

    If you want the Blue can next to the White can instead of the Yellow Can then just modify the MagicMirror/modules/MMM-DumpsterDay/MMM-DumpsterDay.css file like this

    .plasticDiv{
    	height:70px;
    	width:20%;
    	background-image: url(imgs/recycle_blue.png);
    	background-repeat: no-repeat;
    	background-position: center center;
    	background-size: contain;
    	overflow: auto;
    	display:inline-block;
    }
    
    .landscapeDiv{
    	height:70px;
    	width:20%;
    	background-image: url(imgs/recycle_yellow.png);
    	background-repeat: no-repeat;
    	background-position: center center;
    	background-size: contain;
    	overflow: auto;
    	display:inline-block;
    }
    
    M 1 Reply Last reply Nov 12, 2019, 5:17 AM Reply Quote 0
    • M Offline
      mrdenmark @BD0G
      last edited by Nov 12, 2019, 5:17 AM

      @BD0G
      thanks for that,one last thing,is it possible change the colour of the basic bin?in my case i’d like red.

      1 Reply Last reply Reply Quote 0
      • B Offline
        BD0G
        last edited by Nov 12, 2019, 5:19 AM

        Give me a few minutes and I will try and fill the one that is white with a red color.

        1 Reply Last reply Reply Quote 0
        • B Offline
          BD0G
          last edited by BD0G Nov 12, 2019, 5:35 AM Nov 12, 2019, 5:34 AM

          0_1573536694796_basic_red.png

          Save the file I uploaded (right click -Save Image As) to this directory MagicMirror/modules/MMM-DumpsterDay/imgs

          Then change your MagicMirror/modules/MMM-DumpsterDay/MMM-DumpsterDay.css file so that it has this entry

          .basicDiv{
          	height:70px;
          	width:20%;
          	background-image: url(imgs/basic_red.png);
          	background-repeat: no-repeat;
          	background-position: center center;
          	background-size: contain;
          	overflow: auto;
          	display:inline-block;
          
          
          M 1 Reply Last reply Nov 12, 2019, 5:52 AM Reply Quote 0
          • B Offline
            BD0G
            last edited by Nov 12, 2019, 5:47 AM

            I have learned alot during the process to get this module working.

            1. Getting only 2 of the cans to show up.

            One must set all of the cans to true and adjust the dates within the MagicMirror/config/config.js file the very first time and save the file.

            So these lines must be set to true
            enableBasic: true,
            enablePlastic: true,
            enableLandscape: true,

            Then launch MagicMirror. Then shut down MagicMirror and change the can or cans that one does not want to be shown on screen by changing the setting to false.

            For instance,
            enableBasic: true,
            enablePlastic: false,
            enableLandscape: true,

            Save the file and restart MagicMirror. This will display the cans selected.
            Strange behavior , but thats what I found.

            I also needed to change the date on each of the cans within the same MagicMirror/config/config.js file

            basicStartDate: “11.13.2019”,
            plasticStartDate: “11.13.2019”,
            landscapeStartDate: “11.13.2019”,

            to reflect the same dates . If I left
            plasticStartDate: “11.13.2019”,

            as the default date then the recycle nor the landscape can would show up.

            1. Changing the size of the cans. Initially the can size on my MagicMirror were way too big and I needed to modify the

            MagicMirror/modules/MMM-DumpsterDay/MMM-DumpsterDay.css file.

            I changed the value for height from 120 px (I think this was the default size -maybe 200px) to 70px and that turned out to be a good size.

            .basicDiv{
            	height:70px; // I changed this line to 70px
            	width:20%;
            	background-image: url(imgs/basic.png);
            	background-repeat: no-repeat;
            	background-position: center center;
            	background-size: contain;
            	overflow: auto;
            	display:inline-block;
            }
            
            .landscapeDiv{
            	height:70px;  // I changed this line to 70px
            	width:20%;
            	background-image: url(imgs/landscape.png);
            	background-repeat: no-repeat;
            	background-position: center center;
            	background-size: contain;
            	overflow: auto;
            	display:inline-block;
            }
            
            
            .plasticDiv{
            	height:70px;  //I changed this line to 70px
            	width:20%;
            	background-image: url(imgs/recycle_yellow.png);
            	background-repeat: no-repeat;
            	background-position: center center;
            	background-size: contain;
            	overflow: auto;
            	display:inline-block;
            
            D 1 Reply Last reply Nov 12, 2019, 6:14 AM Reply Quote 0
            • M Offline
              mrdenmark @BD0G
              last edited by Nov 12, 2019, 5:52 AM

              @BD0G
              fantastic,thankyou,the helpfulness of people on tghis forum never ceases to surprise me!

              B 1 Reply Last reply Nov 12, 2019, 5:54 AM Reply Quote 0
              • B Offline
                BD0G @mrdenmark
                last edited by BD0G Nov 12, 2019, 6:11 AM Nov 12, 2019, 5:54 AM

                @mrdenmark So I take it that worked as intended? :)

                You are welcome. I have just been focused on getting this module to work. Trash day is in 2 days. LOL!

                Hopefully we can have @DeanoNoire add the red trashcan to the github repository under images just in case someone else wants that color for thier trash can as well.

                D M 2 Replies Last reply Nov 12, 2019, 6:22 AM Reply Quote 0
                • B Offline
                  BD0G
                  last edited by BD0G Nov 12, 2019, 6:09 AM Nov 12, 2019, 6:08 AM

                  What I have yet to figure out is how to get the basic trash can and the landscape can to be shown with less space between them. It appears as if there is enough space between those 2 cans to show the recycle can and since its set to false it is not shown onscreen , but there is a blank space between the cans for it to fit.

                  I want the 2 cans centered and with less space between them.

                  Here is the current spacing
                  DropBox Link

                  D 1 Reply Last reply Nov 12, 2019, 6:19 AM Reply Quote 0
                  • D Offline
                    DeanoNoire @BD0G
                    last edited by DeanoNoire Nov 12, 2019, 6:19 AM Nov 12, 2019, 6:14 AM

                    @BD0G

                    I also needed to change the date on each of the cans within the same MagicMirror/config/config.js file

                    basicStartDate: “11.13.2019”,
                    plasticStartDate: “11.13.2019”,
                    landscapeStartDate: “11.13.2019”,

                    Please note the date format in the config should be DD.MM.YYYY, the only format making sense :P

                    If you were testing this on 11.11.2019, the month and day commutable :D

                    B 1 Reply Last reply Nov 12, 2019, 6:16 AM Reply Quote 0
                    • B Offline
                      BD0G @DeanoNoire
                      last edited by BD0G Nov 12, 2019, 6:24 AM Nov 12, 2019, 6:16 AM

                      @DeanoNoire Thats not how the default dates in the MagicMirror/config/config.js were listed from what I recall. They were/are MM.DD.YYYY.

                      Here is the sample entry that is on the github repository and it lists 24.10.2019 which has to be MM:DD:YYYY. There is no 24th month. :)

                      enableBasic: true, 				// Enable basic trashcan 
                      	basicStartDate: "24.10.2019", 	// The first dumpster day (Always use 2 digit dates (01 instead of 1))
                      	basicDateDiff_1: 14,			// Trashday reoccurance - Default: 14 (every 14 days)
                      	basicNotifyDayBefore: true,		//Default: true - If you want the notification to appear also the day before the dumpster day
                      	
                      enablePlastic: true,			// Same values as basic but for Plastic
                      	plasticStartDate: "16.01.2019", 
                      	plasticDateDiff_1: 28,
                      	plasticNotifyDayBefore: true,	
                      
                      	enableLandscape: false,			// Same values as basic but for Landscape
                      	landscapeStartDate: "29.10.2019",
                      	landscapeDateDiff_1: 28,		
                      	landscapeNotifyDayBefore: true,
                      
                      
                      D 1 Reply Last reply Nov 12, 2019, 6:28 AM Reply Quote 0
                      • 1
                      • 2
                      • 3
                      • 4
                      • 5
                      • 8
                      • 9
                      • 3 / 9
                      3 / 9
                      • First post
                        28/83
                        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