### What is jsTree Bootstrap Theme?

jsTree Bootstrap Theme is created as a part of Proton UI Responsive Admin Panel Theme.

Since there aren't many jsTree 3 themes out there, we thought we'd make this one freely available. Enjoy!

Download from Github: https://github.com/orangehill/jstree-bootstrap-theme

### Responsiveness

jsTree Bootstrap Theme is responsive. To see the effect go ahead and scale a browser window down until the window width is less then 768 pixels. Mobile friendly design should make it easier to tap nodes with more precision

- Root node (basic)
  - initially selected
  - custom icon URL
  - initially open
    - Another node
  - Custom icon class (bootstrap)
  - Custom icon class (font-awesome)
- Root node 2

    // An example of simple responsive jsTree
        $('#jstree-proton-1').jstree({
            'core': {
                'themes': {
                    'name': 'proton',
                    'responsive': true
                }
            }
        });

- Root node (wholerow mode)
  - initially selected
  - custom icon URL
  - initially open
    - Another node
  - Custom icon class (bootstrap)
  - Custom icon class (font-awesome)
- Root node 2

    // An example of responsive jsTree with wholerow plugin.
        $('#jstree-proton-2').jstree({
            'plugins': ["wholerow"],
            'core': {
                'themes': {
                    'name': 'proton',
                    'responsive': true
                }
            }
        });

    // An example of responsive jsTree with wholerow and checbox plugins.
        $('#jstree-proton-3').jstree({
            'plugins': ["wholerow", "checkbox"],
            'core': {
                'data': [{
                        "text": "Wholerow with checkboxes",
                        "children": [{
                            "text": "initially selected",
                            "state": {
                                "selected": true
                            }
                        }, {
                            "text": "custom icon URL",
                            "icon": "./assets/images/tree_icon.png"
                        }, {
                            "text": "initially open",
                            "state": {
                                "opened": true
                            },
                            "children": ["Another node"]
                        }, {
                            "text": "custom icon class",
                            "icon": "glyphicon glyphicon-leaf"
                        }, {
                            "text": "fontawesome icon class",
                            "icon": "fa fa-pagelines"
                        }]
                    },
                    "And wholerow selection"
                ],
                'themes': {
                    'name': 'proton',
                    'responsive': true
                }
            }
        });