Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
</head>
<body>
<script>
  function formatJSON(data) {
    const templates = {};
    data[0].default.forEach(template => {
        templates[template.type] = template;
    });
​
    function addMissingKeys(obj, template) {
        for (const key in template) {
            if (!(key in obj)) {
                obj[key] = template[key];
            }
        }
    }
​
    data.slice(1).forEach(element => {
        if (element.children) {
            element.children.forEach(child => {
                if (child.type in templates) {
                    addMissingKeys(child, templates[child.type]);
                }
​
                if (child.children) {
                    child.children.forEach(grandchild => {
                        if (grandchild.type in templates) {
                            addMissingKeys(grandchild, templates[grandchild.type]);
                        }
                    });
                }
            });
        }
    });
​
    return data.slice(1);
}
​
// Example
const inputJSON = [
    {
        "default": [
            {
                "type": "Row",
                "verticalAlignment": "Center",
                "horizontalAlignment": "Start",
                "width": 364,
                "height": 44
            },
            {
                "type": "Image",
                "url": "/storage/emulated/0/Icons/checkbox_red.svg",
                "size": 49
            },
            {
                "type": "Text",
                "textSize": 16
            }
        ]
    },
    {
        "type": "Column",
        "scrolling": true,
        "backgroundColor": "#FFFFFF",
        "horizontalPadding": 10,
        "padding": 4,
        "cornerRadius": 50,
        "horizontalAlignment": "Center",
        "commandPrefix": "habitica",
        "children": [
            {
                "type": "Row",
                "command": 10,
                "children": [
                    {
                        "type": "Image"
                    },
                    {
                        "type": "Text",
                        "text": "To Do 1 - 2024-11-01"
                    }
                ]
            },
            {
                "type": "Row",
                "command": 2,
                "children": [
                    {
                        "type": "Image"
                    },
                    {
                        "type": "Text",
                        "text": "To Do 2 - 2024-11-05"
                    }
                ]
            },
            {
                "type": "Row",
                "command": 3,
                "children": [
                    {
                        "type": "Image",
                        "url": "/storage/emulated/0/Icons/checkbox_yellow.svg"
                    },
                    {
                        "type": "Text",
                        "text": "To Do 3 - 2024-11-07"
                    }
                ]
            },
            {
                "type": "Row",
                "command": 4,
                "children": [
                    {
                        "type": "Image",
                        "url": "/storage/emulated/0/Icons/checkbox_green.svg"
                    },
                    {
                        "type": "Text",
                        "text": "To Do 4 - 2024-11-15"
                    }
                ]
            }
        ]
    }
];
​
const formattedJSON = formatJSON(inputJSON);
console.log(JSON.stringify(formattedJSON, null, 2));
  </script>
</body>
</html>
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
anonymouspro
0viewers