• 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.

config.js in JSON format

Scheduled Pinned Locked Moved Unsolved Feature Requests
17 Posts 4 Posters 4.4k 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.
  • S Offline
    Serge @sdetweil
    last edited by Sep 13, 2019, 11:15 AM

    This post is deleted!
    1 Reply Last reply Reply Quote 0
    • S Offline
      sdetweil @Serge
      last edited by Sep 13, 2019, 11:57 AM

      @Serge remember, this is not MagicMirror…
      here is the mirror code
      https://github.com/evancohen/smart-mirror

      here is a module (plugin) for smart-mirror
      https://github.com/sdetweil/backgroundImage

      here is a sample plugin
      https://github.com/sdetweil/samplePlugin

      in the base mirror code, YOU have to edit the index.html to add
      the appropriate lines to enable your plugin

      Sam

      How to add modules

      learning how to use browser developers window for css changes

      S 1 Reply Last reply Sep 13, 2019, 3:07 PM Reply Quote 0
      • S Offline
        Serge @sdetweil
        last edited by Serge Sep 13, 2019, 3:12 PM Sep 13, 2019, 3:07 PM

        @sdetweil said in config.js in JSON format:

        @Serge remember, this is not MagicMirror…

        I have looked throught all the code. For simplicity I will call “SmartMirror” as SM and MagicMirror as MM further.

        1. config.schema.json files in SM contain plugins’ parameters and these files have JSON format. Example is a calendar config file smart-mirror/plugins/calendar/config.schema.json
        {
            "schema": {
                "calendar": {
                    "type": "object",
                    "title": "Calendar Settings",
                    "properties": {
                        "icals": {
                            "type": "array",
                            "title": "iCal URLs",
                            "items": {
                                "type": "string"
                            }
                        },
                        "maxResults": {
                            "type": "integer",
                            "title": "Max Number of Events for all iCals",
                            "default": 9
        
        1. config.js in MagicMirror is not made in JSON format so it is not easy to make changes there as compared to SM’s config.schema.json
        var config = {
        	address: "localhost", 
        	port: 8080,
        	ipWhitelist: [],
        	language: "en",
        	timeFormat: 24,
        	units: "metric",
        	modules: [
        		{
        			module: "newsfeed",
        			position: "bottom_bar",
        			config: {
        				feeds: [
        					{
        						title: "New York Times",
        						url: "http://www.nytimes.com/services/xml/rss/nyt/HomePage.xml"
        					}
        				],
        				showSourceTitle: true,
        				showPublishDate: true,
        				broadcastNewsFeeds: true,
        				broadcastNewsUpdates: true
        	}, },	], };
        

        Maybe I think wrong, please correct me if so.

        S 1 Reply Last reply Sep 13, 2019, 3:22 PM Reply Quote 0
        • S Offline
          sdetweil @Serge
          last edited by sdetweil Sep 13, 2019, 9:04 PM Sep 13, 2019, 3:22 PM

          @Serge maybe javascript-stringify npm module would help.

          Load config.js
          Json stringify
          Apply schemas
          Capture json on save
          Convert to js

          this little script seems to work

          var jjs=require('javascript-stringify')
          var cfg=require('../MagicMirror/config/config.js')
          var js=require('json-stringify')
          
          
          var js_config = JSON.stringify(cfg.config)
          
          console.log(cfg)
          jjs_config=jjs.stringify(cfg,null,'\t')
          console.log("var config="+jjs_config)
          

          Sam

          How to add modules

          learning how to use browser developers window for css changes

          1 Reply Last reply Reply Quote 1
          • ? Offline
            A Former User
            last edited by A Former User Sep 13, 2019, 9:34 PM Sep 13, 2019, 9:33 PM

            JSON converting may lose some js specific features like callback function, dynamic values by condition, etc. I doubt the benefit of strict json format.
            And the user would still make mistakes to write strict JSON format.
            I can’t agree JSON is the only or better way to make user-friendly configurable web UI.

            S 1 Reply Last reply Sep 13, 2019, 9:46 PM Reply Quote 0
            • S Offline
              sdetweil @Guest
              last edited by Sep 13, 2019, 9:46 PM

              @Sean do you have some examples of these kinds of data elements? I’d be interested to pass them thru this simple converter to see the fidelity

              Sam

              How to add modules

              learning how to use browser developers window for css changes

              ? 1 Reply Last reply Sep 15, 2019, 11:31 AM Reply Quote 0
              • ? Offline
                A Former User @sdetweil
                last edited by Sep 15, 2019, 11:31 AM

                @sdetweil

                1. callback function as value;
                  Many of my modules use the callback functions to make user command or user-customizable dynamic features instead to modify the source itself. (eg. filter, sort, transform, …)
                  Here is the the sameple of MMM-NotificationTrigger;
                {
                  module: "MMM-NotificationTrigger",
                  config: {
                    triggers:[
                      {
                        trigger: "SOME_NOTIFICATION",
                        fires: [
                          {
                            fire:"SHOW_ALERT",
                            payload: (payload) => {
                              return {
                                type:"notification",
                                title:"Notification comming",
                                message: payload.someOption
                              }
                            },
                          }
                        ]
                      },
                    ]
                  }
                },
                
                1. dynamic values;
                  I manage several different configurations in one config.js for my convenience. like this;

                (simplified concept)

                const mode = "testA"
                const someValue = {
                  "testA" : "testA",
                  "testB" : "testB",
                  "debug" : "debug",
                  "release" : "release",
                  ...
                }
                ...
                
                {
                  module: "MMM-SOMEMODULE",
                  config: {
                    someField: ((mode == "testA") ? true : false),
                    someField2: someValue[mode],
                   ...
                  }
                },
                

                The real usage is more complex but you can catch my approach.

                S 1 Reply Last reply Sep 15, 2019, 12:30 PM Reply Quote 0
                • S Offline
                  sdetweil @Guest
                  last edited by Sep 15, 2019, 12:30 PM

                  @Sean thanks… the 1st, with callbacks was preserved… the 2nd, with the algorithmic values, produced the results of the algorithm… the node runtime does the algorithmic replacement on load of the file… the converter would not know. (unless it processed the text)

                                  {
                                          module: 'MMM-SOMEMODULE',
                                          config: {
                                                  someField: true,
                                                  someField2: 'testA'
                                          }
                                  }
                  

                  Sam

                  How to add modules

                  learning how to use browser developers window for css changes

                  1 Reply Last reply Reply Quote 0
                  • S Offline
                    Serge @lavolp3
                    last edited by Serge Oct 24, 2019, 6:54 PM Oct 24, 2019, 2:43 PM

                    @lavolp3
                    @sdetweil
                    @Sean
                    here is a short video of what is done at the moment.
                    https://youtu.be/6w6Uovy9hbE

                    So what I have:

                    1. Webserver which is based on the asws webserver. Updated version for MagicMirror is here. Changes made to cmd/asws.go file only.
                      Download git

                    2. build docker container from it (go to asws directory and run " docker build -t asws_new ."

                    3. Clone to home/pi/www sample web-interface for MagicMirror clock module settings. It is bases on free SB Admin 2 bootstrap template.
                      Git includes js/settings.js which is necessary for make everything works. Git is here: https://github.com/sergge1/www

                    4. Run with a folloing command a docker container build in point 2 above: sudo docker run -d --restart unless-stopped -e DEBUG=true -p 80:80 -v $(pwd)/www:/www asws_new

                    Sample config.js from video is located at www/config.js

                    screenshot below:
                    photo-2019-10-24-18-04-49

                    S 1 Reply Last reply Oct 24, 2019, 2:58 PM Reply Quote 1
                    • S Offline
                      sdetweil @Serge
                      last edited by Oct 24, 2019, 2:58 PM

                      @Serge @Sean @lavolp3 cool

                      I found this the other day, maybe it will help your UI

                      https://github.com/Toreke/MMM-Dynamic-Modules

                      allows live dynamically positioning module content

                      Sam

                      How to add modules

                      learning how to use browser developers window for css changes

                      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