var app = angular.module('app', ['ngSanitize', 'ui.bootstrap', 'LocalStorageModule',]);

app.controller('HomeController',
  function($scope, $uibModal, localStorageService)
  {

    $scope.btnSaveClicked = function() {
      localStorage.setItem('tree', JSON.stringify($scope.tree));
    };

    $scope.btnLoadClicked = function() {
      var savedTree = localStorage.getItem('tree');
      $scope.tree = JSON.parse(savedTree);
    };


    var highlightJson = function(json) {
      json = json.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;');
      return json.replace(/("(\\u[a-zA-Z0-9]{4}|\\[^u]|[^\\"])*"(\s*:)?|\b(true|false|null)\b|-?\d+(?:\.\d*)?(?:[eE][+\-]?\d+)?)/g, function(match) {
        var cls = 'number';
        if (/^"/.test(match)) {
          if (/:$/.test(match)) {
            cls = 'key';
          } else {
            cls = 'string';
          }
        } else if (/true|false/.test(match)) {
          cls = 'boolean';
        } else if (/null/.test(match)) {
          cls = 'null';
        }
        return '<span class="' + cls + '">' + match + '</span>';
      });
    };

    $scope.highlight = function(obj) {
      return highlightJson(angular.toJson(obj, true))
    };


    (function constructor() {
      $scope.selectedNode = null;
      $scope.tree = [];

      $scope.colors = [
        '#5aa1be',
        '#c065b8',
        '#c0ab5f',
        '#59bc95',
        '#7a63be',
        '#c0615b',
        '#73bb5e',
        '#6ee585',
        '#7088e8',
        '#eb77a3',
        '#c2e675',
      ];

    })();

  }
);

@@ -222,64 +222,1331 @@
     
-localStorage.setItem('tree', JSON.stringify($scope.tree)
+var modalInstance = $uibModal.open(%7B%0A        animation: true,%0A        template:%0A          '%3Cdiv class=%22modal-content%22%3E' +%0A          '  %3Cdiv class=%22modal-header%22%3E' +%0A          '    %3Cbutton type=%22button%22 class=%22close%22 ng-click=%22cancel()%22%3Ex%3C/button%3E' +%0A          '    %3Ch4 class=%22modal-title%22 id=%22mySmallModalLabel%22%3ESave%3C/h4%3E' +%0A          '  %3C/div%3E' +%0A          '  %3Cdiv class=%22modal-body%22%3E' +%0A          '    %3Cinput ng-model=%22input.name%22 type=%22text%22 class=%22form-control%22 /%3E' +%0A          '  %3C/div%3E' +%0A          '  %3Cdiv class=%22modal-footer%22%3E' +%0A          '    %3Cinput type=%22button%22 value=%22Save%22 class=%22btn btn-primary%22 ng-click=%22btnSaveClicked()%22 /%3E' +%0A          '    %3Cinput type=%22button%22 value=%22Close%22 class=%22btn btn-default%22 ng-click=%22cancel()%22 /%3E' +%0A          '  %3C/div%3E' +%0A          '%3C/div%3E',%0A        controller: function($scope, tree, $uibModalInstance) %7B%0A          $scope.input = %7B%7D;%0A          $scope.btnSaveClicked = function() %7B%0A            var names = localStorageService.get('names') %7C%7C %7B%7D;%0A            names%5B$scope.input.name%5D = tree;%0A            localStorageService.set('names', names);%0A          %7D;%0A          $scope.cancel = function() %7B%0A            $uibModalInstance.dismiss('cancel');%0A          %7D;%0A        %7D,%0A        size: 'sm',%0A        resolve: %7B%0A          tree: function() %7B return $scope.tree; %7D%0A        %7D,%0A      %7D
 );%0A 

Save button modal