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.

    MagicMirror² made as Picture In frame

    Scheduled Pinned Locked Moved Show your Mirror
    4 Posts 4 Posters 5.7k Views 4 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
      bdream
      last edited by

      My first running MagicMirror² is not a mirror but a Picture In Frame.
      It is based on an old IKEA frame (RIBBA 30x40 cm) with real glass, not plastic :hugging_face:.
      I use a small LCD (ca. 30x23 cm), therefore I added a matt (passe-partout) infront, so it looks like a nice picture.

      0_1571243509786_MM_00.jpg
      At this time the MM is based on Raspberry 3, Rev. 02 (gaol is to use Paspberry Zero) with 1024MB and 32GB microSD-Card.
      Software-base is Raspian Buster with desktop, version: July 2019, Release date: 2019-07-10
      I made all updates and upgrades as descriped in MagicMirror-guides.

      At this point I installed from GitHub the verry great MagicMirror²-software from @MichMich Michael Teeuw :thumbs_up: excelent job :clapping_hands:

      bash -c "$(curl -sL https://raw.githubusercontent.com/MichMich/MagicMirror/master/installers/raspberry.sh)"
      

      Just updated to MM v2.9.0 with great help from @sdetweil :clapping_hands:

      I use following 3rd Party modules

      MMM-bernwordclock
      MMM-Carousel
      MMM-PublicTransportHafas
      MMM-weatherforecast
      

      Default modules “updatenotification” and “alert” I use untouched.

      Region top_left I have an customized (If I understand how to provide to GitHub I will do) bernwordclock to show the time in words.

      Region top_right I show default clock, currentweather and 3rd Party Module weatherforecast rotating by 3rd Party Module carousel.

      Region bottom_left I show my calendar-entries using default calendar module configured to show different pages for holidays, birthdays, privat-calendars…

      Region bottom_right I show with 3rd Party Module PublicTransportHafas

      0_1571244372542_MM_01.jpg
      0_1571244505197_MM_02.jpg
      0_1571244561382_MM_03.jpg

      3rd Party Modules carousel is THE win getting all information I want to have on my small screen.

      {
      	module: 'MMM-Carousel',
          config: {
              transitionInterval: 10000,
              mode: 'positional',
              top_right: {enabled: true, ignoreModules: []},
              bottom_left: {enabled: true, ignoreModules: []},
          }
      },
      

      And I made some changes to custom.css changing font-size

       body {
        margin: 20px;
        height: calc(100% - 40px);
        width: calc(100% - 40px);
       }
      
       .clock .time {
      	margin: 10px;
      	font-size 20px;
      	color: grey; 
       }
       .clock .date {
              margin: 10px;
      	font-size: 12px;          
       } 
      
       .calendar {
      	width:500px;
       }
      
       .calendar .small {
      	font-size: 13px;
      	line-height: 15px;
       }
      
       .weatherforecast {
              width:400px;
       }
      
       .weatherforecast .small {
              font-size: 15px;
       }
      
      
       .MMM-PublicTransportHafas {
              width:400px;
      	text-align: left; 
      }
      
       .MMM-PublicTransportHafas .small {
              font-size: 15px;
              line-height: 20px;
       }
      
       .MMM-bernwordclock {
              font-size: 20px;
      	line-height: 25px;
              width:400px;
       }
      
       .currentweather {
              width:400px;
       }
      

      As you can see on my pictures I have already prepared PIR-Sensor, but it’s not running at the moment. Will work on it.

      Here you are some impressions on what is behind…

      0_1571244993700_MM_10.jpg
      here you can see the LCD glued to the matt and all components on it.
      As we have the Raspberry at the top right connected to the PIR-Sensor in the top middle, to the HDMI to VGA converter and to the Powerconverter, which converts the Power for the LVDS Interface also to the needed 5V for the Raspberry.
      That means, I need only 1 powercord into the frame :nerd_face:
      The Powercord comes in the bottom richt direct into the LVDS Interface.
      The LVDS Interface is connected to the power as I said, to the backlight and the yellow/plack cables going to the Powerconverter.

      0_1571245001552_MM_11.jpgHere are the 3 GPIO-PINs connected to PIR-Sensor.

      0_1571245007916_MM_12.jpg
      Here I made a small cut for the powercable.

      0_1571245013299_MM_13.jpg
      Here you see the PIR-Sensor placed in the frame, what was a little challenging getting it placed not demolishing the frame and have the PIR-board infront of the glass.

      –
      cheers, bdream

      S Mykle1M 2 Replies Last reply Reply Quote 0
      • S Away
        sdetweil @bdream
        last edited by

        @bdream Nice work!

        Sam

        How to add modules

        learning how to use browser developers window for css changes

        1 Reply Last reply Reply Quote 0
        • Mykle1M Offline
          Mykle1 Project Sponsor Module Developer @bdream
          last edited by

          @bdream

          Great! I like the “Picture In Frame” idea! :thumbsup:

          Create a working config
          How to add modules

          1 Reply Last reply Reply Quote 0
          • buzzkcB Offline
            buzzkc
            last edited by

            Very nice work!

            Darren

            My Build: https://forum.magicmirror.builders/topic/11153/new-non-mirror

            1 Reply Last reply Reply Quote 0
            • 1 / 1
            • 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