You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@zeppelin.apache.org by mo...@apache.org on 2017/01/11 02:42:07 UTC

[1/6] zeppelin git commit: [ZEPPELIN-1927] Remove useless function wrapping in all js files

Repository: zeppelin
Updated Branches:
  refs/heads/master ff8d9027d -> 4c60b27c3


http://git-wip-us.apache.org/repos/asf/zeppelin/blob/4c60b27c/zeppelin-web/src/components/websocketEvents/websocketMsg.service.js
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/components/websocketEvents/websocketMsg.service.js b/zeppelin-web/src/components/websocketEvents/websocketMsg.service.js
index 1fb5f74..d597ff4 100644
--- a/zeppelin-web/src/components/websocketEvents/websocketMsg.service.js
+++ b/zeppelin-web/src/components/websocketEvents/websocketMsg.service.js
@@ -11,308 +11,306 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
-
-  angular.module('zeppelinWebApp').service('websocketMsgSrv', websocketMsgSrv);
-
-  websocketMsgSrv.$inject = ['$rootScope', 'websocketEvents'];
-
-  function websocketMsgSrv($rootScope, websocketEvents) {
-    return {
-
-      getHomeNote: function() {
-        websocketEvents.sendNewEvent({op: 'GET_HOME_NOTE'});
-      },
-
-      createNotebook: function(noteName, defaultInterpreterId) {
-        websocketEvents.sendNewEvent({
-          op: 'NEW_NOTE',
-          data: {
-            name: noteName,
-            defaultInterpreterId: defaultInterpreterId
-          }
-        });
-      },
-
-      moveNoteToTrash: function(noteId) {
-        websocketEvents.sendNewEvent({op: 'MOVE_NOTE_TO_TRASH', data: {id: noteId}});
-      },
-
-      moveFolderToTrash: function(folderId) {
-        websocketEvents.sendNewEvent({op: 'MOVE_FOLDER_TO_TRASH', data: {id: folderId}});
-      },
-
-      restoreNote: function(noteId) {
-        websocketEvents.sendNewEvent({op: 'RESTORE_NOTE', data: {id: noteId}});
-      },
-
-      restoreFolder: function(folderId) {
-        websocketEvents.sendNewEvent({op: 'RESTORE_FOLDER', data: {id: folderId}});
-      },
-
-      restoreAll: function() {
-        websocketEvents.sendNewEvent({op: 'RESTORE_ALL'});
-      },
-
-      deleteNote: function(noteId) {
-        websocketEvents.sendNewEvent({op: 'DEL_NOTE', data: {id: noteId}});
-      },
-
-      removeFolder: function(folderId) {
-        websocketEvents.sendNewEvent({op: 'REMOVE_FOLDER', data: {id: folderId}});
-      },
-
-      emptyTrash: function() {
-        websocketEvents.sendNewEvent({op: 'EMPTY_TRASH'});
-      },
-
-      cloneNote: function(noteIdToClone, newNoteName) {
-        websocketEvents.sendNewEvent({op: 'CLONE_NOTE', data: {id: noteIdToClone, name: newNoteName}});
-      },
-
-      getNoteList: function() {
-        websocketEvents.sendNewEvent({op: 'LIST_NOTES'});
-      },
-
-      reloadAllNotesFromRepo: function() {
-        websocketEvents.sendNewEvent({op: 'RELOAD_NOTES_FROM_REPO'});
-      },
-
-      getNote: function(noteId) {
-        websocketEvents.sendNewEvent({op: 'GET_NOTE', data: {id: noteId}});
-      },
-
-      updateNote: function(noteId, noteName, noteConfig) {
-        websocketEvents.sendNewEvent({op: 'NOTE_UPDATE', data: {id: noteId, name: noteName, config: noteConfig}});
-      },
-
-      updatePersonalizedMode: function(noteId, modeValue) {
-        websocketEvents.sendNewEvent({op: 'UPDATE_PERSONALIZED_MODE', data: {id: noteId, personalized: modeValue}});
-      },
-
-      renameNote: function(noteId, noteName) {
-        websocketEvents.sendNewEvent({op: 'NOTE_RENAME', data: {id: noteId, name: noteName}});
-      },
-
-      renameFolder: function(folderId, folderName) {
-        websocketEvents.sendNewEvent({op: 'FOLDER_RENAME', data: {id: folderId, name: folderName}});
-      },
-
-      moveParagraph: function(paragraphId, newIndex) {
-        websocketEvents.sendNewEvent({op: 'MOVE_PARAGRAPH', data: {id: paragraphId, index: newIndex}});
-      },
-
-      insertParagraph: function(newIndex) {
-        websocketEvents.sendNewEvent({op: 'INSERT_PARAGRAPH', data: {index: newIndex}});
-      },
-
-      copyParagraph: function(newIndex, paragraphTitle, paragraphData,
-                                      paragraphConfig, paragraphParams) {
-        websocketEvents.sendNewEvent({
-          op: 'COPY_PARAGRAPH',
-          data: {
-            index: newIndex,
-            title: paragraphTitle,
-            paragraph: paragraphData,
-            config: paragraphConfig,
-            params: paragraphParams
-          }
-        });
-      },
-
-      updateAngularObject: function(noteId, paragraphId, name, value, interpreterGroupId) {
-        websocketEvents.sendNewEvent({
-          op: 'ANGULAR_OBJECT_UPDATED',
-          data: {
-            noteId: noteId,
-            paragraphId: paragraphId,
-            name: name,
-            value: value,
-            interpreterGroupId: interpreterGroupId
-          }
-        });
-      },
-
-      clientBindAngularObject: function(noteId, name, value, paragraphId) {
-        websocketEvents.sendNewEvent({
-          op: 'ANGULAR_OBJECT_CLIENT_BIND',
-          data: {
-            noteId: noteId,
-            name: name,
-            value: value,
-            paragraphId: paragraphId
-          }
-        });
-      },
-
-      clientUnbindAngularObject: function(noteId, name, paragraphId) {
-        websocketEvents.sendNewEvent({
-          op: 'ANGULAR_OBJECT_CLIENT_UNBIND',
-          data: {
-            noteId: noteId,
-            name: name,
-            paragraphId: paragraphId
-          }
-        });
-      },
-
-      cancelParagraphRun: function(paragraphId) {
-        websocketEvents.sendNewEvent({op: 'CANCEL_PARAGRAPH', data: {id: paragraphId}});
-      },
-
-      runParagraph: function(paragraphId, paragraphTitle, paragraphData, paragraphConfig, paragraphParams) {
-        websocketEvents.sendNewEvent({
-          op: 'RUN_PARAGRAPH',
-          data: {
-            id: paragraphId,
-            title: paragraphTitle,
-            paragraph: paragraphData,
-            config: paragraphConfig,
-            params: paragraphParams
-          }
-        });
-      },
-
-      runAllParagraphs: function(noteId, paragraphs) {
-        websocketEvents.sendNewEvent({
-          op: 'RUN_ALL_PARAGRAPHS',
-          data: {
-            noteId: noteId,
-            paragraphs: JSON.stringify(paragraphs)
-          }
-        });
-      },
-
-      removeParagraph: function(paragraphId) {
-        websocketEvents.sendNewEvent({op: 'PARAGRAPH_REMOVE', data: {id: paragraphId}});
-      },
-
-      clearParagraphOutput: function(paragraphId) {
-        websocketEvents.sendNewEvent({op: 'PARAGRAPH_CLEAR_OUTPUT', data: {id: paragraphId}});
-      },
-
-      clearAllParagraphOutput: function(noteId) {
-        websocketEvents.sendNewEvent({op: 'PARAGRAPH_CLEAR_ALL_OUTPUT', data: {id: noteId}});
-      },
-
-      completion: function(paragraphId, buf, cursor) {
-        websocketEvents.sendNewEvent({
-          op: 'COMPLETION',
-          data: {
-            id: paragraphId,
-            buf: buf,
-            cursor: cursor
-          }
-        });
-      },
-
-      commitParagraph: function(paragraphId, paragraphTitle, paragraphData, paragraphConfig, paragraphParams) {
-        websocketEvents.sendNewEvent({
-          op: 'COMMIT_PARAGRAPH',
-          data: {
-            id: paragraphId,
-            title: paragraphTitle,
-            paragraph: paragraphData,
-            config: paragraphConfig,
-            params: paragraphParams
-          }
-        });
-      },
-
-      importNote: function(note) {
-        websocketEvents.sendNewEvent({
-          op: 'IMPORT_NOTE',
-          data: {
-            note: note
-          }
-        });
-      },
-
-      checkpointNote: function(noteId, commitMessage) {
-        websocketEvents.sendNewEvent({
-          op: 'CHECKPOINT_NOTE',
-          data: {
-            noteId: noteId,
-            commitMessage: commitMessage
-          }
-        });
-      },
-
-      setNoteRevision: function(noteId, revisionId) {
-        websocketEvents.sendNewEvent({
-          op: 'SET_NOTE_REVISION',
-          data: {
-            noteId: noteId,
-            revisionId: revisionId
-          }
-        });
-      },
-
-      listRevisionHistory: function(noteId) {
-        websocketEvents.sendNewEvent({
-          op: 'LIST_REVISION_HISTORY',
-          data: {
-            noteId: noteId
-          }
-        });
-      },
-
-      getNoteByRevision: function(noteId, revisionId) {
-        websocketEvents.sendNewEvent({
-          op: 'NOTE_REVISION',
-          data: {
-            noteId: noteId,
-            revisionId: revisionId
-          }
-        });
-      },
-
-      getEditorSetting: function(paragraphId, replName) {
-        websocketEvents.sendNewEvent({
-          op: 'EDITOR_SETTING',
-          data: {
-            paragraphId: paragraphId,
-            magic: replName
-          }
-        });
-      },
-
-      isConnected: function() {
-        return websocketEvents.isConnected();
-      },
-
-      getNoteJobsList: function() {
-        websocketEvents.sendNewEvent({op: 'LIST_NOTE_JOBS'});
-      },
-
-      getUpdateNoteJobsList: function(lastUpdateServerUnixTime) {
-        websocketEvents.sendNewEvent(
-          {op: 'LIST_UPDATE_NOTE_JOBS', data: {lastUpdateUnixTime: lastUpdateServerUnixTime * 1}}
-        );
-      },
-
-      unsubscribeJobManager: function() {
-        websocketEvents.sendNewEvent({op: 'UNSUBSCRIBE_UPDATE_NOTE_JOBS'});
-      },
-
-      getInterpreterBindings: function(noteId) {
-        websocketEvents.sendNewEvent({op: 'GET_INTERPRETER_BINDINGS', data: {noteId: noteId}});
-      },
-
-      saveInterpreterBindings: function(noteId, selectedSettingIds) {
-        websocketEvents.sendNewEvent({op: 'SAVE_INTERPRETER_BINDINGS',
-          data: {noteId: noteId, selectedSettingIds: selectedSettingIds}});
-      },
-
-      listConfigurations: function() {
-        websocketEvents.sendNewEvent({op: 'LIST_CONFIGURATIONS'});
-      },
-
-      getInterpreterSettings: function() {
-        websocketEvents.sendNewEvent({op: 'GET_INTERPRETER_SETTINGS'});
-      }
-
-    };
-  }
-
-})();
+
+angular.module('zeppelinWebApp').service('websocketMsgSrv', websocketMsgSrv);
+
+websocketMsgSrv.$inject = ['$rootScope', 'websocketEvents'];
+
+function websocketMsgSrv($rootScope, websocketEvents) {
+  return {
+
+    getHomeNote: function() {
+      websocketEvents.sendNewEvent({op: 'GET_HOME_NOTE'});
+    },
+
+    createNotebook: function(noteName, defaultInterpreterId) {
+      websocketEvents.sendNewEvent({
+        op: 'NEW_NOTE',
+        data: {
+          name: noteName,
+          defaultInterpreterId: defaultInterpreterId
+        }
+      });
+    },
+
+    moveNoteToTrash: function(noteId) {
+      websocketEvents.sendNewEvent({op: 'MOVE_NOTE_TO_TRASH', data: {id: noteId}});
+    },
+
+    moveFolderToTrash: function(folderId) {
+      websocketEvents.sendNewEvent({op: 'MOVE_FOLDER_TO_TRASH', data: {id: folderId}});
+    },
+
+    restoreNote: function(noteId) {
+      websocketEvents.sendNewEvent({op: 'RESTORE_NOTE', data: {id: noteId}});
+    },
+
+    restoreFolder: function(folderId) {
+      websocketEvents.sendNewEvent({op: 'RESTORE_FOLDER', data: {id: folderId}});
+    },
+
+    restoreAll: function() {
+      websocketEvents.sendNewEvent({op: 'RESTORE_ALL'});
+    },
+
+    deleteNote: function(noteId) {
+      websocketEvents.sendNewEvent({op: 'DEL_NOTE', data: {id: noteId}});
+    },
+
+    removeFolder: function(folderId) {
+      websocketEvents.sendNewEvent({op: 'REMOVE_FOLDER', data: {id: folderId}});
+    },
+
+    emptyTrash: function() {
+      websocketEvents.sendNewEvent({op: 'EMPTY_TRASH'});
+    },
+
+    cloneNote: function(noteIdToClone, newNoteName) {
+      websocketEvents.sendNewEvent({op: 'CLONE_NOTE', data: {id: noteIdToClone, name: newNoteName}});
+    },
+
+    getNoteList: function() {
+      websocketEvents.sendNewEvent({op: 'LIST_NOTES'});
+    },
+
+    reloadAllNotesFromRepo: function() {
+      websocketEvents.sendNewEvent({op: 'RELOAD_NOTES_FROM_REPO'});
+    },
+
+    getNote: function(noteId) {
+      websocketEvents.sendNewEvent({op: 'GET_NOTE', data: {id: noteId}});
+    },
+
+    updateNote: function(noteId, noteName, noteConfig) {
+      websocketEvents.sendNewEvent({op: 'NOTE_UPDATE', data: {id: noteId, name: noteName, config: noteConfig}});
+    },
+
+    updatePersonalizedMode: function(noteId, modeValue) {
+      websocketEvents.sendNewEvent({op: 'UPDATE_PERSONALIZED_MODE', data: {id: noteId, personalized: modeValue}});
+    },
+
+    renameNote: function(noteId, noteName) {
+      websocketEvents.sendNewEvent({op: 'NOTE_RENAME', data: {id: noteId, name: noteName}});
+    },
+
+    renameFolder: function(folderId, folderName) {
+      websocketEvents.sendNewEvent({op: 'FOLDER_RENAME', data: {id: folderId, name: folderName}});
+    },
+
+    moveParagraph: function(paragraphId, newIndex) {
+      websocketEvents.sendNewEvent({op: 'MOVE_PARAGRAPH', data: {id: paragraphId, index: newIndex}});
+    },
+
+    insertParagraph: function(newIndex) {
+      websocketEvents.sendNewEvent({op: 'INSERT_PARAGRAPH', data: {index: newIndex}});
+    },
+
+    copyParagraph: function(newIndex, paragraphTitle, paragraphData,
+                            paragraphConfig, paragraphParams) {
+      websocketEvents.sendNewEvent({
+        op: 'COPY_PARAGRAPH',
+        data: {
+          index: newIndex,
+          title: paragraphTitle,
+          paragraph: paragraphData,
+          config: paragraphConfig,
+          params: paragraphParams
+        }
+      });
+    },
+
+    updateAngularObject: function(noteId, paragraphId, name, value, interpreterGroupId) {
+      websocketEvents.sendNewEvent({
+        op: 'ANGULAR_OBJECT_UPDATED',
+        data: {
+          noteId: noteId,
+          paragraphId: paragraphId,
+          name: name,
+          value: value,
+          interpreterGroupId: interpreterGroupId
+        }
+      });
+    },
+
+    clientBindAngularObject: function(noteId, name, value, paragraphId) {
+      websocketEvents.sendNewEvent({
+        op: 'ANGULAR_OBJECT_CLIENT_BIND',
+        data: {
+          noteId: noteId,
+          name: name,
+          value: value,
+          paragraphId: paragraphId
+        }
+      });
+    },
+
+    clientUnbindAngularObject: function(noteId, name, paragraphId) {
+      websocketEvents.sendNewEvent({
+        op: 'ANGULAR_OBJECT_CLIENT_UNBIND',
+        data: {
+          noteId: noteId,
+          name: name,
+          paragraphId: paragraphId
+        }
+      });
+    },
+
+    cancelParagraphRun: function(paragraphId) {
+      websocketEvents.sendNewEvent({op: 'CANCEL_PARAGRAPH', data: {id: paragraphId}});
+    },
+
+    runParagraph: function(paragraphId, paragraphTitle, paragraphData, paragraphConfig, paragraphParams) {
+      websocketEvents.sendNewEvent({
+        op: 'RUN_PARAGRAPH',
+        data: {
+          id: paragraphId,
+          title: paragraphTitle,
+          paragraph: paragraphData,
+          config: paragraphConfig,
+          params: paragraphParams
+        }
+      });
+    },
+
+    runAllParagraphs: function(noteId, paragraphs) {
+      websocketEvents.sendNewEvent({
+        op: 'RUN_ALL_PARAGRAPHS',
+        data: {
+          noteId: noteId,
+          paragraphs: JSON.stringify(paragraphs)
+        }
+      });
+    },
+
+    removeParagraph: function(paragraphId) {
+      websocketEvents.sendNewEvent({op: 'PARAGRAPH_REMOVE', data: {id: paragraphId}});
+    },
+
+    clearParagraphOutput: function(paragraphId) {
+      websocketEvents.sendNewEvent({op: 'PARAGRAPH_CLEAR_OUTPUT', data: {id: paragraphId}});
+    },
+
+    clearAllParagraphOutput: function(noteId) {
+      websocketEvents.sendNewEvent({op: 'PARAGRAPH_CLEAR_ALL_OUTPUT', data: {id: noteId}});
+    },
+
+    completion: function(paragraphId, buf, cursor) {
+      websocketEvents.sendNewEvent({
+        op: 'COMPLETION',
+        data: {
+          id: paragraphId,
+          buf: buf,
+          cursor: cursor
+        }
+      });
+    },
+
+    commitParagraph: function(paragraphId, paragraphTitle, paragraphData, paragraphConfig, paragraphParams) {
+      websocketEvents.sendNewEvent({
+        op: 'COMMIT_PARAGRAPH',
+        data: {
+          id: paragraphId,
+          title: paragraphTitle,
+          paragraph: paragraphData,
+          config: paragraphConfig,
+          params: paragraphParams
+        }
+      });
+    },
+
+    importNote: function(note) {
+      websocketEvents.sendNewEvent({
+        op: 'IMPORT_NOTE',
+        data: {
+          note: note
+        }
+      });
+    },
+
+    checkpointNote: function(noteId, commitMessage) {
+      websocketEvents.sendNewEvent({
+        op: 'CHECKPOINT_NOTE',
+        data: {
+          noteId: noteId,
+          commitMessage: commitMessage
+        }
+      });
+    },
+
+    setNoteRevision: function(noteId, revisionId) {
+      websocketEvents.sendNewEvent({
+        op: 'SET_NOTE_REVISION',
+        data: {
+          noteId: noteId,
+          revisionId: revisionId
+        }
+      });
+    },
+
+    listRevisionHistory: function(noteId) {
+      websocketEvents.sendNewEvent({
+        op: 'LIST_REVISION_HISTORY',
+        data: {
+          noteId: noteId
+        }
+      });
+    },
+
+    getNoteByRevision: function(noteId, revisionId) {
+      websocketEvents.sendNewEvent({
+        op: 'NOTE_REVISION',
+        data: {
+          noteId: noteId,
+          revisionId: revisionId
+        }
+      });
+    },
+
+    getEditorSetting: function(paragraphId, replName) {
+      websocketEvents.sendNewEvent({
+        op: 'EDITOR_SETTING',
+        data: {
+          paragraphId: paragraphId,
+          magic: replName
+        }
+      });
+    },
+
+    isConnected: function() {
+      return websocketEvents.isConnected();
+    },
+
+    getNoteJobsList: function() {
+      websocketEvents.sendNewEvent({op: 'LIST_NOTE_JOBS'});
+    },
+
+    getUpdateNoteJobsList: function(lastUpdateServerUnixTime) {
+      websocketEvents.sendNewEvent(
+        {op: 'LIST_UPDATE_NOTE_JOBS', data: {lastUpdateUnixTime: lastUpdateServerUnixTime * 1}}
+      );
+    },
+
+    unsubscribeJobManager: function() {
+      websocketEvents.sendNewEvent({op: 'UNSUBSCRIBE_UPDATE_NOTE_JOBS'});
+    },
+
+    getInterpreterBindings: function(noteId) {
+      websocketEvents.sendNewEvent({op: 'GET_INTERPRETER_BINDINGS', data: {noteId: noteId}});
+    },
+
+    saveInterpreterBindings: function(noteId, selectedSettingIds) {
+      websocketEvents.sendNewEvent({op: 'SAVE_INTERPRETER_BINDINGS',
+        data: {noteId: noteId, selectedSettingIds: selectedSettingIds}});
+    },
+
+    listConfigurations: function() {
+      websocketEvents.sendNewEvent({op: 'LIST_CONFIGURATIONS'});
+    },
+
+    getInterpreterSettings: function() {
+      websocketEvents.sendNewEvent({op: 'GET_INTERPRETER_SETTINGS'});
+    }
+
+  };
+}
+


[5/6] zeppelin git commit: [ZEPPELIN-1927] Remove useless function wrapping in all js files

Posted by mo...@apache.org.
http://git-wip-us.apache.org/repos/asf/zeppelin/blob/4c60b27c/zeppelin-web/src/app/jobmanager/jobmanager.controller.js
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/app/jobmanager/jobmanager.controller.js b/zeppelin-web/src/app/jobmanager/jobmanager.controller.js
index 47e42fb..4c437da 100644
--- a/zeppelin-web/src/app/jobmanager/jobmanager.controller.js
+++ b/zeppelin-web/src/app/jobmanager/jobmanager.controller.js
@@ -11,167 +11,165 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
 
-  angular.module('zeppelinWebApp')
-    .controller('JobmanagerCtrl', JobmanagerCtrl);
+angular.module('zeppelinWebApp')
+  .controller('JobmanagerCtrl', JobmanagerCtrl);
 
-  JobmanagerCtrl.$inject = ['$scope', 'websocketMsgSrv', '$interval', 'ngToast', '$q', '$timeout', 'jobManagerFilter'];
+JobmanagerCtrl.$inject = ['$scope', 'websocketMsgSrv', '$interval', 'ngToast', '$q', '$timeout', 'jobManagerFilter'];
 
-  function JobmanagerCtrl($scope, websocketMsgSrv, $interval, ngToast, $q, $timeout, jobManagerFilter) {
-    ngToast.dismiss();
-    var asyncNotebookJobFilter = function(jobInfomations, filterConfig) {
-      return $q(function(resolve, reject) {
-        $scope.JobInfomationsByFilter = $scope.jobTypeFilter(jobInfomations, filterConfig);
-        resolve($scope.JobInfomationsByFilter);
+function JobmanagerCtrl($scope, websocketMsgSrv, $interval, ngToast, $q, $timeout, jobManagerFilter) {
+  ngToast.dismiss();
+  var asyncNotebookJobFilter = function(jobInfomations, filterConfig) {
+    return $q(function(resolve, reject) {
+      $scope.JobInfomationsByFilter = $scope.jobTypeFilter(jobInfomations, filterConfig);
+      resolve($scope.JobInfomationsByFilter);
+    });
+  };
+
+  $scope.doFiltering = function(jobInfomations, filterConfig) {
+    asyncNotebookJobFilter(jobInfomations, filterConfig).then(
+      function() {
+        // success
+        $scope.isLoadingFilter = false;
+      },
+      function() {
+        // failed
       });
-    };
-
-    $scope.doFiltering = function(jobInfomations, filterConfig) {
-      asyncNotebookJobFilter(jobInfomations, filterConfig).then(
-        function() {
-          // success
-          $scope.isLoadingFilter = false;
-        },
-        function() {
-          // failed
-        });
-    };
-
-    $scope.filterValueToName = function(filterValue, maxStringLength) {
-      if ($scope.activeInterpreters === undefined) {
-        return;
+  };
+
+  $scope.filterValueToName = function(filterValue, maxStringLength) {
+    if ($scope.activeInterpreters === undefined) {
+      return;
+    }
+    var index = _.findIndex($scope.activeInterpreters, {value: filterValue});
+    if ($scope.activeInterpreters[index].name !== undefined) {
+      if (maxStringLength !== undefined && maxStringLength > $scope.activeInterpreters[index].name) {
+        return $scope.activeInterpreters[index].name.substr(0, maxStringLength - 3) + '...';
       }
-      var index = _.findIndex($scope.activeInterpreters, {value: filterValue});
-      if ($scope.activeInterpreters[index].name !== undefined) {
-        if (maxStringLength !== undefined && maxStringLength > $scope.activeInterpreters[index].name) {
-          return $scope.activeInterpreters[index].name.substr(0, maxStringLength - 3) + '...';
-        }
-        return $scope.activeInterpreters[index].name;
-      } else {
-        return 'Interpreter is not set';
-      }
-    };
-
-    $scope.setFilterValue = function(filterValue) {
-      $scope.filterConfig.filterValueInterpreter = filterValue;
-      $scope.doFiltering($scope.jobInfomations, $scope.filterConfig);
-    };
-
-    $scope.onChangeRunJobToAlwaysTopToggle = function() {
-      $scope.filterConfig.isRunningAlwaysTop = !$scope.filterConfig.isRunningAlwaysTop;
-      $scope.doFiltering($scope.jobInfomations, $scope.filterConfig);
-    };
-
-    $scope.onChangeSortAsc = function() {
-      $scope.filterConfig.isSortByAsc = !$scope.filterConfig.isSortByAsc;
-      $scope.doFiltering($scope.jobInfomations, $scope.filterConfig);
-    };
-
-    $scope.doFilterInputTyping = function(keyEvent, jobInfomations, filterConfig) {
-      var RETURN_KEY_CODE = 13;
-      $timeout.cancel($scope.dofilterTimeoutObject);
-      $scope.isActiveSearchTimer = true;
-      $scope.dofilterTimeoutObject = $timeout(function() {
-        $scope.doFiltering(jobInfomations, filterConfig);
-        $scope.isActiveSearchTimer = false;
-      }, 10000);
-      if (keyEvent.which === RETURN_KEY_CODE) {
-        $timeout.cancel($scope.dofilterTimeoutObject);
-        $scope.doFiltering(jobInfomations, filterConfig);
-        $scope.isActiveSearchTimer = false;
-      }
-    };
-
-    $scope.doForceFilterInputTyping = function(keyEvent, jobInfomations, filterConfig) {
+      return $scope.activeInterpreters[index].name;
+    } else {
+      return 'Interpreter is not set';
+    }
+  };
+
+  $scope.setFilterValue = function(filterValue) {
+    $scope.filterConfig.filterValueInterpreter = filterValue;
+    $scope.doFiltering($scope.jobInfomations, $scope.filterConfig);
+  };
+
+  $scope.onChangeRunJobToAlwaysTopToggle = function() {
+    $scope.filterConfig.isRunningAlwaysTop = !$scope.filterConfig.isRunningAlwaysTop;
+    $scope.doFiltering($scope.jobInfomations, $scope.filterConfig);
+  };
+
+  $scope.onChangeSortAsc = function() {
+    $scope.filterConfig.isSortByAsc = !$scope.filterConfig.isSortByAsc;
+    $scope.doFiltering($scope.jobInfomations, $scope.filterConfig);
+  };
+
+  $scope.doFilterInputTyping = function(keyEvent, jobInfomations, filterConfig) {
+    var RETURN_KEY_CODE = 13;
+    $timeout.cancel($scope.dofilterTimeoutObject);
+    $scope.isActiveSearchTimer = true;
+    $scope.dofilterTimeoutObject = $timeout(function() {
+      $scope.doFiltering(jobInfomations, filterConfig);
+      $scope.isActiveSearchTimer = false;
+    }, 10000);
+    if (keyEvent.which === RETURN_KEY_CODE) {
       $timeout.cancel($scope.dofilterTimeoutObject);
       $scope.doFiltering(jobInfomations, filterConfig);
       $scope.isActiveSearchTimer = false;
+    }
+  };
+
+  $scope.doForceFilterInputTyping = function(keyEvent, jobInfomations, filterConfig) {
+    $timeout.cancel($scope.dofilterTimeoutObject);
+    $scope.doFiltering(jobInfomations, filterConfig);
+    $scope.isActiveSearchTimer = false;
+  };
+
+  $scope.init = function() {
+    $scope.isLoadingFilter = true;
+    $scope.jobInfomations = [];
+    $scope.JobInfomationsByFilter = $scope.jobInfomations;
+    $scope.filterConfig = {
+      isRunningAlwaysTop: true,
+      filterValueNotebookName: '',
+      filterValueInterpreter: '*',
+      isSortByAsc: true
     };
+    $scope.jobTypeFilter = jobManagerFilter;
 
-    $scope.init = function() {
-      $scope.isLoadingFilter = true;
-      $scope.jobInfomations = [];
-      $scope.JobInfomationsByFilter = $scope.jobInfomations;
-      $scope.filterConfig = {
-        isRunningAlwaysTop: true,
-        filterValueNotebookName: '',
-        filterValueInterpreter: '*',
-        isSortByAsc: true
-      };
-      $scope.jobTypeFilter = jobManagerFilter;
-
-      websocketMsgSrv.getNoteJobsList();
-
-      $scope.$on('$destroy', function() {
-        websocketMsgSrv.unsubscribeJobManager();
-      });
-    };
+    websocketMsgSrv.getNoteJobsList();
 
-    /*
-     ** $scope.$on functions below
-     */
-
-    $scope.$on('setNoteJobs', function(event, responseData) {
-      $scope.lastJobServerUnixTime = responseData.lastResponseUnixTime;
-      $scope.jobInfomations = responseData.jobs;
-      $scope.jobInfomationsIndexs = $scope.jobInfomations ? _.indexBy($scope.jobInfomations, 'noteId') : {};
-      $scope.jobTypeFilter($scope.jobInfomations, $scope.filterConfig);
-      $scope.activeInterpreters = [
-        {
-          name: 'ALL',
-          value: '*'
-        }
-      ];
-      var interpreterLists = _.uniq(_.pluck($scope.jobInfomations, 'interpreter'), false);
-      for (var index = 0, length = interpreterLists.length; index < length; index++) {
-        $scope.activeInterpreters.push({
-          name: interpreterLists[index],
-          value: interpreterLists[index]
-        });
-      }
-      $scope.doFiltering($scope.jobInfomations, $scope.filterConfig);
+    $scope.$on('$destroy', function() {
+      websocketMsgSrv.unsubscribeJobManager();
     });
+  };
+
+  /*
+   ** $scope.$on functions below
+   */
+
+  $scope.$on('setNoteJobs', function(event, responseData) {
+    $scope.lastJobServerUnixTime = responseData.lastResponseUnixTime;
+    $scope.jobInfomations = responseData.jobs;
+    $scope.jobInfomationsIndexs = $scope.jobInfomations ? _.indexBy($scope.jobInfomations, 'noteId') : {};
+    $scope.jobTypeFilter($scope.jobInfomations, $scope.filterConfig);
+    $scope.activeInterpreters = [
+      {
+        name: 'ALL',
+        value: '*'
+      }
+    ];
+    var interpreterLists = _.uniq(_.pluck($scope.jobInfomations, 'interpreter'), false);
+    for (var index = 0, length = interpreterLists.length; index < length; index++) {
+      $scope.activeInterpreters.push({
+        name: interpreterLists[index],
+        value: interpreterLists[index]
+      });
+    }
+    $scope.doFiltering($scope.jobInfomations, $scope.filterConfig);
+  });
+
+  $scope.$on('setUpdateNoteJobs', function(event, responseData) {
+    var jobInfomations = $scope.jobInfomations;
+    var indexStore = $scope.jobInfomationsIndexs;
+    $scope.lastJobServerUnixTime = responseData.lastResponseUnixTime;
+    var notes = responseData.jobs;
+    notes.map(function(changedItem) {
+      if (indexStore[changedItem.noteId] === undefined) {
+        var newItem = angular.copy(changedItem);
+        jobInfomations.push(newItem);
+        indexStore[changedItem.noteId] = newItem;
+      } else {
+        var changeOriginTarget = indexStore[changedItem.noteId];
 
-    $scope.$on('setUpdateNoteJobs', function(event, responseData) {
-      var jobInfomations = $scope.jobInfomations;
-      var indexStore = $scope.jobInfomationsIndexs;
-      $scope.lastJobServerUnixTime = responseData.lastResponseUnixTime;
-      var notes = responseData.jobs;
-      notes.map(function(changedItem) {
-        if (indexStore[changedItem.noteId] === undefined) {
-          var newItem = angular.copy(changedItem);
-          jobInfomations.push(newItem);
-          indexStore[changedItem.noteId] = newItem;
-        } else {
-          var changeOriginTarget = indexStore[changedItem.noteId];
-
-          if (changedItem.isRemoved !== undefined && changedItem.isRemoved === true) {
-
-            // remove Item.
-            var removeIndex = _.findIndex(indexStore, changedItem.noteId);
-            if (removeIndex > -1) {
-              indexStore.splice(removeIndex, 1);
-            }
-
-            removeIndex = _.findIndex(jobInfomations, {'noteId': changedItem.noteId});
-            if (removeIndex) {
-              jobInfomations.splice(removeIndex, 1);
-            }
-
-          } else {
-            // change value for item.
-            changeOriginTarget.isRunningJob = changedItem.isRunningJob;
-            changeOriginTarget.noteName = changedItem.noteName;
-            changeOriginTarget.noteType = changedItem.noteType;
-            changeOriginTarget.interpreter = changedItem.interpreter;
-            changeOriginTarget.unixTimeLastRun = changedItem.unixTimeLastRun;
-            changeOriginTarget.paragraphs = changedItem.paragraphs;
+        if (changedItem.isRemoved !== undefined && changedItem.isRemoved === true) {
+
+          // remove Item.
+          var removeIndex = _.findIndex(indexStore, changedItem.noteId);
+          if (removeIndex > -1) {
+            indexStore.splice(removeIndex, 1);
+          }
+
+          removeIndex = _.findIndex(jobInfomations, {'noteId': changedItem.noteId});
+          if (removeIndex) {
+            jobInfomations.splice(removeIndex, 1);
           }
+
+        } else {
+          // change value for item.
+          changeOriginTarget.isRunningJob = changedItem.isRunningJob;
+          changeOriginTarget.noteName = changedItem.noteName;
+          changeOriginTarget.noteType = changedItem.noteType;
+          changeOriginTarget.interpreter = changedItem.interpreter;
+          changeOriginTarget.unixTimeLastRun = changedItem.unixTimeLastRun;
+          changeOriginTarget.paragraphs = changedItem.paragraphs;
         }
-      });
-      $scope.doFiltering(jobInfomations, $scope.filterConfig);
+      }
     });
-  }
+    $scope.doFiltering(jobInfomations, $scope.filterConfig);
+  });
+}
 
-})();

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/4c60b27c/zeppelin-web/src/app/jobmanager/jobmanager.filter.js
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/app/jobmanager/jobmanager.filter.js b/zeppelin-web/src/app/jobmanager/jobmanager.filter.js
index baf3c5d..62e85fd 100644
--- a/zeppelin-web/src/app/jobmanager/jobmanager.filter.js
+++ b/zeppelin-web/src/app/jobmanager/jobmanager.filter.js
@@ -11,35 +11,33 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
 
-  angular.module('zeppelinWebApp').filter('jobManager', jobManagerFilter);
+angular.module('zeppelinWebApp').filter('jobManager', jobManagerFilter);
 
-  function jobManagerFilter() {
-    function filterContext(jobItems, filterConfig) {
-      var filterValueInterpreter = filterConfig.filterValueInterpreter;
-      var filterValueNotebookName = filterConfig.filterValueNotebookName;
-      var filterItems = jobItems;
+function jobManagerFilter() {
+  function filterContext(jobItems, filterConfig) {
+    var filterValueInterpreter = filterConfig.filterValueInterpreter;
+    var filterValueNotebookName = filterConfig.filterValueNotebookName;
+    var filterItems = jobItems;
 
-      if (filterValueInterpreter === undefined) {
-        filterItems = _.filter(filterItems, function(jobItem) {
-          return jobItem.interpreter === undefined ? true : false;
-        });
-      } else if (filterValueInterpreter !== '*') {
-        filterItems = _.where(filterItems, {interpreter: filterValueInterpreter});
-      }
-
-      if (filterValueNotebookName !== '') {
-        filterItems = _.filter(filterItems, function(jobItem) {
-          var lowerFilterValue = filterValueNotebookName.toLocaleLowerCase();
-          var lowerNotebookName = jobItem.noteName.toLocaleLowerCase();
-          return lowerNotebookName.match(new RegExp('.*' + lowerFilterValue + '.*'));
-        });
-      }
+    if (filterValueInterpreter === undefined) {
+      filterItems = _.filter(filterItems, function(jobItem) {
+        return jobItem.interpreter === undefined ? true : false;
+      });
+    } else if (filterValueInterpreter !== '*') {
+      filterItems = _.where(filterItems, {interpreter: filterValueInterpreter});
+    }
 
-      return filterItems;
+    if (filterValueNotebookName !== '') {
+      filterItems = _.filter(filterItems, function(jobItem) {
+        var lowerFilterValue = filterValueNotebookName.toLocaleLowerCase();
+        var lowerNotebookName = jobItem.noteName.toLocaleLowerCase();
+        return lowerNotebookName.match(new RegExp('.*' + lowerFilterValue + '.*'));
+      });
     }
-    return filterContext;
+
+    return filterItems;
   }
+  return filterContext;
+}
 
-})();

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/4c60b27c/zeppelin-web/src/app/jobmanager/jobs/job.controller.js
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/app/jobmanager/jobs/job.controller.js b/zeppelin-web/src/app/jobmanager/jobs/job.controller.js
index c2155ab..8bf9d87 100644
--- a/zeppelin-web/src/app/jobmanager/jobs/job.controller.js
+++ b/zeppelin-web/src/app/jobmanager/jobs/job.controller.js
@@ -11,99 +11,97 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
 
-  angular.module('zeppelinWebApp').controller('JobCtrl', JobCtrl);
+angular.module('zeppelinWebApp').controller('JobCtrl', JobCtrl);
 
-  JobCtrl.$inject = ['$scope', '$http', 'baseUrlSrv'];
+JobCtrl.$inject = ['$scope', '$http', 'baseUrlSrv'];
 
-  function JobCtrl($scope, $http, baseUrlSrv) {
-    $scope.init = function(jobInformation) {
-      $scope.progressValue = 0;
-    };
+function JobCtrl($scope, $http, baseUrlSrv) {
+  $scope.init = function(jobInformation) {
+    $scope.progressValue = 0;
+  };
 
-    $scope.getProgress = function() {
-      var statusList = _.pluck($scope.notebookJob.paragraphs, 'status');
-      var runningJob = _.countBy(statusList, function(status) {
-        if (status === 'FINISHED' || status === 'RUNNING') {
-          return 'matchCount';
-        } else {
-          return 'none';
-        }
-      });
-      var totalCount = statusList.length;
-      var runningJobCount = runningJob.matchCount;
-      var result = Math.ceil(runningJobCount / totalCount * 100);
-      return isNaN(result) ? 0 : result;
-    };
+  $scope.getProgress = function() {
+    var statusList = _.pluck($scope.notebookJob.paragraphs, 'status');
+    var runningJob = _.countBy(statusList, function(status) {
+      if (status === 'FINISHED' || status === 'RUNNING') {
+        return 'matchCount';
+      } else {
+        return 'none';
+      }
+    });
+    var totalCount = statusList.length;
+    var runningJobCount = runningJob.matchCount;
+    var result = Math.ceil(runningJobCount / totalCount * 100);
+    return isNaN(result) ? 0 : result;
+  };
 
-    $scope.runNotebookJob = function(notebookId) {
-      BootstrapDialog.confirm({
-        closable: true,
-        title: '',
-        message: 'Run all paragraphs?',
-        callback: function(result) {
-          if (result) {
-            $http({
-              method: 'POST',
-              url: baseUrlSrv.getRestApiBase() + '/notebook/job/' + notebookId,
-              headers: {
-                'Content-Type': 'application/x-www-form-urlencoded'
-              }
-            }).then(function successCallback(response) {
-              // success
-            }, function errorCallback(errorResponse) {
-              var errorText = 'SERVER ERROR';
-              if (!!errorResponse.data.message) {
-                errorText = errorResponse.data.message;
-              }
-              BootstrapDialog.alert({
-                closable: true,
-                title: 'Execution Failure',
-                message: errorText
-              });
+  $scope.runNotebookJob = function(notebookId) {
+    BootstrapDialog.confirm({
+      closable: true,
+      title: '',
+      message: 'Run all paragraphs?',
+      callback: function(result) {
+        if (result) {
+          $http({
+            method: 'POST',
+            url: baseUrlSrv.getRestApiBase() + '/notebook/job/' + notebookId,
+            headers: {
+              'Content-Type': 'application/x-www-form-urlencoded'
+            }
+          }).then(function successCallback(response) {
+            // success
+          }, function errorCallback(errorResponse) {
+            var errorText = 'SERVER ERROR';
+            if (!!errorResponse.data.message) {
+              errorText = errorResponse.data.message;
+            }
+            BootstrapDialog.alert({
+              closable: true,
+              title: 'Execution Failure',
+              message: errorText
             });
-          }
+          });
         }
-      });
-    };
+      }
+    });
+  };
 
-    $scope.stopNotebookJob = function(notebookId) {
-      BootstrapDialog.confirm({
-        closable: true,
-        title: '',
-        message: 'Stop all paragraphs?',
-        callback: function(result) {
-          if (result) {
-            $http({
-              method: 'DELETE',
-              url: baseUrlSrv.getRestApiBase() + '/notebook/job/' + notebookId,
-              headers: {
-                'Content-Type': 'application/x-www-form-urlencoded'
-              }
-            }).then(function successCallback(response) {
-              // success
-            }, function errorCallback(errorResponse) {
-              var errorText = 'SERVER ERROR';
-              if (!!errorResponse.data.message) {
+  $scope.stopNotebookJob = function(notebookId) {
+    BootstrapDialog.confirm({
+      closable: true,
+      title: '',
+      message: 'Stop all paragraphs?',
+      callback: function(result) {
+        if (result) {
+          $http({
+            method: 'DELETE',
+            url: baseUrlSrv.getRestApiBase() + '/notebook/job/' + notebookId,
+            headers: {
+              'Content-Type': 'application/x-www-form-urlencoded'
+            }
+          }).then(function successCallback(response) {
+            // success
+          }, function errorCallback(errorResponse) {
+            var errorText = 'SERVER ERROR';
+            if (!!errorResponse.data.message) {
 
-                errorText = errorResponse.data.message;
-              }
-              BootstrapDialog.alert({
-                closable: true,
-                title: 'Stop Failure',
-                message: errorText
-              });
+              errorText = errorResponse.data.message;
+            }
+            BootstrapDialog.alert({
+              closable: true,
+              title: 'Stop Failure',
+              message: errorText
             });
-          }
+          });
         }
-      });
-    };
+      }
+    });
+  };
 
-    $scope.lastExecuteTime = function(unixtime) {
-      return moment.unix(unixtime / 1000).fromNow();
-    };
+  $scope.lastExecuteTime = function(unixtime) {
+    return moment.unix(unixtime / 1000).fromNow();
+  };
 
-  }
+}
 
-})();

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/4c60b27c/zeppelin-web/src/app/notebook/notebook.controller.js
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/app/notebook/notebook.controller.js b/zeppelin-web/src/app/notebook/notebook.controller.js
index b1b5447..248ef8a 100644
--- a/zeppelin-web/src/app/notebook/notebook.controller.js
+++ b/zeppelin-web/src/app/notebook/notebook.controller.js
@@ -11,1006 +11,1004 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
-
-  angular.module('zeppelinWebApp').controller('NotebookCtrl', NotebookCtrl);
-
-  NotebookCtrl.$inject = [
-    '$scope',
-    '$route',
-    '$routeParams',
-    '$location',
-    '$rootScope',
-    '$http',
-    'websocketMsgSrv',
-    'baseUrlSrv',
-    '$timeout',
-    'saveAsService',
-    'ngToast',
-    'noteActionSrv',
-    'noteVarShareService',
-    'TRASH_FOLDER_ID'
+
+angular.module('zeppelinWebApp').controller('NotebookCtrl', NotebookCtrl);
+
+NotebookCtrl.$inject = [
+  '$scope',
+  '$route',
+  '$routeParams',
+  '$location',
+  '$rootScope',
+  '$http',
+  'websocketMsgSrv',
+  'baseUrlSrv',
+  '$timeout',
+  'saveAsService',
+  'ngToast',
+  'noteActionSrv',
+  'noteVarShareService',
+  'TRASH_FOLDER_ID'
+];
+
+function NotebookCtrl($scope, $route, $routeParams, $location, $rootScope,
+                      $http, websocketMsgSrv, baseUrlSrv, $timeout, saveAsService,
+                      ngToast, noteActionSrv, noteVarShareService, TRASH_FOLDER_ID) {
+
+  ngToast.dismiss();
+
+  $scope.note = null;
+  $scope.moment = moment;
+  $scope.editorToggled = false;
+  $scope.tableToggled = false;
+  $scope.viewOnly = false;
+  $scope.showSetting = false;
+  $scope.looknfeelOption = ['default', 'simple', 'report'];
+  $scope.cronOption = [
+    {name: 'None', value: undefined},
+    {name: '1m', value: '0 0/1 * * * ?'},
+    {name: '5m', value: '0 0/5 * * * ?'},
+    {name: '1h', value: '0 0 0/1 * * ?'},
+    {name: '3h', value: '0 0 0/3 * * ?'},
+    {name: '6h', value: '0 0 0/6 * * ?'},
+    {name: '12h', value: '0 0 0/12 * * ?'},
+    {name: '1d', value: '0 0 0 * * ?'}
   ];
 
-  function NotebookCtrl($scope, $route, $routeParams, $location, $rootScope,
-                        $http, websocketMsgSrv, baseUrlSrv, $timeout, saveAsService,
-                        ngToast, noteActionSrv, noteVarShareService, TRASH_FOLDER_ID) {
+  $scope.interpreterSettings = [];
+  $scope.interpreterBindings = [];
+  $scope.isNoteDirty = null;
+  $scope.saveTimer = null;
 
-    ngToast.dismiss();
+  var connectedOnce = false;
+  var isRevisionPath = function(path) {
+    var pattern = new RegExp('^.*\/notebook\/[a-zA-Z0-9_]*\/revision\/[a-zA-Z0-9_]*');
+    return pattern.test(path);
+  };
 
-    $scope.note = null;
-    $scope.moment = moment;
-    $scope.editorToggled = false;
-    $scope.tableToggled = false;
-    $scope.viewOnly = false;
-    $scope.showSetting = false;
-    $scope.looknfeelOption = ['default', 'simple', 'report'];
-    $scope.cronOption = [
-      {name: 'None', value: undefined},
-      {name: '1m', value: '0 0/1 * * * ?'},
-      {name: '5m', value: '0 0/5 * * * ?'},
-      {name: '1h', value: '0 0 0/1 * * ?'},
-      {name: '3h', value: '0 0 0/3 * * ?'},
-      {name: '6h', value: '0 0 0/6 * * ?'},
-      {name: '12h', value: '0 0 0/12 * * ?'},
-      {name: '1d', value: '0 0 0 * * ?'}
-    ];
-
-    $scope.interpreterSettings = [];
-    $scope.interpreterBindings = [];
-    $scope.isNoteDirty = null;
-    $scope.saveTimer = null;
-
-    var connectedOnce = false;
-    var isRevisionPath = function(path) {
-      var pattern = new RegExp('^.*\/notebook\/[a-zA-Z0-9_]*\/revision\/[a-zA-Z0-9_]*');
-      return pattern.test(path);
-    };
-
-    $scope.noteRevisions = [];
-    $scope.currentRevision = 'Head';
-    $scope.revisionView = isRevisionPath($location.path());
-
-    $scope.$on('setConnectedStatus', function(event, param) {
-      if (connectedOnce && param) {
-        initNotebook();
-      }
-      connectedOnce = true;
-    });
+  $scope.noteRevisions = [];
+  $scope.currentRevision = 'Head';
+  $scope.revisionView = isRevisionPath($location.path());
 
-    $scope.getCronOptionNameFromValue = function(value) {
-      if (!value) {
-        return '';
-      }
+  $scope.$on('setConnectedStatus', function(event, param) {
+    if (connectedOnce && param) {
+      initNotebook();
+    }
+    connectedOnce = true;
+  });
 
-      for (var o in $scope.cronOption) {
-        if ($scope.cronOption[o].value === value) {
-          return $scope.cronOption[o].name;
-        }
-      }
-      return value;
-    };
-
-    $scope.blockAnonUsers = function() {
-      var zeppelinVersion = $rootScope.zeppelinVersion;
-      var url = 'https://zeppelin.apache.org/docs/' + zeppelinVersion + '/security/notebook_authorization.html';
-      var content = 'Only authenticated user can set the permission.' +
-        '<a data-toggle="tooltip" data-placement="top" title="Learn more" target="_blank" href=' + url + '>' +
-        '<i class="icon-question" />' +
-        '</a>';
-      BootstrapDialog.show({
-        closable: false,
-        closeByBackdrop: false,
-        closeByKeyboard: false,
-        title: 'No permission',
-        message: content,
-        buttons: [{
-          label: 'Close',
-          action: function(dialog) {
-            dialog.close();
-          }
-        }]
-      });
-    };
+  $scope.getCronOptionNameFromValue = function(value) {
+    if (!value) {
+      return '';
+    }
 
-    /** Init the new controller */
-    var initNotebook = function() {
-      noteVarShareService.clear();
-      if ($routeParams.revisionId) {
-        websocketMsgSrv.getNoteByRevision($routeParams.noteId, $routeParams.revisionId);
-      } else {
-        websocketMsgSrv.getNote($routeParams.noteId);
+    for (var o in $scope.cronOption) {
+      if ($scope.cronOption[o].value === value) {
+        return $scope.cronOption[o].name;
       }
-      websocketMsgSrv.listRevisionHistory($routeParams.noteId);
-      var currentRoute = $route.current;
-      if (currentRoute) {
-        setTimeout(
-          function() {
-            var routeParams = currentRoute.params;
-            var $id = angular.element('#' + routeParams.paragraph + '_container');
-
-            if ($id.length > 0) {
-              // adjust for navbar
-              var top = $id.offset().top - 103;
-              angular.element('html, body').scrollTo({top: top, left: 0});
-            }
-          },
-          1000
-        );
-      }
-    };
-
-    initNotebook();
-
-    // force notebook reload on user change
-    $scope.$on('setNoteMenu', function(event, note) {
-      initNotebook();
+    }
+    return value;
+  };
+
+  $scope.blockAnonUsers = function() {
+    var zeppelinVersion = $rootScope.zeppelinVersion;
+    var url = 'https://zeppelin.apache.org/docs/' + zeppelinVersion + '/security/notebook_authorization.html';
+    var content = 'Only authenticated user can set the permission.' +
+      '<a data-toggle="tooltip" data-placement="top" title="Learn more" target="_blank" href=' + url + '>' +
+      '<i class="icon-question" />' +
+      '</a>';
+    BootstrapDialog.show({
+      closable: false,
+      closeByBackdrop: false,
+      closeByKeyboard: false,
+      title: 'No permission',
+      message: content,
+      buttons: [{
+        label: 'Close',
+        action: function(dialog) {
+          dialog.close();
+        }
+      }]
     });
+  };
+
+  /** Init the new controller */
+  var initNotebook = function() {
+    noteVarShareService.clear();
+    if ($routeParams.revisionId) {
+      websocketMsgSrv.getNoteByRevision($routeParams.noteId, $routeParams.revisionId);
+    } else {
+      websocketMsgSrv.getNote($routeParams.noteId);
+    }
+    websocketMsgSrv.listRevisionHistory($routeParams.noteId);
+    var currentRoute = $route.current;
+    if (currentRoute) {
+      setTimeout(
+        function() {
+          var routeParams = currentRoute.params;
+          var $id = angular.element('#' + routeParams.paragraph + '_container');
+
+          if ($id.length > 0) {
+            // adjust for navbar
+            var top = $id.offset().top - 103;
+            angular.element('html, body').scrollTo({top: top, left: 0});
+          }
+        },
+        1000
+      );
+    }
+  };
 
-    $scope.focusParagraphOnClick = function(clickEvent) {
-      if (!$scope.note) {
-        return;
-      }
-      for (var i = 0; i < $scope.note.paragraphs.length; i++) {
-        var paragraphId = $scope.note.paragraphs[i].id;
-        if (jQuery.contains(angular.element('#' + paragraphId + '_container')[0], clickEvent.target)) {
-          $scope.$broadcast('focusParagraph', paragraphId, 0, true);
-          break;
-        }
-      }
-    };
+  initNotebook();
 
-    // register mouseevent handler for focus paragraph
-    document.addEventListener('click', $scope.focusParagraphOnClick);
+  // force notebook reload on user change
+  $scope.$on('setNoteMenu', function(event, note) {
+    initNotebook();
+  });
 
-    $scope.keyboardShortcut = function(keyEvent) {
-      // handle keyevent
-      if (!$scope.viewOnly && !$scope.revisionView) {
-        $scope.$broadcast('keyEvent', keyEvent);
+  $scope.focusParagraphOnClick = function(clickEvent) {
+    if (!$scope.note) {
+      return;
+    }
+    for (var i = 0; i < $scope.note.paragraphs.length; i++) {
+      var paragraphId = $scope.note.paragraphs[i].id;
+      if (jQuery.contains(angular.element('#' + paragraphId + '_container')[0], clickEvent.target)) {
+        $scope.$broadcast('focusParagraph', paragraphId, 0, true);
+        break;
       }
-    };
-
-    // register mouseevent handler for focus paragraph
-    document.addEventListener('keydown', $scope.keyboardShortcut);
-
-    $scope.paragraphOnDoubleClick = function(paragraphId) {
-      $scope.$broadcast('doubleClickParagraph', paragraphId);
-    };
-
-    // Move the note to trash and go back to the main page
-    $scope.moveNoteToTrash = function(noteId) {
-      noteActionSrv.moveNoteToTrash(noteId, true);
-    };
-
-    // Remove the note permanently if it's in the trash
-    $scope.removeNote = function(noteId) {
-      noteActionSrv.removeNote(noteId, true);
-    };
-
-    $scope.isTrash = function(note) {
-      return note ? note.name.split('/')[0] === TRASH_FOLDER_ID : false;
-    };
-
-    //Export notebook
-    $scope.exportNote = function() {
-      var jsonContent = JSON.stringify($scope.note);
-      saveAsService.saveAs(jsonContent, $scope.note.name, 'json');
-    };
-
-    //Clone note
-    $scope.cloneNote = function(noteId) {
-      BootstrapDialog.confirm({
-        closable: true,
-        title: '',
-        message: 'Do you want to clone this note?',
-        callback: function(result) {
-          if (result) {
-            websocketMsgSrv.cloneNote(noteId);
-            $location.path('/');
-          }
-        }
-      });
-    };
+    }
+  };
 
-    // checkpoint/commit notebook
-    $scope.checkpointNote = function(commitMessage) {
-      BootstrapDialog.confirm({
-        closable: true,
-        title: '',
-        message: 'Commit note to current repository?',
-        callback: function(result) {
-          if (result) {
-            websocketMsgSrv.checkpointNote($routeParams.noteId, commitMessage);
-          }
-        }
-      });
-      document.getElementById('note.checkpoint.message').value = '';
-    };
+  // register mouseevent handler for focus paragraph
+  document.addEventListener('click', $scope.focusParagraphOnClick);
 
-    // set notebook head to given revision
-    $scope.setNoteRevision = function() {
-      BootstrapDialog.confirm({
-        closable: true,
-        title: '',
-        message: 'Set notebook head to current revision?',
-        callback: function(result) {
-          if (result) {
-            websocketMsgSrv.setNoteRevision($routeParams.noteId, $routeParams.revisionId);
-          }
-        }
-      });
-    };
-
-    $scope.$on('listRevisionHistory', function(event, data) {
-      console.log('received list of revisions %o', data);
-      $scope.noteRevisions = data.revisionList;
-      $scope.noteRevisions.splice(0, 0, {
-        id: 'Head',
-        message: 'Head'
-      });
-      if ($routeParams.revisionId) {
-        var index = _.findIndex($scope.noteRevisions, {'id': $routeParams.revisionId});
-        if (index > -1) {
-          $scope.currentRevision = $scope.noteRevisions[index].message;
+  $scope.keyboardShortcut = function(keyEvent) {
+    // handle keyevent
+    if (!$scope.viewOnly && !$scope.revisionView) {
+      $scope.$broadcast('keyEvent', keyEvent);
+    }
+  };
+
+  // register mouseevent handler for focus paragraph
+  document.addEventListener('keydown', $scope.keyboardShortcut);
+
+  $scope.paragraphOnDoubleClick = function(paragraphId) {
+    $scope.$broadcast('doubleClickParagraph', paragraphId);
+  };
+
+  // Move the note to trash and go back to the main page
+  $scope.moveNoteToTrash = function(noteId) {
+    noteActionSrv.moveNoteToTrash(noteId, true);
+  };
+
+  // Remove the note permanently if it's in the trash
+  $scope.removeNote = function(noteId) {
+    noteActionSrv.removeNote(noteId, true);
+  };
+
+  $scope.isTrash = function(note) {
+    return note ? note.name.split('/')[0] === TRASH_FOLDER_ID : false;
+  };
+
+  //Export notebook
+  $scope.exportNote = function() {
+    var jsonContent = JSON.stringify($scope.note);
+    saveAsService.saveAs(jsonContent, $scope.note.name, 'json');
+  };
+
+  //Clone note
+  $scope.cloneNote = function(noteId) {
+    BootstrapDialog.confirm({
+      closable: true,
+      title: '',
+      message: 'Do you want to clone this note?',
+      callback: function(result) {
+        if (result) {
+          websocketMsgSrv.cloneNote(noteId);
+          $location.path('/');
         }
       }
     });
-
-    $scope.$on('noteRevision', function(event, data) {
-      console.log('received note revision %o', data);
-      if (data.note) {
-        $scope.note = data.note;
-        initializeLookAndFeel();
-      } else {
-        $location.path('/');
+  };
+
+  // checkpoint/commit notebook
+  $scope.checkpointNote = function(commitMessage) {
+    BootstrapDialog.confirm({
+      closable: true,
+      title: '',
+      message: 'Commit note to current repository?',
+      callback: function(result) {
+        if (result) {
+          websocketMsgSrv.checkpointNote($routeParams.noteId, commitMessage);
+        }
       }
     });
-
-    $scope.$on('setNoteRevisionResult', function(event, data) {
-      console.log('received set note revision result %o', data);
-      if (data.status) {
-        $location.path('/notebook/' + $routeParams.noteId);
+    document.getElementById('note.checkpoint.message').value = '';
+  };
+
+  // set notebook head to given revision
+  $scope.setNoteRevision = function() {
+    BootstrapDialog.confirm({
+      closable: true,
+      title: '',
+      message: 'Set notebook head to current revision?',
+      callback: function(result) {
+        if (result) {
+          websocketMsgSrv.setNoteRevision($routeParams.noteId, $routeParams.revisionId);
+        }
       }
     });
-
-    $scope.visitRevision = function(revision) {
-      if (revision.id) {
-        if (revision.id === 'Head') {
-          $location.path('/notebook/' + $routeParams.noteId);
-        } else {
-          $location.path('/notebook/' + $routeParams.noteId + '/revision/' + revision.id);
-        }
-      } else {
-        ngToast.danger({content: 'There is a problem with this Revision',
-          verticalPosition: 'top', dismissOnTimeout: false});
+  };
+
+  $scope.$on('listRevisionHistory', function(event, data) {
+    console.log('received list of revisions %o', data);
+    $scope.noteRevisions = data.revisionList;
+    $scope.noteRevisions.splice(0, 0, {
+      id: 'Head',
+      message: 'Head'
+    });
+    if ($routeParams.revisionId) {
+      var index = _.findIndex($scope.noteRevisions, {'id': $routeParams.revisionId});
+      if (index > -1) {
+        $scope.currentRevision = $scope.noteRevisions[index].message;
       }
-    };
+    }
+  });
 
-    $scope.runAllParagraphs = function(noteId) {
-      BootstrapDialog.confirm({
-        closable: true,
-        title: '',
-        message: 'Run all paragraphs?',
-        callback: function(result) {
-          if (result) {
-            const paragraphs = $scope.note.paragraphs.map(p => {
-              return {
-                id: p.id,
-                title: p.title,
-                paragraph: p.text,
-                config: p.config,
-                params: p.settings.params
-              };
-            });
-            websocketMsgSrv.runAllParagraphs(noteId, paragraphs);
-          }
-        }
-      });
-    };
-
-    $scope.saveNote = function() {
-      if ($scope.note && $scope.note.paragraphs) {
-        _.forEach($scope.note.paragraphs, function(par) {
-          angular
-            .element('#' + par.id + '_paragraphColumn_main')
-            .scope()
-            .saveParagraph(par);
-        });
-        $scope.isNoteDirty = null;
-      }
-    };
+  $scope.$on('noteRevision', function(event, data) {
+    console.log('received note revision %o', data);
+    if (data.note) {
+      $scope.note = data.note;
+      initializeLookAndFeel();
+    } else {
+      $location.path('/');
+    }
+  });
 
-    $scope.clearAllParagraphOutput = function(noteId) {
-      noteActionSrv.clearAllParagraphOutput(noteId);
-    };
+  $scope.$on('setNoteRevisionResult', function(event, data) {
+    console.log('received set note revision result %o', data);
+    if (data.status) {
+      $location.path('/notebook/' + $routeParams.noteId);
+    }
+  });
 
-    $scope.toggleAllEditor = function() {
-      if ($scope.editorToggled) {
-        $scope.$broadcast('openEditor');
+  $scope.visitRevision = function(revision) {
+    if (revision.id) {
+      if (revision.id === 'Head') {
+        $location.path('/notebook/' + $routeParams.noteId);
       } else {
-        $scope.$broadcast('closeEditor');
+        $location.path('/notebook/' + $routeParams.noteId + '/revision/' + revision.id);
+      }
+    } else {
+      ngToast.danger({content: 'There is a problem with this Revision',
+        verticalPosition: 'top', dismissOnTimeout: false});
+    }
+  };
+
+  $scope.runAllParagraphs = function(noteId) {
+    BootstrapDialog.confirm({
+      closable: true,
+      title: '',
+      message: 'Run all paragraphs?',
+      callback: function(result) {
+        if (result) {
+          const paragraphs = $scope.note.paragraphs.map(p => {
+            return {
+              id: p.id,
+              title: p.title,
+              paragraph: p.text,
+              config: p.config,
+              params: p.settings.params
+            };
+          });
+          websocketMsgSrv.runAllParagraphs(noteId, paragraphs);
+        }
       }
-      $scope.editorToggled = !$scope.editorToggled;
-    };
+    });
+  };
+
+  $scope.saveNote = function() {
+    if ($scope.note && $scope.note.paragraphs) {
+      _.forEach($scope.note.paragraphs, function(par) {
+        angular
+          .element('#' + par.id + '_paragraphColumn_main')
+          .scope()
+          .saveParagraph(par);
+      });
+      $scope.isNoteDirty = null;
+    }
+  };
 
-    $scope.showAllEditor = function() {
-      $scope.$broadcast('openEditor');
-    };
+  $scope.clearAllParagraphOutput = function(noteId) {
+    noteActionSrv.clearAllParagraphOutput(noteId);
+  };
 
-    $scope.hideAllEditor = function() {
+  $scope.toggleAllEditor = function() {
+    if ($scope.editorToggled) {
+      $scope.$broadcast('openEditor');
+    } else {
       $scope.$broadcast('closeEditor');
-    };
+    }
+    $scope.editorToggled = !$scope.editorToggled;
+  };
 
-    $scope.toggleAllTable = function() {
-      if ($scope.tableToggled) {
-        $scope.$broadcast('openTable');
-      } else {
-        $scope.$broadcast('closeTable');
-      }
-      $scope.tableToggled = !$scope.tableToggled;
-    };
+  $scope.showAllEditor = function() {
+    $scope.$broadcast('openEditor');
+  };
 
-    $scope.showAllTable = function() {
-      $scope.$broadcast('openTable');
-    };
+  $scope.hideAllEditor = function() {
+    $scope.$broadcast('closeEditor');
+  };
 
-    $scope.hideAllTable = function() {
+  $scope.toggleAllTable = function() {
+    if ($scope.tableToggled) {
+      $scope.$broadcast('openTable');
+    } else {
       $scope.$broadcast('closeTable');
-    };
-
-    $scope.isNoteRunning = function() {
-      var running = false;
-      if (!$scope.note) { return false; }
-      for (var i = 0; i < $scope.note.paragraphs.length; i++) {
-        if ($scope.note.paragraphs[i].status === 'PENDING' || $scope.note.paragraphs[i].status === 'RUNNING') {
-          running = true;
-          break;
-        }
-      }
-      return running;
-    };
+    }
+    $scope.tableToggled = !$scope.tableToggled;
+  };
 
-    $scope.killSaveTimer = function() {
-      if ($scope.saveTimer) {
-        $timeout.cancel($scope.saveTimer);
-        $scope.saveTimer = null;
-      }
-    };
-
-    $scope.startSaveTimer = function() {
-      $scope.killSaveTimer();
-      $scope.isNoteDirty = true;
-      //console.log('startSaveTimer called ' + $scope.note.id);
-      $scope.saveTimer = $timeout(function() {
-        $scope.saveNote();
-      }, 10000);
-    };
-
-    angular.element(window).on('beforeunload', function(e) {
-      $scope.killSaveTimer();
-      $scope.saveNote();
-    });
+  $scope.showAllTable = function() {
+    $scope.$broadcast('openTable');
+  };
 
-    $scope.setLookAndFeel = function(looknfeel) {
-      $scope.note.config.looknfeel = looknfeel;
-      if ($scope.revisionView === true) {
-        $rootScope.$broadcast('setLookAndFeel', $scope.note.config.looknfeel);
-      } else {
-        $scope.setConfig();
+  $scope.hideAllTable = function() {
+    $scope.$broadcast('closeTable');
+  };
+
+  $scope.isNoteRunning = function() {
+    var running = false;
+    if (!$scope.note) { return false; }
+    for (var i = 0; i < $scope.note.paragraphs.length; i++) {
+      if ($scope.note.paragraphs[i].status === 'PENDING' || $scope.note.paragraphs[i].status === 'RUNNING') {
+        running = true;
+        break;
       }
-    };
+    }
+    return running;
+  };
 
-    /** Set cron expression for this note **/
-    $scope.setCronScheduler = function(cronExpr) {
-      $scope.note.config.cron = cronExpr;
-      $scope.setConfig();
-    };
+  $scope.killSaveTimer = function() {
+    if ($scope.saveTimer) {
+      $timeout.cancel($scope.saveTimer);
+      $scope.saveTimer = null;
+    }
+  };
 
-    /** Set the username of the user to be used to execute all notes in notebook **/
-    $scope.setCronExecutingUser = function(cronExecutingUser) {
-      $scope.note.config.cronExecutingUser = cronExecutingUser;
-      $scope.setConfig();
-    };
+  $scope.startSaveTimer = function() {
+    $scope.killSaveTimer();
+    $scope.isNoteDirty = true;
+    //console.log('startSaveTimer called ' + $scope.note.id);
+    $scope.saveTimer = $timeout(function() {
+      $scope.saveNote();
+    }, 10000);
+  };
 
-    /** Set release resource for this note **/
-    $scope.setReleaseResource = function(value) {
-      $scope.note.config.releaseresource = value;
-      $scope.setConfig();
-    };
+  angular.element(window).on('beforeunload', function(e) {
+    $scope.killSaveTimer();
+    $scope.saveNote();
+  });
 
-    /** Update note config **/
-    $scope.setConfig = function(config) {
-      if (config) {
-        $scope.note.config = config;
-      }
+  $scope.setLookAndFeel = function(looknfeel) {
+    $scope.note.config.looknfeel = looknfeel;
+    if ($scope.revisionView === true) {
+      $rootScope.$broadcast('setLookAndFeel', $scope.note.config.looknfeel);
+    } else {
+      $scope.setConfig();
+    }
+  };
+
+  /** Set cron expression for this note **/
+  $scope.setCronScheduler = function(cronExpr) {
+    $scope.note.config.cron = cronExpr;
+    $scope.setConfig();
+  };
+
+  /** Set the username of the user to be used to execute all notes in notebook **/
+  $scope.setCronExecutingUser = function(cronExecutingUser) {
+    $scope.note.config.cronExecutingUser = cronExecutingUser;
+    $scope.setConfig();
+  };
+
+  /** Set release resource for this note **/
+  $scope.setReleaseResource = function(value) {
+    $scope.note.config.releaseresource = value;
+    $scope.setConfig();
+  };
+
+  /** Update note config **/
+  $scope.setConfig = function(config) {
+    if (config) {
+      $scope.note.config = config;
+    }
+    websocketMsgSrv.updateNote($scope.note.id, $scope.note.name, $scope.note.config);
+  };
+
+  /** Update the note name */
+  $scope.updateNoteName = function(newName) {
+    const trimmedNewName = newName.trim();
+    if (trimmedNewName.length > 0 && $scope.note.name !== trimmedNewName) {
+      $scope.note.name = trimmedNewName;
       websocketMsgSrv.updateNote($scope.note.id, $scope.note.name, $scope.note.config);
-    };
-
-    /** Update the note name */
-    $scope.updateNoteName = function(newName) {
-      const trimmedNewName = newName.trim();
-      if (trimmedNewName.length > 0 && $scope.note.name !== trimmedNewName) {
-        $scope.note.name = trimmedNewName;
-        websocketMsgSrv.updateNote($scope.note.id, $scope.note.name, $scope.note.config);
-      }
-    };
+    }
+  };
 
-    var initializeLookAndFeel = function() {
-      if (!$scope.note.config.looknfeel) {
-        $scope.note.config.looknfeel = 'default';
-      } else {
-        $scope.viewOnly = $scope.note.config.looknfeel === 'report' ? true : false;
-      }
+  var initializeLookAndFeel = function() {
+    if (!$scope.note.config.looknfeel) {
+      $scope.note.config.looknfeel = 'default';
+    } else {
+      $scope.viewOnly = $scope.note.config.looknfeel === 'report' ? true : false;
+    }
 
-      if ($scope.note.paragraphs && $scope.note.paragraphs[0]) {
-        $scope.note.paragraphs[0].focus = true;
-      }
-      $rootScope.$broadcast('setLookAndFeel', $scope.note.config.looknfeel);
-    };
-
-    var cleanParagraphExcept = function(paragraphId, note) {
-      var noteCopy = {};
-      noteCopy.id = note.id;
-      noteCopy.name = note.name;
-      noteCopy.config = note.config;
-      noteCopy.info = note.info;
-      noteCopy.paragraphs = [];
-      for (var i = 0; i < note.paragraphs.length; i++) {
-        if (note.paragraphs[i].id === paragraphId) {
-          noteCopy.paragraphs[0] = note.paragraphs[i];
-          if (!noteCopy.paragraphs[0].config) {
-            noteCopy.paragraphs[0].config = {};
-          }
-          noteCopy.paragraphs[0].config.editorHide = true;
-          noteCopy.paragraphs[0].config.tableHide = false;
-          break;
+    if ($scope.note.paragraphs && $scope.note.paragraphs[0]) {
+      $scope.note.paragraphs[0].focus = true;
+    }
+    $rootScope.$broadcast('setLookAndFeel', $scope.note.config.looknfeel);
+  };
+
+  var cleanParagraphExcept = function(paragraphId, note) {
+    var noteCopy = {};
+    noteCopy.id = note.id;
+    noteCopy.name = note.name;
+    noteCopy.config = note.config;
+    noteCopy.info = note.info;
+    noteCopy.paragraphs = [];
+    for (var i = 0; i < note.paragraphs.length; i++) {
+      if (note.paragraphs[i].id === paragraphId) {
+        noteCopy.paragraphs[0] = note.paragraphs[i];
+        if (!noteCopy.paragraphs[0].config) {
+          noteCopy.paragraphs[0].config = {};
         }
+        noteCopy.paragraphs[0].config.editorHide = true;
+        noteCopy.paragraphs[0].config.tableHide = false;
+        break;
       }
-      return noteCopy;
-    };
-
-    var addPara = function(paragraph, index) {
-      $scope.note.paragraphs.splice(index, 0, paragraph);
-      _.each($scope.note.paragraphs, function(para) {
-        if (para.id === paragraph.id) {
-          para.focus = true;
-          $scope.$broadcast('focusParagraph', para.id, 0, false);
-        }
-      });
-    };
-
-    var removePara = function(paragraphId) {
-      var removeIdx;
-      _.each($scope.note.paragraphs, function(para, idx) {
-        if (para.id === paragraphId) {
-          removeIdx = idx;
-        }
-      });
-      return $scope.note.paragraphs.splice(removeIdx, 1);
-    };
-
-    $scope.$on('addParagraph', function(event, paragraph, index) {
-      addPara(paragraph, index);
-    });
-
-    $scope.$on('removeParagraph', function(event, paragraphId) {
-      removePara(paragraphId);
-    });
+    }
+    return noteCopy;
+  };
 
-    $scope.$on('moveParagraph', function(event, paragraphId, newIdx) {
-      var removedPara = removePara(paragraphId);
-      if (removedPara && removedPara.length === 1) {
-        addPara(removedPara[0], newIdx);
+  var addPara = function(paragraph, index) {
+    $scope.note.paragraphs.splice(index, 0, paragraph);
+    _.each($scope.note.paragraphs, function(para) {
+      if (para.id === paragraph.id) {
+        para.focus = true;
+        $scope.$broadcast('focusParagraph', para.id, 0, false);
       }
     });
+  };
 
-    $scope.$on('updateNote', function(event, name, config, info) {
-      /** update Note name */
-      if (name !== $scope.note.name) {
-        console.log('change note name to : %o', $scope.note.name);
-        $scope.note.name = name;
+  var removePara = function(paragraphId) {
+    var removeIdx;
+    _.each($scope.note.paragraphs, function(para, idx) {
+      if (para.id === paragraphId) {
+        removeIdx = idx;
       }
-      $scope.note.config = config;
-      $scope.note.info = info;
-      initializeLookAndFeel();
     });
+    return $scope.note.paragraphs.splice(removeIdx, 1);
+  };
 
-    var getInterpreterBindings = function() {
-      websocketMsgSrv.getInterpreterBindings($scope.note.id);
-    };
+  $scope.$on('addParagraph', function(event, paragraph, index) {
+    addPara(paragraph, index);
+  });
 
-    $scope.$on('interpreterBindings', function(event, data) {
-      $scope.interpreterBindings = data.interpreterBindings;
-      $scope.interpreterBindingsOrig = angular.copy($scope.interpreterBindings); // to check dirty
+  $scope.$on('removeParagraph', function(event, paragraphId) {
+    removePara(paragraphId);
+  });
 
-      var selected = false;
-      var key;
-      var setting;
+  $scope.$on('moveParagraph', function(event, paragraphId, newIdx) {
+    var removedPara = removePara(paragraphId);
+    if (removedPara && removedPara.length === 1) {
+      addPara(removedPara[0], newIdx);
+    }
+  });
 
-      for (key in $scope.interpreterBindings) {
-        setting = $scope.interpreterBindings[key];
-        if (setting.selected) {
-          selected = true;
-          break;
-        }
-      }
+  $scope.$on('updateNote', function(event, name, config, info) {
+    /** update Note name */
+    if (name !== $scope.note.name) {
+      console.log('change note name to : %o', $scope.note.name);
+      $scope.note.name = name;
+    }
+    $scope.note.config = config;
+    $scope.note.info = info;
+    initializeLookAndFeel();
+  });
 
-      if (!selected) {
-        // make default selection
-        var selectedIntp = {};
-        for (key in $scope.interpreterBindings) {
-          setting = $scope.interpreterBindings[key];
-          if (!selectedIntp[setting.name]) {
-            setting.selected = true;
-            selectedIntp[setting.name] = true;
-          }
-        }
-        $scope.showSetting = true;
-      }
-    });
+  var getInterpreterBindings = function() {
+    websocketMsgSrv.getInterpreterBindings($scope.note.id);
+  };
 
-    $scope.interpreterSelectionListeners = {
-      accept: function(sourceItemHandleScope, destSortableScope) {return true;},
-      itemMoved: function(event) {},
-      orderChanged: function(event) {}
-    };
+  $scope.$on('interpreterBindings', function(event, data) {
+    $scope.interpreterBindings = data.interpreterBindings;
+    $scope.interpreterBindingsOrig = angular.copy($scope.interpreterBindings); // to check dirty
 
-    $scope.openSetting = function() {
-      $scope.showSetting = true;
-      getInterpreterBindings();
-    };
+    var selected = false;
+    var key;
+    var setting;
 
-    $scope.closeSetting = function() {
-      if (isSettingDirty()) {
-        BootstrapDialog.confirm({
-          closable: true,
-          title: '',
-          message: 'Interpreter setting changes will be discarded.',
-          callback: function(result) {
-            if (result) {
-              $scope.$apply(function() {
-                $scope.showSetting = false;
-              });
-            }
-          }
-        });
-      } else {
-        $scope.showSetting = false;
+    for (key in $scope.interpreterBindings) {
+      setting = $scope.interpreterBindings[key];
+      if (setting.selected) {
+        selected = true;
+        break;
       }
-    };
-
-    $scope.saveSetting = function() {
-      var selectedSettingIds = [];
-      for (var no in $scope.interpreterBindings) {
-        var setting = $scope.interpreterBindings[no];
-        if (setting.selected) {
-          selectedSettingIds.push(setting.id);
+    }
+
+    if (!selected) {
+      // make default selection
+      var selectedIntp = {};
+      for (key in $scope.interpreterBindings) {
+        setting = $scope.interpreterBindings[key];
+        if (!selectedIntp[setting.name]) {
+          setting.selected = true;
+          selectedIntp[setting.name] = true;
         }
       }
-      websocketMsgSrv.saveInterpreterBindings($scope.note.id, selectedSettingIds);
-      console.log('Interpreter bindings %o saved', selectedSettingIds);
+      $scope.showSetting = true;
+    }
+  });
+
+  $scope.interpreterSelectionListeners = {
+    accept: function(sourceItemHandleScope, destSortableScope) {return true;},
+    itemMoved: function(event) {},
+    orderChanged: function(event) {}
+  };
+
+  $scope.openSetting = function() {
+    $scope.showSetting = true;
+    getInterpreterBindings();
+  };
 
-      _.forEach($scope.note.paragraphs, function(n, key) {
-        var regExp = /^\s*%/g;
-        if (n.text && !regExp.exec(n.text)) {
-          $scope.$broadcast('saveInterpreterBindings', n.id);
+  $scope.closeSetting = function() {
+    if (isSettingDirty()) {
+      BootstrapDialog.confirm({
+        closable: true,
+        title: '',
+        message: 'Interpreter setting changes will be discarded.',
+        callback: function(result) {
+          if (result) {
+            $scope.$apply(function() {
+              $scope.showSetting = false;
+            });
+          }
         }
       });
-
+    } else {
       $scope.showSetting = false;
-    };
+    }
+  };
 
-    $scope.toggleSetting = function() {
-      if ($scope.showSetting) {
-        $scope.closeSetting();
-      } else {
-        $scope.openSetting();
-        $scope.closePermissions();
+  $scope.saveSetting = function() {
+    var selectedSettingIds = [];
+    for (var no in $scope.interpreterBindings) {
+      var setting = $scope.interpreterBindings[no];
+      if (setting.selected) {
+        selectedSettingIds.push(setting.id);
       }
-    };
-
-    var getPermissions = function(callback) {
-      $http.get(baseUrlSrv.getRestApiBase() + '/notebook/' + $scope.note.id + '/permissions').
-      success(function(data, status, headers, config) {
-        $scope.permissions = data.body;
-        $scope.permissionsOrig = angular.copy($scope.permissions); // to check dirty
-
-        var selectJson = {
-          tokenSeparators: [',', ' '],
-          ajax: {
-            url: function(params) {
-              if (!params.term) {
-                return false;
-              }
-              return baseUrlSrv.getRestApiBase() + '/security/userlist/' + params.term;
-            },
-            delay: 250,
-            processResults: function(data, params) {
-              var results = [];
-
-              if (data.body.users.length !== 0) {
-                var users = [];
-                for (var len = 0; len < data.body.users.length; len++) {
-                  users.push({
-                    'id': data.body.users[len],
-                    'text': data.body.users[len]
-                  });
-                }
-                results.push({
-                  'text': 'Users :',
-                  'children': users
+    }
+    websocketMsgSrv.saveInterpreterBindings($scope.note.id, selectedSettingIds);
+    console.log('Interpreter bindings %o saved', selectedSettingIds);
+
+    _.forEach($scope.note.paragraphs, function(n, key) {
+      var regExp = /^\s*%/g;
+      if (n.text && !regExp.exec(n.text)) {
+        $scope.$broadcast('saveInterpreterBindings', n.id);
+      }
+    });
+
+    $scope.showSetting = false;
+  };
+
+  $scope.toggleSetting = function() {
+    if ($scope.showSetting) {
+      $scope.closeSetting();
+    } else {
+      $scope.openSetting();
+      $scope.closePermissions();
+    }
+  };
+
+  var getPermissions = function(callback) {
+    $http.get(baseUrlSrv.getRestApiBase() + '/notebook/' + $scope.note.id + '/permissions').
+    success(function(data, status, headers, config) {
+      $scope.permissions = data.body;
+      $scope.permissionsOrig = angular.copy($scope.permissions); // to check dirty
+
+      var selectJson = {
+        tokenSeparators: [',', ' '],
+        ajax: {
+          url: function(params) {
+            if (!params.term) {
+              return false;
+            }
+            return baseUrlSrv.getRestApiBase() + '/security/userlist/' + params.term;
+          },
+          delay: 250,
+          processResults: function(data, params) {
+            var results = [];
+
+            if (data.body.users.length !== 0) {
+              var users = [];
+              for (var len = 0; len < data.body.users.length; len++) {
+                users.push({
+                  'id': data.body.users[len],
+                  'text': data.body.users[len]
                 });
               }
-              if (data.body.roles.length !== 0) {
-                var roles = [];
-                for (var len = 0; len < data.body.roles.length; len++) {
-                  roles.push({
-                    'id': data.body.roles[len],
-                    'text': data.body.roles[len]
-                  });
-                }
-                results.push({
-                  'text': 'Roles :',
-                  'children': roles
+              results.push({
+                'text': 'Users :',
+                'children': users
+              });
+            }
+            if (data.body.roles.length !== 0) {
+              var roles = [];
+              for (var len = 0; len < data.body.roles.length; len++) {
+                roles.push({
+                  'id': data.body.roles[len],
+                  'text': data.body.roles[len]
                 });
               }
-              return {
-                results: results,
-                pagination: {
-                  more: false
-                }
-              };
-            },
-            cache: false
-          },
-          width: ' ',
-          tags: true,
-          minimumInputLength: 3
-        };
-
-        $scope.setIamOwner();
-        angular.element('#selectOwners').select2(selectJson);
-        angular.element('#selectReaders').select2(selectJson);
-        angular.element('#selectWriters').select2(selectJson);
-        if (callback) {
-          callback();
-        }
-      }).
-      error(function(data, status, headers, config) {
-        if (status !== 0) {
-          console.log('Error %o %o', status, data.message);
-        }
-      });
-    };
-
-    $scope.openPermissions = function() {
-      $scope.showPermissions = true;
-      getPermissions();
-    };
-
-    $scope.closePermissions = function() {
-      if (isPermissionsDirty()) {
-        BootstrapDialog.confirm({
-          closable: true,
-          title: '',
-          message: 'Changes will be discarded.',
-          callback: function(result) {
-            if (result) {
-              $scope.$apply(function() {
-                $scope.showPermissions = false;
+              results.push({
+                'text': 'Roles :',
+                'children': roles
               });
             }
-          }
-        });
-      } else {
-        $scope.showPermissions = false;
+            return {
+              results: results,
+              pagination: {
+                more: false
+              }
+            };
+          },
+          cache: false
+        },
+        width: ' ',
+        tags: true,
+        minimumInputLength: 3
+      };
+
+      $scope.setIamOwner();
+      angular.element('#selectOwners').select2(selectJson);
+      angular.element('#selectReaders').select2(selectJson);
+      angular.element('#selectWriters').select2(selectJson);
+      if (callback) {
+        callback();
+      }
+    }).
+    error(function(data, status, headers, config) {
+      if (status !== 0) {
+        console.log('Error %o %o', status, data.message);
       }
-    };
+    });
+  };
 
-    function convertPermissionsToArray() {
-      $scope.permissions.owners = angular.element('#selectOwners').val();
-      $scope.permissions.readers = angular.element('#selectReaders').val();
-      $scope.permissions.writers = angular.element('#selectWriters').val();
-    }
+  $scope.openPermissions = function() {
+    $scope.showPermissions = true;
+    getPermissions();
+  };
 
-    $scope.restartInterpreter = function(interpeter) {
-      var thisConfirm = BootstrapDialog.confirm({
-        closable: false,
-        closeByBackdrop: false,
-        closeByKeyboard: false,
+  $scope.closePermissions = function() {
+    if (isPermissionsDirty()) {
+      BootstrapDialog.confirm({
+        closable: true,
         title: '',
-        message: 'Do you want to restart ' + interpeter.name + ' interpreter?',
+        message: 'Changes will be discarded.',
         callback: function(result) {
           if (result) {
-            var payload  = {
-              'noteId': $scope.note.id
-            };
+            $scope.$apply(function() {
+              $scope.showPermissions = false;
+            });
+          }
+        }
+      });
+    } else {
+      $scope.showPermissions = false;
+    }
+  };
 
-            thisConfirm.$modalFooter.find('button').addClass('disabled');
-            thisConfirm.$modalFooter.find('button:contains("OK")')
-              .html('<i class="fa fa-circle-o-notch fa-spin"></i> Saving Setting');
+  function convertPermissionsToArray() {
+    $scope.permissions.owners = angular.element('#selectOwners').val();
+    $scope.permissions.readers = angular.element('#selectReaders').val();
+    $scope.permissions.writers = angular.element('#selectWriters').val();
+  }
 
-            $http.put(baseUrlSrv.getRestApiBase() + '/interpreter/setting/restart/' + interpeter.id, payload)
-              .success(function(data, status, headers, config) {
+  $scope.restartInterpreter = function(interpeter) {
+    var thisConfirm = BootstrapDialog.confirm({
+      closable: false,
+      closeByBackdrop: false,
+      closeByKeyboard: false,
+      title: '',
+      message: 'Do you want to restart ' + interpeter.name + ' interpreter?',
+      callback: function(result) {
+        if (result) {
+          var payload  = {
+            'noteId': $scope.note.id
+          };
+
+          thisConfirm.$modalFooter.find('button').addClass('disabled');
+          thisConfirm.$modalFooter.find('button:contains("OK")')
+            .html('<i class="fa fa-circle-o-notch fa-spin"></i> Saving Setting');
+
+          $http.put(baseUrlSrv.getRestApiBase() + '/interpreter/setting/restart/' + interpeter.id, payload)
+            .success(function(data, status, headers, config) {
               var index = _.findIndex($scope.interpreterSettings, {'id': interpeter.id});
               $scope.interpreterSettings[index] = data.body;
               thisConfirm.close();
             }).error(function(data, status, headers, config) {
-              thisConfirm.close();
-              console.log('Error %o %o', status, data.message);
-              BootstrapDialog.show({
-                title: 'Error restart interpreter.',
-                message: data.message
-              });
-            });
-            return false;
-          }
-        }
-      });
-    };
-
-    $scope.savePermissions = function() {
-      convertPermissionsToArray();
-      $http.put(baseUrlSrv.getRestApiBase() + '/notebook/' + $scope.note.id + '/permissions',
-        $scope.permissions, {withCredentials: true}).
-        success(function(data, status, headers, config) {
-          getPermissions(function() {
-            console.log('Note permissions %o saved', $scope.permissions);
-            BootstrapDialog.alert({
-              closable: true,
-              title: 'Permissions Saved Successfully!!!',
-              message: 'Owners : ' + $scope.permissions.owners + '\n\n' + 'Readers : ' +
-              $scope.permissions.readers + '\n\n' + 'Writers  : ' + $scope.permissions.writers
+            thisConfirm.close();
+            console.log('Error %o %o', status, data.message);
+            BootstrapDialog.show({
+              title: 'Error restart interpreter.',
+              message: data.message
             });
-            $scope.showPermissions = false;
-          });
-        }).
-        error(function(data, status, headers, config) {
-          console.log('Error %o %o', status, data.message);
-          BootstrapDialog.show({
-            closable: false,
-            closeByBackdrop: false,
-            closeByKeyboard: false,
-            title: 'Insufficient privileges',
-            message: data.message,
-            buttons: [
-              {
-                label: 'Login',
-                action: function(dialog) {
-                  dialog.close();
-                  angular.element('#loginModal').modal({
-                    show: 'true'
-                  });
-                }
-              },
-              {
-                label: 'Cancel',
-                action: function(dialog) {
-                  dialog.close();
-                  $location.path('/');
-                }
-              }
-            ]
           });
-        });
-    };
-
-    $scope.togglePermissions = function() {
-      var principal = $rootScope.ticket.principal;
-      $scope.isAnonymous = principal === 'anonymous' ? true : false;
-      if (!!principal && $scope.isAnonymous) {
-        $scope.blockAnonUsers();
-      } else {
-        if ($scope.showPermissions) {
-          $scope.closePermissions();
-          angular.element('#selectOwners').select2({});
-          angular.element('#selectReaders').select2({});
-          angular.element('#selectWriters').select2({});
-        } else {
-          $scope.openPermissions();
-          $scope.closeSetting();
+          return false;
         }
       }
-    };
-
-    $scope.setIamOwner = function() {
-      if ($scope.permissions.owners.length > 0 &&
-          _.indexOf($scope.permissions.owners, $rootScope.ticket.principal) < 0) {
-        $scope.isOwner = false;
-        return false;
-      }
-      $scope.isOwner = true;
-      return true;
-    };
-
-    $scope.toggleNotePersonalizedMode = function() {
-      var personalizedMode = $scope.note.config.personalizedMode;
-      if ($scope.isOwner) {
-        BootstrapDialog.confirm({
+    });
+  };
+
+  $scope.savePermissions = function() {
+    convertPermissionsToArray();
+    $http.put(baseUrlSrv.getRestApiBase() + '/notebook/' + $scope.note.id + '/permissions',
+      $scope.permissions, {withCredentials: true}).
+    success(function(data, status, headers, config) {
+      getPermissions(function() {
+        console.log('Note permissions %o saved', $scope.permissions);
+        BootstrapDialog.alert({
           closable: true,
-          title: 'Setting the result display',
-          message: function(dialog) {
-            var modeText = $scope.note.config.personalizedMode === 'true' ? 'collaborate' : 'personalize';
-            return 'Do you want to <span class="text-info">' + modeText + '</span> your analysis?';
+          title: 'Permissions Saved Successfully!!!',
+          message: 'Owners : ' + $scope.permissions.owners + '\n\n' + 'Readers : ' +
+          $scope.permissions.readers + '\n\n' + 'Writers  : ' + $scope.permissions.writers
+        });
+        $scope.showPermissions = false;
+      });
+    }).
+    error(function(data, status, headers, config) {
+      console.log('Error %o %o', status, data.message);
+      BootstrapDialog.show({
+        closable: false,
+        closeByBackdrop: false,
+        closeByKeyboard: false,
+        title: 'Insufficient privileges',
+        message: data.message,
+        buttons: [
+          {
+            label: 'Login',
+            action: function(dialog) {
+              dialog.close();
+              angular.element('#loginModal').modal({
+                show: 'true'
+              });
+            }
           },
-          callback: function(result) {
-            if (result) {
-              if ($scope.note.config.personalizedMode === undefined) {
-                $scope.note.config.personalizedMode = 'false';
-              }
-              $scope.note.config.personalizedMode = personalizedMode === 'true' ?  'false' : 'true';
-              websocketMsgSrv.updatePersonalizedMode($scope.note.id, $scope.note.config.personalizedMode);
+          {
+            label: 'Cancel',
+            action: function(dialog) {
+              dialog.close();
+              $location.path('/');
             }
           }
-        });
-      }
-    };
-
-    var isSettingDirty = function() {
-      if (angular.equals($scope.interpreterBindings, $scope.interpreterBindingsOrig)) {
-        return false;
+        ]
+      });
+    });
+  };
+
+  $scope.togglePermissions = function() {
+    var principal = $rootScope.ticket.principal;
+    $scope.isAnonymous = principal === 'anonymous' ? true : false;
+    if (!!principal && $scope.isAnonymous) {
+      $scope.blockAnonUsers();
+    } else {
+      if ($scope.showPermissions) {
+        $scope.closePermissions();
+        angular.element('#selectOwners').select2({});
+        angular.element('#selectReaders').select2({});
+        angular.element('#selectWriters').select2({});
       } else {
-        return true;
+        $scope.openPermissions();
+        $scope.closeSetting();
       }
-    };
+    }
+  };
 
-    var isPermissionsDirty = function() {
-      if (angular.equals($scope.permissions, $scope.permissionsOrig)) {
-        return false;
-      } else {
-        return true;
-      }
-    };
+  $scope.setIamOwner = function() {
+    if ($scope.permissions.owners.length > 0 &&
+      _.indexOf($scope.permissions.owners, $rootScope.ticket.principal) < 0) {
+      $scope.isOwner = false;
+      return false;
+    }
+    $scope.isOwner = true;
+    return true;
+  };
 
-    angular.element(document).click(function() {
-      angular.element('.ace_autocomplete').hide();
-    });
+  $scope.toggleNotePersonalizedMode = function() {
+    var personalizedMode = $scope.note.config.personalizedMode;
+    if ($scope.isOwner) {
+      BootstrapDialog.confirm({
+        closable: true,
+        title: 'Setting the result display',
+        message: function(dialog) {
+          var modeText = $scope.note.config.personalizedMode === 'true' ? 'collaborate' : 'personalize';
+          return 'Do you want to <span class="text-info">' + modeText + '</span> your analysis?';
+        },
+        callback: function(result) {
+          if (result) {
+            if ($scope.note.config.personalizedMode === undefined) {
+              $scope.note.config.personalizedMode = 'false';
+            }
+            $scope.note.config.personalizedMode = personalizedMode === 'true' ?  'false' : 'true';
+            websocketMsgSrv.updatePersonalizedMode($scope.note.id, $scope.note.config.personalizedMode);
+          }
+        }
+      });
+    }
+  };
 
-    /*
-    ** $scope.$on functions below
-    */
+  var isSettingDirty = function() {
+    if (angular.equals($scope.interpreterBindings, $scope.interpreterBindingsOrig)) {
+      return false;
+    } else {
+      return true;
+    }
+  };
 
-    $scope.$on('setConnectedStatus', function(event, param) {
-      if (connectedOnce && param) {
-        initNotebook();
-      }
-      connectedOnce = true;
-    });
+  var isPermissionsDirty = function() {
+    if (angular.equals($scope.permissions, $scope.permissionsOrig)) {
+      return false;
+    } else {
+      return true;
+    }
+  };
 
-    $scope.$on('moveParagraphUp', function(event, paragraph) {
-      var newIndex = -1;
-      for (var i = 0; i < $scope.note.paragraphs.length; i++) {
-        if ($scope.note.paragraphs[i].id === paragraph.id) {
-          newIndex = i - 1;
-          break;
-        }
-      }
-      if (newIndex < 0 || newIndex >= $scope.note.paragraphs.length) {
-        return;
-      }
-      // save dirtyText of moving paragraphs.
-      var prevParagraph = $scope.note.paragraphs[newIndex];
-      angular
-        .element('#' + paragraph.id + '_paragraphColumn_main')
-        .scope()
-        .saveParagraph(paragraph);
-      angular
-        .element('#' + prevParagraph.id + '_paragraphColumn_main')
-        .scope()
-        .saveParagraph(prevParagraph);
-      websocketMsgSrv.moveParagraph(paragraph.id, newIndex);
-    });
+  angular.element(document).click(function() {
+    angular.element('.ace_autocomplete').hide();
+  });
 
-    $scope.$on('moveParagraphDown', function(event, paragraph) {
-      var newIndex = -1;
-      for (var i = 0; i < $scope.note.paragraphs.length; i++) {
-        if ($scope.note.paragraphs[i].id === paragraph.id) {
-          newIndex = i + 1;
-          break;
-        }
-      }
+  /*
+   ** $scope.$on functions below
+   */
 
-      if (newIndex < 0 || newIndex >= $scope.note.paragraphs.length) {
-        return;
-      }
-      // save dirtyText of moving paragraphs.
-      var nextParagraph = $scope.note.paragraphs[newIndex];
-      angular
-        .element('#' + paragraph.id + '_paragraphColumn_main')
-        .scope()
-        .saveParagraph(paragraph);
-      angular
-        .element('#' + nextParagraph.id + '_paragraphColumn_main')
-        .scope()
-        .saveParagraph(nextParagraph);
-      websocketMsgSrv.moveParagraph(paragraph.id, newIndex);
-    });
+  $scope.$on('setConnectedStatus', function(event, param) {
+    if (connectedOnce && param) {
+      initNotebook();
+    }
+    connectedOnce = true;
+  });
 
-    $scope.$on('moveFocusToPreviousParagraph', function(event, currentParagraphId) {
-      var focus = false;
-      for (var i = $scope.note.paragraphs.length - 1; i >= 0; i--) {
-        if (focus === false) {
-          if ($scope.note.paragraphs[i].id === currentParagraphId) {
-            focus = true;
-            continue;
-          }
-        } else {
-          $scope.$broadcast('focusParagraph', $scope.note.paragraphs[i].id, -1);
-          break;
-        }
+  $scope.$on('moveParagraphUp', function(event, paragraph) {
+    var newIndex = -1;
+    for (var i = 0; i < $scope.note.paragraphs.length; i++) {
+      if ($scope.note.paragraphs[i].id === paragraph.id) {
+        newIndex = i - 1;
+        break;
       }
-    });
-
-    $scope.$on('moveFocusToNextParagraph', function(event, currentParagraphId) {
-      var focus = false;
-      for (var i = 0; i < $scope.note.paragraphs.length; i++) {
-        if (focus === false) {
-          if ($scope.note.paragraphs[i].id === currentParagraphId) {
-            focus = true;
-            continue;
-          }
-        } else {
-          $scope.$broadcast('focusParagraph', $scope.note.paragraphs[i].id, 0);
-          break;
-        }
+    }
+    if (newIndex < 0 || newIndex >= $scope.note.paragraphs.length) {
+      return;
+    }
+    // save dirtyText of moving paragraphs.
+    var prevParagraph = $scope.note.paragraphs[newIndex];
+    angular
+      .element('#' + paragraph.id + '_paragraphColumn_main')
+      .scope()
+      .saveParagraph(paragraph);
+    angular
+      .element('#' + prevParagraph.id + '_paragraphColumn_main')
+      .scope()
+      .saveParagraph(prevParagraph);
+    websocketMsgSrv.moveParagraph(paragraph.id, newIndex);
+  });
+
+  $scope.$on('moveParagraphDown', function(event, paragraph) {
+    var newIndex = -1;
+    for (var i = 0; i < $scope.note.paragraphs.length; i++) {
+      if ($scope.note.paragraphs[i].id === paragraph.id) {
+        newIndex = i + 1;
+        break;
       }
-    });
+    }
 
-    $scope.$on('insertParagraph', function(event, paragraphId, position) {
-      var newIndex = -1;
-      for (var i = 0; i < $scope.note.paragraphs.length; i++) {
-        if ($scope.note.paragraphs[i].id === paragraphId) {
-          //determine position of where to add new paragraph; default is below
-          if (position === 'above') {
-            newIndex = i;
-          } else {
-            newIndex = i + 1;
-          }
-          break;
+    if (newIndex < 0 || newIndex >= $scope.note.paragraphs.length) {
+      return;
+    }
+    // save dirtyText of moving paragraphs.
+    var nextParagraph = $scope.note.paragraphs[newIndex];
+    angular
+      .element('#' + paragraph.id + '_paragraphColumn_main')
+      .scope()
+      .saveParagraph(paragraph);
+    angular
+      .element('#' + nextParagraph.id + '_paragraphColumn_main')
+      .scope()
+      .saveParagraph(nextParagraph);
+    websocketMsgSrv.moveParagraph(paragraph.id, newIndex);
+  });
+
+  $scope.$on('moveFocusToPreviousParagraph', function(event, currentParagraphId) {
+    var focus = false;
+    for (var i = $scope.note.paragraphs.length - 1; i >= 0; i--) {
+      if (focus === false) {
+        if ($scope.note.paragraphs[i].id === currentParagraphId) {
+          focus = true;
+          continue;
         }
+      } else {
+        $scope.$broadcast('focusParagraph', $scope.note.paragraphs[i].id, -1);
+        break;
       }
-
-      if (newIndex < 0 || newIndex > $scope.note.paragraphs.length) {
-        return;
-      }
-      websocketMsgSrv.insertParagraph(newIndex);
-    });
-
-    $scope.$on('setNoteContent', function(event, note) {
-      if (note === undefined) {
-        $location.path('/');
+    }
+  });
+
+  $scope.$on('moveFocusToNextParagraph', function(event, currentParagraphId) {
+    var focus = false;
+    for (var i = 0; i < $scope.note.paragraphs.length; i++) {
+      if (focus === false) {
+        if ($scope.note.paragraphs[i].id === currentParagraphId) {
+          focus = true;
+          continue;
+        }
+      } else {
+        $scope.$broadcast('focusParagraph', $scope.note.paragraphs[i].id, 0);
+        break;
       }
-
-      $scope.paragraphUrl = $routeParams.paragraphId;
-      $scope.asIframe = $routeParams.asIframe;
-      if ($scope.paragraphUrl) {
-        note = cleanParagraphExcept($scope.paragraphUrl, note);
-        $rootScope.$broadcast('setIframe', $scope.asIframe);
+    }
+  });
+
+  $scope.$on('insertParagraph', function(event, paragraphId, position) {
+    var newIndex = -1;
+    for (var i = 0; i < $scope.note.paragraphs.length; i++) {
+      if ($scope.note.paragraphs[i].id === paragraphId) {
+        //determine position of where to add new paragraph; default is below
+        if (position === 'above') {
+          newIndex = i;
+        } else {
+          newIndex = i + 1;
+        }
+        break;
       }
+    }
 
-      $scope.note = note;
-      initializeLookAndFeel();
-      //open interpreter binding setting when there're none selected
-      getInterpreterBindings();
-      getPermissions();
-      var isPersonalized = $scope.note.config.personalizedMode;
-      isPersonalized = isPersonalized === undefined ?  'false' : isPersonalized;
-      $scope.note.config.personalizedMode = isPersonalized;
-    });
+    if (newIndex < 0 || newIndex > $scope.note.paragraphs.length) {
+      return;
+    }
+    websocketMsgSrv.insertParagraph(newIndex);
+  });
 
-    $scope.$on('$destroy', function() {
-      angular.element(window).off('beforeunload');
-      $scope.killSaveTimer();
-      $scope.saveNote();
+  $scope.$on('setNoteContent', function(event, note) {
+    if (note === undefined) {
+      $location.path('/');
+    }
 
-      document.removeEventListener('click', $scope.focusParagraphOnClick);
-      document.removeEventListener('keydown', $scope.keyboardShortcut);
-    });
+    $scope.paragraphUrl = $routeParams.paragraphId;
+    $scope.asIframe = $routeParams.asIframe;
+    if ($scope.paragraphUrl) {
+      note = cleanParagraphExcept($scope.paragraphUrl, note);
+      $rootScope.$broadcast('setIframe', $scope.asIframe);
+    }
 
-    angular.element(window).bind('resize', function() {
-      const actionbarHeight = document.getElementById('actionbar').lastElementChild.clientHeight;
-      angular.element(document.getElementById('content')).css('padding-top', actionbarHeight - 20);
-    });
-  }
+    $scope.note = note;
+    initializeLookAndFeel();
+    //open interpreter binding setting when there're none selected
+    getInterpreterBindings();
+    getPermissions();
+    var isPersonalized = $scope.note.config.personalizedMode;
+    isPersonalized = isPersonalized === undefined ?  'false' : isPersonalized;
+    $scope.note.config.personalizedMode = isPersonalized;
+  });
+
+  $scope.$on('$destroy', function() {
+    angular.element(window).off('beforeunload');
+    $scope.killSaveTimer();
+    $scope.saveNote();
+
+    document.removeEventListener('click', $scope.focusParagraphOnClick);
+    document.removeEventListener('keydown', $scope.keyboardShortcut);
+  });
+
+  angular.element(window).bind('resize', function() {
+    const actionbarHeight = document.getElementById('actionbar').lastElementChild.clientHeight;
+    angular.element(document.getElementById('content')).css('padding-top', actionbarHeight - 20);
+  });
+}
 
-})();


[3/6] zeppelin git commit: [ZEPPELIN-1927] Remove useless function wrapping in all js files

Posted by mo...@apache.org.
http://git-wip-us.apache.org/repos/asf/zeppelin/blob/4c60b27c/zeppelin-web/src/app/notebook/paragraph/result/result.controller.js
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/app/notebook/paragraph/result/result.controller.js b/zeppelin-web/src/app/notebook/paragraph/result/result.controller.js
index f494029..e793199 100644
--- a/zeppelin-web/src/app/notebook/paragraph/result/result.controller.js
+++ b/zeppelin-web/src/app/notebook/paragraph/result/result.controller.js
@@ -20,894 +20,891 @@ import AreachartVisualization from '../../../visualization/builtins/visualizatio
 import LinechartVisualization from '../../../visualization/builtins/visualization-linechart';
 import ScatterchartVisualization from '../../../visualization/builtins/visualization-scatterchart';
 
-(function() {
-
-  angular.module('zeppelinWebApp').controller('ResultCtrl', ResultCtrl);
-
-  ResultCtrl.$inject = [
-    '$scope',
-    '$rootScope',
-    '$route',
-    '$window',
-    '$routeParams',
-    '$location',
-    '$timeout',
-    '$compile',
-    '$http',
-    '$q',
-    '$templateRequest',
-    'websocketMsgSrv',
-    'baseUrlSrv',
-    'ngToast',
-    'saveAsService',
-    'noteVarShareService'
+angular.module('zeppelinWebApp').controller('ResultCtrl', ResultCtrl);
+
+ResultCtrl.$inject = [
+  '$scope',
+  '$rootScope',
+  '$route',
+  '$window',
+  '$routeParams',
+  '$location',
+  '$timeout',
+  '$compile',
+  '$http',
+  '$q',
+  '$templateRequest',
+  'websocketMsgSrv',
+  'baseUrlSrv',
+  'ngToast',
+  'saveAsService',
+  'noteVarShareService'
+];
+
+function ResultCtrl($scope, $rootScope, $route, $window, $routeParams, $location,
+                    $timeout, $compile, $http, $q, $templateRequest, websocketMsgSrv,
+                    baseUrlSrv, ngToast, saveAsService, noteVarShareService) {
+
+  /**
+   * Built-in visualizations
+   */
+  $scope.builtInTableDataVisualizationList = [
+    {
+      id: 'table',   // paragraph.config.graph.mode
+      name: 'Table', // human readable name. tooltip
+      icon: 'fa fa-table'
+    },
+    {
+      id: 'multiBarChart',
+      name: 'Bar Chart',
+      icon: 'fa fa-bar-chart',
+      transformation: 'pivot'
+    },
+    {
+      id: 'pieChart',
+      name: 'Pie Chart',
+      icon: 'fa fa-pie-chart',
+      transformation: 'pivot'
+    },
+    {
+      id: 'stackedAreaChart',
+      name: 'Area Chart',
+      icon: 'fa fa-area-chart',
+      transformation: 'pivot'
+    },
+    {
+      id: 'lineChart',
+      name: 'Line Chart',
+      icon: 'fa fa-line-chart',
+      transformation: 'pivot'
+    },
+    {
+      id: 'scatterChart',
+      name: 'Scatter Chart',
+      icon: 'cf cf-scatter-chart'
+    }
   ];
 
-  function ResultCtrl($scope, $rootScope, $route, $window, $routeParams, $location,
-                      $timeout, $compile, $http, $q, $templateRequest, websocketMsgSrv,
-                      baseUrlSrv, ngToast, saveAsService, noteVarShareService) {
+  /**
+   * Holds class and actual runtime instance and related infos of built-in visualizations
+   */
+  var builtInVisualizations = {
+    'table': {
+      class: TableVisualization,
+      instance: undefined   // created from setGraphMode()
+    },
+    'multiBarChart': {
+      class: BarchartVisualization,
+      instance: undefined
+    },
+    'pieChart': {
+      class: PiechartVisualization,
+      instance: undefined
+    },
+    'stackedAreaChart': {
+      class: AreachartVisualization,
+      instance: undefined
+    },
+    'lineChart': {
+      class: LinechartVisualization,
+      instance: undefined
+    },
+    'scatterChart': {
+      class: ScatterchartVisualization,
+      instance: undefined
+    }
+  };
 
-    /**
-     * Built-in visualizations
-     */
-    $scope.builtInTableDataVisualizationList = [
-      {
-        id: 'table',   // paragraph.config.graph.mode
-        name: 'Table', // human readable name. tooltip
-        icon: 'fa fa-table'
-      },
-      {
-        id: 'multiBarChart',
-        name: 'Bar Chart',
-        icon: 'fa fa-bar-chart',
-        transformation: 'pivot'
-      },
-      {
-        id: 'pieChart',
-        name: 'Pie Chart',
-        icon: 'fa fa-pie-chart',
-        transformation: 'pivot'
-      },
-      {
-        id: 'stackedAreaChart',
-        name: 'Area Chart',
-        icon: 'fa fa-area-chart',
-        transformation: 'pivot'
-      },
-      {
-        id: 'lineChart',
-        name: 'Line Chart',
-        icon: 'fa fa-line-chart',
-        transformation: 'pivot'
-      },
-      {
-        id: 'scatterChart',
-        name: 'Scatter Chart',
-        icon: 'cf cf-scatter-chart'
-      }
-    ];
+  // type
+  $scope.type;
 
-    /**
-     * Holds class and actual runtime instance and related infos of built-in visualizations
-     */
-    var builtInVisualizations = {
-      'table': {
-        class: TableVisualization,
-        instance: undefined   // created from setGraphMode()
-      },
-      'multiBarChart': {
-        class: BarchartVisualization,
-        instance: undefined
-      },
-      'pieChart': {
-        class: PiechartVisualization,
-        instance: undefined
-      },
-      'stackedAreaChart': {
-        class: AreachartVisualization,
-        instance: undefined
-      },
-      'lineChart': {
-        class: LinechartVisualization,
-        instance: undefined
-      },
-      'scatterChart': {
-        class: ScatterchartVisualization,
-        instance: undefined
-      }
-    };
+  // Data of the result
+  var data;
 
-    // type
-    $scope.type;
+  // config
+  $scope.config;
 
-    // Data of the result
-    var data;
+  // resultId = paragraph.id + index
+  $scope.id;
 
-    // config
-    $scope.config;
+  // referece to paragraph
+  var paragraph;
 
-    // resultId = paragraph.id + index
-    $scope.id;
+  // index of the result
+  var resultIndex;
 
-    // referece to paragraph
-    var paragraph;
+  // TableData instance
+  var tableData;
 
-    // index of the result
-    var resultIndex;
+  // available columns in tabledata
+  $scope.tableDataColumns = [];
 
-    // TableData instance
-    var tableData;
+  // enable helium
+  var enableHelium = false;
 
-    // available columns in tabledata
-    $scope.tableDataColumns = [];
+  // graphMode
+  $scope.graphMode;
 
-    // enable helium
-    var enableHelium = false;
+  // image data
+  $scope.imageData;
 
-    // graphMode
-    $scope.graphMode;
+  $scope.init = function(result, config, paragraph, index) {
+    console.log('result controller init %o %o %o', result, config, index);
+    updateData(result, config, paragraph, index);
+    renderResult($scope.type);
+  };
 
-    // image data
-    $scope.imageData;
+  $scope.$on('updateResult', function(event, result, newConfig, paragraphRef, index) {
+    if (paragraph.id !== paragraphRef.id || index !== resultIndex) {
+      return;
+    }
+    console.log('updateResult %o %o %o %o', result, newConfig, paragraphRef, index);
+    var refresh = !angular.equals(newConfig, $scope.config) ||
+      !angular.equals(result.type, $scope.type) ||
+      !angular.equals(result.data, data);
+
+    updateData(result, newConfig, paragraph, resultIndex);
+    renderResult($scope.type, refresh);
+  });
+
+  $scope.$on('appendParagraphOutput', function(event, data) {
+    /* It has been observed that append events
+     * can be errorneously called even if paragraph
+     * execution has ended, and in that case, no append
+     * should be made. Also, it was observed that between PENDING
+     * and RUNNING states, append-events can be called and we can't
+     * miss those, else during the length of paragraph run, few
+     * initial output line/s will be missing.
+     */
+    if (paragraph.id === data.paragraphId &&
+      resultIndex === data.index &&
+      (paragraph.status === 'RUNNING' || paragraph.status === 'PENDING')) {
+      appendTextOutput(data.data);
+    }
+  });
 
-    $scope.init = function(result, config, paragraph, index) {
-      console.log('result controller init %o %o %o', result, config, index);
-      updateData(result, config, paragraph, index);
-      renderResult($scope.type);
-    };
+  $scope.$on('updateParagraphOutput', function(event, data) {
+    if (paragraph.id === data.paragraphId &&
+      resultIndex === data.index) {
+      clearTextOutput();
+      appendTextOutput(data.data);
+    }
+  });
 
-    $scope.$on('updateResult', function(event, result, newConfig, paragraphRef, index) {
-      if (paragraph.id !== paragraphRef.id || index !== resultIndex) {
-        return;
-      }
-      console.log('updateResult %o %o %o %o', result, newConfig, paragraphRef, index);
-      var refresh = !angular.equals(newConfig, $scope.config) ||
-                    !angular.equals(result.type, $scope.type) ||
-                    !angular.equals(result.data, data);
+  var updateData = function(result, config, paragraphRef, index) {
+    data = result.data;
+    paragraph = paragraphRef;
+    resultIndex = parseInt(index);
 
-      updateData(result, newConfig, paragraph, resultIndex);
-      renderResult($scope.type, refresh);
-    });
+    $scope.id = paragraph.id + '_' + index;
+    $scope.type = result.type;
+    config = config ? config : {};
 
-    $scope.$on('appendParagraphOutput', function(event, data) {
-      /* It has been observed that append events
-       * can be errorneously called even if paragraph
-       * execution has ended, and in that case, no append
-       * should be made. Also, it was observed that between PENDING
-       * and RUNNING states, append-events can be called and we can't
-       * miss those, else during the length of paragraph run, few
-       * initial output line/s will be missing.
-       */
-      if (paragraph.id === data.paragraphId &&
-          resultIndex === data.index &&
-         (paragraph.status === 'RUNNING' || paragraph.status === 'PENDING')) {
-        appendTextOutput(data.data);
-      }
-    });
+    // initialize default config values
+    if (!config.graph) {
+      config.graph = {};
+    }
 
-    $scope.$on('updateParagraphOutput', function(event, data) {
-      if (paragraph.id === data.paragraphId &&
-          resultIndex === data.index) {
-        clearTextOutput();
-        appendTextOutput(data.data);
-      }
-    });
+    if (!config.graph.mode) {
+      config.graph.mode = 'table';
+    }
 
-    var updateData = function(result, config, paragraphRef, index) {
-      data = result.data;
-      paragraph = paragraphRef;
-      resultIndex = parseInt(index);
+    if (!config.graph.height) {
+      config.graph.height = 300;
+    }
 
-      $scope.id = paragraph.id + '_' + index;
-      $scope.type = result.type;
-      config = config ? config : {};
+    if (!config.graph.optionOpen) {
+      config.graph.optionOpen = false;
+    }
 
-      // initialize default config values
-      if (!config.graph) {
-        config.graph = {};
-      }
+    $scope.graphMode = config.graph.mode;
+    $scope.config = angular.copy(config);
 
-      if (!config.graph.mode) {
-        config.graph.mode = 'table';
-      }
+    // enable only when it is last result
+    enableHelium = (index === paragraphRef.results.msg.length - 1);
 
-      if (!config.graph.height) {
-        config.graph.height = 300;
-      }
+    if ($scope.type === 'TABLE') {
+      tableData = new TableData();
+      tableData.loadParagraphResult({type: $scope.type, msg: data});
+      $scope.tableDataColumns = tableData.columns;
+      $scope.tableDataComment = tableData.comment;
+    } else if ($scope.type === 'IMG') {
+      $scope.imageData = data;
+    }
+  };
 
-      if (!config.graph.optionOpen) {
-        config.graph.optionOpen = false;
-      }
+  var renderResult = function(type, refresh) {
+    var activeApp;
+    if (enableHelium) {
+      getSuggestions();
+      getApplicationStates();
+      activeApp = _.get($scope.config, 'helium.activeApp');
+    }
 
-      $scope.graphMode = config.graph.mode;
-      $scope.config = angular.copy(config);
+    if (activeApp) {
+      var app = _.find($scope.apps, {id: activeApp});
+      renderApp(app);
+    } else {
+      if (type === 'TABLE') {
+        $scope.renderGraph($scope.graphMode, refresh);
+      } else if (type === 'HTML') {
+        renderHtml();
+      } else if (type === 'ANGULAR') {
+        renderAngular();
+      } else if (type === 'TEXT') {
+        renderText();
+      }
+    }
+  };
 
-      // enable only when it is last result
-      enableHelium = (index === paragraphRef.results.msg.length - 1);
+  var renderHtml = function() {
+    var retryRenderer = function() {
+      var htmlEl = angular.element('#p' + $scope.id + '_html');
+      if (htmlEl.length) {
+        try {
+          htmlEl.html(data);
 
-      if ($scope.type === 'TABLE') {
-        tableData = new TableData();
-        tableData.loadParagraphResult({type: $scope.type, msg: data});
-        $scope.tableDataColumns = tableData.columns;
-        $scope.tableDataComment = tableData.comment;
-      } else if ($scope.type === 'IMG') {
-        $scope.imageData = data;
+          htmlEl.find('pre code').each(function(i, e) {
+            hljs.highlightBlock(e);
+          });
+          /*eslint new-cap: [2, {"capIsNewExceptions": ["MathJax.Hub.Queue"]}]*/
+          MathJax.Hub.Queue(['Typeset', MathJax.Hub, htmlEl[0]]);
+        } catch (err) {
+          console.log('HTML rendering error %o', err);
+        }
+      } else {
+        $timeout(retryRenderer, 10);
       }
     };
+    $timeout(retryRenderer);
+  };
 
-    var renderResult = function(type, refresh) {
-      var activeApp;
-      if (enableHelium) {
-        getSuggestions();
-        getApplicationStates();
-        activeApp = _.get($scope.config, 'helium.activeApp');
-      }
+  var renderAngular = function() {
+    var retryRenderer = function() {
+      if (angular.element('#p' + $scope.id + '_angular').length) {
+        try {
+          angular.element('#p' + $scope.id + '_angular').html(data);
 
-      if (activeApp) {
-        var app = _.find($scope.apps, {id: activeApp});
-        renderApp(app);
-      } else {
-        if (type === 'TABLE') {
-          $scope.renderGraph($scope.graphMode, refresh);
-        } else if (type === 'HTML') {
-          renderHtml();
-        } else if (type === 'ANGULAR') {
-          renderAngular();
-        } else if (type === 'TEXT') {
-          renderText();
+          var paragraphScope = noteVarShareService.get(paragraph.id + '_paragraphScope');
+          $compile(angular.element('#p' + $scope.id + '_angular').contents())(paragraphScope);
+        } catch (err) {
+          console.log('ANGULAR rendering error %o', err);
         }
+      } else {
+        $timeout(retryRenderer, 10);
       }
     };
+    $timeout(retryRenderer);
+  };
 
-    var renderHtml = function() {
-      var retryRenderer = function() {
-        var htmlEl = angular.element('#p' + $scope.id + '_html');
-        if (htmlEl.length) {
-          try {
-            htmlEl.html(data);
-
-            htmlEl.find('pre code').each(function(i, e) {
-              hljs.highlightBlock(e);
-            });
-            /*eslint new-cap: [2, {"capIsNewExceptions": ["MathJax.Hub.Queue"]}]*/
-            MathJax.Hub.Queue(['Typeset', MathJax.Hub, htmlEl[0]]);
-          } catch (err) {
-            console.log('HTML rendering error %o', err);
-          }
-        } else {
-          $timeout(retryRenderer, 10);
-        }
-      };
-      $timeout(retryRenderer);
-    };
+  var getTextEl = function (paragraphId) {
+    return angular.element('#p' + $scope.id + '_text');
+  }
 
-    var renderAngular = function() {
-      var retryRenderer = function() {
-        if (angular.element('#p' + $scope.id + '_angular').length) {
-          try {
-            angular.element('#p' + $scope.id + '_angular').html(data);
+  var textRendererInitialized = false;
+  var renderText = function() {
+    var retryRenderer = function() {
+      var textEl = getTextEl($scope.id);
+      if (textEl.length) {
+        // clear all lines before render
+        clearTextOutput();
+        textRendererInitialized = true;
 
-            var paragraphScope = noteVarShareService.get(paragraph.id + '_paragraphScope');
-            $compile(angular.element('#p' + $scope.id + '_angular').contents())(paragraphScope);
-          } catch (err) {
-            console.log('ANGULAR rendering error %o', err);
-          }
+        if (data) {
+          appendTextOutput(data);
         } else {
-          $timeout(retryRenderer, 10);
+          flushAppendQueue();
         }
-      };
-      $timeout(retryRenderer);
+
+        getTextEl($scope.id).bind('mousewheel', function(e) {
+          $scope.keepScrollDown = false;
+        });
+      } else {
+        $timeout(retryRenderer, 10);
+      }
     };
+    $timeout(retryRenderer);
+  };
 
-    var getTextEl = function (paragraphId) {
-      return angular.element('#p' + $scope.id + '_text');
+  var clearTextOutput = function() {
+    var textEl = getTextEl($scope.id);
+    if (textEl.length) {
+      textEl.children().remove();
     }
+  };
 
-    var textRendererInitialized = false;
-    var renderText = function() {
-      var retryRenderer = function() {
-        var textEl = getTextEl($scope.id);
-        if (textEl.length) {
-          // clear all lines before render
-          clearTextOutput();
-          textRendererInitialized = true;
+  var textAppendQueueBeforeInitialize = [];
 
-          if (data) {
-            appendTextOutput(data);
-          } else {
-            flushAppendQueue();
-          }
-
-          getTextEl($scope.id).bind('mousewheel', function(e) {
-            $scope.keepScrollDown = false;
-          });
-        } else {
-          $timeout(retryRenderer, 10);
-        }
-      };
-      $timeout(retryRenderer);
-    };
+  var flushAppendQueue = function() {
+    while (textAppendQueueBeforeInitialize.length > 0) {
+      appendTextOutput(textAppendQueueBeforeInitialize.pop());
+    }
+  };
 
-    var clearTextOutput = function() {
+  var appendTextOutput = function(msg) {
+    if (!textRendererInitialized) {
+      textAppendQueueBeforeInitialize.push(msg);
+    } else {
+      flushAppendQueue();
       var textEl = getTextEl($scope.id);
       if (textEl.length) {
-        textEl.children().remove();
-      }
-    };
-
-    var textAppendQueueBeforeInitialize = [];
-
-    var flushAppendQueue = function() {
-      while (textAppendQueueBeforeInitialize.length > 0) {
-        appendTextOutput(textAppendQueueBeforeInitialize.pop());
-      }
-    };
-
-    var appendTextOutput = function(msg) {
-      if (!textRendererInitialized) {
-        textAppendQueueBeforeInitialize.push(msg);
-      } else {
-        flushAppendQueue();
-        var textEl = getTextEl($scope.id);
-        if (textEl.length) {
-          var lines = msg.split('\n');
-          for (var i = 0; i < lines.length; i++) {
-            textEl.append(angular.element('<div></div>').text(lines[i]));
-          }
-        }
-        if ($scope.keepScrollDown) {
-          var doc = getTextEl($scope.id);
-          doc[0].scrollTop = doc[0].scrollHeight;
+        var lines = msg.split('\n');
+        for (var i = 0; i < lines.length; i++) {
+          textEl.append(angular.element('<div></div>').text(lines[i]));
         }
       }
-    };
+      if ($scope.keepScrollDown) {
+        var doc = getTextEl($scope.id);
+        doc[0].scrollTop = doc[0].scrollHeight;
+      }
+    }
+  };
 
-    $scope.renderGraph = function(type, refresh) {
-      // set graph height
-      var height = $scope.config.graph.height;
-      var graphContainerEl = angular.element('#p' + $scope.id + '_graph');
-      graphContainerEl.height(height);
+  $scope.renderGraph = function(type, refresh) {
+    // set graph height
+    var height = $scope.config.graph.height;
+    var graphContainerEl = angular.element('#p' + $scope.id + '_graph');
+    graphContainerEl.height(height);
 
-      if (!type) {
-        type = 'table';
-      }
+    if (!type) {
+      type = 'table';
+    }
 
-      var builtInViz = builtInVisualizations[type];
-      if (builtInViz) {
-        // deactive previsouly active visualization
-        for (var t in builtInVisualizations) {
-          var v = builtInVisualizations[t].instance;
+    var builtInViz = builtInVisualizations[type];
+    if (builtInViz) {
+      // deactive previsouly active visualization
+      for (var t in builtInVisualizations) {
+        var v = builtInVisualizations[t].instance;
 
-          if (t !== type && v && v.isActive()) {
-            v.deactivate();
-            break;
-          }
+        if (t !== type && v && v.isActive()) {
+          v.deactivate();
+          break;
         }
+      }
 
-        if (!builtInViz.instance) { // not instantiated yet
-          // render when targetEl is available
-          var retryRenderer = function() {
-            var targetEl = angular.element('#p' + $scope.id + '_' + type);
-            var transformationSettingTargetEl = angular.element('#trsetting' + $scope.id + '_' + type);
-            var visualizationSettingTargetEl = angular.element('#vizsetting' + $scope.id + '_' + type);
-            if (targetEl.length) {
-              try {
-                // set height
-                targetEl.height(height);
-
-                // instantiate visualization
-                var config = getVizConfig(type);
-                var Visualization = builtInViz.class;
-                builtInViz.instance = new Visualization(targetEl, config);
-
-                // inject emitter, $templateRequest
-                var emitter = function(graphSetting) {
-                  commitVizConfigChange(graphSetting, type);
-                };
-                builtInViz.instance._emitter = emitter;
-                builtInViz.instance._compile = $compile;
-                builtInViz.instance._createNewScope = createNewScope;
-                var transformation = builtInViz.instance.getTransformation();
-                transformation._emitter = emitter;
-                transformation._templateRequest = $templateRequest;
-                transformation._compile = $compile;
-                transformation._createNewScope = createNewScope;
-
-                // render
-                var transformed = transformation.transform(tableData);
-                transformation.renderSetting(transformationSettingTargetEl);
-                builtInViz.instance.render(transformed);
-                builtInViz.instance.renderSetting(visualizationSettingTargetEl);
-                builtInViz.instance.activate();
-                angular.element(window).resize(function() {
-                  builtInViz.instance.resize();
-                });
-              } catch (err) {
-                console.log('Graph drawing error %o', err);
-              }
-            } else {
-              $timeout(retryRenderer, 10);
-            }
-          };
-          $timeout(retryRenderer);
-        } else if (refresh) {
-          console.log('Refresh data %o', tableData);
-          // when graph options or data are changed
-          var retryRenderer = function() {
-            var targetEl = angular.element('#p' + $scope.id + '_' + type);
-            var transformationSettingTargetEl = angular.element('#trsetting' + $scope.id + '_' + type);
-            var visualizationSettingTargetEl = angular.element('#trsetting' + $scope.id + '_' + type);
-            if (targetEl.length) {
-              var config = getVizConfig(type);
+      if (!builtInViz.instance) { // not instantiated yet
+        // render when targetEl is available
+        var retryRenderer = function() {
+          var targetEl = angular.element('#p' + $scope.id + '_' + type);
+          var transformationSettingTargetEl = angular.element('#trsetting' + $scope.id + '_' + type);
+          var visualizationSettingTargetEl = angular.element('#vizsetting' + $scope.id + '_' + type);
+          if (targetEl.length) {
+            try {
+              // set height
               targetEl.height(height);
+
+              // instantiate visualization
+              var config = getVizConfig(type);
+              var Visualization = builtInViz.class;
+              builtInViz.instance = new Visualization(targetEl, config);
+
+              // inject emitter, $templateRequest
+              var emitter = function(graphSetting) {
+                commitVizConfigChange(graphSetting, type);
+              };
+              builtInViz.instance._emitter = emitter;
+              builtInViz.instance._compile = $compile;
+              builtInViz.instance._createNewScope = createNewScope;
               var transformation = builtInViz.instance.getTransformation();
-              transformation.setConfig(config);
+              transformation._emitter = emitter;
+              transformation._templateRequest = $templateRequest;
+              transformation._compile = $compile;
+              transformation._createNewScope = createNewScope;
+
+              // render
               var transformed = transformation.transform(tableData);
               transformation.renderSetting(transformationSettingTargetEl);
-              builtInViz.instance.setConfig(config);
               builtInViz.instance.render(transformed);
               builtInViz.instance.renderSetting(visualizationSettingTargetEl);
-            } else {
-              $timeout(retryRenderer, 10);
-            }
-          };
-          $timeout(retryRenderer);
-        } else {
-          var retryRenderer = function() {
-            var targetEl = angular.element('#p' + $scope.id + '_' + type);
-            if (targetEl.length) {
-              targetEl.height(height);
               builtInViz.instance.activate();
-            } else {
-              $timeout(retryRenderer, 10);
+              angular.element(window).resize(function() {
+                builtInViz.instance.resize();
+              });
+            } catch (err) {
+              console.log('Graph drawing error %o', err);
             }
-          };
-          $timeout(retryRenderer);
-        }
-      }
-    };
-    $scope.switchViz = function(newMode) {
-      var newConfig = angular.copy($scope.config);
-      var newParams = angular.copy(paragraph.settings.params);
-
-      // graph options
-      newConfig.graph.mode = newMode;
-
-      // see switchApp()
-      _.set(newConfig, 'helium.activeApp', undefined);
-
-      commitParagraphResult(paragraph.title, paragraph.text, newConfig, newParams);
-    };
-
-    var createNewScope = function() {
-      return $rootScope.$new(true);
-    };
-
-    var commitParagraphResult = function(title, text, config, params) {
-      var newParagraphConfig = angular.copy(paragraph.config);
-      newParagraphConfig.results = newParagraphConfig.results || [];
-      newParagraphConfig.results[resultIndex] = config;
-      if ($scope.revisionView === true) {
-        // local update without commit
-        updateData({
-          type: $scope.type,
-          data: data
-        }, newParagraphConfig.results[resultIndex], paragraph, resultIndex);
-        renderResult($scope.type, true);
+          } else {
+            $timeout(retryRenderer, 10);
+          }
+        };
+        $timeout(retryRenderer);
+      } else if (refresh) {
+        console.log('Refresh data %o', tableData);
+        // when graph options or data are changed
+        var retryRenderer = function() {
+          var targetEl = angular.element('#p' + $scope.id + '_' + type);
+          var transformationSettingTargetEl = angular.element('#trsetting' + $scope.id + '_' + type);
+          var visualizationSettingTargetEl = angular.element('#trsetting' + $scope.id + '_' + type);
+          if (targetEl.length) {
+            var config = getVizConfig(type);
+            targetEl.height(height);
+            var transformation = builtInViz.instance.getTransformation();
+            transformation.setConfig(config);
+            var transformed = transformation.transform(tableData);
+            transformation.renderSetting(transformationSettingTargetEl);
+            builtInViz.instance.setConfig(config);
+            builtInViz.instance.render(transformed);
+            builtInViz.instance.renderSetting(visualizationSettingTargetEl);
+          } else {
+            $timeout(retryRenderer, 10);
+          }
+        };
+        $timeout(retryRenderer);
       } else {
-        websocketMsgSrv.commitParagraph(paragraph.id, title, text, newParagraphConfig, params);
+        var retryRenderer = function() {
+          var targetEl = angular.element('#p' + $scope.id + '_' + type);
+          if (targetEl.length) {
+            targetEl.height(height);
+            builtInViz.instance.activate();
+          } else {
+            $timeout(retryRenderer, 10);
+          }
+        };
+        $timeout(retryRenderer);
       }
-    };
+    }
+  };
+  $scope.switchViz = function(newMode) {
+    var newConfig = angular.copy($scope.config);
+    var newParams = angular.copy(paragraph.settings.params);
 
-    $scope.toggleGraphSetting = function() {
-      var newConfig = angular.copy($scope.config);
-      if (newConfig.graph.optionOpen) {
-        newConfig.graph.optionOpen = false;
-      } else {
-        newConfig.graph.optionOpen = true;
-      }
-      var newParams = angular.copy(paragraph.settings.params);
+    // graph options
+    newConfig.graph.mode = newMode;
 
-      commitParagraphResult(paragraph.title, paragraph.text, newConfig, newParams);
-    };
+    // see switchApp()
+    _.set(newConfig, 'helium.activeApp', undefined);
 
-    var getVizConfig = function(vizId) {
-      var config;
-      var graph = $scope.config.graph;
-      if (graph) {
-        // copy setting for vizId
-        if (graph.setting) {
-          config = angular.copy(graph.setting[vizId]);
-        }
+    commitParagraphResult(paragraph.title, paragraph.text, newConfig, newParams);
+  };
 
-        if (!config) {
-          config = {};
-        }
+  var createNewScope = function() {
+    return $rootScope.$new(true);
+  };
 
-        // copy common setting
-        config.common = angular.copy(graph.commonSetting) || {};
+  var commitParagraphResult = function(title, text, config, params) {
+    var newParagraphConfig = angular.copy(paragraph.config);
+    newParagraphConfig.results = newParagraphConfig.results || [];
+    newParagraphConfig.results[resultIndex] = config;
+    if ($scope.revisionView === true) {
+      // local update without commit
+      updateData({
+        type: $scope.type,
+        data: data
+      }, newParagraphConfig.results[resultIndex], paragraph, resultIndex);
+      renderResult($scope.type, true);
+    } else {
+      websocketMsgSrv.commitParagraph(paragraph.id, title, text, newParagraphConfig, params);
+    }
+  };
 
-        // copy pivot setting
-        if (graph.keys) {
-          config.common.pivot = {
-            keys: angular.copy(graph.keys),
-            groups: angular.copy(graph.groups),
-            values: angular.copy(graph.values)
-          };
-        }
-      }
-      console.log('getVizConfig', config);
-      return config;
-    };
+  $scope.toggleGraphSetting = function() {
+    var newConfig = angular.copy($scope.config);
+    if (newConfig.graph.optionOpen) {
+      newConfig.graph.optionOpen = false;
+    } else {
+      newConfig.graph.optionOpen = true;
+    }
+    var newParams = angular.copy(paragraph.settings.params);
 
-    var commitVizConfigChange = function(config, vizId) {
-      var newConfig = angular.copy($scope.config);
-      if (!newConfig.graph) {
-        newConfig.graph = {};
-      }
+    commitParagraphResult(paragraph.title, paragraph.text, newConfig, newParams);
+  };
 
+  var getVizConfig = function(vizId) {
+    var config;
+    var graph = $scope.config.graph;
+    if (graph) {
       // copy setting for vizId
-      if (!newConfig.graph.setting) {
-        newConfig.graph.setting = {};
+      if (graph.setting) {
+        config = angular.copy(graph.setting[vizId]);
       }
-      newConfig.graph.setting[vizId] = angular.copy(config);
 
-      // copy common setting
-      if (newConfig.graph.setting[vizId]) {
-        newConfig.graph.commonSetting = newConfig.graph.setting[vizId].common;
-        delete newConfig.graph.setting[vizId].common;
+      if (!config) {
+        config = {};
       }
 
+      // copy common setting
+      config.common = angular.copy(graph.commonSetting) || {};
+
       // copy pivot setting
-      if (newConfig.graph.commonSetting && newConfig.graph.commonSetting.pivot) {
-        newConfig.graph.keys = newConfig.graph.commonSetting.pivot.keys;
-        newConfig.graph.groups = newConfig.graph.commonSetting.pivot.groups;
-        newConfig.graph.values = newConfig.graph.commonSetting.pivot.values;
-        delete newConfig.graph.commonSetting.pivot;
+      if (graph.keys) {
+        config.common.pivot = {
+          keys: angular.copy(graph.keys),
+          groups: angular.copy(graph.groups),
+          values: angular.copy(graph.values)
+        };
       }
-      console.log('committVizConfig', newConfig);
-      var newParams = angular.copy(paragraph.settings.params);
-      commitParagraphResult(paragraph.title, paragraph.text, newConfig, newParams);
-    };
+    }
+    console.log('getVizConfig', config);
+    return config;
+  };
 
-    $scope.$on('paragraphResized', function(event, paragraphId) {
-      // paragraph col width changed
-      if (paragraphId === paragraph.id) {
-        var builtInViz = builtInVisualizations[$scope.graphMode];
-        if (builtInViz && builtInViz.instance) {
-          builtInViz.instance.resize();
-        }
+  var commitVizConfigChange = function(config, vizId) {
+    var newConfig = angular.copy($scope.config);
+    if (!newConfig.graph) {
+      newConfig.graph = {};
+    }
+
+    // copy setting for vizId
+    if (!newConfig.graph.setting) {
+      newConfig.graph.setting = {};
+    }
+    newConfig.graph.setting[vizId] = angular.copy(config);
+
+    // copy common setting
+    if (newConfig.graph.setting[vizId]) {
+      newConfig.graph.commonSetting = newConfig.graph.setting[vizId].common;
+      delete newConfig.graph.setting[vizId].common;
+    }
+
+    // copy pivot setting
+    if (newConfig.graph.commonSetting && newConfig.graph.commonSetting.pivot) {
+      newConfig.graph.keys = newConfig.graph.commonSetting.pivot.keys;
+      newConfig.graph.groups = newConfig.graph.commonSetting.pivot.groups;
+      newConfig.graph.values = newConfig.graph.commonSetting.pivot.values;
+      delete newConfig.graph.commonSetting.pivot;
+    }
+    console.log('committVizConfig', newConfig);
+    var newParams = angular.copy(paragraph.settings.params);
+    commitParagraphResult(paragraph.title, paragraph.text, newConfig, newParams);
+  };
+
+  $scope.$on('paragraphResized', function(event, paragraphId) {
+    // paragraph col width changed
+    if (paragraphId === paragraph.id) {
+      var builtInViz = builtInVisualizations[$scope.graphMode];
+      if (builtInViz && builtInViz.instance) {
+        builtInViz.instance.resize();
       }
-    });
+    }
+  });
 
-    $scope.resize = function(width, height) {
-      $timeout(function() {
-        changeHeight(width, height);
-      }, 200);
-    };
+  $scope.resize = function(width, height) {
+    $timeout(function() {
+      changeHeight(width, height);
+    }, 200);
+  };
 
-    var changeHeight = function(width, height) {
-      var newParams = angular.copy(paragraph.settings.params);
-      var newConfig = angular.copy($scope.config);
+  var changeHeight = function(width, height) {
+    var newParams = angular.copy(paragraph.settings.params);
+    var newConfig = angular.copy($scope.config);
 
-      newConfig.graph.height = height;
-      paragraph.config.colWidth = width;
+    newConfig.graph.height = height;
+    paragraph.config.colWidth = width;
 
-      commitParagraphResult(paragraph.title, paragraph.text, newConfig, newParams);
-    };
+    commitParagraphResult(paragraph.title, paragraph.text, newConfig, newParams);
+  };
 
-    $scope.exportToDSV = function(delimiter) {
-      var dsv = '';
-      var dateFinished = moment(paragraph.dateFinished).format('YYYY-MM-DD hh:mm:ss A');
-      var exportedFileName = paragraph.title ? paragraph.title + '_' + dateFinished : 'data_' + dateFinished;
+  $scope.exportToDSV = function(delimiter) {
+    var dsv = '';
+    var dateFinished = moment(paragraph.dateFinished).format('YYYY-MM-DD hh:mm:ss A');
+    var exportedFileName = paragraph.title ? paragraph.title + '_' + dateFinished : 'data_' + dateFinished;
 
-      for (var titleIndex in tableData.columns) {
-        dsv += tableData.columns[titleIndex].name + delimiter;
-      }
-      dsv = dsv.substring(0, dsv.length - 1) + '\n';
-      for (var r in tableData.rows) {
-        var row = tableData.rows[r];
-        var dsvRow = '';
-        for (var index in row) {
-          var stringValue =  (row[index]).toString();
-          if (stringValue.indexOf(delimiter) > -1) {
-            dsvRow += '"' + stringValue + '"' + delimiter;
-          } else {
-            dsvRow += row[index] + delimiter;
-          }
+    for (var titleIndex in tableData.columns) {
+      dsv += tableData.columns[titleIndex].name + delimiter;
+    }
+    dsv = dsv.substring(0, dsv.length - 1) + '\n';
+    for (var r in tableData.rows) {
+      var row = tableData.rows[r];
+      var dsvRow = '';
+      for (var index in row) {
+        var stringValue =  (row[index]).toString();
+        if (stringValue.indexOf(delimiter) > -1) {
+          dsvRow += '"' + stringValue + '"' + delimiter;
+        } else {
+          dsvRow += row[index] + delimiter;
         }
-        dsv += dsvRow.substring(0, dsvRow.length - 1) + '\n';
       }
-      var extension = '';
-      if (delimiter === '\t') {
-        extension = 'tsv';
-      } else if (delimiter === ',') {
-        extension = 'csv';
-      }
-      saveAsService.saveAs(dsv, exportedFileName, extension);
-    };
+      dsv += dsvRow.substring(0, dsvRow.length - 1) + '\n';
+    }
+    var extension = '';
+    if (delimiter === '\t') {
+      extension = 'tsv';
+    } else if (delimiter === ',') {
+      extension = 'csv';
+    }
+    saveAsService.saveAs(dsv, exportedFileName, extension);
+  };
 
-    $scope.getBase64ImageSrc = function(base64Data) {
-      return 'data:image/png;base64,' + base64Data;
-    };
+  $scope.getBase64ImageSrc = function(base64Data) {
+    return 'data:image/png;base64,' + base64Data;
+  };
 
-    // Helium ----------------
-    var ANGULAR_FUNCTION_OBJECT_NAME_PREFIX = '_Z_ANGULAR_FUNC_';
+  // Helium ----------------
+  var ANGULAR_FUNCTION_OBJECT_NAME_PREFIX = '_Z_ANGULAR_FUNC_';
 
-    // app states
-    $scope.apps = [];
+  // app states
+  $scope.apps = [];
 
-    // suggested apps
-    $scope.suggestion = {};
+  // suggested apps
+  $scope.suggestion = {};
 
-    $scope.switchApp = function(appId) {
-      var newConfig = angular.copy($scope.config);
-      var newParams = angular.copy(paragraph.settings.params);
+  $scope.switchApp = function(appId) {
+    var newConfig = angular.copy($scope.config);
+    var newParams = angular.copy(paragraph.settings.params);
 
-      // 'helium.activeApp' can be cleared by switchViz()
-      _.set(newConfig, 'helium.activeApp', appId);
+    // 'helium.activeApp' can be cleared by switchViz()
+    _.set(newConfig, 'helium.activeApp', appId);
 
-      commitConfig(newConfig, newParams);
-    };
+    commitConfig(newConfig, newParams);
+  };
 
-    $scope.loadApp = function(heliumPackage) {
-      var noteId = $route.current.pathParams.noteId;
-      $http.post(baseUrlSrv.getRestApiBase() + '/helium/load/' + noteId + '/' + paragraph.id, heliumPackage)
-        .success(function(data, status, headers, config) {
-          console.log('Load app %o', data);
-        })
-        .error(function(err, status, headers, config) {
-          console.log('Error %o', err);
-        });
-    };
+  $scope.loadApp = function(heliumPackage) {
+    var noteId = $route.current.pathParams.noteId;
+    $http.post(baseUrlSrv.getRestApiBase() + '/helium/load/' + noteId + '/' + paragraph.id, heliumPackage)
+      .success(function(data, status, headers, config) {
+        console.log('Load app %o', data);
+      })
+      .error(function(err, status, headers, config) {
+        console.log('Error %o', err);
+      });
+  };
 
-    var commitConfig = function(config, params) {
-      commitParagraphResult(paragraph.title, paragraph.text, config, params);
-    };
+  var commitConfig = function(config, params) {
+    commitParagraphResult(paragraph.title, paragraph.text, config, params);
+  };
 
-    var getApplicationStates = function() {
-      var appStates = [];
-
-      // Display ApplicationState
-      if (paragraph.apps) {
-        _.forEach(paragraph.apps, function(app) {
-          appStates.push({
-            id: app.id,
-            pkg: app.pkg,
-            status: app.status,
-            output: app.output
-          });
+  var getApplicationStates = function() {
+    var appStates = [];
+
+    // Display ApplicationState
+    if (paragraph.apps) {
+      _.forEach(paragraph.apps, function(app) {
+        appStates.push({
+          id: app.id,
+          pkg: app.pkg,
+          status: app.status,
+          output: app.output
         });
+      });
+    }
+
+    // update or remove app states no longer exists
+    _.forEach($scope.apps, function(currentAppState, idx) {
+      var newAppState = _.find(appStates, {id: currentAppState.id});
+      if (newAppState) {
+        angular.extend($scope.apps[idx], newAppState);
+      } else {
+        $scope.apps.splice(idx, 1);
       }
+    });
 
-      // update or remove app states no longer exists
-      _.forEach($scope.apps, function(currentAppState, idx) {
-        var newAppState = _.find(appStates, {id: currentAppState.id});
-        if (newAppState) {
-          angular.extend($scope.apps[idx], newAppState);
-        } else {
-          $scope.apps.splice(idx, 1);
-        }
+    // add new app states
+    _.forEach(appStates, function(app, idx) {
+      if ($scope.apps.length <= idx || $scope.apps[idx].id !== app.id) {
+        $scope.apps.splice(idx, 0, app);
+      }
+    });
+  };
+
+  var getSuggestions = function() {
+    // Get suggested apps
+    var noteId = $route.current.pathParams.noteId;
+    $http.get(baseUrlSrv.getRestApiBase() + '/helium/suggest/' + noteId + '/' + paragraph.id)
+      .success(function(data, status, headers, config) {
+        $scope.suggestion = data.body;
+      })
+      .error(function(err, status, headers, config) {
+        console.log('Error %o', err);
       });
+  };
 
-      // add new app states
-      _.forEach(appStates, function(app, idx) {
-        if ($scope.apps.length <= idx || $scope.apps[idx].id !== app.id) {
-          $scope.apps.splice(idx, 0, app);
+  var renderApp = function(appState) {
+    var retryRenderer = function() {
+      var targetEl = angular.element(document.getElementById('p' + appState.id));
+      console.log('retry renderApp %o', targetEl);
+      if (targetEl.length) {
+        try {
+          console.log('renderApp %o', appState);
+          targetEl.html(appState.output);
+          $compile(targetEl.contents())(getAppScope(appState));
+        } catch (err) {
+          console.log('App rendering error %o', err);
         }
-      });
+      } else {
+        $timeout(retryRenderer, 1000);
+      }
     };
+    $timeout(retryRenderer);
+  };
 
-    var getSuggestions = function() {
-      // Get suggested apps
-      var noteId = $route.current.pathParams.noteId;
-      $http.get(baseUrlSrv.getRestApiBase() + '/helium/suggest/' + noteId + '/' + paragraph.id)
-        .success(function(data, status, headers, config) {
-          $scope.suggestion = data.body;
-        })
-        .error(function(err, status, headers, config) {
-          console.log('Error %o', err);
-        });
-    };
+  /*
+   ** $scope.$on functions below
+   */
+  $scope.$on('appendAppOutput', function(event, data) {
+    if (paragraph.id === data.paragraphId) {
+      var app = _.find($scope.apps, {id: data.appId});
+      if (app) {
+        app.output += data.data;
 
-    var renderApp = function(appState) {
-      var retryRenderer = function() {
-        var targetEl = angular.element(document.getElementById('p' + appState.id));
-        console.log('retry renderApp %o', targetEl);
-        if (targetEl.length) {
-          try {
-            console.log('renderApp %o', appState);
-            targetEl.html(appState.output);
-            $compile(targetEl.contents())(getAppScope(appState));
-          } catch (err) {
-            console.log('App rendering error %o', err);
-          }
-        } else {
-          $timeout(retryRenderer, 1000);
-        }
-      };
-      $timeout(retryRenderer);
-    };
+        var paragraphAppState = _.find(paragraph.apps, {id: data.appId});
+        paragraphAppState.output = app.output;
 
-    /*
-    ** $scope.$on functions below
-    */
-    $scope.$on('appendAppOutput', function(event, data) {
-      if (paragraph.id === data.paragraphId) {
-        var app = _.find($scope.apps, {id: data.appId});
-        if (app) {
-          app.output += data.data;
-
-          var paragraphAppState = _.find(paragraph.apps, {id: data.appId});
-          paragraphAppState.output = app.output;
-
-          var targetEl = angular.element(document.getElementById('p' + app.id));
-          targetEl.html(app.output);
-          $compile(targetEl.contents())(getAppScope(app));
-          console.log('append app output %o', $scope.apps);
-        }
+        var targetEl = angular.element(document.getElementById('p' + app.id));
+        targetEl.html(app.output);
+        $compile(targetEl.contents())(getAppScope(app));
+        console.log('append app output %o', $scope.apps);
       }
-    });
+    }
+  });
 
-    $scope.$on('updateAppOutput', function(event, data) {
-      if (paragraph.id === data.paragraphId) {
-        var app = _.find($scope.apps, {id: data.appId});
-        if (app) {
-          app.output = data.data;
+  $scope.$on('updateAppOutput', function(event, data) {
+    if (paragraph.id === data.paragraphId) {
+      var app = _.find($scope.apps, {id: data.appId});
+      if (app) {
+        app.output = data.data;
 
-          var paragraphAppState = _.find(paragraph.apps, {id: data.appId});
-          paragraphAppState.output = app.output;
+        var paragraphAppState = _.find(paragraph.apps, {id: data.appId});
+        paragraphAppState.output = app.output;
 
-          var targetEl = angular.element(document.getElementById('p' + app.id));
-          targetEl.html(app.output);
-          $compile(targetEl.contents())(getAppScope(app));
-          console.log('append app output');
-        }
+        var targetEl = angular.element(document.getElementById('p' + app.id));
+        targetEl.html(app.output);
+        $compile(targetEl.contents())(getAppScope(app));
+        console.log('append app output');
       }
-    });
-
-    $scope.$on('appLoad', function(event, data) {
-      if (paragraph.id === data.paragraphId) {
-        var app = _.find($scope.apps, {id: data.appId});
-        if (!app) {
-          app = {
-            id: data.appId,
-            pkg: data.pkg,
-            status: 'UNLOADED',
-            output: ''
-          };
-
-          $scope.apps.push(app);
-          paragraph.apps.push(app);
-          $scope.switchApp(app.id);
-        }
+    }
+  });
+
+  $scope.$on('appLoad', function(event, data) {
+    if (paragraph.id === data.paragraphId) {
+      var app = _.find($scope.apps, {id: data.appId});
+      if (!app) {
+        app = {
+          id: data.appId,
+          pkg: data.pkg,
+          status: 'UNLOADED',
+          output: ''
+        };
+
+        $scope.apps.push(app);
+        paragraph.apps.push(app);
+        $scope.switchApp(app.id);
       }
-    });
+    }
+  });
 
-    $scope.$on('appStatusChange', function(event, data) {
-      if (paragraph.id === data.paragraphId) {
-        var app = _.find($scope.apps, {id: data.appId});
-        if (app) {
-          app.status = data.status;
-          var paragraphAppState = _.find(paragraph.apps, {id: data.appId});
-          paragraphAppState.status = app.status;
-        }
+  $scope.$on('appStatusChange', function(event, data) {
+    if (paragraph.id === data.paragraphId) {
+      var app = _.find($scope.apps, {id: data.appId});
+      if (app) {
+        app.status = data.status;
+        var paragraphAppState = _.find(paragraph.apps, {id: data.appId});
+        paragraphAppState.status = app.status;
       }
-    });
+    }
+  });
 
-    var getAppRegistry = function(appState) {
-      if (!appState.registry) {
-        appState.registry = {};
-      }
+  var getAppRegistry = function(appState) {
+    if (!appState.registry) {
+      appState.registry = {};
+    }
 
-      return appState.registry;
-    };
+    return appState.registry;
+  };
 
-    var getAppScope = function(appState) {
-      if (!appState.scope) {
-        appState.scope = $rootScope.$new(true, $rootScope);
-      }
-      return appState.scope;
-    };
+  var getAppScope = function(appState) {
+    if (!appState.scope) {
+      appState.scope = $rootScope.$new(true, $rootScope);
+    }
+    return appState.scope;
+  };
 
-    $scope.$on('angularObjectUpdate', function(event, data) {
-      var noteId = $route.current.pathParams.noteId;
-      if (!data.noteId || data.noteId === noteId) {
-        var scope;
-        var registry;
+  $scope.$on('angularObjectUpdate', function(event, data) {
+    var noteId = $route.current.pathParams.noteId;
+    if (!data.noteId || data.noteId === noteId) {
+      var scope;
+      var registry;
 
-        var app = _.find($scope.apps, {id: data.paragraphId});
-        if (app) {
-          scope = getAppScope(app);
-          registry = getAppRegistry(app);
-        } else {
-          // no matching app in this paragraph
-          return;
-        }
+      var app = _.find($scope.apps, {id: data.paragraphId});
+      if (app) {
+        scope = getAppScope(app);
+        registry = getAppRegistry(app);
+      } else {
+        // no matching app in this paragraph
+        return;
+      }
 
-        var varName = data.angularObject.name;
+      var varName = data.angularObject.name;
 
-        if (angular.equals(data.angularObject.object, scope[varName])) {
-          // return when update has no change
-          return;
-        }
+      if (angular.equals(data.angularObject.object, scope[varName])) {
+        // return when update has no change
+        return;
+      }
 
-        if (!registry[varName]) {
-          registry[varName] = {
-            interpreterGroupId: data.interpreterGroupId,
-            noteId: data.noteId,
-            paragraphId: data.paragraphId
-          };
-        } else {
-          registry[varName].noteId = registry[varName].noteId || data.noteId;
-          registry[varName].paragraphId = registry[varName].paragraphId || data.paragraphId;
-        }
+      if (!registry[varName]) {
+        registry[varName] = {
+          interpreterGroupId: data.interpreterGroupId,
+          noteId: data.noteId,
+          paragraphId: data.paragraphId
+        };
+      } else {
+        registry[varName].noteId = registry[varName].noteId || data.noteId;
+        registry[varName].paragraphId = registry[varName].paragraphId || data.paragraphId;
+      }
 
-        registry[varName].skipEmit = true;
+      registry[varName].skipEmit = true;
 
-        if (!registry[varName].clearWatcher) {
-          registry[varName].clearWatcher = scope.$watch(varName, function(newValue, oldValue) {
-            console.log('angular object (paragraph) updated %o %o', varName, registry[varName]);
-            if (registry[varName].skipEmit) {
-              registry[varName].skipEmit = false;
-              return;
-            }
-            websocketMsgSrv.updateAngularObject(
-              registry[varName].noteId,
-              registry[varName].paragraphId,
-              varName,
-              newValue,
-              registry[varName].interpreterGroupId);
-          });
-        }
-        console.log('angular object (paragraph) created %o', varName);
-        scope[varName] = data.angularObject.object;
-
-        // create proxy for AngularFunction
-        if (varName.indexOf(ANGULAR_FUNCTION_OBJECT_NAME_PREFIX) === 0) {
-          var funcName = varName.substring((ANGULAR_FUNCTION_OBJECT_NAME_PREFIX).length);
-          scope[funcName] = function() {
-            scope[varName] = arguments;
-            console.log('angular function (paragraph) invoked %o', arguments);
-          };
-
-          console.log('angular function (paragraph) created %o', scope[funcName]);
-        }
+      if (!registry[varName].clearWatcher) {
+        registry[varName].clearWatcher = scope.$watch(varName, function(newValue, oldValue) {
+          console.log('angular object (paragraph) updated %o %o', varName, registry[varName]);
+          if (registry[varName].skipEmit) {
+            registry[varName].skipEmit = false;
+            return;
+          }
+          websocketMsgSrv.updateAngularObject(
+            registry[varName].noteId,
+            registry[varName].paragraphId,
+            varName,
+            newValue,
+            registry[varName].interpreterGroupId);
+        });
       }
-    });
+      console.log('angular object (paragraph) created %o', varName);
+      scope[varName] = data.angularObject.object;
 
-    $scope.$on('angularObjectRemove', function(event, data) {
-      var noteId = $route.current.pathParams.noteId;
-      if (!data.noteId || data.noteId === noteId) {
-        var scope;
-        var registry;
+      // create proxy for AngularFunction
+      if (varName.indexOf(ANGULAR_FUNCTION_OBJECT_NAME_PREFIX) === 0) {
+        var funcName = varName.substring((ANGULAR_FUNCTION_OBJECT_NAME_PREFIX).length);
+        scope[funcName] = function() {
+          scope[varName] = arguments;
+          console.log('angular function (paragraph) invoked %o', arguments);
+        };
 
-        var app = _.find($scope.apps, {id: data.paragraphId});
-        if (app) {
-          scope = getAppScope(app);
-          registry = getAppRegistry(app);
-        } else {
-          // no matching app in this paragraph
-          return;
-        }
+        console.log('angular function (paragraph) created %o', scope[funcName]);
+      }
+    }
+  });
+
+  $scope.$on('angularObjectRemove', function(event, data) {
+    var noteId = $route.current.pathParams.noteId;
+    if (!data.noteId || data.noteId === noteId) {
+      var scope;
+      var registry;
+
+      var app = _.find($scope.apps, {id: data.paragraphId});
+      if (app) {
+        scope = getAppScope(app);
+        registry = getAppRegistry(app);
+      } else {
+        // no matching app in this paragraph
+        return;
+      }
 
-        var varName = data.name;
+      var varName = data.name;
 
-        // clear watcher
-        if (registry[varName]) {
-          registry[varName].clearWatcher();
-          registry[varName] = undefined;
-        }
+      // clear watcher
+      if (registry[varName]) {
+        registry[varName].clearWatcher();
+        registry[varName] = undefined;
+      }
 
-        // remove scope variable
-        scope[varName] = undefined;
+      // remove scope variable
+      scope[varName] = undefined;
 
-        // remove proxy for AngularFunction
-        if (varName.indexOf(ANGULAR_FUNCTION_OBJECT_NAME_PREFIX) === 0) {
-          var funcName = varName.substring((ANGULAR_FUNCTION_OBJECT_NAME_PREFIX).length);
-          scope[funcName] = undefined;
-        }
+      // remove proxy for AngularFunction
+      if (varName.indexOf(ANGULAR_FUNCTION_OBJECT_NAME_PREFIX) === 0) {
+        var funcName = varName.substring((ANGULAR_FUNCTION_OBJECT_NAME_PREFIX).length);
+        scope[funcName] = undefined;
       }
-    });
-  };
-})();
+    }
+  });
+};

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/4c60b27c/zeppelin-web/src/app/notebookRepos/notebookRepos.controller.js
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/app/notebookRepos/notebookRepos.controller.js b/zeppelin-web/src/app/notebookRepos/notebookRepos.controller.js
index 7106527..3d82206 100644
--- a/zeppelin-web/src/app/notebookRepos/notebookRepos.controller.js
+++ b/zeppelin-web/src/app/notebookRepos/notebookRepos.controller.js
@@ -11,80 +11,78 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
 
-  angular.module('zeppelinWebApp').controller('NotebookReposCtrl', NotebookReposCtrl);
+angular.module('zeppelinWebApp').controller('NotebookReposCtrl', NotebookReposCtrl);
 
-  NotebookReposCtrl.$inject = ['$http', 'baseUrlSrv', 'ngToast'];
+NotebookReposCtrl.$inject = ['$http', 'baseUrlSrv', 'ngToast'];
 
-  function NotebookReposCtrl($http, baseUrlSrv, ngToast) {
-    var vm = this;
-    vm.notebookRepos = [];
-    vm.showDropdownSelected = showDropdownSelected;
-    vm.saveNotebookRepo = saveNotebookRepo;
+function NotebookReposCtrl($http, baseUrlSrv, ngToast) {
+  var vm = this;
+  vm.notebookRepos = [];
+  vm.showDropdownSelected = showDropdownSelected;
+  vm.saveNotebookRepo = saveNotebookRepo;
 
-    _init();
+  _init();
 
-    // Public functions
+  // Public functions
 
-    function saveNotebookRepo(valueform, repo, data) {
-      console.log('data %o', data);
-      $http.put(baseUrlSrv.getRestApiBase() + '/notebook-repositories', {
-        'name': repo.className,
-        'settings': data
-      }).success(function(data) {
-        var index = _.findIndex(vm.notebookRepos, {'className': repo.className});
-        if (index >= 0) {
-          vm.notebookRepos[index] = data.body;
-          console.log('repos %o, data %o', vm.notebookRepos, data.body);
-        }
-        valueform.$show();
-      }).error(function() {
-        ngToast.danger({
-          content: 'We couldn\'t save that NotebookRepo\'s settings',
-          verticalPosition: 'bottom',
-          timeout: '3000'
-        });
-        valueform.$show();
+  function saveNotebookRepo(valueform, repo, data) {
+    console.log('data %o', data);
+    $http.put(baseUrlSrv.getRestApiBase() + '/notebook-repositories', {
+      'name': repo.className,
+      'settings': data
+    }).success(function(data) {
+      var index = _.findIndex(vm.notebookRepos, {'className': repo.className});
+      if (index >= 0) {
+        vm.notebookRepos[index] = data.body;
+        console.log('repos %o, data %o', vm.notebookRepos, data.body);
+      }
+      valueform.$show();
+    }).error(function() {
+      ngToast.danger({
+        content: 'We couldn\'t save that NotebookRepo\'s settings',
+        verticalPosition: 'bottom',
+        timeout: '3000'
       });
+      valueform.$show();
+    });
 
-      return 'manual';
-    }
+    return 'manual';
+  }
 
-    function showDropdownSelected(setting) {
-      var index = _.findIndex(setting.value, {'value': setting.selected});
-      if (index < 0) {
-        return 'No value';
-      } else {
-        return setting.value[index].name;
-      }
+  function showDropdownSelected(setting) {
+    var index = _.findIndex(setting.value, {'value': setting.selected});
+    if (index < 0) {
+      return 'No value';
+    } else {
+      return setting.value[index].name;
     }
+  }
 
-    // Private functions
+  // Private functions
 
-    function _getInterpreterSettings() {
-      $http.get(baseUrlSrv.getRestApiBase() + '/notebook-repositories')
+  function _getInterpreterSettings() {
+    $http.get(baseUrlSrv.getRestApiBase() + '/notebook-repositories')
       .success(function(data, status, headers, config) {
         vm.notebookRepos = data.body;
         console.log('ya notebookRepos %o', vm.notebookRepos);
       }).error(function(data, status, headers, config) {
-        if (status === 401) {
-          ngToast.danger({
-            content: 'You don\'t have permission on this page',
-            verticalPosition: 'bottom',
-            timeout: '3000'
-          });
-          setTimeout(function() {
-            window.location.replace('/');
-          }, 3000);
-        }
-        console.log('Error %o %o', status, data.message);
-      });
-    }
-
-    function _init() {
-      _getInterpreterSettings();
-    };
+      if (status === 401) {
+        ngToast.danger({
+          content: 'You don\'t have permission on this page',
+          verticalPosition: 'bottom',
+          timeout: '3000'
+        });
+        setTimeout(function() {
+          window.location.replace('/');
+        }, 3000);
+      }
+      console.log('Error %o %o', status, data.message);
+    });
   }
 
-})();
+  function _init() {
+    _getInterpreterSettings();
+  };
+}
+

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/4c60b27c/zeppelin-web/src/app/search/result-list.controller.js
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/app/search/result-list.controller.js b/zeppelin-web/src/app/search/result-list.controller.js
index 3d81fab..30c8325 100644
--- a/zeppelin-web/src/app/search/result-list.controller.js
+++ b/zeppelin-web/src/app/search/result-list.controller.js
@@ -11,148 +11,146 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
 
-  angular.module('zeppelinWebApp').controller('SearchResultCtrl', SearchResultCtrl);
+angular.module('zeppelinWebApp').controller('SearchResultCtrl', SearchResultCtrl);
 
-  SearchResultCtrl.$inject = ['$scope', '$routeParams', 'searchService'];
+SearchResultCtrl.$inject = ['$scope', '$routeParams', 'searchService'];
 
-  function SearchResultCtrl($scope, $routeParams, searchService) {
-    $scope.isResult = true ;
-    $scope.searchTerm = $routeParams.searchTerm;
-    var results = searchService.search({'q': $routeParams.searchTerm}).query();
-
-    results.$promise.then(function(result) {
-      $scope.notes = result.body.map(function(note) {
-        // redirect to notebook when search result is a notebook itself,
-        // not a paragraph
-        if (!/\/paragraph\//.test(note.id)) {
-          return note;
-        }
-
-        note.id = note.id.replace('paragraph/', '?paragraph=') +
-          '&term=' + $routeParams.searchTerm;
+function SearchResultCtrl($scope, $routeParams, searchService) {
+  $scope.isResult = true ;
+  $scope.searchTerm = $routeParams.searchTerm;
+  var results = searchService.search({'q': $routeParams.searchTerm}).query();
 
+  results.$promise.then(function(result) {
+    $scope.notes = result.body.map(function(note) {
+      // redirect to notebook when search result is a notebook itself,
+      // not a paragraph
+      if (!/\/paragraph\//.test(note.id)) {
         return note;
-      });
-      if ($scope.notes.length === 0) {
-        $scope.isResult = false;
-      } else {
-        $scope.isResult = true;
       }
 
-      $scope.$on('$routeChangeStart', function(event, next, current) {
-        if (next.originalPath !== '/search/:searchTerm') {
-          searchService.searchTerm = '';
-        }
-      });
+      note.id = note.id.replace('paragraph/', '?paragraph=') +
+        '&term=' + $routeParams.searchTerm;
+
+      return note;
     });
+    if ($scope.notes.length === 0) {
+      $scope.isResult = false;
+    } else {
+      $scope.isResult = true;
+    }
+
+    $scope.$on('$routeChangeStart', function(event, next, current) {
+      if (next.originalPath !== '/search/:searchTerm') {
+        searchService.searchTerm = '';
+      }
+    });
+  });
+
+  $scope.page = 0;
+  $scope.allResults = false;
+
+  $scope.highlightSearchResults = function(note) {
+    return function(_editor) {
+      function getEditorMode(text) {
+        var editorModes = {
+          'ace/mode/scala': /^%(\w*\.)?spark/,
+          'ace/mode/python': /^%(\w*\.)?(pyspark|python)/,
+          'ace/mode/r': /^%(\w*\.)?(r|sparkr|knitr)/,
+          'ace/mode/sql': /^%(\w*\.)?\wql/,
+          'ace/mode/markdown': /^%md/,
+          'ace/mode/sh': /^%sh/
+        };
+
+        return Object.keys(editorModes).reduce(function(res, mode) {
+          return editorModes[mode].test(text) ? mode : res;
+        }, 'ace/mode/scala');
+      }
 
-    $scope.page = 0;
-    $scope.allResults = false;
-
-    $scope.highlightSearchResults = function(note) {
-      return function(_editor) {
-        function getEditorMode(text) {
-          var editorModes = {
-            'ace/mode/scala': /^%(\w*\.)?spark/,
-            'ace/mode/python': /^%(\w*\.)?(pyspark|python)/,
-            'ace/mode/r': /^%(\w*\.)?(r|sparkr|knitr)/,
-            'ace/mode/sql': /^%(\w*\.)?\wql/,
-            'ace/mode/markdown': /^%md/,
-            'ace/mode/sh': /^%sh/
-          };
-
-          return Object.keys(editorModes).reduce(function(res, mode) {
-            return editorModes[mode].test(text) ? mode : res;
-          }, 'ace/mode/scala');
-        }
-
-        var Range = ace.require('ace/range').Range;
-
-        _editor.setOption('highlightActiveLine', false);
-        _editor.$blockScrolling = Infinity;
-        _editor.setReadOnly(true);
-        _editor.renderer.setShowGutter(false);
-        _editor.setTheme('ace/theme/chrome');
-        _editor.getSession().setMode(getEditorMode(note.text));
-
-        function getIndeces(term) {
-          return function(str) {
-            var indeces = [];
-            var i = -1;
-            while ((i = str.indexOf(term, i + 1)) >= 0) {
-              indeces.push(i);
-            }
-            return indeces;
-          };
-        }
-
-        var result = '';
-        if (note.header !== '') {
-          result = note.header + '\n\n' + note.snippet;
-        } else {
-          result = note.snippet;
-        }
-
-        var lines = result
-          .split('\n')
-          .map(function(line, row) {
-
-            var match = line.match(/<B>(.+?)<\/B>/);
-
-            // return early if nothing to highlight
-            if (!match) {
-              return line;
-            }
+      var Range = ace.require('ace/range').Range;
+
+      _editor.setOption('highlightActiveLine', false);
+      _editor.$blockScrolling = Infinity;
+      _editor.setReadOnly(true);
+      _editor.renderer.setShowGutter(false);
+      _editor.setTheme('ace/theme/chrome');
+      _editor.getSession().setMode(getEditorMode(note.text));
+
+      function getIndeces(term) {
+        return function(str) {
+          var indeces = [];
+          var i = -1;
+          while ((i = str.indexOf(term, i + 1)) >= 0) {
+            indeces.push(i);
+          }
+          return indeces;
+        };
+      }
 
-            var term = match[1];
-            var __line = line
-              .replace(/<B>/g, '')
-              .replace(/<\/B>/g, '');
-
-            var indeces = getIndeces(term)(__line);
-
-            indeces.forEach(function(start) {
-              var end = start + term.length;
-              if (note.header !== '' && row === 0) {
-                _editor
-                  .getSession()
-                  .addMarker(
-                    new Range(row, 0, row, line.length),
-                    'search-results-highlight-header',
-                    'background'
-                  );
-                _editor
-                  .getSession()
-                  .addMarker(
-                    new Range(row, start, row, end),
-                    'search-results-highlight',
-                    'line'
-                  );
-              } else {
-                _editor
-                  .getSession()
-                  .addMarker(
-                    new Range(row, start, row, end),
-                    'search-results-highlight',
-                    'line'
-                  );
-              }
-            });
-            return __line;
+      var result = '';
+      if (note.header !== '') {
+        result = note.header + '\n\n' + note.snippet;
+      } else {
+        result = note.snippet;
+      }
+
+      var lines = result
+        .split('\n')
+        .map(function(line, row) {
+
+          var match = line.match(/<B>(.+?)<\/B>/);
+
+          // return early if nothing to highlight
+          if (!match) {
+            return line;
+          }
+
+          var term = match[1];
+          var __line = line
+            .replace(/<B>/g, '')
+            .replace(/<\/B>/g, '');
+
+          var indeces = getIndeces(term)(__line);
+
+          indeces.forEach(function(start) {
+            var end = start + term.length;
+            if (note.header !== '' && row === 0) {
+              _editor
+                .getSession()
+                .addMarker(
+                  new Range(row, 0, row, line.length),
+                  'search-results-highlight-header',
+                  'background'
+                );
+              _editor
+                .getSession()
+                .addMarker(
+                  new Range(row, start, row, end),
+                  'search-results-highlight',
+                  'line'
+                );
+            } else {
+              _editor
+                .getSession()
+                .addMarker(
+                  new Range(row, start, row, end),
+                  'search-results-highlight',
+                  'line'
+                );
+            }
           });
+          return __line;
+        });
 
-        // resize editor based on content length
-        _editor.setOption(
-          'maxLines',
-          lines.reduce(function(len, line) {return len + line.length;}, 0)
-        );
+      // resize editor based on content length
+      _editor.setOption(
+        'maxLines',
+        lines.reduce(function(len, line) {return len + line.length;}, 0)
+      );
 
-        _editor.getSession().setValue(lines.join('\n'));
+      _editor.getSession().setValue(lines.join('\n'));
 
-      };
     };
-  }
+  };
+}
 
-})();

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/4c60b27c/zeppelin-web/src/components/arrayOrderingSrv/arrayOrdering.service.js
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/components/arrayOrderingSrv/arrayOrdering.service.js b/zeppelin-web/src/components/arrayOrderingSrv/arrayOrdering.service.js
index 6f89ebb..7b9d41a 100644
--- a/zeppelin-web/src/components/arrayOrderingSrv/arrayOrdering.service.js
+++ b/zeppelin-web/src/components/arrayOrderingSrv/arrayOrdering.service.js
@@ -11,29 +11,27 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
 
-  angular.module('zeppelinWebApp').service('arrayOrderingSrv', arrayOrderingSrv);
+angular.module('zeppelinWebApp').service('arrayOrderingSrv', arrayOrderingSrv);
 
-  arrayOrderingSrv.$inject = ['TRASH_FOLDER_ID'];
+arrayOrderingSrv.$inject = ['TRASH_FOLDER_ID'];
 
-  function arrayOrderingSrv(TRASH_FOLDER_ID) {
-    var arrayOrderingSrv = this;
+function arrayOrderingSrv(TRASH_FOLDER_ID) {
+  var arrayOrderingSrv = this;
 
-    this.noteListOrdering = function(note) {
-      if (note.id === TRASH_FOLDER_ID) {
-        return '\uFFFF';
-      }
-      return arrayOrderingSrv.getNoteName(note);
-    };
+  this.noteListOrdering = function(note) {
+    if (note.id === TRASH_FOLDER_ID) {
+      return '\uFFFF';
+    }
+    return arrayOrderingSrv.getNoteName(note);
+  };
 
-    this.getNoteName = function(note) {
-      if (note.name === undefined || note.name.trim() === '') {
-        return 'Note ' + note.id;
-      } else {
-        return note.name;
-      }
-    };
-  }
+  this.getNoteName = function(note) {
+    if (note.name === undefined || note.name.trim() === '') {
+      return 'Note ' + note.id;
+    } else {
+      return note.name;
+    }
+  };
+}
 
-})();

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/4c60b27c/zeppelin-web/src/components/baseUrl/baseUrl.service.js
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/components/baseUrl/baseUrl.service.js b/zeppelin-web/src/components/baseUrl/baseUrl.service.js
index 465b327..ff5e11b 100644
--- a/zeppelin-web/src/components/baseUrl/baseUrl.service.js
+++ b/zeppelin-web/src/components/baseUrl/baseUrl.service.js
@@ -11,41 +11,39 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
 
-  angular.module('zeppelinWebApp').service('baseUrlSrv', baseUrlSrv);
+angular.module('zeppelinWebApp').service('baseUrlSrv', baseUrlSrv);
 
-  function baseUrlSrv() {
-    this.getPort = function() {
-      var port = Number(location.port);
-      if (!port) {
-        port = 80;
-        if (location.protocol === 'https:') {
-          port = 443;
-        }
+function baseUrlSrv() {
+  this.getPort = function() {
+    var port = Number(location.port);
+    if (!port) {
+      port = 80;
+      if (location.protocol === 'https:') {
+        port = 443;
       }
-      //Exception for when running locally via grunt
-      if (port === 3333 || port === 9000) {
-        port = 8080;
-      }
-      return port;
-    };
+    }
+    //Exception for when running locally via grunt
+    if (port === 3333 || port === 9000) {
+      port = 8080;
+    }
+    return port;
+  };
 
-    this.getWebsocketUrl = function() {
-      var wsProtocol = location.protocol === 'https:' ? 'wss:' : 'ws:';
-      return wsProtocol + '//' + location.hostname + ':' + this.getPort() +
+  this.getWebsocketUrl = function() {
+    var wsProtocol = location.protocol === 'https:' ? 'wss:' : 'ws:';
+    return wsProtocol + '//' + location.hostname + ':' + this.getPort() +
       skipTrailingSlash(location.pathname) + '/ws';
-    };
+  };
 
-    this.getRestApiBase = function() {
-      return location.protocol + '//' + location.hostname + ':' +
+  this.getRestApiBase = function() {
+    return location.protocol + '//' + location.hostname + ':' +
       this.getPort() + skipTrailingSlash(location.pathname) +
-        '/api';
-    };
+      '/api';
+  };
 
-    var skipTrailingSlash = function(path) {
-      return path.replace(/\/$/, '');
-    };
-  }
+  var skipTrailingSlash = function(path) {
+    return path.replace(/\/$/, '');
+  };
+}
 
-})();

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/4c60b27c/zeppelin-web/src/components/browser-detect/browserDetect.service.js
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/components/browser-detect/browserDetect.service.js b/zeppelin-web/src/components/browser-detect/browserDetect.service.js
index 9e84616..2fda717 100644
--- a/zeppelin-web/src/components/browser-detect/browserDetect.service.js
+++ b/zeppelin-web/src/components/browser-detect/browserDetect.service.js
@@ -11,32 +11,30 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
 
-  angular.module('zeppelinWebApp').service('browserDetectService', browserDetectService);
+angular.module('zeppelinWebApp').service('browserDetectService', browserDetectService);
 
-  function browserDetectService() {
-    this.detectIE = function() {
-      var ua = window.navigator.userAgent;
-      var msie = ua.indexOf('MSIE ');
-      if (msie > 0) {
-        // IE 10 or older => return version number
-        return parseInt(ua.substring(msie + 5, ua.indexOf('.', msie)), 10);
-      }
-      var trident = ua.indexOf('Trident/');
-      if (trident > 0) {
-        // IE 11 => return version number
-        var rv = ua.indexOf('rv:');
-        return parseInt(ua.substring(rv + 3, ua.indexOf('.', rv)), 10);
-      }
-      var edge = ua.indexOf('Edge/');
-      if (edge > 0) {
-        // IE 12 (aka Edge) => return version number
-        return parseInt(ua.substring(edge + 5, ua.indexOf('.', edge)), 10);
-      }
-      // other browser
-      return false;
-    };
-  }
+function browserDetectService() {
+  this.detectIE = function() {
+    var ua = window.navigator.userAgent;
+    var msie = ua.indexOf('MSIE ');
+    if (msie > 0) {
+      // IE 10 or older => return version number
+      return parseInt(ua.substring(msie + 5, ua.indexOf('.', msie)), 10);
+    }
+    var trident = ua.indexOf('Trident/');
+    if (trident > 0) {
+      // IE 11 => return version number
+      var rv = ua.indexOf('rv:');
+      return parseInt(ua.substring(rv + 3, ua.indexOf('.', rv)), 10);
+    }
+    var edge = ua.indexOf('Edge/');
+    if (edge > 0) {
+      // IE 12 (aka Edge) => return version number
+      return parseInt(ua.substring(edge + 5, ua.indexOf('.', edge)), 10);
+    }
+    // other browser
+    return false;
+  };
+}
 
-})();

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/4c60b27c/zeppelin-web/src/components/clipboard/clipboard.controller.js
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/components/clipboard/clipboard.controller.js b/zeppelin-web/src/components/clipboard/clipboard.controller.js
index 804db40..a989920 100644
--- a/zeppelin-web/src/components/clipboard/clipboard.controller.js
+++ b/zeppelin-web/src/components/clipboard/clipboard.controller.js
@@ -11,25 +11,23 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
-  angular.module('zeppelinWebApp').controller('clipboardCtrl', clipboardCtrl);
-  clipboardCtrl.$inject = ['$scope'];
+angular.module('zeppelinWebApp').controller('clipboardCtrl', clipboardCtrl);
+clipboardCtrl.$inject = ['$scope'];
 
-  function clipboardCtrl($scope) {
-    $scope.complete = function(e) {
-      $scope.copied = true;
-      $scope.tooltip = 'Copied!';
-      setTimeout(function() {
-        $scope.tooltip = 'Copy to clipboard';
-      }, 400);
-    };
-    $scope.$watch('input', function() {
-      $scope.copied = false;
+function clipboardCtrl($scope) {
+  $scope.complete = function(e) {
+    $scope.copied = true;
+    $scope.tooltip = 'Copied!';
+    setTimeout(function() {
       $scope.tooltip = 'Copy to clipboard';
-    });
-    $scope.clipError = function(e) {
-      console.log('Error: ' + e.name + ' - ' + e.message);
-      $scope.tooltip = 'Not supported browser';
-    };
-  }
-})();
+    }, 400);
+  };
+  $scope.$watch('input', function() {
+    $scope.copied = false;
+    $scope.tooltip = 'Copy to clipboard';
+  });
+  $scope.clipError = function(e) {
+    console.log('Error: ' + e.name + ' - ' + e.message);
+    $scope.tooltip = 'Not supported browser';
+  };
+}

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/4c60b27c/zeppelin-web/src/components/dropdowninput/dropdowninput.directive.js
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/components/dropdowninput/dropdowninput.directive.js b/zeppelin-web/src/components/dropdowninput/dropdowninput.directive.js
index ab4b60b..a690aed 100644
--- a/zeppelin-web/src/components/dropdowninput/dropdowninput.directive.js
+++ b/zeppelin-web/src/components/dropdowninput/dropdowninput.directive.js
@@ -11,19 +11,17 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
 
-  angular.module('zeppelinWebApp').directive('dropdownInput', dropdownInput);
+angular.module('zeppelinWebApp').directive('dropdownInput', dropdownInput);
 
-  function dropdownInput() {
-    return {
-      restrict: 'A',
-      link: function(scope, element) {
-        element.bind('click', function(event) {
-          event.stopPropagation();
-        });
-      }
-    };
-  }
+function dropdownInput() {
+  return {
+    restrict: 'A',
+    link: function(scope, element) {
+      element.bind('click', function(event) {
+        event.stopPropagation();
+      });
+    }
+  };
+}
 
-})();

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/4c60b27c/zeppelin-web/src/components/editor/codeEditor.directive.js
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/components/editor/codeEditor.directive.js b/zeppelin-web/src/components/editor/codeEditor.directive.js
index 7ad74c6..09ef21f 100644
--- a/zeppelin-web/src/components/editor/codeEditor.directive.js
+++ b/zeppelin-web/src/components/editor/codeEditor.directive.js
@@ -11,31 +11,29 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
 
-  angular.module('zeppelinWebApp').directive('codeEditor', codeEditor);
+angular.module('zeppelinWebApp').directive('codeEditor', codeEditor);
 
-  function codeEditor($templateRequest, $compile) {
-    return {
-      restrict: 'AE',
-      scope: {
-        paragraphId: '=paragraphId',
-        paragraph: '=paragraphContext',
-        dirtyText: '=dirtyText',
-        originalText: '=originalText',
-        onLoad: '=onLoad',
-        revisionView: '=revisionView'
-      },
-      link: function(scope, element, attrs, controller) {
-        $templateRequest('components/editor/ace.editor.directive.html').then(function(editorHtml) {
-          var editor = angular.element(editorHtml);
-          editor.attr('id', scope.paragraphId + '_editor');
-          element.append(editor);
-          $compile(editor)(scope);
-          console.log('codeEditor directive revision view is ' + scope.revisionView);
-        });
-      }
-    };
-  }
+function codeEditor($templateRequest, $compile) {
+  return {
+    restrict: 'AE',
+    scope: {
+      paragraphId: '=paragraphId',
+      paragraph: '=paragraphContext',
+      dirtyText: '=dirtyText',
+      originalText: '=originalText',
+      onLoad: '=onLoad',
+      revisionView: '=revisionView'
+    },
+    link: function(scope, element, attrs, controller) {
+      $templateRequest('components/editor/ace.editor.directive.html').then(function(editorHtml) {
+        var editor = angular.element(editorHtml);
+        editor.attr('id', scope.paragraphId + '_editor');
+        element.append(editor);
+        $compile(editor)(scope);
+        console.log('codeEditor directive revision view is ' + scope.revisionView);
+      });
+    }
+  };
+}
 
-})();

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/4c60b27c/zeppelin-web/src/components/elasticInputCtrl/elasticInput.controller.js
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/components/elasticInputCtrl/elasticInput.controller.js b/zeppelin-web/src/components/elasticInputCtrl/elasticInput.controller.js
index d647200..f56c172 100644
--- a/zeppelin-web/src/components/elasticInputCtrl/elasticInput.controller.js
+++ b/zeppelin-web/src/components/elasticInputCtrl/elasticInput.controller.js
@@ -11,14 +11,12 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
 
-  angular.module('zeppelinWebApp').controller('ElasticInputCtrl', ElasticInputCtrl);
+angular.module('zeppelinWebApp').controller('ElasticInputCtrl', ElasticInputCtrl);
 
-  function ElasticInputCtrl() {
-    var vm = this;
-    vm.showEditor = false;
-    vm.value = '';
-  }
+function ElasticInputCtrl() {
+  var vm = this;
+  vm.showEditor = false;
+  vm.value = '';
+}
 
-})();

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/4c60b27c/zeppelin-web/src/components/expandCollapse/expandCollapse.directive.js
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/components/expandCollapse/expandCollapse.directive.js b/zeppelin-web/src/components/expandCollapse/expandCollapse.directive.js
index 1230934..1f73f64 100644
--- a/zeppelin-web/src/components/expandCollapse/expandCollapse.directive.js
+++ b/zeppelin-web/src/components/expandCollapse/expandCollapse.directive.js
@@ -11,30 +11,28 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
 
-  angular.module('zeppelinWebApp').directive('expandCollapse', expandCollapse);
+angular.module('zeppelinWebApp').directive('expandCollapse', expandCollapse);
 
-  function expandCollapse() {
-    return {
-      restrict: 'EA',
-      link: function(scope, element, attrs) {
-        angular.element(element).click(function(event) {
-          if (angular.element(element).find('.expandable:visible').length > 1) {
-            angular.element(element).find('.expandable:visible').slideUp('slow');
-            angular.element(element).find('i.icon-folder-alt').toggleClass('icon-folder icon-folder-alt');
-          } else {
-            angular.element(element).find('.expandable').first().slideToggle('200',function() {
-              // do not toggle trash folder
-              if (angular.element(element).find('.fa-trash-o').length === 0) {
-                angular.element(element).find('i').first().toggleClass('icon-folder icon-folder-alt');
-              }
-            });
-          }
-          event.stopPropagation();
-        });
-      }
-    };
-  }
+function expandCollapse() {
+  return {
+    restrict: 'EA',
+    link: function(scope, element, attrs) {
+      angular.element(element).click(function(event) {
+        if (angular.element(element).find('.expandable:visible').length > 1) {
+          angular.element(element).find('.expandable:visible').slideUp('slow');
+          angular.element(element).find('i.icon-folder-alt').toggleClass('icon-folder icon-folder-alt');
+        } else {
+          angular.element(element).find('.expandable').first().slideToggle('200',function() {
+            // do not toggle trash folder
+            if (angular.element(element).find('.fa-trash-o').length === 0) {
+              angular.element(element).find('i').first().toggleClass('icon-folder icon-folder-alt');
+            }
+          });
+        }
+        event.stopPropagation();
+      });
+    }
+  };
+}
 
-})();

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/4c60b27c/zeppelin-web/src/components/interpreter/interpreter.directive.js
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/components/interpreter/interpreter.directive.js b/zeppelin-web/src/components/interpreter/interpreter.directive.js
index f2c0280..b207e34 100644
--- a/zeppelin-web/src/components/interpreter/interpreter.directive.js
+++ b/zeppelin-web/src/components/interpreter/interpreter.directive.js
@@ -11,24 +11,22 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
 
-  angular.module('zeppelinWebApp').directive('interpreterDirective', interpreterDirective);
+angular.module('zeppelinWebApp').directive('interpreterDirective', interpreterDirective);
 
-  interpreterDirective.$inject = ['$timeout'];
+interpreterDirective.$inject = ['$timeout'];
 
-  function interpreterDirective($timeout) {
-    return {
-      restrict: 'A',
-      link: function(scope, element, attr) {
-        if (scope.$last === true) {
-          $timeout(function() {
-            var id = 'ngRenderFinished';
-            scope.$emit(id);
-          });
-        }
+function interpreterDirective($timeout) {
+  return {
+    restrict: 'A',
+    link: function(scope, element, attr) {
+      if (scope.$last === true) {
+        $timeout(function() {
+          var id = 'ngRenderFinished';
+          scope.$emit(id);
+        });
       }
-    };
-  }
+    }
+  };
+}
 
-})();


[4/6] zeppelin git commit: [ZEPPELIN-1927] Remove useless function wrapping in all js files

Posted by mo...@apache.org.
http://git-wip-us.apache.org/repos/asf/zeppelin/blob/4c60b27c/zeppelin-web/src/app/notebook/paragraph/paragraph.controller.js
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/app/notebook/paragraph/paragraph.controller.js b/zeppelin-web/src/app/notebook/paragraph/paragraph.controller.js
index 431ec94..6c612dd 100644
--- a/zeppelin-web/src/app/notebook/paragraph/paragraph.controller.js
+++ b/zeppelin-web/src/app/notebook/paragraph/paragraph.controller.js
@@ -11,1193 +11,1191 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
-
-  angular.module('zeppelinWebApp').controller('ParagraphCtrl', ParagraphCtrl);
-
-  ParagraphCtrl.$inject = [
-    '$scope',
-    '$rootScope',
-    '$route',
-    '$window',
-    '$routeParams',
-    '$location',
-    '$timeout',
-    '$compile',
-    '$http',
-    '$q',
-    'websocketMsgSrv',
-    'baseUrlSrv',
-    'ngToast',
-    'saveAsService',
-    'noteVarShareService'
-  ];
-
-  function ParagraphCtrl($scope, $rootScope, $route, $window, $routeParams, $location,
-                         $timeout, $compile, $http, $q, websocketMsgSrv,
-                         baseUrlSrv, ngToast, saveAsService, noteVarShareService) {
-    var ANGULAR_FUNCTION_OBJECT_NAME_PREFIX = '_Z_ANGULAR_FUNC_';
-    $scope.parentNote = null;
-    $scope.paragraph = null;
-    $scope.originalText = '';
-    $scope.editor = null;
-
-    var editorSetting = {};
-    // flag that is used to set editor setting on paste percent sign
-    var pastePercentSign = false;
-    // flag that is used to set editor setting on save interpreter bindings
-    var setInterpreterBindings = false;
-    var paragraphScope = $rootScope.$new(true, $rootScope);
-
-    // to keep backward compatibility
-    $scope.compiledScope = paragraphScope;
-
-    paragraphScope.z = {
-      // z.runParagraph('20150213-231621_168813393')
-      runParagraph: function(paragraphId) {
-        if (paragraphId) {
-          var filtered = $scope.parentNote.paragraphs.filter(function(x) {
-            return x.id === paragraphId;});
-          if (filtered.length === 1) {
-            var paragraph = filtered[0];
-            websocketMsgSrv.runParagraph(paragraph.id, paragraph.title, paragraph.text,
-                paragraph.config, paragraph.settings.params);
-          } else {
-            ngToast.danger({content: 'Cannot find a paragraph with id \'' + paragraphId + '\'',
-              verticalPosition: 'top', dismissOnTimeout: false});
-          }
-        } else {
-          ngToast.danger({
-            content: 'Please provide a \'paragraphId\' when calling z.runParagraph(paragraphId)',
-            verticalPosition: 'top', dismissOnTimeout: false});
-        }
-      },
-
-      // Example: z.angularBind('my_var', 'Test Value', '20150213-231621_168813393')
-      angularBind: function(varName, value, paragraphId) {
-        // Only push to server if there paragraphId is defined
-        if (paragraphId) {
-          websocketMsgSrv.clientBindAngularObject($routeParams.noteId, varName, value, paragraphId);
-        } else {
-          ngToast.danger({
-            content: 'Please provide a \'paragraphId\' when calling ' +
-            'z.angularBind(varName, value, \'PUT_HERE_PARAGRAPH_ID\')',
-            verticalPosition: 'top', dismissOnTimeout: false});
-        }
-      },
 
-      // Example: z.angularUnBind('my_var', '20150213-231621_168813393')
-      angularUnbind: function(varName, paragraphId) {
-        // Only push to server if paragraphId is defined
-        if (paragraphId) {
-          websocketMsgSrv.clientUnbindAngularObject($routeParams.noteId, varName, paragraphId);
+angular.module('zeppelinWebApp').controller('ParagraphCtrl', ParagraphCtrl);
+
+ParagraphCtrl.$inject = [
+  '$scope',
+  '$rootScope',
+  '$route',
+  '$window',
+  '$routeParams',
+  '$location',
+  '$timeout',
+  '$compile',
+  '$http',
+  '$q',
+  'websocketMsgSrv',
+  'baseUrlSrv',
+  'ngToast',
+  'saveAsService',
+  'noteVarShareService'
+];
+
+function ParagraphCtrl($scope, $rootScope, $route, $window, $routeParams, $location,
+                       $timeout, $compile, $http, $q, websocketMsgSrv,
+                       baseUrlSrv, ngToast, saveAsService, noteVarShareService) {
+  var ANGULAR_FUNCTION_OBJECT_NAME_PREFIX = '_Z_ANGULAR_FUNC_';
+  $scope.parentNote = null;
+  $scope.paragraph = null;
+  $scope.originalText = '';
+  $scope.editor = null;
+
+  var editorSetting = {};
+  // flag that is used to set editor setting on paste percent sign
+  var pastePercentSign = false;
+  // flag that is used to set editor setting on save interpreter bindings
+  var setInterpreterBindings = false;
+  var paragraphScope = $rootScope.$new(true, $rootScope);
+
+  // to keep backward compatibility
+  $scope.compiledScope = paragraphScope;
+
+  paragraphScope.z = {
+    // z.runParagraph('20150213-231621_168813393')
+    runParagraph: function(paragraphId) {
+      if (paragraphId) {
+        var filtered = $scope.parentNote.paragraphs.filter(function(x) {
+          return x.id === paragraphId;});
+        if (filtered.length === 1) {
+          var paragraph = filtered[0];
+          websocketMsgSrv.runParagraph(paragraph.id, paragraph.title, paragraph.text,
+            paragraph.config, paragraph.settings.params);
         } else {
-          ngToast.danger({
-            content: 'Please provide a \'paragraphId\' when calling ' +
-            'z.angularUnbind(varName, \'PUT_HERE_PARAGRAPH_ID\')',
+          ngToast.danger({content: 'Cannot find a paragraph with id \'' + paragraphId + '\'',
             verticalPosition: 'top', dismissOnTimeout: false});
         }
+      } else {
+        ngToast.danger({
+          content: 'Please provide a \'paragraphId\' when calling z.runParagraph(paragraphId)',
+          verticalPosition: 'top', dismissOnTimeout: false});
       }
-    };
-
-    var angularObjectRegistry = {};
-
-    // Controller init
-    $scope.init = function(newParagraph, note) {
-      $scope.paragraph = newParagraph;
-      $scope.parentNote = note;
-      $scope.originalText = angular.copy(newParagraph.text);
-      $scope.chart = {};
-      $scope.baseMapOption = ['Streets', 'Satellite', 'Hybrid', 'Topo', 'Gray', 'Oceans', 'Terrain'];
-      $scope.colWidthOption = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12];
-      $scope.paragraphFocused = false;
-      if (newParagraph.focus) {
-        $scope.paragraphFocused = true;
-      }
-      if (!$scope.paragraph.config) {
-        $scope.paragraph.config = {};
-      }
-
-      noteVarShareService.put($scope.paragraph.id + '_paragraphScope', paragraphScope);
-
-      initializeDefault($scope.paragraph.config);
-    };
-
-    var initializeDefault = function(config) {
-      if (!config.colWidth) {
-        config.colWidth = 12;
-      }
-
-      if (config.enabled === undefined) {
-        config.enabled = true;
-      }
-
-      if (!config.results) {
-        config.results = {};
-      }
-
-      if (!config.editorSetting) {
-        config.editorSetting = {};
-      } else if (config.editorSetting.editOnDblClick) {
-        editorSetting.isOutputHidden = config.editorSetting.editOnDblClick;
-      }
-    };
-
-    $scope.$on('updateParagraphOutput', function(event, data) {
-      if ($scope.paragraph.id === data.paragraphId) {
-        if (!$scope.paragraph.results) {
-          $scope.paragraph.results = {};
-        }
-        if (!$scope.paragraph.results.msg) {
-          $scope.paragraph.results.msg = [];
-        }
-
-        var update = ($scope.paragraph.results.msg[data.index]) ? true : false;
-
-        $scope.paragraph.results.msg[data.index] = {
-          data: data.data,
-          type: data.type
-        };
-
-        if (update) {
-          $rootScope.$broadcast(
-            'updateResult',
-            $scope.paragraph.results.msg[data.index],
-            $scope.paragraph.config.results[data.index],
-            $scope.paragraph,
-            data.index);
-        }
-      }
-    });
+    },
 
-    $scope.getIframeDimensions = function() {
-      if ($scope.asIframe) {
-        var paragraphid = '#' + $routeParams.paragraphId + '_container';
-        var height = angular.element(paragraphid).height();
-        return height;
-      }
-      return 0;
-    };
-
-    $scope.$watch($scope.getIframeDimensions, function(newValue, oldValue) {
-      if ($scope.asIframe && newValue) {
-        var message = {};
-        message.height = newValue;
-        message.url = $location.$$absUrl;
-        $window.parent.postMessage(angular.toJson(message), '*');
+    // Example: z.angularBind('my_var', 'Test Value', '20150213-231621_168813393')
+    angularBind: function(varName, value, paragraphId) {
+      // Only push to server if there paragraphId is defined
+      if (paragraphId) {
+        websocketMsgSrv.clientBindAngularObject($routeParams.noteId, varName, value, paragraphId);
+      } else {
+        ngToast.danger({
+          content: 'Please provide a \'paragraphId\' when calling ' +
+          'z.angularBind(varName, value, \'PUT_HERE_PARAGRAPH_ID\')',
+          verticalPosition: 'top', dismissOnTimeout: false});
       }
-    });
-
-    $scope.getEditor = function() {
-      return $scope.editor;
-    };
+    },
 
-    $scope.$watch($scope.getEditor, function(newValue, oldValue) {
-      if (newValue === null || newValue === undefined) {
-        console.log('editor isnt loaded yet, returning');
-        return;
-      }
-      if ($scope.revisionView === true) {
-        $scope.editor.setReadOnly(true);
+    // Example: z.angularUnBind('my_var', '20150213-231621_168813393')
+    angularUnbind: function(varName, paragraphId) {
+      // Only push to server if paragraphId is defined
+      if (paragraphId) {
+        websocketMsgSrv.clientUnbindAngularObject($routeParams.noteId, varName, paragraphId);
       } else {
-        $scope.editor.setReadOnly(false);
+        ngToast.danger({
+          content: 'Please provide a \'paragraphId\' when calling ' +
+          'z.angularUnbind(varName, \'PUT_HERE_PARAGRAPH_ID\')',
+          verticalPosition: 'top', dismissOnTimeout: false});
       }
-    });
-
-    var isEmpty = function(object) {
-      return !object;
-    };
-
-    $scope.isRunning = function(paragraph) {
-      return paragraph.status === 'RUNNING' || paragraph.status === 'PENDING';
-    };
-
-    $scope.cancelParagraph = function(paragraph) {
-      console.log('Cancel %o', paragraph.id);
-      websocketMsgSrv.cancelParagraphRun(paragraph.id);
-    };
-
-    $scope.runParagraph = function(data) {
-      websocketMsgSrv.runParagraph($scope.paragraph.id, $scope.paragraph.title,
-                                   data, $scope.paragraph.config, $scope.paragraph.settings.params);
-      $scope.originalText = angular.copy(data);
-      $scope.dirtyText = undefined;
-
-      if ($scope.paragraph.config.editorSetting.editOnDblClick) {
-        closeEditorAndOpenTable($scope.paragraph);
-      } else if (editorSetting.isOutputHidden &&
-          !$scope.paragraph.config.editorSetting.editOnDblClick) {
-        // %md/%angular repl make output to be hidden by default after running
-        // so should open output if repl changed from %md/%angular to another
-        openEditorAndOpenTable($scope.paragraph);
+    }
+  };
+
+  var angularObjectRegistry = {};
+
+  // Controller init
+  $scope.init = function(newParagraph, note) {
+    $scope.paragraph = newParagraph;
+    $scope.parentNote = note;
+    $scope.originalText = angular.copy(newParagraph.text);
+    $scope.chart = {};
+    $scope.baseMapOption = ['Streets', 'Satellite', 'Hybrid', 'Topo', 'Gray', 'Oceans', 'Terrain'];
+    $scope.colWidthOption = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12];
+    $scope.paragraphFocused = false;
+    if (newParagraph.focus) {
+      $scope.paragraphFocused = true;
+    }
+    if (!$scope.paragraph.config) {
+      $scope.paragraph.config = {};
+    }
+
+    noteVarShareService.put($scope.paragraph.id + '_paragraphScope', paragraphScope);
+
+    initializeDefault($scope.paragraph.config);
+  };
+
+  var initializeDefault = function(config) {
+    if (!config.colWidth) {
+      config.colWidth = 12;
+    }
+
+    if (config.enabled === undefined) {
+      config.enabled = true;
+    }
+
+    if (!config.results) {
+      config.results = {};
+    }
+
+    if (!config.editorSetting) {
+      config.editorSetting = {};
+    } else if (config.editorSetting.editOnDblClick) {
+      editorSetting.isOutputHidden = config.editorSetting.editOnDblClick;
+    }
+  };
+
+  $scope.$on('updateParagraphOutput', function(event, data) {
+    if ($scope.paragraph.id === data.paragraphId) {
+      if (!$scope.paragraph.results) {
+        $scope.paragraph.results = {};
       }
-      editorSetting.isOutputHidden = $scope.paragraph.config.editorSetting.editOnDblClick;
-    };
-
-    $scope.saveParagraph = function(paragraph) {
-      const dirtyText = paragraph.text;
-      if (dirtyText === undefined || dirtyText === $scope.originalText) {
-        return;
-      }
-      commitParagraph(paragraph);
-      $scope.originalText = dirtyText;
-      $scope.dirtyText = undefined;
-    };
-
-    $scope.toggleEnableDisable = function(paragraph) {
-      paragraph.config.enabled = !paragraph.config.enabled;
-      commitParagraph(paragraph);
-    };
-
-    $scope.run = function(paragraph, editorValue) {
-      if (editorValue && !$scope.isRunning(paragraph)) {
-        $scope.runParagraph(editorValue);
+      if (!$scope.paragraph.results.msg) {
+        $scope.paragraph.results.msg = [];
       }
-    };
-
-    $scope.moveUp = function(paragraph) {
-      $scope.$emit('moveParagraphUp', paragraph);
-    };
 
-    $scope.moveDown = function(paragraph) {
-      $scope.$emit('moveParagraphDown', paragraph);
-    };
+      var update = ($scope.paragraph.results.msg[data.index]) ? true : false;
 
-    $scope.insertNew = function(position) {
-      $scope.$emit('insertParagraph', $scope.paragraph.id, position);
-    };
+      $scope.paragraph.results.msg[data.index] = {
+        data: data.data,
+        type: data.type
+      };
 
-    $scope.copyPara = function(position) {
-      var editorValue = $scope.editor.getValue();
-      if (editorValue) {
-        $scope.copyParagraph(editorValue, position);
+      if (update) {
+        $rootScope.$broadcast(
+          'updateResult',
+          $scope.paragraph.results.msg[data.index],
+          $scope.paragraph.config.results[data.index],
+          $scope.paragraph,
+          data.index);
       }
-    };
-
-    $scope.copyParagraph = function(data, position) {
-      var newIndex = -1;
-      for (var i = 0; i < $scope.note.paragraphs.length; i++) {
-        if ($scope.note.paragraphs[i].id === $scope.paragraph.id) {
-          //determine position of where to add new paragraph; default is below
-          if (position === 'above') {
-            newIndex = i;
-          } else {
-            newIndex = i + 1;
-          }
-          break;
+    }
+  });
+
+  $scope.getIframeDimensions = function() {
+    if ($scope.asIframe) {
+      var paragraphid = '#' + $routeParams.paragraphId + '_container';
+      var height = angular.element(paragraphid).height();
+      return height;
+    }
+    return 0;
+  };
+
+  $scope.$watch($scope.getIframeDimensions, function(newValue, oldValue) {
+    if ($scope.asIframe && newValue) {
+      var message = {};
+      message.height = newValue;
+      message.url = $location.$$absUrl;
+      $window.parent.postMessage(angular.toJson(message), '*');
+    }
+  });
+
+  $scope.getEditor = function() {
+    return $scope.editor;
+  };
+
+  $scope.$watch($scope.getEditor, function(newValue, oldValue) {
+    if (newValue === null || newValue === undefined) {
+      console.log('editor isnt loaded yet, returning');
+      return;
+    }
+    if ($scope.revisionView === true) {
+      $scope.editor.setReadOnly(true);
+    } else {
+      $scope.editor.setReadOnly(false);
+    }
+  });
+
+  var isEmpty = function(object) {
+    return !object;
+  };
+
+  $scope.isRunning = function(paragraph) {
+    return paragraph.status === 'RUNNING' || paragraph.status === 'PENDING';
+  };
+
+  $scope.cancelParagraph = function(paragraph) {
+    console.log('Cancel %o', paragraph.id);
+    websocketMsgSrv.cancelParagraphRun(paragraph.id);
+  };
+
+  $scope.runParagraph = function(data) {
+    websocketMsgSrv.runParagraph($scope.paragraph.id, $scope.paragraph.title,
+      data, $scope.paragraph.config, $scope.paragraph.settings.params);
+    $scope.originalText = angular.copy(data);
+    $scope.dirtyText = undefined;
+
+    if ($scope.paragraph.config.editorSetting.editOnDblClick) {
+      closeEditorAndOpenTable($scope.paragraph);
+    } else if (editorSetting.isOutputHidden &&
+      !$scope.paragraph.config.editorSetting.editOnDblClick) {
+      // %md/%angular repl make output to be hidden by default after running
+      // so should open output if repl changed from %md/%angular to another
+      openEditorAndOpenTable($scope.paragraph);
+    }
+    editorSetting.isOutputHidden = $scope.paragraph.config.editorSetting.editOnDblClick;
+  };
+
+  $scope.saveParagraph = function(paragraph) {
+    const dirtyText = paragraph.text;
+    if (dirtyText === undefined || dirtyText === $scope.originalText) {
+      return;
+    }
+    commitParagraph(paragraph);
+    $scope.originalText = dirtyText;
+    $scope.dirtyText = undefined;
+  };
+
+  $scope.toggleEnableDisable = function(paragraph) {
+    paragraph.config.enabled = !paragraph.config.enabled;
+    commitParagraph(paragraph);
+  };
+
+  $scope.run = function(paragraph, editorValue) {
+    if (editorValue && !$scope.isRunning(paragraph)) {
+      $scope.runParagraph(editorValue);
+    }
+  };
+
+  $scope.moveUp = function(paragraph) {
+    $scope.$emit('moveParagraphUp', paragraph);
+  };
+
+  $scope.moveDown = function(paragraph) {
+    $scope.$emit('moveParagraphDown', paragraph);
+  };
+
+  $scope.insertNew = function(position) {
+    $scope.$emit('insertParagraph', $scope.paragraph.id, position);
+  };
+
+  $scope.copyPara = function(position) {
+    var editorValue = $scope.editor.getValue();
+    if (editorValue) {
+      $scope.copyParagraph(editorValue, position);
+    }
+  };
+
+  $scope.copyParagraph = function(data, position) {
+    var newIndex = -1;
+    for (var i = 0; i < $scope.note.paragraphs.length; i++) {
+      if ($scope.note.paragraphs[i].id === $scope.paragraph.id) {
+        //determine position of where to add new paragraph; default is below
+        if (position === 'above') {
+          newIndex = i;
+        } else {
+          newIndex = i + 1;
         }
+        break;
       }
-
-      if (newIndex < 0 || newIndex > $scope.note.paragraphs.length) {
-        return;
-      }
-
-      var config = angular.copy($scope.paragraph.config);
-      config.editorHide = false;
-
-      websocketMsgSrv.copyParagraph(newIndex, $scope.paragraph.title, data,
-                                        config, $scope.paragraph.settings.params);
-    };
-
-    $scope.removeParagraph = function(paragraph) {
-      var paragraphs = angular.element('div[id$="_paragraphColumn_main"]');
-      if (paragraphs[paragraphs.length - 1].id.indexOf(paragraph.id) === 0) {
-        BootstrapDialog.alert({
-          closable: true,
-          message: 'The last paragraph can\'t be deleted.',
-          callback: function(result) {
-            if (result) {
-              $scope.editor.focus();
-            }
+    }
+
+    if (newIndex < 0 || newIndex > $scope.note.paragraphs.length) {
+      return;
+    }
+
+    var config = angular.copy($scope.paragraph.config);
+    config.editorHide = false;
+
+    websocketMsgSrv.copyParagraph(newIndex, $scope.paragraph.title, data,
+      config, $scope.paragraph.settings.params);
+  };
+
+  $scope.removeParagraph = function(paragraph) {
+    var paragraphs = angular.element('div[id$="_paragraphColumn_main"]');
+    if (paragraphs[paragraphs.length - 1].id.indexOf(paragraph.id) === 0) {
+      BootstrapDialog.alert({
+        closable: true,
+        message: 'The last paragraph can\'t be deleted.',
+        callback: function(result) {
+          if (result) {
+            $scope.editor.focus();
           }
-        });
-      } else {
-        BootstrapDialog.confirm({
-          closable: true,
-          title: '',
-          message: 'Do you want to delete this paragraph?',
-          callback: function(result) {
-            if (result) {
-              console.log('Remove paragraph');
-              websocketMsgSrv.removeParagraph(paragraph.id);
-              $scope.$emit('moveFocusToNextParagraph', $scope.paragraph.id);
-            }
+        }
+      });
+    } else {
+      BootstrapDialog.confirm({
+        closable: true,
+        title: '',
+        message: 'Do you want to delete this paragraph?',
+        callback: function(result) {
+          if (result) {
+            console.log('Remove paragraph');
+            websocketMsgSrv.removeParagraph(paragraph.id);
+            $scope.$emit('moveFocusToNextParagraph', $scope.paragraph.id);
           }
-        });
-      }
-    };
-
-    $scope.clearParagraphOutput = function(paragraph) {
-      websocketMsgSrv.clearParagraphOutput(paragraph.id);
-    };
-
-    $scope.toggleEditor = function(paragraph) {
-      if (paragraph.config.editorHide) {
-        $scope.openEditor(paragraph);
-      } else {
-        $scope.closeEditor(paragraph);
-      }
-    };
-
-    $scope.closeEditor = function(paragraph) {
-      console.log('close the note');
-      paragraph.config.editorHide = true;
-      commitParagraph(paragraph);
-    };
-
-    $scope.openEditor = function(paragraph) {
-      console.log('open the note');
-      paragraph.config.editorHide = false;
-      commitParagraph(paragraph);
-    };
-
-    $scope.closeTable = function(paragraph) {
-      console.log('close the output');
-      paragraph.config.tableHide = true;
-      commitParagraph(paragraph);
-    };
-
-    $scope.openTable = function(paragraph) {
-      console.log('open the output');
-      paragraph.config.tableHide = false;
-      commitParagraph(paragraph);
-    };
-
-    var openEditorAndCloseTable = function(paragraph) {
-      manageEditorAndTableState(paragraph, false, true);
-    };
-
-    var closeEditorAndOpenTable = function(paragraph) {
-      manageEditorAndTableState(paragraph, true, false);
-    };
-
-    var openEditorAndOpenTable = function(paragraph) {
-      manageEditorAndTableState(paragraph, false, false);
-    };
-
-    var manageEditorAndTableState = function(paragraph, hideEditor, hideTable) {
-      paragraph.config.editorHide = hideEditor;
-      paragraph.config.tableHide = hideTable;
-      commitParagraph(paragraph);
-    };
-
-    $scope.showTitle = function(paragraph) {
-      paragraph.config.title = true;
-      commitParagraph(paragraph);
-    };
-
-    $scope.hideTitle = function(paragraph) {
-      paragraph.config.title = false;
-      commitParagraph(paragraph);
-    };
-
-    $scope.setTitle = function(paragraph) {
-      commitParagraph(paragraph);
-    };
-
-    $scope.showLineNumbers = function(paragraph) {
-      paragraph.config.lineNumbers = true;
-      $scope.editor.renderer.setShowGutter(true);
-      commitParagraph(paragraph);
-    };
-
-    $scope.hideLineNumbers = function(paragraph) {
-      paragraph.config.lineNumbers = false;
-      $scope.editor.renderer.setShowGutter(false);
+        }
+      });
+    }
+  };
+
+  $scope.clearParagraphOutput = function(paragraph) {
+    websocketMsgSrv.clearParagraphOutput(paragraph.id);
+  };
+
+  $scope.toggleEditor = function(paragraph) {
+    if (paragraph.config.editorHide) {
+      $scope.openEditor(paragraph);
+    } else {
+      $scope.closeEditor(paragraph);
+    }
+  };
+
+  $scope.closeEditor = function(paragraph) {
+    console.log('close the note');
+    paragraph.config.editorHide = true;
+    commitParagraph(paragraph);
+  };
+
+  $scope.openEditor = function(paragraph) {
+    console.log('open the note');
+    paragraph.config.editorHide = false;
+    commitParagraph(paragraph);
+  };
+
+  $scope.closeTable = function(paragraph) {
+    console.log('close the output');
+    paragraph.config.tableHide = true;
+    commitParagraph(paragraph);
+  };
+
+  $scope.openTable = function(paragraph) {
+    console.log('open the output');
+    paragraph.config.tableHide = false;
+    commitParagraph(paragraph);
+  };
+
+  var openEditorAndCloseTable = function(paragraph) {
+    manageEditorAndTableState(paragraph, false, true);
+  };
+
+  var closeEditorAndOpenTable = function(paragraph) {
+    manageEditorAndTableState(paragraph, true, false);
+  };
+
+  var openEditorAndOpenTable = function(paragraph) {
+    manageEditorAndTableState(paragraph, false, false);
+  };
+
+  var manageEditorAndTableState = function(paragraph, hideEditor, hideTable) {
+    paragraph.config.editorHide = hideEditor;
+    paragraph.config.tableHide = hideTable;
+    commitParagraph(paragraph);
+  };
+
+  $scope.showTitle = function(paragraph) {
+    paragraph.config.title = true;
+    commitParagraph(paragraph);
+  };
+
+  $scope.hideTitle = function(paragraph) {
+    paragraph.config.title = false;
+    commitParagraph(paragraph);
+  };
+
+  $scope.setTitle = function(paragraph) {
+    commitParagraph(paragraph);
+  };
+
+  $scope.showLineNumbers = function(paragraph) {
+    paragraph.config.lineNumbers = true;
+    $scope.editor.renderer.setShowGutter(true);
+    commitParagraph(paragraph);
+  };
+
+  $scope.hideLineNumbers = function(paragraph) {
+    paragraph.config.lineNumbers = false;
+    $scope.editor.renderer.setShowGutter(false);
+    commitParagraph(paragraph);
+  };
+
+  $scope.columnWidthClass = function(n) {
+    if ($scope.asIframe) {
+      return 'col-md-12';
+    } else {
+      return 'col-md-' + n;
+    }
+  };
+
+  $scope.changeColWidth = function(paragraph, width) {
+    angular.element('.navbar-right.open').removeClass('open');
+    if (width !== paragraph.config.colWidth) {
+      paragraph.config.colWidth = width;
       commitParagraph(paragraph);
-    };
-
-    $scope.columnWidthClass = function(n) {
-      if ($scope.asIframe) {
-        return 'col-md-12';
-      } else {
-        return 'col-md-' + n;
-      }
-    };
-
-    $scope.changeColWidth = function(paragraph, width) {
-      angular.element('.navbar-right.open').removeClass('open');
-      if (width !== paragraph.config.colWidth) {
-        paragraph.config.colWidth = width;
-        commitParagraph(paragraph);
+    }
+  };
+
+  $scope.toggleOutput = function(paragraph) {
+    paragraph.config.tableHide = !paragraph.config.tableHide;
+    commitParagraph(paragraph);
+  };
+
+  $scope.loadForm = function(formulaire, params) {
+    var value = formulaire.defaultValue;
+    if (params[formulaire.name]) {
+      value = params[formulaire.name];
+    }
+
+    $scope.paragraph.settings.params[formulaire.name] = value;
+  };
+
+  $scope.toggleCheckbox = function(formulaire, option) {
+    var idx = $scope.paragraph.settings.params[formulaire.name].indexOf(option.value);
+    if (idx > -1) {
+      $scope.paragraph.settings.params[formulaire.name].splice(idx, 1);
+    } else {
+      $scope.paragraph.settings.params[formulaire.name].push(option.value);
+    }
+  };
+
+  $scope.aceChanged = function(_, editor) {
+    var session = editor.getSession();
+    var dirtyText = session.getValue();
+    $scope.dirtyText = dirtyText;
+    $scope.startSaveTimer();
+    setParagraphMode(session, dirtyText, editor.getCursorPosition());
+  };
+
+  $scope.aceLoaded = function(_editor) {
+    var langTools = ace.require('ace/ext/language_tools');
+    var Range = ace.require('ace/range').Range;
+
+    _editor.$blockScrolling = Infinity;
+    $scope.editor = _editor;
+    $scope.editor.on('input', $scope.aceChanged);
+    if (_editor.container.id !== '{{paragraph.id}}_editor') {
+      $scope.editor.renderer.setShowGutter($scope.paragraph.config.lineNumbers);
+      $scope.editor.setShowFoldWidgets(false);
+      $scope.editor.setHighlightActiveLine(false);
+      $scope.editor.setHighlightGutterLine(false);
+      $scope.editor.getSession().setUseWrapMode(true);
+      $scope.editor.setTheme('ace/theme/chrome');
+      $scope.editor.setReadOnly($scope.isRunning($scope.paragraph));
+      if ($scope.paragraphFocused) {
+        $scope.editor.focus();
+        $scope.goToEnd($scope.editor);
       }
-    };
 
-    $scope.toggleOutput = function(paragraph) {
-      paragraph.config.tableHide = !paragraph.config.tableHide;
-      commitParagraph(paragraph);
-    };
-
-    $scope.loadForm = function(formulaire, params) {
-      var value = formulaire.defaultValue;
-      if (params[formulaire.name]) {
-        value = params[formulaire.name];
+      autoAdjustEditorHeight(_editor);
+      angular.element(window).resize(function() {
+        autoAdjustEditorHeight(_editor);
+      });
+
+      if (navigator.appVersion.indexOf('Mac') !== -1) {
+        $scope.editor.setKeyboardHandler('ace/keyboard/emacs');
+        $rootScope.isMac = true;
+      } else if (navigator.appVersion.indexOf('Win') !== -1 ||
+        navigator.appVersion.indexOf('X11') !== -1 ||
+        navigator.appVersion.indexOf('Linux') !== -1) {
+        $rootScope.isMac = false;
+        // not applying emacs key binding while the binding override Ctrl-v. default behavior of paste text on windows.
       }
 
-      $scope.paragraph.settings.params[formulaire.name] = value;
-    };
+      var remoteCompleter = {
+        getCompletions: function(editor, session, pos, prefix, callback) {
+          if (!editor.isFocused()) {
+            return;
+          }
 
-    $scope.toggleCheckbox = function(formulaire, option) {
-      var idx = $scope.paragraph.settings.params[formulaire.name].indexOf(option.value);
-      if (idx > -1) {
-        $scope.paragraph.settings.params[formulaire.name].splice(idx, 1);
-      } else {
-        $scope.paragraph.settings.params[formulaire.name].push(option.value);
-      }
-    };
-
-    $scope.aceChanged = function(_, editor) {
-      var session = editor.getSession();
-      var dirtyText = session.getValue();
-      $scope.dirtyText = dirtyText;
-      $scope.startSaveTimer();
-      setParagraphMode(session, dirtyText, editor.getCursorPosition());
-    };
-
-    $scope.aceLoaded = function(_editor) {
-      var langTools = ace.require('ace/ext/language_tools');
-      var Range = ace.require('ace/range').Range;
-
-      _editor.$blockScrolling = Infinity;
-      $scope.editor = _editor;
-      $scope.editor.on('input', $scope.aceChanged);
-      if (_editor.container.id !== '{{paragraph.id}}_editor') {
-        $scope.editor.renderer.setShowGutter($scope.paragraph.config.lineNumbers);
-        $scope.editor.setShowFoldWidgets(false);
-        $scope.editor.setHighlightActiveLine(false);
-        $scope.editor.setHighlightGutterLine(false);
-        $scope.editor.getSession().setUseWrapMode(true);
-        $scope.editor.setTheme('ace/theme/chrome');
-        $scope.editor.setReadOnly($scope.isRunning($scope.paragraph));
-        if ($scope.paragraphFocused) {
-          $scope.editor.focus();
-          $scope.goToEnd($scope.editor);
+          pos = session.getTextRange(new Range(0, 0, pos.row, pos.column)).length;
+          var buf = session.getValue();
+
+          websocketMsgSrv.completion($scope.paragraph.id, buf, pos);
+
+          $scope.$on('completionList', function(event, data) {
+            if (data.completions) {
+              var completions = [];
+              for (var c in data.completions) {
+                var v = data.completions[c];
+                completions.push({
+                  name: v.name,
+                  value: v.value,
+                  score: 300
+                });
+              }
+              callback(null, completions);
+            }
+          });
         }
-
-        autoAdjustEditorHeight(_editor);
-        angular.element(window).resize(function() {
-          autoAdjustEditorHeight(_editor);
-        });
-
-        if (navigator.appVersion.indexOf('Mac') !== -1) {
-          $scope.editor.setKeyboardHandler('ace/keyboard/emacs');
-          $rootScope.isMac = true;
-        } else if (navigator.appVersion.indexOf('Win') !== -1 ||
-                   navigator.appVersion.indexOf('X11') !== -1 ||
-                   navigator.appVersion.indexOf('Linux') !== -1) {
-          $rootScope.isMac = false;
-          // not applying emacs key binding while the binding override Ctrl-v. default behavior of paste text on windows.
+      };
+
+      langTools.setCompleters([remoteCompleter, langTools.keyWordCompleter, langTools.snippetCompleter,
+        langTools.textCompleter]);
+
+      $scope.editor.setOptions({
+        enableBasicAutocompletion: true,
+        enableSnippets: false,
+        enableLiveAutocompletion: false
+      });
+
+      $scope.handleFocus = function(value, isDigestPass) {
+        $scope.paragraphFocused = value;
+        if (isDigestPass === false || isDigestPass === undefined) {
+          // Protect against error in case digest is already running
+          $timeout(function() {
+            // Apply changes since they come from 3rd party library
+            $scope.$digest();
+          });
         }
+      };
 
-        var remoteCompleter = {
-          getCompletions: function(editor, session, pos, prefix, callback) {
-            if (!editor.isFocused()) {
-              return;
-            }
-
-            pos = session.getTextRange(new Range(0, 0, pos.row, pos.column)).length;
-            var buf = session.getValue();
-
-            websocketMsgSrv.completion($scope.paragraph.id, buf, pos);
-
-            $scope.$on('completionList', function(event, data) {
-              if (data.completions) {
-                var completions = [];
-                for (var c in data.completions) {
-                  var v = data.completions[c];
-                  completions.push({
-                    name: v.name,
-                    value: v.value,
-                    score: 300
-                  });
-                }
-                callback(null, completions);
-              }
-            });
-          }
-        };
-
-        langTools.setCompleters([remoteCompleter, langTools.keyWordCompleter, langTools.snippetCompleter,
-          langTools.textCompleter]);
-
-        $scope.editor.setOptions({
-          enableBasicAutocompletion: true,
-          enableSnippets: false,
-          enableLiveAutocompletion: false
-        });
-
-        $scope.handleFocus = function(value, isDigestPass) {
-          $scope.paragraphFocused = value;
-          if (isDigestPass === false || isDigestPass === undefined) {
-            // Protect against error in case digest is already running
-            $timeout(function() {
-              // Apply changes since they come from 3rd party library
-              $scope.$digest();
-            });
-          }
-        };
-
-        $scope.editor.on('focus', function() {
-          $scope.handleFocus(true);
-        });
-
-        $scope.editor.on('blur', function() {
-          $scope.handleFocus(false);
-        });
+      $scope.editor.on('focus', function() {
+        $scope.handleFocus(true);
+      });
 
-        $scope.editor.on('paste', function(e) {
-          if (e.text.indexOf('%') === 0) {
-            pastePercentSign = true;
-          }
-        });
+      $scope.editor.on('blur', function() {
+        $scope.handleFocus(false);
+      });
 
-        $scope.editor.getSession().on('change', function(e, editSession) {
-          autoAdjustEditorHeight(_editor);
-        });
+      $scope.editor.on('paste', function(e) {
+        if (e.text.indexOf('%') === 0) {
+          pastePercentSign = true;
+        }
+      });
 
-        setParagraphMode($scope.editor.getSession(), $scope.editor.getSession().getValue());
+      $scope.editor.getSession().on('change', function(e, editSession) {
+        autoAdjustEditorHeight(_editor);
+      });
+
+      setParagraphMode($scope.editor.getSession(), $scope.editor.getSession().getValue());
+
+      // autocomplete on '.'
+      /*
+       $scope.editor.commands.on("afterExec", function(e, t) {
+       if (e.command.name == "insertstring" && e.args == "." ) {
+       var all = e.editor.completers;
+       //e.editor.completers = [remoteCompleter];
+       e.editor.execCommand("startAutocomplete");
+       //e.editor.completers = all;
+       }
+       });
+       */
+
+      // remove binding
+      $scope.editor.commands.bindKey('ctrl-alt-n.', null);
+      $scope.editor.commands.removeCommand('showSettingsMenu');
+
+      $scope.editor.commands.bindKey('ctrl-alt-l', null);
+      $scope.editor.commands.bindKey('ctrl-alt-w', null);
+      $scope.editor.commands.bindKey('ctrl-alt-a', null);
+      $scope.editor.commands.bindKey('ctrl-alt-k', null);
+      $scope.editor.commands.bindKey('ctrl-alt-e', null);
+      $scope.editor.commands.bindKey('ctrl-alt-t', null);
+
+      // autocomplete on 'ctrl+.'
+      $scope.editor.commands.bindKey('ctrl-.', 'startAutocomplete');
+      $scope.editor.commands.bindKey('ctrl-space', null);
+
+      var keyBindingEditorFocusAction = function(scrollValue) {
+        var numRows = $scope.editor.getSession().getLength();
+        var currentRow = $scope.editor.getCursorPosition().row;
+        if (currentRow === 0 && scrollValue <= 0) {
+          // move focus to previous paragraph
+          $scope.$emit('moveFocusToPreviousParagraph', $scope.paragraph.id);
+        } else if (currentRow === numRows - 1 && scrollValue >= 0) {
+          $scope.$emit('moveFocusToNextParagraph', $scope.paragraph.id);
+        } else {
+          $scope.scrollToCursor($scope.paragraph.id, scrollValue);
+        }
+      };
 
-        // autocomplete on '.'
-        /*
-        $scope.editor.commands.on("afterExec", function(e, t) {
-          if (e.command.name == "insertstring" && e.args == "." ) {
-        var all = e.editor.completers;
-        //e.editor.completers = [remoteCompleter];
-        e.editor.execCommand("startAutocomplete");
-        //e.editor.completers = all;
-      }
-        });
-        */
-
-        // remove binding
-        $scope.editor.commands.bindKey('ctrl-alt-n.', null);
-        $scope.editor.commands.removeCommand('showSettingsMenu');
-
-        $scope.editor.commands.bindKey('ctrl-alt-l', null);
-        $scope.editor.commands.bindKey('ctrl-alt-w', null);
-        $scope.editor.commands.bindKey('ctrl-alt-a', null);
-        $scope.editor.commands.bindKey('ctrl-alt-k', null);
-        $scope.editor.commands.bindKey('ctrl-alt-e', null);
-        $scope.editor.commands.bindKey('ctrl-alt-t', null);
-
-        // autocomplete on 'ctrl+.'
-        $scope.editor.commands.bindKey('ctrl-.', 'startAutocomplete');
-        $scope.editor.commands.bindKey('ctrl-space', null);
-
-        var keyBindingEditorFocusAction = function(scrollValue) {
-          var numRows = $scope.editor.getSession().getLength();
-          var currentRow = $scope.editor.getCursorPosition().row;
-          if (currentRow === 0 && scrollValue <= 0) {
-            // move focus to previous paragraph
-            $scope.$emit('moveFocusToPreviousParagraph', $scope.paragraph.id);
-          } else if (currentRow === numRows - 1 && scrollValue >= 0) {
-            $scope.$emit('moveFocusToNextParagraph', $scope.paragraph.id);
-          } else {
-            $scope.scrollToCursor($scope.paragraph.id, scrollValue);
+      // handle cursor moves
+      $scope.editor.keyBinding.origOnCommandKey = $scope.editor.keyBinding.onCommandKey;
+      $scope.editor.keyBinding.onCommandKey = function(e, hashId, keyCode) {
+        if ($scope.editor.completer && $scope.editor.completer.activated) { // if autocompleter is active
+        } else {
+          // fix ace editor focus issue in chrome (textarea element goes to top: -1000px after focused by cursor move)
+          if (parseInt(angular.element('#' + $scope.paragraph.id + '_editor > textarea')
+              .css('top').replace('px', '')) < 0) {
+            var position = $scope.editor.getCursorPosition();
+            var cursorPos = $scope.editor.renderer.$cursorLayer.getPixelPosition(position, true);
+            angular.element('#' + $scope.paragraph.id + '_editor > textarea').css('top', cursorPos.top);
           }
-        };
 
-        // handle cursor moves
-        $scope.editor.keyBinding.origOnCommandKey = $scope.editor.keyBinding.onCommandKey;
-        $scope.editor.keyBinding.onCommandKey = function(e, hashId, keyCode) {
-          if ($scope.editor.completer && $scope.editor.completer.activated) { // if autocompleter is active
-          } else {
-            // fix ace editor focus issue in chrome (textarea element goes to top: -1000px after focused by cursor move)
-            if (parseInt(angular.element('#' + $scope.paragraph.id + '_editor > textarea')
-                .css('top').replace('px', '')) < 0) {
-              var position = $scope.editor.getCursorPosition();
-              var cursorPos = $scope.editor.renderer.$cursorLayer.getPixelPosition(position, true);
-              angular.element('#' + $scope.paragraph.id + '_editor > textarea').css('top', cursorPos.top);
-            }
+          var ROW_UP = -1;
+          var ROW_DOWN = 1;
 
-            var ROW_UP = -1;
-            var ROW_DOWN = 1;
-
-            switch (keyCode) {
-              case 38:
+          switch (keyCode) {
+            case 38:
+              keyBindingEditorFocusAction(ROW_UP);
+              break;
+            case 80:
+              if (e.ctrlKey && !e.altKey) {
                 keyBindingEditorFocusAction(ROW_UP);
-                break;
-              case 80:
-                if (e.ctrlKey && !e.altKey) {
-                  keyBindingEditorFocusAction(ROW_UP);
-                }
-                break;
-              case 40:
+              }
+              break;
+            case 40:
+              keyBindingEditorFocusAction(ROW_DOWN);
+              break;
+            case 78:
+              if (e.ctrlKey && !e.altKey) {
                 keyBindingEditorFocusAction(ROW_DOWN);
-                break;
-              case 78:
-                if (e.ctrlKey && !e.altKey) {
-                  keyBindingEditorFocusAction(ROW_DOWN);
-                }
-                break;
-            }
+              }
+              break;
           }
-          this.origOnCommandKey(e, hashId, keyCode);
-        };
-      }
-    };
-
-    var getEditorSetting = function(paragraph, interpreterName) {
-      var deferred = $q.defer();
-      websocketMsgSrv.getEditorSetting(paragraph.id, interpreterName);
-      $timeout(
-        $scope.$on('editorSetting', function(event, data) {
+        }
+        this.origOnCommandKey(e, hashId, keyCode);
+      };
+    }
+  };
+
+  var getEditorSetting = function(paragraph, interpreterName) {
+    var deferred = $q.defer();
+    websocketMsgSrv.getEditorSetting(paragraph.id, interpreterName);
+    $timeout(
+      $scope.$on('editorSetting', function(event, data) {
           if (paragraph.id === data.paragraphId) {
             deferred.resolve(data);
           }
         }
       ), 1000);
-      return deferred.promise;
-    };
-
-    var setEditorLanguage = function(session, language) {
-      var mode = 'ace/mode/';
-      mode += language;
-      $scope.paragraph.config.editorMode = mode;
-      session.setMode(mode);
-    };
-
-    var setParagraphMode = function(session, paragraphText, pos) {
-      // Evaluate the mode only if the the position is undefined
-      // or the first 30 characters of the paragraph have been modified
-      // or cursor position is at beginning of second line.(in case user hit enter after typing %magic)
-      if ((typeof pos === 'undefined') || (pos.row === 0 && pos.column < 30) ||
-          (pos.row === 1 && pos.column === 0) || pastePercentSign) {
-        // If paragraph loading, use config value if exists
-        if ((typeof pos === 'undefined') && $scope.paragraph.config.editorMode &&
-            !setInterpreterBindings) {
-          session.setMode($scope.paragraph.config.editorMode);
-        } else {
-          var magic = getInterpreterName(paragraphText);
-          if (editorSetting.magic !== magic) {
-            editorSetting.magic = magic;
-            getEditorSetting($scope.paragraph, magic)
-              .then(function(setting) {
-                setEditorLanguage(session, setting.editor.language);
-                _.merge($scope.paragraph.config.editorSetting, setting.editor);
-              });
-          }
+    return deferred.promise;
+  };
+
+  var setEditorLanguage = function(session, language) {
+    var mode = 'ace/mode/';
+    mode += language;
+    $scope.paragraph.config.editorMode = mode;
+    session.setMode(mode);
+  };
+
+  var setParagraphMode = function(session, paragraphText, pos) {
+    // Evaluate the mode only if the the position is undefined
+    // or the first 30 characters of the paragraph have been modified
+    // or cursor position is at beginning of second line.(in case user hit enter after typing %magic)
+    if ((typeof pos === 'undefined') || (pos.row === 0 && pos.column < 30) ||
+      (pos.row === 1 && pos.column === 0) || pastePercentSign) {
+      // If paragraph loading, use config value if exists
+      if ((typeof pos === 'undefined') && $scope.paragraph.config.editorMode &&
+        !setInterpreterBindings) {
+        session.setMode($scope.paragraph.config.editorMode);
+      } else {
+        var magic = getInterpreterName(paragraphText);
+        if (editorSetting.magic !== magic) {
+          editorSetting.magic = magic;
+          getEditorSetting($scope.paragraph, magic)
+            .then(function(setting) {
+              setEditorLanguage(session, setting.editor.language);
+              _.merge($scope.paragraph.config.editorSetting, setting.editor);
+            });
         }
       }
-      pastePercentSign = false;
-      setInterpreterBindings = false;
-    };
-
-    var getInterpreterName = function(paragraphText) {
-      var intpNameRegexp = /^\s*%(.+?)\s/g;
-      var match = intpNameRegexp.exec(paragraphText);
-      if (match) {
-        return match[1].trim();
+    }
+    pastePercentSign = false;
+    setInterpreterBindings = false;
+  };
+
+  var getInterpreterName = function(paragraphText) {
+    var intpNameRegexp = /^\s*%(.+?)\s/g;
+    var match = intpNameRegexp.exec(paragraphText);
+    if (match) {
+      return match[1].trim();
       // get default interpreter name if paragraph text doesn't start with '%'
       // TODO(mina): dig into the cause what makes interpreterBindings to have no element
-      } else if ($scope.$parent.interpreterBindings.length !== 0) {
-        return $scope.$parent.interpreterBindings[0].name;
-      }
-      return '';
-    };
-
-    var autoAdjustEditorHeight = function(editor) {
-      var height =
-        editor.getSession().getScreenLength() *
-        editor.renderer.lineHeight +
-        editor.renderer.scrollBar.getWidth();
-
-      angular.element('#' + editor.container.id).height(height.toString() + 'px');
-      editor.resize();
-    };
-
-    $rootScope.$on('scrollToCursor', function(event) {
-      // scroll on 'scrollToCursor' event only when cursor is in the last paragraph
-      var paragraphs = angular.element('div[id$="_paragraphColumn_main"]');
-      if (paragraphs[paragraphs.length - 1].id.indexOf($scope.paragraph.id) === 0) {
-        $scope.scrollToCursor($scope.paragraph.id, 0);
-      }
-    });
-
-    /** scrollToCursor if it is necessary
-     * when cursor touches scrollTriggerEdgeMargin from the top (or bottom) of the screen, it autoscroll to place cursor around 1/3 of screen height from the top (or bottom)
-     * paragraphId : paragraph that has active cursor
-     * lastCursorMove : 1(down), 0, -1(up) last cursor move event
-     **/
-    $scope.scrollToCursor = function(paragraphId, lastCursorMove) {
-      if (!$scope.editor || !$scope.editor.isFocused()) {
-        // only make sense when editor is focused
-        return;
+    } else if ($scope.$parent.interpreterBindings.length !== 0) {
+      return $scope.$parent.interpreterBindings[0].name;
+    }
+    return '';
+  };
+
+  var autoAdjustEditorHeight = function(editor) {
+    var height =
+      editor.getSession().getScreenLength() *
+      editor.renderer.lineHeight +
+      editor.renderer.scrollBar.getWidth();
+
+    angular.element('#' + editor.container.id).height(height.toString() + 'px');
+    editor.resize();
+  };
+
+  $rootScope.$on('scrollToCursor', function(event) {
+    // scroll on 'scrollToCursor' event only when cursor is in the last paragraph
+    var paragraphs = angular.element('div[id$="_paragraphColumn_main"]');
+    if (paragraphs[paragraphs.length - 1].id.indexOf($scope.paragraph.id) === 0) {
+      $scope.scrollToCursor($scope.paragraph.id, 0);
+    }
+  });
+
+  /** scrollToCursor if it is necessary
+   * when cursor touches scrollTriggerEdgeMargin from the top (or bottom) of the screen, it autoscroll to place cursor around 1/3 of screen height from the top (or bottom)
+   * paragraphId : paragraph that has active cursor
+   * lastCursorMove : 1(down), 0, -1(up) last cursor move event
+   **/
+  $scope.scrollToCursor = function(paragraphId, lastCursorMove) {
+    if (!$scope.editor || !$scope.editor.isFocused()) {
+      // only make sense when editor is focused
+      return;
+    }
+    var lineHeight = $scope.editor.renderer.lineHeight;
+    var headerHeight = 103; // menubar, notebook titlebar
+    var scrollTriggerEdgeMargin = 50;
+
+    var documentHeight = angular.element(document).height();
+    var windowHeight = angular.element(window).height();  // actual viewport height
+
+    var scrollPosition = angular.element(document).scrollTop();
+    var editorPosition = angular.element('#' + paragraphId + '_editor').offset();
+    var position = $scope.editor.getCursorPosition();
+    var lastCursorPosition = $scope.editor.renderer.$cursorLayer.getPixelPosition(position, true);
+
+    var calculatedCursorPosition = editorPosition.top + lastCursorPosition.top + lineHeight * lastCursorMove;
+
+    var scrollTargetPos;
+    if (calculatedCursorPosition < scrollPosition + headerHeight + scrollTriggerEdgeMargin) {
+      scrollTargetPos = calculatedCursorPosition - headerHeight - ((windowHeight - headerHeight) / 3);
+      if (scrollTargetPos < 0) {
+        scrollTargetPos = 0;
       }
-      var lineHeight = $scope.editor.renderer.lineHeight;
-      var headerHeight = 103; // menubar, notebook titlebar
-      var scrollTriggerEdgeMargin = 50;
+    } else if (calculatedCursorPosition > scrollPosition + scrollTriggerEdgeMargin + windowHeight - headerHeight) {
+      scrollTargetPos = calculatedCursorPosition - headerHeight - ((windowHeight - headerHeight) * 2 / 3);
 
-      var documentHeight = angular.element(document).height();
-      var windowHeight = angular.element(window).height();  // actual viewport height
-
-      var scrollPosition = angular.element(document).scrollTop();
-      var editorPosition = angular.element('#' + paragraphId + '_editor').offset();
-      var position = $scope.editor.getCursorPosition();
-      var lastCursorPosition = $scope.editor.renderer.$cursorLayer.getPixelPosition(position, true);
-
-      var calculatedCursorPosition = editorPosition.top + lastCursorPosition.top + lineHeight * lastCursorMove;
-
-      var scrollTargetPos;
-      if (calculatedCursorPosition < scrollPosition + headerHeight + scrollTriggerEdgeMargin) {
-        scrollTargetPos = calculatedCursorPosition - headerHeight - ((windowHeight - headerHeight) / 3);
-        if (scrollTargetPos < 0) {
-          scrollTargetPos = 0;
-        }
-      } else if (calculatedCursorPosition > scrollPosition + scrollTriggerEdgeMargin + windowHeight - headerHeight) {
-        scrollTargetPos = calculatedCursorPosition - headerHeight - ((windowHeight - headerHeight) * 2 / 3);
-
-        if (scrollTargetPos > documentHeight) {
-          scrollTargetPos = documentHeight;
-        }
+      if (scrollTargetPos > documentHeight) {
+        scrollTargetPos = documentHeight;
       }
+    }
 
-      // cancel previous scroll animation
-      var bodyEl = angular.element('body');
-      bodyEl.stop();
-      bodyEl.finish();
+    // cancel previous scroll animation
+    var bodyEl = angular.element('body');
+    bodyEl.stop();
+    bodyEl.finish();
 
-      // scroll to scrollTargetPos
-      bodyEl.scrollTo(scrollTargetPos, {axis: 'y', interrupt: true, duration: 100});
-    };
+    // scroll to scrollTargetPos
+    bodyEl.scrollTo(scrollTargetPos, {axis: 'y', interrupt: true, duration: 100});
+  };
 
-    $scope.getEditorValue = function() {
-      return $scope.editor.getValue();
-    };
+  $scope.getEditorValue = function() {
+    return $scope.editor.getValue();
+  };
 
-    $scope.getProgress = function() {
-      return $scope.currentProgress || 0;
-    };
+  $scope.getProgress = function() {
+    return $scope.currentProgress || 0;
+  };
 
-    $scope.getExecutionTime = function(pdata) {
-      var timeMs = Date.parse(pdata.dateFinished) - Date.parse(pdata.dateStarted);
-      if (isNaN(timeMs) || timeMs < 0) {
-        if ($scope.isResultOutdated(pdata)) {
-          return 'outdated';
-        }
-        return '';
-      }
-      var user = (pdata.user === undefined || pdata.user === null) ? 'anonymous' : pdata.user;
-      var desc = 'Took ' + moment.duration((timeMs / 1000), 'seconds').format('h [hrs] m [min] s [sec]') +
-        '. Last updated by ' + user + ' at ' + moment(pdata.dateFinished).format('MMMM DD YYYY, h:mm:ss A') + '.';
+  $scope.getExecutionTime = function(pdata) {
+    var timeMs = Date.parse(pdata.dateFinished) - Date.parse(pdata.dateStarted);
+    if (isNaN(timeMs) || timeMs < 0) {
       if ($scope.isResultOutdated(pdata)) {
-        desc += ' (outdated)';
+        return 'outdated';
       }
-      return desc;
-    };
-
-    $scope.getElapsedTime = function(paragraph) {
-      return 'Started ' + moment(paragraph.dateStarted).fromNow() + '.';
-    };
-
-    $scope.isResultOutdated = function(pdata) {
-      if (pdata.dateUpdated !== undefined && Date.parse(pdata.dateUpdated) > Date.parse(pdata.dateStarted)) {
-        return true;
+      return '';
+    }
+    var user = (pdata.user === undefined || pdata.user === null) ? 'anonymous' : pdata.user;
+    var desc = 'Took ' + moment.duration((timeMs / 1000), 'seconds').format('h [hrs] m [min] s [sec]') +
+      '. Last updated by ' + user + ' at ' + moment(pdata.dateFinished).format('MMMM DD YYYY, h:mm:ss A') + '.';
+    if ($scope.isResultOutdated(pdata)) {
+      desc += ' (outdated)';
+    }
+    return desc;
+  };
+
+  $scope.getElapsedTime = function(paragraph) {
+    return 'Started ' + moment(paragraph.dateStarted).fromNow() + '.';
+  };
+
+  $scope.isResultOutdated = function(pdata) {
+    if (pdata.dateUpdated !== undefined && Date.parse(pdata.dateUpdated) > Date.parse(pdata.dateStarted)) {
+      return true;
+    }
+    return false;
+  };
+
+  $scope.goToEnd = function(editor) {
+    editor.navigateFileEnd();
+  };
+
+  $scope.getResultType = function(paragraph) {
+    var pdata = (paragraph) ? paragraph : $scope.paragraph;
+    if (pdata.results && pdata.results.type) {
+      return pdata.results.type;
+    } else {
+      return 'TEXT';
+    }
+  };
+
+  $scope.parseTableCell = function(cell) {
+    if (!isNaN(cell)) {
+      if (cell.length === 0 || Number(cell) > Number.MAX_SAFE_INTEGER || Number(cell) < Number.MIN_SAFE_INTEGER) {
+        return cell;
+      } else {
+        return Number(cell);
       }
-      return false;
-    };
-
-    $scope.goToEnd = function(editor) {
-      editor.navigateFileEnd();
-    };
-
-    $scope.getResultType = function(paragraph) {
-      var pdata = (paragraph) ? paragraph : $scope.paragraph;
-      if (pdata.results && pdata.results.type) {
-        return pdata.results.type;
+    }
+    var d = moment(cell);
+    if (d.isValid()) {
+      return d;
+    }
+    return cell;
+  };
+
+  var commitParagraph = function(paragraph) {
+    const {
+      id,
+      title,
+      text,
+      config,
+      settings: {params},
+    } = paragraph;
+
+    websocketMsgSrv.commitParagraph(id, title, text, config, params);
+  };
+
+  /** Utility function */
+  $scope.goToSingleParagraph = function() {
+    var noteId = $route.current.pathParams.noteId;
+    var redirectToUrl = location.protocol + '//' + location.host + location.pathname + '#/notebook/' + noteId +
+      '/paragraph/' + $scope.paragraph.id + '?asIframe';
+    $window.open(redirectToUrl);
+  };
+
+  $scope.showScrollDownIcon = function(id) {
+    var doc = angular.element('#p' + id + '_text');
+    if (doc[0]) {
+      return doc[0].scrollHeight > doc.innerHeight();
+    }
+    return false;
+  };
+
+  $scope.scrollParagraphDown = function(id) {
+    var doc = angular.element('#p' + id + '_text');
+    doc.animate({scrollTop: doc[0].scrollHeight}, 500);
+    $scope.keepScrollDown = true;
+  };
+
+  $scope.showScrollUpIcon = function(id) {
+    if (angular.element('#p' + id + '_text')[0]) {
+      return angular.element('#p' + id + '_text')[0].scrollTop !== 0;
+    }
+    return false;
+
+  };
+
+  $scope.scrollParagraphUp = function(id) {
+    var doc = angular.element('#p' + id + '_text');
+    doc.animate({scrollTop: 0}, 500);
+    $scope.keepScrollDown = false;
+  };
+
+  $scope.$on('angularObjectUpdate', function(event, data) {
+    var noteId = $route.current.pathParams.noteId;
+    if (!data.noteId || data.noteId === noteId) {
+      var scope;
+      var registry;
+
+      if (!data.paragraphId || data.paragraphId === $scope.paragraph.id) {
+        scope = paragraphScope;
+        registry = angularObjectRegistry;
       } else {
-        return 'TEXT';
+        return;
       }
-    };
+      var varName = data.angularObject.name;
 
-    $scope.parseTableCell = function(cell) {
-      if (!isNaN(cell)) {
-        if (cell.length === 0 || Number(cell) > Number.MAX_SAFE_INTEGER || Number(cell) < Number.MIN_SAFE_INTEGER) {
-          return cell;
-        } else {
-          return Number(cell);
-        }
-      }
-      var d = moment(cell);
-      if (d.isValid()) {
-        return d;
-      }
-      return cell;
-    };
-
-    var commitParagraph = function(paragraph) {
-      const {
-        id,
-        title,
-        text,
-        config,
-        settings: {params},
-      } = paragraph;
-
-      websocketMsgSrv.commitParagraph(id, title, text, config, params);
-    };
-
-    /** Utility function */
-    $scope.goToSingleParagraph = function() {
-      var noteId = $route.current.pathParams.noteId;
-      var redirectToUrl = location.protocol + '//' + location.host + location.pathname + '#/notebook/' + noteId +
-        '/paragraph/' + $scope.paragraph.id + '?asIframe';
-      $window.open(redirectToUrl);
-    };
-
-    $scope.showScrollDownIcon = function(id) {
-      var doc = angular.element('#p' + id + '_text');
-      if (doc[0]) {
-        return doc[0].scrollHeight > doc.innerHeight();
-      }
-      return false;
-    };
-
-    $scope.scrollParagraphDown = function(id) {
-      var doc = angular.element('#p' + id + '_text');
-      doc.animate({scrollTop: doc[0].scrollHeight}, 500);
-      $scope.keepScrollDown = true;
-    };
-
-    $scope.showScrollUpIcon = function(id) {
-      if (angular.element('#p' + id + '_text')[0]) {
-        return angular.element('#p' + id + '_text')[0].scrollTop !== 0;
+      if (angular.equals(data.angularObject.object, scope[varName])) {
+        // return when update has no change
+        return;
       }
-      return false;
-
-    };
-
-    $scope.scrollParagraphUp = function(id) {
-      var doc = angular.element('#p' + id + '_text');
-      doc.animate({scrollTop: 0}, 500);
-      $scope.keepScrollDown = false;
-    };
-
-    $scope.$on('angularObjectUpdate', function(event, data) {
-      var noteId = $route.current.pathParams.noteId;
-      if (!data.noteId || data.noteId === noteId) {
-        var scope;
-        var registry;
 
-        if (!data.paragraphId || data.paragraphId === $scope.paragraph.id) {
-          scope = paragraphScope;
-          registry = angularObjectRegistry;
-        } else {
-          return;
-        }
-        var varName = data.angularObject.name;
-
-        if (angular.equals(data.angularObject.object, scope[varName])) {
-          // return when update has no change
-          return;
-        }
-
-        if (!registry[varName]) {
-          registry[varName] = {
-            interpreterGroupId: data.interpreterGroupId,
-            noteId: data.noteId,
-            paragraphId: data.paragraphId
-          };
-        } else {
-          registry[varName].noteId = registry[varName].noteId || data.noteId;
-          registry[varName].paragraphId = registry[varName].paragraphId || data.paragraphId;
-        }
+      if (!registry[varName]) {
+        registry[varName] = {
+          interpreterGroupId: data.interpreterGroupId,
+          noteId: data.noteId,
+          paragraphId: data.paragraphId
+        };
+      } else {
+        registry[varName].noteId = registry[varName].noteId || data.noteId;
+        registry[varName].paragraphId = registry[varName].paragraphId || data.paragraphId;
+      }
 
-        registry[varName].skipEmit = true;
+      registry[varName].skipEmit = true;
 
-        if (!registry[varName].clearWatcher) {
-          registry[varName].clearWatcher = scope.$watch(varName, function(newValue, oldValue) {
-            console.log('angular object (paragraph) updated %o %o', varName, registry[varName]);
-            if (registry[varName].skipEmit) {
-              registry[varName].skipEmit = false;
-              return;
-            }
-            websocketMsgSrv.updateAngularObject(
-              registry[varName].noteId,
-              registry[varName].paragraphId,
-              varName,
-              newValue,
-              registry[varName].interpreterGroupId);
-          });
-        }
-        console.log('angular object (paragraph) created %o', varName);
-        scope[varName] = data.angularObject.object;
-
-        // create proxy for AngularFunction
-        if (varName.indexOf(ANGULAR_FUNCTION_OBJECT_NAME_PREFIX) === 0) {
-          var funcName = varName.substring((ANGULAR_FUNCTION_OBJECT_NAME_PREFIX).length);
-          scope[funcName] = function() {
-            scope[varName] = arguments;
-            console.log('angular function (paragraph) invoked %o', arguments);
-          };
-
-          console.log('angular function (paragraph) created %o', scope[funcName]);
-        }
+      if (!registry[varName].clearWatcher) {
+        registry[varName].clearWatcher = scope.$watch(varName, function(newValue, oldValue) {
+          console.log('angular object (paragraph) updated %o %o', varName, registry[varName]);
+          if (registry[varName].skipEmit) {
+            registry[varName].skipEmit = false;
+            return;
+          }
+          websocketMsgSrv.updateAngularObject(
+            registry[varName].noteId,
+            registry[varName].paragraphId,
+            varName,
+            newValue,
+            registry[varName].interpreterGroupId);
+        });
       }
-    });
-
-    $scope.$on('angularObjectRemove', function(event, data) {
-      var noteId = $route.current.pathParams.noteId;
-      if (!data.noteId || data.noteId === noteId) {
-        var scope;
-        var registry;
+      console.log('angular object (paragraph) created %o', varName);
+      scope[varName] = data.angularObject.object;
+
+      // create proxy for AngularFunction
+      if (varName.indexOf(ANGULAR_FUNCTION_OBJECT_NAME_PREFIX) === 0) {
+        var funcName = varName.substring((ANGULAR_FUNCTION_OBJECT_NAME_PREFIX).length);
+        scope[funcName] = function() {
+          scope[varName] = arguments;
+          console.log('angular function (paragraph) invoked %o', arguments);
+        };
 
-        if (!data.paragraphId || data.paragraphId === $scope.paragraph.id) {
-          scope = paragraphScope;
-          registry = angularObjectRegistry;
-        } else {
-          return;
-        }
+        console.log('angular function (paragraph) created %o', scope[funcName]);
+      }
+    }
+  });
+
+  $scope.$on('angularObjectRemove', function(event, data) {
+    var noteId = $route.current.pathParams.noteId;
+    if (!data.noteId || data.noteId === noteId) {
+      var scope;
+      var registry;
+
+      if (!data.paragraphId || data.paragraphId === $scope.paragraph.id) {
+        scope = paragraphScope;
+        registry = angularObjectRegistry;
+      } else {
+        return;
+      }
 
-        var varName = data.name;
+      var varName = data.name;
 
-        // clear watcher
-        if (registry[varName]) {
-          registry[varName].clearWatcher();
-          registry[varName] = undefined;
-        }
+      // clear watcher
+      if (registry[varName]) {
+        registry[varName].clearWatcher();
+        registry[varName] = undefined;
+      }
 
-        // remove scope variable
-        scope[varName] = undefined;
+      // remove scope variable
+      scope[varName] = undefined;
 
-        // remove proxy for AngularFunction
-        if (varName.indexOf(ANGULAR_FUNCTION_OBJECT_NAME_PREFIX) === 0) {
-          var funcName = varName.substring((ANGULAR_FUNCTION_OBJECT_NAME_PREFIX).length);
-          scope[funcName] = undefined;
-        }
+      // remove proxy for AngularFunction
+      if (varName.indexOf(ANGULAR_FUNCTION_OBJECT_NAME_PREFIX) === 0) {
+        var funcName = varName.substring((ANGULAR_FUNCTION_OBJECT_NAME_PREFIX).length);
+        scope[funcName] = undefined;
       }
-    });
-
-    $scope.$on('updateParagraph', function(event, data) {
-      if (data.paragraph.id === $scope.paragraph.id &&
-          (data.paragraph.dateCreated !== $scope.paragraph.dateCreated ||
-           data.paragraph.dateFinished !== $scope.paragraph.dateFinished ||
-           data.paragraph.dateStarted !== $scope.paragraph.dateStarted ||
-           data.paragraph.dateUpdated !== $scope.paragraph.dateUpdated ||
-           data.paragraph.status !== $scope.paragraph.status ||
-           data.paragraph.jobName !== $scope.paragraph.jobName ||
-           data.paragraph.title !== $scope.paragraph.title ||
-           isEmpty(data.paragraph.results) !== isEmpty($scope.paragraph.results) ||
-           data.paragraph.errorMessage !== $scope.paragraph.errorMessage ||
-           !angular.equals(data.paragraph.settings, $scope.paragraph.settings) ||
-           !angular.equals(data.paragraph.config, $scope.paragraph.config))
-         ) {
-        var statusChanged = (data.paragraph.status !== $scope.paragraph.status);
-        var resultRefreshed = (data.paragraph.dateFinished !== $scope.paragraph.dateFinished) ||
-            isEmpty(data.paragraph.results) !== isEmpty($scope.paragraph.results) ||
-          data.paragraph.status === 'ERROR' || (data.paragraph.status === 'FINISHED' && statusChanged);
-
-        if ($scope.paragraph.text !== data.paragraph.text) {
-          if ($scope.dirtyText) {         // check if editor has local update
-            if ($scope.dirtyText === data.paragraph.text) {  // when local update is the same from remote, clear local update
-              $scope.paragraph.text = data.paragraph.text;
-              $scope.dirtyText = undefined;
-              $scope.originalText = angular.copy(data.paragraph.text);
-            } else { // if there're local update, keep it.
-              $scope.paragraph.text = data.paragraph.text;
-            }
-          } else {
+    }
+  });
+
+  $scope.$on('updateParagraph', function(event, data) {
+    if (data.paragraph.id === $scope.paragraph.id &&
+      (data.paragraph.dateCreated !== $scope.paragraph.dateCreated ||
+      data.paragraph.dateFinished !== $scope.paragraph.dateFinished ||
+      data.paragraph.dateStarted !== $scope.paragraph.dateStarted ||
+      data.paragraph.dateUpdated !== $scope.paragraph.dateUpdated ||
+      data.paragraph.status !== $scope.paragraph.status ||
+      data.paragraph.jobName !== $scope.paragraph.jobName ||
+      data.paragraph.title !== $scope.paragraph.title ||
+      isEmpty(data.paragraph.results) !== isEmpty($scope.paragraph.results) ||
+      data.paragraph.errorMessage !== $scope.paragraph.errorMessage ||
+      !angular.equals(data.paragraph.settings, $scope.paragraph.settings) ||
+      !angular.equals(data.paragraph.config, $scope.paragraph.config))
+    ) {
+      var statusChanged = (data.paragraph.status !== $scope.paragraph.status);
+      var resultRefreshed = (data.paragraph.dateFinished !== $scope.paragraph.dateFinished) ||
+        isEmpty(data.paragraph.results) !== isEmpty($scope.paragraph.results) ||
+        data.paragraph.status === 'ERROR' || (data.paragraph.status === 'FINISHED' && statusChanged);
+
+      if ($scope.paragraph.text !== data.paragraph.text) {
+        if ($scope.dirtyText) {         // check if editor has local update
+          if ($scope.dirtyText === data.paragraph.text) {  // when local update is the same from remote, clear local update
             $scope.paragraph.text = data.paragraph.text;
+            $scope.dirtyText = undefined;
             $scope.originalText = angular.copy(data.paragraph.text);
+          } else { // if there're local update, keep it.
+            $scope.paragraph.text = data.paragraph.text;
           }
-        }
-
-        /** broadcast update to result controller **/
-        if (data.paragraph.results && data.paragraph.results.msg) {
-          for (var i in data.paragraph.results.msg) {
-            var newResult = data.paragraph.results.msg ? data.paragraph.results.msg[i] : {};
-            var oldResult = ($scope.paragraph.results && $scope.paragraph.results.msg) ?
-                $scope.paragraph.results.msg[i] : {};
-            var newConfig = data.paragraph.config.results ? data.paragraph.config.results[i] : {};
-            var oldConfig = $scope.paragraph.config.results ? $scope.paragraph.config.results[i] : {};
-            if (!angular.equals(newResult, oldResult) ||
-                !angular.equals(newConfig, oldConfig)) {
-              $rootScope.$broadcast('updateResult', newResult, newConfig, data.paragraph, parseInt(i));
-            }
-          }
-        }
-
-        // resize col width
-        if ($scope.paragraph.config.colWidth !== data.paragraph.colWidth) {
-          $rootScope.$broadcast('paragraphResized', $scope.paragraph.id);
-        }
-
-        /** push the rest */
-        $scope.paragraph.aborted = data.paragraph.aborted;
-        $scope.paragraph.user = data.paragraph.user;
-        $scope.paragraph.dateUpdated = data.paragraph.dateUpdated;
-        $scope.paragraph.dateCreated = data.paragraph.dateCreated;
-        $scope.paragraph.dateFinished = data.paragraph.dateFinished;
-        $scope.paragraph.dateStarted = data.paragraph.dateStarted;
-        $scope.paragraph.errorMessage = data.paragraph.errorMessage;
-        $scope.paragraph.jobName = data.paragraph.jobName;
-        $scope.paragraph.title = data.paragraph.title;
-        $scope.paragraph.lineNumbers = data.paragraph.lineNumbers;
-        $scope.paragraph.status = data.paragraph.status;
-        $scope.paragraph.results = data.paragraph.results;
-        $scope.paragraph.settings = data.paragraph.settings;
-        $scope.editor.setReadOnly($scope.isRunning(data.paragraph));
-
-        if (!$scope.asIframe) {
-          $scope.paragraph.config = data.paragraph.config;
-          initializeDefault(data.paragraph.config);
         } else {
-          data.paragraph.config.editorHide = true;
-          data.paragraph.config.tableHide = false;
-          $scope.paragraph.config = data.paragraph.config;
+          $scope.paragraph.text = data.paragraph.text;
+          $scope.originalText = angular.copy(data.paragraph.text);
         }
+      }
 
-        if (statusChanged || resultRefreshed) {
-          // when last paragraph runs, zeppelin automatically appends new paragraph.
-          // this broadcast will focus to the newly inserted paragraph
-          var paragraphs = angular.element('div[id$="_paragraphColumn_main"]');
-          if (paragraphs.length >= 2 && paragraphs[paragraphs.length - 2].id.indexOf($scope.paragraph.id) === 0) {
-            // rendering output can took some time. So delay scrolling event firing for sometime.
-            setTimeout(function() {
-              $rootScope.$broadcast('scrollToCursor');
-            }, 500);
+      /** broadcast update to result controller **/
+      if (data.paragraph.results && data.paragraph.results.msg) {
+        for (var i in data.paragraph.results.msg) {
+          var newResult = data.paragraph.results.msg ? data.paragraph.results.msg[i] : {};
+          var oldResult = ($scope.paragraph.results && $scope.paragraph.results.msg) ?
+            $scope.paragraph.results.msg[i] : {};
+          var newConfig = data.paragraph.config.results ? data.paragraph.config.results[i] : {};
+          var oldConfig = $scope.paragraph.config.results ? $scope.paragraph.config.results[i] : {};
+          if (!angular.equals(newResult, oldResult) ||
+            !angular.equals(newConfig, oldConfig)) {
+            $rootScope.$broadcast('updateResult', newResult, newConfig, data.paragraph, parseInt(i));
           }
         }
       }
-    });
 
-    $scope.$on('updateProgress', function(event, data) {
-      if (data.id === $scope.paragraph.id) {
-        $scope.currentProgress = data.progress;
+      // resize col width
+      if ($scope.paragraph.config.colWidth !== data.paragraph.colWidth) {
+        $rootScope.$broadcast('paragraphResized', $scope.paragraph.id);
       }
-    });
 
-    $scope.$on('keyEvent', function(event, keyEvent) {
-      if ($scope.paragraphFocused) {
-
-        var paragraphId = $scope.paragraph.id;
-        var keyCode = keyEvent.keyCode;
-        var noShortcutDefined = false;
-        var editorHide = $scope.paragraph.config.editorHide;
+      /** push the rest */
+      $scope.paragraph.aborted = data.paragraph.aborted;
+      $scope.paragraph.user = data.paragraph.user;
+      $scope.paragraph.dateUpdated = data.paragraph.dateUpdated;
+      $scope.paragraph.dateCreated = data.paragraph.dateCreated;
+      $scope.paragraph.dateFinished = data.paragraph.dateFinished;
+      $scope.paragraph.dateStarted = data.paragraph.dateStarted;
+      $scope.paragraph.errorMessage = data.paragraph.errorMessage;
+      $scope.paragraph.jobName = data.paragraph.jobName;
+      $scope.paragraph.title = data.paragraph.title;
+      $scope.paragraph.lineNumbers = data.paragraph.lineNumbers;
+      $scope.paragraph.status = data.paragraph.status;
+      $scope.paragraph.results = data.paragraph.results;
+      $scope.paragraph.settings = data.paragraph.settings;
+      $scope.editor.setReadOnly($scope.isRunning(data.paragraph));
+
+      if (!$scope.asIframe) {
+        $scope.paragraph.config = data.paragraph.config;
+        initializeDefault(data.paragraph.config);
+      } else {
+        data.paragraph.config.editorHide = true;
+        data.paragraph.config.tableHide = false;
+        $scope.paragraph.config = data.paragraph.config;
+      }
 
-        if (editorHide && (keyCode === 38 || (keyCode === 80 && keyEvent.ctrlKey && !keyEvent.altKey))) { // up
-          // move focus to previous paragraph
-          $scope.$emit('moveFocusToPreviousParagraph', paragraphId);
-        } else if (editorHide && (keyCode === 40 || (keyCode === 78 && keyEvent.ctrlKey && !keyEvent.altKey))) { // down
-          // move focus to next paragraph
-          $scope.$emit('moveFocusToNextParagraph', paragraphId);
-        } else if (keyEvent.shiftKey && keyCode === 13) { // Shift + Enter
-          $scope.run($scope.paragraph, $scope.editor.getValue());
-        } else if (keyEvent.ctrlKey && keyEvent.altKey && keyCode === 67) { // Ctrl + Alt + c
-          $scope.cancelParagraph($scope.paragraph);
-        } else if (keyEvent.ctrlKey && keyEvent.altKey && keyCode === 68) { // Ctrl + Alt + d
-          $scope.removeParagraph($scope.paragraph);
-        } else if (keyEvent.ctrlKey && keyEvent.altKey && keyCode === 75) { // Ctrl + Alt + k
-          $scope.moveUp($scope.paragraph);
-        } else if (keyEvent.ctrlKey && keyEvent.altKey && keyCode === 74) { // Ctrl + Alt + j
-          $scope.moveDown($scope.paragraph);
-        } else if (keyEvent.ctrlKey && keyEvent.altKey && keyCode === 65) { // Ctrl + Alt + a
-          $scope.insertNew('above');
-        } else if (keyEvent.ctrlKey && keyEvent.altKey && keyCode === 66) { // Ctrl + Alt + b
-          $scope.insertNew('below');
-        } else if (keyEvent.ctrlKey && keyEvent.altKey && keyCode === 79) { // Ctrl + Alt + o
-          $scope.toggleOutput($scope.paragraph);
-        } else if (keyEvent.ctrlKey && keyEvent.altKey && keyCode === 82) { // Ctrl + Alt + r
-          $scope.toggleEnableDisable($scope.paragraph);
-        } else if (keyEvent.ctrlKey && keyEvent.altKey && keyCode === 69) { // Ctrl + Alt + e
-          $scope.toggleEditor($scope.paragraph);
-        } else if (keyEvent.ctrlKey && keyEvent.altKey && keyCode === 77) { // Ctrl + Alt + m
-          if ($scope.paragraph.config.lineNumbers) {
-            $scope.hideLineNumbers($scope.paragraph);
-          } else {
-            $scope.showLineNumbers($scope.paragraph);
-          }
-        } else if (keyEvent.ctrlKey && keyEvent.shiftKey && keyCode === 189) { // Ctrl + Shift + -
-          $scope.changeColWidth($scope.paragraph, Math.max(1, $scope.paragraph.config.colWidth - 1));
-        } else if (keyEvent.ctrlKey && keyEvent.shiftKey && keyCode === 187) { // Ctrl + Shift + =
-          $scope.changeColWidth($scope.paragraph, Math.min(12, $scope.paragraph.config.colWidth + 1));
-        } else if (keyEvent.ctrlKey && keyEvent.altKey && keyCode === 84) { // Ctrl + Alt + t
-          if ($scope.paragraph.config.title) {
-            $scope.hideTitle($scope.paragraph);
-          } else {
-            $scope.showTitle($scope.paragraph);
-          }
-        } else if (keyEvent.ctrlKey && keyEvent.shiftKey && keyCode === 67) { // Ctrl + Alt + c
-          $scope.copyPara('below');
-        } else if (keyEvent.ctrlKey && keyEvent.altKey && keyCode === 76) { // Ctrl + Alt + l
-          $scope.clearParagraphOutput($scope.paragraph);
-        } else if (keyEvent.ctrlKey && keyEvent.altKey && keyCode === 87) { // Ctrl + Alt + w
-          $scope.goToSingleParagraph();
+      if (statusChanged || resultRefreshed) {
+        // when last paragraph runs, zeppelin automatically appends new paragraph.
+        // this broadcast will focus to the newly inserted paragraph
+        var paragraphs = angular.element('div[id$="_paragraphColumn_main"]');
+        if (paragraphs.length >= 2 && paragraphs[paragraphs.length - 2].id.indexOf($scope.paragraph.id) === 0) {
+          // rendering output can took some time. So delay scrolling event firing for sometime.
+          setTimeout(function() {
+            $rootScope.$broadcast('scrollToCursor');
+          }, 500);
+        }
+      }
+    }
+  });
+
+  $scope.$on('updateProgress', function(event, data) {
+    if (data.id === $scope.paragraph.id) {
+      $scope.currentProgress = data.progress;
+    }
+  });
+
+  $scope.$on('keyEvent', function(event, keyEvent) {
+    if ($scope.paragraphFocused) {
+
+      var paragraphId = $scope.paragraph.id;
+      var keyCode = keyEvent.keyCode;
+      var noShortcutDefined = false;
+      var editorHide = $scope.paragraph.config.editorHide;
+
+      if (editorHide && (keyCode === 38 || (keyCode === 80 && keyEvent.ctrlKey && !keyEvent.altKey))) { // up
+        // move focus to previous paragraph
+        $scope.$emit('moveFocusToPreviousParagraph', paragraphId);
+      } else if (editorHide && (keyCode === 40 || (keyCode === 78 && keyEvent.ctrlKey && !keyEvent.altKey))) { // down
+        // move focus to next paragraph
+        $scope.$emit('moveFocusToNextParagraph', paragraphId);
+      } else if (keyEvent.shiftKey && keyCode === 13) { // Shift + Enter
+        $scope.run($scope.paragraph, $scope.editor.getValue());
+      } else if (keyEvent.ctrlKey && keyEvent.altKey && keyCode === 67) { // Ctrl + Alt + c
+        $scope.cancelParagraph($scope.paragraph);
+      } else if (keyEvent.ctrlKey && keyEvent.altKey && keyCode === 68) { // Ctrl + Alt + d
+        $scope.removeParagraph($scope.paragraph);
+      } else if (keyEvent.ctrlKey && keyEvent.altKey && keyCode === 75) { // Ctrl + Alt + k
+        $scope.moveUp($scope.paragraph);
+      } else if (keyEvent.ctrlKey && keyEvent.altKey && keyCode === 74) { // Ctrl + Alt + j
+        $scope.moveDown($scope.paragraph);
+      } else if (keyEvent.ctrlKey && keyEvent.altKey && keyCode === 65) { // Ctrl + Alt + a
+        $scope.insertNew('above');
+      } else if (keyEvent.ctrlKey && keyEvent.altKey && keyCode === 66) { // Ctrl + Alt + b
+        $scope.insertNew('below');
+      } else if (keyEvent.ctrlKey && keyEvent.altKey && keyCode === 79) { // Ctrl + Alt + o
+        $scope.toggleOutput($scope.paragraph);
+      } else if (keyEvent.ctrlKey && keyEvent.altKey && keyCode === 82) { // Ctrl + Alt + r
+        $scope.toggleEnableDisable($scope.paragraph);
+      } else if (keyEvent.ctrlKey && keyEvent.altKey && keyCode === 69) { // Ctrl + Alt + e
+        $scope.toggleEditor($scope.paragraph);
+      } else if (keyEvent.ctrlKey && keyEvent.altKey && keyCode === 77) { // Ctrl + Alt + m
+        if ($scope.paragraph.config.lineNumbers) {
+          $scope.hideLineNumbers($scope.paragraph);
         } else {
-          noShortcutDefined = true;
+          $scope.showLineNumbers($scope.paragraph);
         }
-
-        if (!noShortcutDefined) {
-          keyEvent.preventDefault();
+      } else if (keyEvent.ctrlKey && keyEvent.shiftKey && keyCode === 189) { // Ctrl + Shift + -
+        $scope.changeColWidth($scope.paragraph, Math.max(1, $scope.paragraph.config.colWidth - 1));
+      } else if (keyEvent.ctrlKey && keyEvent.shiftKey && keyCode === 187) { // Ctrl + Shift + =
+        $scope.changeColWidth($scope.paragraph, Math.min(12, $scope.paragraph.config.colWidth + 1));
+      } else if (keyEvent.ctrlKey && keyEvent.altKey && keyCode === 84) { // Ctrl + Alt + t
+        if ($scope.paragraph.config.title) {
+          $scope.hideTitle($scope.paragraph);
+        } else {
+          $scope.showTitle($scope.paragraph);
         }
+      } else if (keyEvent.ctrlKey && keyEvent.shiftKey && keyCode === 67) { // Ctrl + Alt + c
+        $scope.copyPara('below');
+      } else if (keyEvent.ctrlKey && keyEvent.altKey && keyCode === 76) { // Ctrl + Alt + l
+        $scope.clearParagraphOutput($scope.paragraph);
+      } else if (keyEvent.ctrlKey && keyEvent.altKey && keyCode === 87) { // Ctrl + Alt + w
+        $scope.goToSingleParagraph();
+      } else {
+        noShortcutDefined = true;
       }
-    });
 
-    $scope.$on('focusParagraph', function(event, paragraphId, cursorPos, mouseEvent) {
-      if ($scope.paragraph.id === paragraphId) {
-        // focus editor
-        if (!$scope.paragraph.config.editorHide) {
-          if (!mouseEvent) {
-            $scope.editor.focus();
-            // move cursor to the first row (or the last row)
-            var row;
-            if (cursorPos >= 0) {
-              row = cursorPos;
-              $scope.editor.gotoLine(row, 0);
-            } else {
-              row = $scope.editor.session.getLength();
-              $scope.editor.gotoLine(row, 0);
-            }
-            $scope.scrollToCursor($scope.paragraph.id, 0);
+      if (!noShortcutDefined) {
+        keyEvent.preventDefault();
+      }
+    }
+  });
+
+  $scope.$on('focusParagraph', function(event, paragraphId, cursorPos, mouseEvent) {
+    if ($scope.paragraph.id === paragraphId) {
+      // focus editor
+      if (!$scope.paragraph.config.editorHide) {
+        if (!mouseEvent) {
+          $scope.editor.focus();
+          // move cursor to the first row (or the last row)
+          var row;
+          if (cursorPos >= 0) {
+            row = cursorPos;
+            $scope.editor.gotoLine(row, 0);
+          } else {
+            row = $scope.editor.session.getLength();
+            $scope.editor.gotoLine(row, 0);
           }
+          $scope.scrollToCursor($scope.paragraph.id, 0);
         }
-        $scope.handleFocus(true);
-      } else {
-        $scope.editor.blur();
-        var isDigestPass = true;
-        $scope.handleFocus(false, isDigestPass);
       }
-    });
-
-    $scope.$on('saveInterpreterBindings', function(event, paragraphId) {
-      if ($scope.paragraph.id === paragraphId) {
-        setInterpreterBindings = true;
-        setParagraphMode($scope.editor.getSession(), $scope.editor.getSession().getValue());
-      }
-    });
-
-    $scope.$on('doubleClickParagraph', function(event, paragraphId) {
-      if ($scope.paragraph.id === paragraphId && $scope.paragraph.config.editorHide &&
-          $scope.paragraph.config.editorSetting.editOnDblClick && $scope.revisionView !== true) {
-        var deferred = $q.defer();
-        openEditorAndCloseTable($scope.paragraph);
-        $timeout(
-          $scope.$on('updateParagraph', function(event, data) {
+      $scope.handleFocus(true);
+    } else {
+      $scope.editor.blur();
+      var isDigestPass = true;
+      $scope.handleFocus(false, isDigestPass);
+    }
+  });
+
+  $scope.$on('saveInterpreterBindings', function(event, paragraphId) {
+    if ($scope.paragraph.id === paragraphId) {
+      setInterpreterBindings = true;
+      setParagraphMode($scope.editor.getSession(), $scope.editor.getSession().getValue());
+    }
+  });
+
+  $scope.$on('doubleClickParagraph', function(event, paragraphId) {
+    if ($scope.paragraph.id === paragraphId && $scope.paragraph.config.editorHide &&
+      $scope.paragraph.config.editorSetting.editOnDblClick && $scope.revisionView !== true) {
+      var deferred = $q.defer();
+      openEditorAndCloseTable($scope.paragraph);
+      $timeout(
+        $scope.$on('updateParagraph', function(event, data) {
             deferred.resolve(data);
           }
         ), 1000);
 
-        deferred.promise.then(function(data) {
-          $scope.editor.focus();
-          $scope.goToEnd($scope.editor);
-        });
-      }
-    });
-
-    $scope.$on('openEditor', function(event) {
-      $scope.openEditor($scope.paragraph);
-    });
-
-    $scope.$on('closeEditor', function(event) {
-      $scope.closeEditor($scope.paragraph);
-    });
-
-    $scope.$on('openTable', function(event) {
-      $scope.openTable($scope.paragraph);
-    });
-
-    $scope.$on('closeTable', function(event) {
-      $scope.closeTable($scope.paragraph);
-    });
-  }
-})();
+      deferred.promise.then(function(data) {
+        $scope.editor.focus();
+        $scope.goToEnd($scope.editor);
+      });
+    }
+  });
+
+  $scope.$on('openEditor', function(event) {
+    $scope.openEditor($scope.paragraph);
+  });
+
+  $scope.$on('closeEditor', function(event) {
+    $scope.closeEditor($scope.paragraph);
+  });
+
+  $scope.$on('openTable', function(event) {
+    $scope.openTable($scope.paragraph);
+  });
+
+  $scope.$on('closeTable', function(event) {
+    $scope.closeTable($scope.paragraph);
+  });
+}


[6/6] zeppelin git commit: [ZEPPELIN-1927] Remove useless function wrapping in all js files

Posted by mo...@apache.org.
[ZEPPELIN-1927] Remove useless function wrapping in all js files

### What is this PR for?

Removed useless function wrappings to move toward `import`, `export` syntax. This PR will not affect on any previous functionalities.

**This PR is not big! I did only 2 things.**

1. Removed `(function() {})()` which wraps a module.
2. Reindented whole files.

### What type of PR is it?
[Refactoring]

### Todos
* [x] - Remove function wrappings
* [x] - Reindent

### What is the Jira issue?

[ZEPPELIN-1927](https://issues.apache.org/jira/browse/ZEPPELIN-1927)

### How should this be tested?

CI will test this PR.

### Screenshots (if appropriate)

None

### Questions:
* Does the licenses files need update? - NO
* Is there breaking changes for older versions? - NO
* Does this needs documentation? - NO

Author: 1ambda <1a...@gmail.com>

Closes #1876 from 1ambda/ZEPPELIN-1927/remove-useless-func-wrappings and squashes the following commits:

7017807 [1ambda] fix: Remove all func wrappings in js files


Project: http://git-wip-us.apache.org/repos/asf/zeppelin/repo
Commit: http://git-wip-us.apache.org/repos/asf/zeppelin/commit/4c60b27c
Tree: http://git-wip-us.apache.org/repos/asf/zeppelin/tree/4c60b27c
Diff: http://git-wip-us.apache.org/repos/asf/zeppelin/diff/4c60b27c

Branch: refs/heads/master
Commit: 4c60b27c3acbdd976bf8901ef52019380bb3c334
Parents: ff8d902
Author: 1ambda <1a...@gmail.com>
Authored: Wed Jan 11 06:26:53 2017 +0900
Committer: Lee moon soo <mo...@apache.org>
Committed: Tue Jan 10 18:42:01 2017 -0800

----------------------------------------------------------------------
 zeppelin-web/src/app/app.controller.js          |   72 +-
 zeppelin-web/src/app/app.js                     |  235 +-
 .../configuration/configuration.controller.js   |   62 +-
 .../src/app/credential/credential.controller.js |  278 ++-
 zeppelin-web/src/app/home/home.controller.js    |  198 +-
 .../app/interpreter/interpreter.controller.js   | 1282 +++++-----
 .../src/app/interpreter/interpreter.filter.js   |   17 +-
 .../src/app/jobmanager/jobmanager.controller.js |  292 ++-
 .../src/app/jobmanager/jobmanager.filter.js     |   48 +-
 .../src/app/jobmanager/jobs/job.controller.js   |  162 +-
 .../src/app/notebook/notebook.controller.js     | 1768 +++++++-------
 .../notebook/paragraph/paragraph.controller.js  | 2182 +++++++++---------
 .../paragraph/result/result.controller.js       | 1503 ++++++------
 .../notebookRepos/notebookRepos.controller.js   |  116 +-
 .../src/app/search/result-list.controller.js    |  256 +-
 .../arrayOrderingSrv/arrayOrdering.service.js   |   38 +-
 .../src/components/baseUrl/baseUrl.service.js   |   56 +-
 .../browser-detect/browserDetect.service.js     |   50 +-
 .../clipboard/clipboard.controller.js           |   38 +-
 .../dropdowninput/dropdowninput.directive.js    |   24 +-
 .../components/editor/codeEditor.directive.js   |   48 +-
 .../elasticInputCtrl/elasticInput.controller.js |   14 +-
 .../expandCollapse/expandCollapse.directive.js  |   46 +-
 .../interpreter/interpreter.directive.js        |   30 +-
 .../src/components/login/login.controller.js    |   86 +-
 .../src/components/navbar/navbar.controller.js  |  226 +-
 .../src/components/ngenter/ngenter.directive.js |   30 +-
 .../components/ngescape/ngescape.directive.js   |   28 +-
 .../components/noteAction/noteAction.service.js |  302 ++-
 .../noteListDataFactory/noteList.datafactory.js |  112 +-
 .../noteName-create/notename.controller.js      |  182 +-
 .../noteName-create/visible.directive.js        |   60 +-
 .../notenameImport.controller.js                |  246 +-
 .../notevarshareService/notevarshare.service.js |   38 +-
 .../popover-html-unsafe-popup.directive.js      |   20 +-
 .../popover-html-unsafe.directive.js            |   12 +-
 .../src/components/rename/rename.controller.js  |   48 +-
 .../src/components/rename/rename.service.js     |   32 +-
 .../components/resizable/resizable.directive.js |  100 +-
 .../src/components/saveAs/saveAs.service.js     |   68 +-
 .../components/searchService/search.service.js  |   34 +-
 .../websocketEvents/websocketEvents.factory.js  |  314 ++-
 .../websocketEvents/websocketMsg.service.js     |  608 +++--
 43 files changed, 5637 insertions(+), 5724 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/zeppelin/blob/4c60b27c/zeppelin-web/src/app/app.controller.js
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/app/app.controller.js b/zeppelin-web/src/app/app.controller.js
index 0ab8469..95be93d 100644
--- a/zeppelin-web/src/app/app.controller.js
+++ b/zeppelin-web/src/app/app.controller.js
@@ -11,52 +11,50 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
 
-  angular.module('zeppelinWebApp').controller('MainCtrl', MainCtrl);
+angular.module('zeppelinWebApp').controller('MainCtrl', MainCtrl);
 
-  MainCtrl.$inject = ['$scope', '$rootScope', '$window', 'arrayOrderingSrv'];
+MainCtrl.$inject = ['$scope', '$rootScope', '$window', 'arrayOrderingSrv'];
 
-  function MainCtrl($scope, $rootScope, $window, arrayOrderingSrv) {
-    $scope.looknfeel = 'default';
+function MainCtrl($scope, $rootScope, $window, arrayOrderingSrv) {
+  $scope.looknfeel = 'default';
 
-    var init = function() {
-      $scope.asIframe = (($window.location.href.indexOf('asIframe') > -1) ? true : false);
-    };
+  var init = function() {
+    $scope.asIframe = (($window.location.href.indexOf('asIframe') > -1) ? true : false);
+  };
 
-    init();
+  init();
 
-    $rootScope.$on('setIframe', function(event, data) {
-      if (!event.defaultPrevented) {
-        $scope.asIframe = data;
-        event.preventDefault();
-      }
-    });
+  $rootScope.$on('setIframe', function(event, data) {
+    if (!event.defaultPrevented) {
+      $scope.asIframe = data;
+      event.preventDefault();
+    }
+  });
 
-    $rootScope.$on('setLookAndFeel', function(event, data) {
-      if (!event.defaultPrevented && data && data !== '' && data !== $scope.looknfeel) {
-        $scope.looknfeel = data;
-        event.preventDefault();
-      }
-    });
+  $rootScope.$on('setLookAndFeel', function(event, data) {
+    if (!event.defaultPrevented && data && data !== '' && data !== $scope.looknfeel) {
+      $scope.looknfeel = data;
+      event.preventDefault();
+    }
+  });
 
-    // Set The lookAndFeel to default on every page
-    $rootScope.$on('$routeChangeStart', function(event, next, current) {
-      $rootScope.$broadcast('setLookAndFeel', 'default');
-    });
+  // Set The lookAndFeel to default on every page
+  $rootScope.$on('$routeChangeStart', function(event, next, current) {
+    $rootScope.$broadcast('setLookAndFeel', 'default');
+  });
 
-    $rootScope.noteName = function(note) {
-      if (!_.isEmpty(note)) {
-        return arrayOrderingSrv.getNoteName(note);
-      }
-    };
+  $rootScope.noteName = function(note) {
+    if (!_.isEmpty(note)) {
+      return arrayOrderingSrv.getNoteName(note);
+    }
+  };
 
-    BootstrapDialog.defaultOptions.onshown = function() {
-      angular.element('#' + this.id).find('.btn:last').focus();
-    };
+  BootstrapDialog.defaultOptions.onshown = function() {
+    angular.element('#' + this.id).find('.btn:last').focus();
+  };
 
-    // Remove BootstrapDialog animation
-    BootstrapDialog.configDefaultOptions({animate: false});
-  }
+  // Remove BootstrapDialog animation
+  BootstrapDialog.configDefaultOptions({animate: false});
+}
 
-})();

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/4c60b27c/zeppelin-web/src/app/app.js
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/app/app.js b/zeppelin-web/src/app/app.js
index 6b5d8f9..fcfed28 100644
--- a/zeppelin-web/src/app/app.js
+++ b/zeppelin-web/src/app/app.js
@@ -14,129 +14,128 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
-  var zeppelinWebApp = angular.module('zeppelinWebApp', [
-          'ngCookies',
-          'ngAnimate',
-          'ngRoute',
-          'ngSanitize',
-          'angular-websocket',
-          'ui.ace',
-          'ui.bootstrap',
-          'as.sortable',
-          'ngTouch',
-          'ngDragDrop',
-          'angular.filter',
-          'monospaced.elastic',
-          'puElasticInput',
-          'xeditable',
-          'ngToast',
-          'focus-if',
-          'ngResource',
-          'ngclipboard'
-      ])
-        .filter('breakFilter', function() {
-          return function(text) {
-            if (!!text) {
-              return text.replace(/\n/g, '<br />');
-            }
-          };
-        })
-        .config(function($httpProvider, $routeProvider, ngToastProvider) {
-          // withCredentials when running locally via grunt
-          $httpProvider.defaults.withCredentials = true;
 
-          $routeProvider
-            .when('/', {
-              templateUrl: 'app/home/home.html'
-            })
-            .when('/notebook/:noteId', {
-              templateUrl: 'app/notebook/notebook.html',
-              controller: 'NotebookCtrl'
-            })
-            .when('/notebook/:noteId/paragraph?=:paragraphId', {
-              templateUrl: 'app/notebook/notebook.html',
-              controller: 'NotebookCtrl'
-            })
-            .when('/notebook/:noteId/paragraph/:paragraphId?', {
-              templateUrl: 'app/notebook/notebook.html',
-              controller: 'NotebookCtrl'
-            })
-            .when('/notebook/:noteId/revision/:revisionId', {
-              templateUrl: 'app/notebook/notebook.html',
-              controller: 'NotebookCtrl'
-            })
-            .when('/jobmanager', {
-              templateUrl: 'app/jobmanager/jobmanager.html',
-              controller: 'JobmanagerCtrl'
-            })
-            .when('/interpreter', {
-              templateUrl: 'app/interpreter/interpreter.html',
-              controller: 'InterpreterCtrl'
-            })
-            .when('/notebookRepos', {
-              templateUrl: 'app/notebookRepos/notebookRepos.html',
-              controller: 'NotebookReposCtrl',
-              controllerAs: 'noterepo'
-            })
-            .when('/credential', {
-              templateUrl: 'app/credential/credential.html',
-              controller: 'CredentialCtrl'
-            })
-            .when('/configuration', {
-              templateUrl: 'app/configuration/configuration.html',
-              controller: 'ConfigurationCtrl'
-            })
-            .when('/search/:searchTerm', {
-              templateUrl: 'app/search/result-list.html',
-              controller: 'SearchResultCtrl'
-            })
-            .otherwise({
-              redirectTo: '/'
-            });
-
-          ngToastProvider.configure({
-            dismissButton: true,
-            dismissOnClick: false,
-            combineDuplications: true,
-            timeout: 6000
-          });
-        })
-        .constant('TRASH_FOLDER_ID', '~Trash');
-
-  function auth() {
-    var $http = angular.injector(['ng']).get('$http');
-    var baseUrlSrv = angular.injector(['zeppelinWebApp']).get('baseUrlSrv');
+var zeppelinWebApp = angular.module('zeppelinWebApp', [
+  'ngCookies',
+  'ngAnimate',
+  'ngRoute',
+  'ngSanitize',
+  'angular-websocket',
+  'ui.ace',
+  'ui.bootstrap',
+  'as.sortable',
+  'ngTouch',
+  'ngDragDrop',
+  'angular.filter',
+  'monospaced.elastic',
+  'puElasticInput',
+  'xeditable',
+  'ngToast',
+  'focus-if',
+  'ngResource',
+  'ngclipboard'
+])
+  .filter('breakFilter', function() {
+    return function(text) {
+      if (!!text) {
+        return text.replace(/\n/g, '<br />');
+      }
+    };
+  })
+  .config(function($httpProvider, $routeProvider, ngToastProvider) {
     // withCredentials when running locally via grunt
-    $http.defaults.withCredentials = true;
-    jQuery.ajaxSetup({
-      dataType: 'json',
-      xhrFields: {
-        withCredentials: true
-      },
-      crossDomain: true
-    });
-    return $http.get(baseUrlSrv.getRestApiBase() + '/security/ticket').then(function(response) {
-      zeppelinWebApp.run(function($rootScope) {
-        $rootScope.ticket = angular.fromJson(response.data).body;
+    $httpProvider.defaults.withCredentials = true;
+
+    $routeProvider
+      .when('/', {
+        templateUrl: 'app/home/home.html'
+      })
+      .when('/notebook/:noteId', {
+        templateUrl: 'app/notebook/notebook.html',
+        controller: 'NotebookCtrl'
+      })
+      .when('/notebook/:noteId/paragraph?=:paragraphId', {
+        templateUrl: 'app/notebook/notebook.html',
+        controller: 'NotebookCtrl'
+      })
+      .when('/notebook/:noteId/paragraph/:paragraphId?', {
+        templateUrl: 'app/notebook/notebook.html',
+        controller: 'NotebookCtrl'
+      })
+      .when('/notebook/:noteId/revision/:revisionId', {
+        templateUrl: 'app/notebook/notebook.html',
+        controller: 'NotebookCtrl'
+      })
+      .when('/jobmanager', {
+        templateUrl: 'app/jobmanager/jobmanager.html',
+        controller: 'JobmanagerCtrl'
+      })
+      .when('/interpreter', {
+        templateUrl: 'app/interpreter/interpreter.html',
+        controller: 'InterpreterCtrl'
+      })
+      .when('/notebookRepos', {
+        templateUrl: 'app/notebookRepos/notebookRepos.html',
+        controller: 'NotebookReposCtrl',
+        controllerAs: 'noterepo'
+      })
+      .when('/credential', {
+        templateUrl: 'app/credential/credential.html',
+        controller: 'CredentialCtrl'
+      })
+      .when('/configuration', {
+        templateUrl: 'app/configuration/configuration.html',
+        controller: 'ConfigurationCtrl'
+      })
+      .when('/search/:searchTerm', {
+        templateUrl: 'app/search/result-list.html',
+        controller: 'SearchResultCtrl'
+      })
+      .otherwise({
+        redirectTo: '/'
       });
-    }, function(errorResponse) {
-      // Handle error case
+
+    ngToastProvider.configure({
+      dismissButton: true,
+      dismissOnClick: false,
+      combineDuplications: true,
+      timeout: 6000
     });
-  }
+  })
+  .constant('TRASH_FOLDER_ID', '~Trash');
 
-  function bootstrapApplication() {
-    zeppelinWebApp.run(function($rootScope, $location) {
-      $rootScope.$on('$routeChangeStart', function(event, next, current) {
-        if (!$rootScope.ticket && next.$$route && !next.$$route.publicAccess) {
-          $location.path('/');
-        }
-      });
+function auth() {
+  var $http = angular.injector(['ng']).get('$http');
+  var baseUrlSrv = angular.injector(['zeppelinWebApp']).get('baseUrlSrv');
+  // withCredentials when running locally via grunt
+  $http.defaults.withCredentials = true;
+  jQuery.ajaxSetup({
+    dataType: 'json',
+    xhrFields: {
+      withCredentials: true
+    },
+    crossDomain: true
+  });
+  return $http.get(baseUrlSrv.getRestApiBase() + '/security/ticket').then(function(response) {
+    zeppelinWebApp.run(function($rootScope) {
+      $rootScope.ticket = angular.fromJson(response.data).body;
     });
-    angular.bootstrap(document, ['zeppelinWebApp']);
-  }
+  }, function(errorResponse) {
+    // Handle error case
+  });
+}
 
-  angular.element(document).ready(function() {
-    auth().then(bootstrapApplication);
+function bootstrapApplication() {
+  zeppelinWebApp.run(function($rootScope, $location) {
+    $rootScope.$on('$routeChangeStart', function(event, next, current) {
+      if (!$rootScope.ticket && next.$$route && !next.$$route.publicAccess) {
+        $location.path('/');
+      }
+    });
   });
-}());
+  angular.bootstrap(document, ['zeppelinWebApp']);
+}
+
+angular.element(document).ready(function() {
+  auth().then(bootstrapApplication);
+});

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/4c60b27c/zeppelin-web/src/app/configuration/configuration.controller.js
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/app/configuration/configuration.controller.js b/zeppelin-web/src/app/configuration/configuration.controller.js
index df25404..4d6ad9f 100644
--- a/zeppelin-web/src/app/configuration/configuration.controller.js
+++ b/zeppelin-web/src/app/configuration/configuration.controller.js
@@ -11,41 +11,39 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
 
-  angular.module('zeppelinWebApp').controller('ConfigurationCtrl', ConfigurationCtrl);
+angular.module('zeppelinWebApp').controller('ConfigurationCtrl', ConfigurationCtrl);
 
-  ConfigurationCtrl.$inject = ['$scope', '$rootScope', '$http', 'baseUrlSrv', 'ngToast'];
+ConfigurationCtrl.$inject = ['$scope', '$rootScope', '$http', 'baseUrlSrv', 'ngToast'];
 
-  function ConfigurationCtrl($scope, $rootScope, $http, baseUrlSrv, ngToast) {
-    $scope.configrations = [];
-    $scope._ = _;
-    ngToast.dismiss();
+function ConfigurationCtrl($scope, $rootScope, $http, baseUrlSrv, ngToast) {
+  $scope.configrations = [];
+  $scope._ = _;
+  ngToast.dismiss();
 
-    var getConfigurations = function() {
-      $http.get(baseUrlSrv.getRestApiBase() + '/configurations/all').
-      success(function(data, status, headers, config) {
-        $scope.configurations = data.body;
-      }).
-      error(function(data, status, headers, config) {
-        if (status === 401) {
-          ngToast.danger({
-            content: 'You don\'t have permission on this page',
-            verticalPosition: 'bottom',
-            timeout: '3000'
-          });
-          setTimeout(function() {
-            window.location.replace('/');
-          }, 3000);
-        }
-        console.log('Error %o %o', status, data.message);
-      });
-    };
+  var getConfigurations = function() {
+    $http.get(baseUrlSrv.getRestApiBase() + '/configurations/all').
+    success(function(data, status, headers, config) {
+      $scope.configurations = data.body;
+    }).
+    error(function(data, status, headers, config) {
+      if (status === 401) {
+        ngToast.danger({
+          content: 'You don\'t have permission on this page',
+          verticalPosition: 'bottom',
+          timeout: '3000'
+        });
+        setTimeout(function() {
+          window.location.replace('/');
+        }, 3000);
+      }
+      console.log('Error %o %o', status, data.message);
+    });
+  };
 
-    var init = function() {
-      getConfigurations();
-    };
+  var init = function() {
+    getConfigurations();
+  };
 
-    init();
-  }
-})();
+  init();
+}

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/4c60b27c/zeppelin-web/src/app/credential/credential.controller.js
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/app/credential/credential.controller.js b/zeppelin-web/src/app/credential/credential.controller.js
index ce4ef14..d0fdd1e 100644
--- a/zeppelin-web/src/app/credential/credential.controller.js
+++ b/zeppelin-web/src/app/credential/credential.controller.js
@@ -11,88 +11,87 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
 
-  angular.module('zeppelinWebApp').controller('CredentialCtrl', CredentialCtrl);
+angular.module('zeppelinWebApp').controller('CredentialCtrl', CredentialCtrl);
 
-  CredentialCtrl.$inject = ['$scope', '$rootScope', '$http', 'baseUrlSrv', 'ngToast'];
+CredentialCtrl.$inject = ['$scope', '$rootScope', '$http', 'baseUrlSrv', 'ngToast'];
 
-  function CredentialCtrl($scope, $rootScope, $http, baseUrlSrv, ngToast) {
-    $scope._ = _;
-    ngToast.dismiss();
+function CredentialCtrl($scope, $rootScope, $http, baseUrlSrv, ngToast) {
+  $scope._ = _;
+  ngToast.dismiss();
 
-    $scope.credentialInfo = [];
-    $scope.showAddNewCredentialInfo = false;
-    $scope.availableInterpreters = [];
+  $scope.credentialInfo = [];
+  $scope.showAddNewCredentialInfo = false;
+  $scope.availableInterpreters = [];
 
-    var getCredentialInfo = function() {
-      $http.get(baseUrlSrv.getRestApiBase() + '/credential').
-      success(function(data, status, headers, config) {
-        $scope.credentialInfo  = _.map(data.body.userCredentials, function(value, prop) {
-          return {entity: prop, password: value.password, username: value.username};
-        });
-        console.log('Success %o %o', status, $scope.credentialInfo);
-      }).
-      error(function(data, status, headers, config) {
-        if (status === 401) {
-          ngToast.danger({
-            content: 'You don\'t have permission on this page',
-            verticalPosition: 'bottom',
-            timeout: '3000'
-          });
-          setTimeout(function() {
-            window.location.replace('/');
-          }, 3000);
-        }
-        console.log('Error %o %o', status, data.message);
+  var getCredentialInfo = function() {
+    $http.get(baseUrlSrv.getRestApiBase() + '/credential').
+    success(function(data, status, headers, config) {
+      $scope.credentialInfo  = _.map(data.body.userCredentials, function(value, prop) {
+        return {entity: prop, password: value.password, username: value.username};
       });
-    };
-
-    $scope.addNewCredentialInfo = function() {
-      if ($scope.entity && _.isEmpty($scope.entity.trim()) &&
-        $scope.username && _.isEmpty($scope.username.trim())) {
+      console.log('Success %o %o', status, $scope.credentialInfo);
+    }).
+    error(function(data, status, headers, config) {
+      if (status === 401) {
         ngToast.danger({
-          content: 'Username \\ Entity can not be empty.',
+          content: 'You don\'t have permission on this page',
           verticalPosition: 'bottom',
           timeout: '3000'
         });
-        return;
+        setTimeout(function() {
+          window.location.replace('/');
+        }, 3000);
       }
+      console.log('Error %o %o', status, data.message);
+    });
+  };
+
+  $scope.addNewCredentialInfo = function() {
+    if ($scope.entity && _.isEmpty($scope.entity.trim()) &&
+      $scope.username && _.isEmpty($scope.username.trim())) {
+      ngToast.danger({
+        content: 'Username \\ Entity can not be empty.',
+        verticalPosition: 'bottom',
+        timeout: '3000'
+      });
+      return;
+    }
 
-      var newCredential  = {
-        'entity': $scope.entity,
-        'username': $scope.username,
-        'password': $scope.password
-      };
+    var newCredential  = {
+      'entity': $scope.entity,
+      'username': $scope.username,
+      'password': $scope.password
+    };
 
-      $http.put(baseUrlSrv.getRestApiBase() + '/credential', newCredential).
-      success(function(data, status, headers, config) {
-        ngToast.success({
-          content: 'Successfully saved credentials.',
-          verticalPosition: 'bottom',
-          timeout: '3000'
-        });
-        $scope.credentialInfo.push(newCredential);
-        resetCredentialInfo();
-        $scope.showAddNewCredentialInfo = false;
-        console.log('Success %o %o', status, data.message);
-      }).
-      error(function(data, status, headers, config) {
-        ngToast.danger({
-          content: 'Error saving credentials',
-          verticalPosition: 'bottom',
-          timeout: '3000'
-        });
-        console.log('Error %o %o', status, data.message);
+    $http.put(baseUrlSrv.getRestApiBase() + '/credential', newCredential).
+    success(function(data, status, headers, config) {
+      ngToast.success({
+        content: 'Successfully saved credentials.',
+        verticalPosition: 'bottom',
+        timeout: '3000'
       });
-    };
+      $scope.credentialInfo.push(newCredential);
+      resetCredentialInfo();
+      $scope.showAddNewCredentialInfo = false;
+      console.log('Success %o %o', status, data.message);
+    }).
+    error(function(data, status, headers, config) {
+      ngToast.danger({
+        content: 'Error saving credentials',
+        verticalPosition: 'bottom',
+        timeout: '3000'
+      });
+      console.log('Error %o %o', status, data.message);
+    });
+  };
 
-    var getAvailableInterpreters = function() {
-      $http.get(baseUrlSrv.getRestApiBase() + '/interpreter/setting')
+  var getAvailableInterpreters = function() {
+    $http.get(baseUrlSrv.getRestApiBase() + '/interpreter/setting')
       .success(function(data, status, headers, config) {
         for (var setting = 0; setting < data.body.length; setting++) {
           $scope.availableInterpreters.push(
-          data.body[setting].group + '.' + data.body[setting].name);
+            data.body[setting].group + '.' + data.body[setting].name);
         }
         angular.element('#entityname').autocomplete({
           source: $scope.availableInterpreters,
@@ -102,91 +101,90 @@
           }
         });
       }).error(function(data, status, headers, config) {
-        console.log('Error %o %o', status, data.message);
-      });
-    };
-
-    $scope.toggleAddNewCredentialInfo = function() {
-      if ($scope.showAddNewCredentialInfo) {
-        $scope.showAddNewCredentialInfo = false;
-      } else {
-        $scope.showAddNewCredentialInfo = true;
-      }
-    };
+      console.log('Error %o %o', status, data.message);
+    });
+  };
 
-    $scope.cancelCredentialInfo = function() {
+  $scope.toggleAddNewCredentialInfo = function() {
+    if ($scope.showAddNewCredentialInfo) {
       $scope.showAddNewCredentialInfo = false;
-      resetCredentialInfo();
-    };
+    } else {
+      $scope.showAddNewCredentialInfo = true;
+    }
+  };
 
-    var resetCredentialInfo = function() {
-      $scope.entity = '';
-      $scope.username = '';
-      $scope.password = '';
+  $scope.cancelCredentialInfo = function() {
+    $scope.showAddNewCredentialInfo = false;
+    resetCredentialInfo();
+  };
+
+  var resetCredentialInfo = function() {
+    $scope.entity = '';
+    $scope.username = '';
+    $scope.password = '';
+  };
+
+  $scope.copyOriginCredentialsInfo = function() {
+    ngToast.info({
+      content: 'Since entity is a unique key, you can edit only username & password',
+      verticalPosition: 'bottom',
+      timeout: '3000'
+    });
+  };
+
+  $scope.updateCredentialInfo = function(form, data, entity) {
+    var request = {
+      entity: entity,
+      username: data.username,
+      password: data.password
     };
 
-    $scope.copyOriginCredentialsInfo = function() {
-      ngToast.info({
-        content: 'Since entity is a unique key, you can edit only username & password',
+    $http.put(baseUrlSrv.getRestApiBase() + '/credential/', request).
+    success(function(data, status, headers, config) {
+      var index = _.findIndex($scope.credentialInfo, {'entity': entity});
+      $scope.credentialInfo[index] = request;
+      return true;
+    }).
+    error(function(data, status, headers, config) {
+      console.log('Error %o %o', status, data.message);
+      ngToast.danger({
+        content: 'We couldn\'t save the credential',
         verticalPosition: 'bottom',
         timeout: '3000'
       });
-    };
-
-    $scope.updateCredentialInfo = function(form, data, entity) {
-      var request = {
-        entity: entity,
-        username: data.username,
-        password: data.password
-      };
-
-      $http.put(baseUrlSrv.getRestApiBase() + '/credential/', request).
-      success(function(data, status, headers, config) {
-        var index = _.findIndex($scope.credentialInfo, {'entity': entity});
-        $scope.credentialInfo[index] = request;
-        return true;
-      }).
-      error(function(data, status, headers, config) {
-        console.log('Error %o %o', status, data.message);
-        ngToast.danger({
-          content: 'We couldn\'t save the credential',
-          verticalPosition: 'bottom',
-          timeout: '3000'
-        });
-        form.$show();
-      });
-      return false;
-    };
-
-    $scope.removeCredentialInfo = function(entity) {
-      BootstrapDialog.confirm({
-        closable: false,
-        closeByBackdrop: false,
-        closeByKeyboard: false,
-        title: '',
-        message: 'Do you want to delete this credential information?',
-        callback: function(result) {
-          if (result) {
-            $http.delete(baseUrlSrv.getRestApiBase() + '/credential/' + entity).
-            success(function(data, status, headers, config) {
-              var index = _.findIndex($scope.credentialInfo, {'entity': entity});
-              $scope.credentialInfo.splice(index, 1);
-              console.log('Success %o %o', status, data.message);
-            }).
-            error(function(data, status, headers, config) {
-              console.log('Error %o %o', status, data.message);
-            });
-          }
+      form.$show();
+    });
+    return false;
+  };
+
+  $scope.removeCredentialInfo = function(entity) {
+    BootstrapDialog.confirm({
+      closable: false,
+      closeByBackdrop: false,
+      closeByKeyboard: false,
+      title: '',
+      message: 'Do you want to delete this credential information?',
+      callback: function(result) {
+        if (result) {
+          $http.delete(baseUrlSrv.getRestApiBase() + '/credential/' + entity).
+          success(function(data, status, headers, config) {
+            var index = _.findIndex($scope.credentialInfo, {'entity': entity});
+            $scope.credentialInfo.splice(index, 1);
+            console.log('Success %o %o', status, data.message);
+          }).
+          error(function(data, status, headers, config) {
+            console.log('Error %o %o', status, data.message);
+          });
         }
-      });
-    };
+      }
+    });
+  };
 
-    var init = function() {
-      getAvailableInterpreters();
-      getCredentialInfo();
-    };
+  var init = function() {
+    getAvailableInterpreters();
+    getCredentialInfo();
+  };
 
-    init();
-  }
+  init();
+}
 
-})();

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/4c60b27c/zeppelin-web/src/app/home/home.controller.js
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/app/home/home.controller.js b/zeppelin-web/src/app/home/home.controller.js
index 08ce309..c27f811 100644
--- a/zeppelin-web/src/app/home/home.controller.js
+++ b/zeppelin-web/src/app/home/home.controller.js
@@ -11,126 +11,124 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
-
-  angular.module('zeppelinWebApp').controller('HomeCtrl', HomeCtrl);
-
-  HomeCtrl.$inject = [
-    '$scope',
-    'noteListDataFactory',
-    'websocketMsgSrv',
-    '$rootScope',
-    'arrayOrderingSrv',
-    'ngToast',
-    'noteActionSrv',
-    'TRASH_FOLDER_ID'
-  ];
-
-  function HomeCtrl($scope, noteListDataFactory, websocketMsgSrv, $rootScope, arrayOrderingSrv,
-                    ngToast, noteActionSrv, TRASH_FOLDER_ID) {
-    ngToast.dismiss();
-    var vm = this;
-    vm.notes = noteListDataFactory;
-    vm.websocketMsgSrv = websocketMsgSrv;
-    vm.arrayOrderingSrv = arrayOrderingSrv;
-
-    vm.notebookHome = false;
-    if ($rootScope.ticket !== undefined) {
-      vm.staticHome = false;
-    } else {
-      vm.staticHome = true;
-    }
 
-    $scope.isReloading = false;
-    $scope.TRASH_FOLDER_ID = TRASH_FOLDER_ID;
+angular.module('zeppelinWebApp').controller('HomeCtrl', HomeCtrl);
+
+HomeCtrl.$inject = [
+  '$scope',
+  'noteListDataFactory',
+  'websocketMsgSrv',
+  '$rootScope',
+  'arrayOrderingSrv',
+  'ngToast',
+  'noteActionSrv',
+  'TRASH_FOLDER_ID'
+];
+
+function HomeCtrl($scope, noteListDataFactory, websocketMsgSrv, $rootScope, arrayOrderingSrv,
+                  ngToast, noteActionSrv, TRASH_FOLDER_ID) {
+  ngToast.dismiss();
+  var vm = this;
+  vm.notes = noteListDataFactory;
+  vm.websocketMsgSrv = websocketMsgSrv;
+  vm.arrayOrderingSrv = arrayOrderingSrv;
+
+  vm.notebookHome = false;
+  if ($rootScope.ticket !== undefined) {
+    vm.staticHome = false;
+  } else {
+    vm.staticHome = true;
+  }
 
-    var initHome = function() {
-      websocketMsgSrv.getHomeNote();
-    };
+  $scope.isReloading = false;
+  $scope.TRASH_FOLDER_ID = TRASH_FOLDER_ID;
 
-    initHome();
+  var initHome = function() {
+    websocketMsgSrv.getHomeNote();
+  };
 
-    $scope.reloadNoteList = function() {
-      websocketMsgSrv.reloadAllNotesFromRepo();
-      $scope.isReloadingNotes = true;
-    };
+  initHome();
 
-    $scope.toggleFolderNode = function(node) {
-      node.hidden = !node.hidden;
-    };
+  $scope.reloadNoteList = function() {
+    websocketMsgSrv.reloadAllNotesFromRepo();
+    $scope.isReloadingNotes = true;
+  };
 
-    angular.element('#loginModal').on('hidden.bs.modal', function(e) {
-      $rootScope.$broadcast('initLoginValues');
-    });
+  $scope.toggleFolderNode = function(node) {
+    node.hidden = !node.hidden;
+  };
 
-    /*
-    ** $scope.$on functions below
-    */
+  angular.element('#loginModal').on('hidden.bs.modal', function(e) {
+    $rootScope.$broadcast('initLoginValues');
+  });
 
-    $scope.$on('setNoteMenu', function(event, notes) {
-      $scope.isReloadingNotes = false;
-    });
+  /*
+   ** $scope.$on functions below
+   */
 
-    $scope.$on('setNoteContent', function(event, note) {
-      if (note) {
-        vm.note = note;
+  $scope.$on('setNoteMenu', function(event, notes) {
+    $scope.isReloadingNotes = false;
+  });
 
-        // initialize look And Feel
-        $rootScope.$broadcast('setLookAndFeel', 'home');
+  $scope.$on('setNoteContent', function(event, note) {
+    if (note) {
+      vm.note = note;
 
-        // make it read only
-        vm.viewOnly = true;
+      // initialize look And Feel
+      $rootScope.$broadcast('setLookAndFeel', 'home');
 
-        vm.notebookHome = true;
-        vm.staticHome = false;
-      } else {
-        vm.staticHome = true;
-        vm.notebookHome = false;
-      }
-    });
+      // make it read only
+      vm.viewOnly = true;
 
-    $scope.renameNote = function(node) {
-      noteActionSrv.renameNote(node.id, node.path);
-    };
+      vm.notebookHome = true;
+      vm.staticHome = false;
+    } else {
+      vm.staticHome = true;
+      vm.notebookHome = false;
+    }
+  });
 
-    $scope.moveNoteToTrash = function(noteId) {
-      noteActionSrv.moveNoteToTrash(noteId, false);
-    };
+  $scope.renameNote = function(node) {
+    noteActionSrv.renameNote(node.id, node.path);
+  };
 
-    $scope.moveFolderToTrash = function(folderId) {
-      noteActionSrv.moveFolderToTrash(folderId);
-    };
+  $scope.moveNoteToTrash = function(noteId) {
+    noteActionSrv.moveNoteToTrash(noteId, false);
+  };
 
-    $scope.restoreNote = function(noteId) {
-      websocketMsgSrv.restoreNote(noteId);
-    };
+  $scope.moveFolderToTrash = function(folderId) {
+    noteActionSrv.moveFolderToTrash(folderId);
+  };
 
-    $scope.restoreFolder = function(folderId) {
-      websocketMsgSrv.restoreFolder(folderId);
-    };
+  $scope.restoreNote = function(noteId) {
+    websocketMsgSrv.restoreNote(noteId);
+  };
 
-    $scope.restoreAll = function() {
-      noteActionSrv.restoreAll();
-    };
+  $scope.restoreFolder = function(folderId) {
+    websocketMsgSrv.restoreFolder(folderId);
+  };
 
-    $scope.renameFolder = function(node) {
-      noteActionSrv.renameFolder(node.id);
-    };
+  $scope.restoreAll = function() {
+    noteActionSrv.restoreAll();
+  };
 
-    $scope.removeNote = function(noteId) {
-      noteActionSrv.removeNote(noteId, false);
-    };
+  $scope.renameFolder = function(node) {
+    noteActionSrv.renameFolder(node.id);
+  };
 
-    $scope.removeFolder = function(folderId) {
-      noteActionSrv.removeFolder(folderId);
-    };
+  $scope.removeNote = function(noteId) {
+    noteActionSrv.removeNote(noteId, false);
+  };
 
-    $scope.emptyTrash = function() {
-      noteActionSrv.emptyTrash();
-    };
+  $scope.removeFolder = function(folderId) {
+    noteActionSrv.removeFolder(folderId);
+  };
 
-    $scope.clearAllParagraphOutput = function(noteId) {
-      noteActionSrv.clearAllParagraphOutput(noteId);
-    };
-  }
-})();
+  $scope.emptyTrash = function() {
+    noteActionSrv.emptyTrash();
+  };
+
+  $scope.clearAllParagraphOutput = function(noteId) {
+    noteActionSrv.clearAllParagraphOutput(noteId);
+  };
+}

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/4c60b27c/zeppelin-web/src/app/interpreter/interpreter.controller.js
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/app/interpreter/interpreter.controller.js b/zeppelin-web/src/app/interpreter/interpreter.controller.js
index 2754ae5..f73bc98 100644
--- a/zeppelin-web/src/app/interpreter/interpreter.controller.js
+++ b/zeppelin-web/src/app/interpreter/interpreter.controller.js
@@ -11,710 +11,708 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
 
-  angular.module('zeppelinWebApp').controller('InterpreterCtrl', InterpreterCtrl);
-
-  InterpreterCtrl.$inject = ['$rootScope', '$scope', '$http', 'baseUrlSrv', 'ngToast', '$timeout', '$route'];
-
-  function InterpreterCtrl($rootScope, $scope, $http, baseUrlSrv, ngToast, $timeout, $route) {
-    var interpreterSettingsTmp = [];
-    $scope.interpreterSettings = [];
-    $scope.availableInterpreters = {};
-    $scope.showAddNewSetting = false;
-    $scope.showRepositoryInfo = false;
-    $scope.searchInterpreter = '';
-    $scope._ = _;
-    ngToast.dismiss();
-
-    $scope.openPermissions = function() {
-      $scope.showInterpreterAuth = true;
-    };
-
-    $scope.closePermissions = function() {
-      $scope.showInterpreterAuth = false;
-    };
-
-    var getSelectJson = function() {
-      var selectJson = {
-        tags: false,
-        multiple: true,
-        tokenSeparators: [',', ' '],
-        minimumInputLength: 2,
-        ajax: {
-          url: function(params) {
-            if (!params.term) {
-              return false;
+angular.module('zeppelinWebApp').controller('InterpreterCtrl', InterpreterCtrl);
+
+InterpreterCtrl.$inject = ['$rootScope', '$scope', '$http', 'baseUrlSrv', 'ngToast', '$timeout', '$route'];
+
+function InterpreterCtrl($rootScope, $scope, $http, baseUrlSrv, ngToast, $timeout, $route) {
+  var interpreterSettingsTmp = [];
+  $scope.interpreterSettings = [];
+  $scope.availableInterpreters = {};
+  $scope.showAddNewSetting = false;
+  $scope.showRepositoryInfo = false;
+  $scope.searchInterpreter = '';
+  $scope._ = _;
+  ngToast.dismiss();
+
+  $scope.openPermissions = function() {
+    $scope.showInterpreterAuth = true;
+  };
+
+  $scope.closePermissions = function() {
+    $scope.showInterpreterAuth = false;
+  };
+
+  var getSelectJson = function() {
+    var selectJson = {
+      tags: false,
+      multiple: true,
+      tokenSeparators: [',', ' '],
+      minimumInputLength: 2,
+      ajax: {
+        url: function(params) {
+          if (!params.term) {
+            return false;
+          }
+          return baseUrlSrv.getRestApiBase() + '/security/userlist/' + params.term;
+        },
+        delay: 250,
+        processResults: function(data, params) {
+          var users = [];
+          if (data.body.users.length !== 0) {
+            for (var i = 0; i < data.body.users.length; i++) {
+              users.push({
+                'id': data.body.users[i],
+                'text': data.body.users[i]
+              });
             }
-            return baseUrlSrv.getRestApiBase() + '/security/userlist/' + params.term;
-          },
-          delay: 250,
-          processResults: function(data, params) {
-            var users = [];
-            if (data.body.users.length !== 0) {
-              for (var i = 0; i < data.body.users.length; i++) {
-                users.push({
-                  'id': data.body.users[i],
-                  'text': data.body.users[i]
-                });
-              }
+          }
+          return {
+            results: users,
+            pagination: {
+              more: false
             }
-            return {
-              results: users,
-              pagination: {
-                more: false
-              }
-            };
-          },
-          cache: false
-        }
-      };
-      return selectJson;
-    };
-
-    $scope.togglePermissions = function(intpName) {
-      angular.element('#' + intpName + 'Users').select2(getSelectJson());
-      if ($scope.showInterpreterAuth) {
-        $scope.closePermissions();
-      } else {
-        $scope.openPermissions();
+          };
+        },
+        cache: false
       }
     };
-
-    $scope.$on('ngRenderFinished', function(event, data) {
-      for (var setting = 0; setting < $scope.interpreterSettings.length; setting++) {
-        angular.element('#' + $scope.interpreterSettings[setting].name + 'Users').select2(getSelectJson());
-      }
-    });
-
-    var getInterpreterSettings = function() {
-      $http.get(baseUrlSrv.getRestApiBase() + '/interpreter/setting')
+    return selectJson;
+  };
+
+  $scope.togglePermissions = function(intpName) {
+    angular.element('#' + intpName + 'Users').select2(getSelectJson());
+    if ($scope.showInterpreterAuth) {
+      $scope.closePermissions();
+    } else {
+      $scope.openPermissions();
+    }
+  };
+
+  $scope.$on('ngRenderFinished', function(event, data) {
+    for (var setting = 0; setting < $scope.interpreterSettings.length; setting++) {
+      angular.element('#' + $scope.interpreterSettings[setting].name + 'Users').select2(getSelectJson());
+    }
+  });
+
+  var getInterpreterSettings = function() {
+    $http.get(baseUrlSrv.getRestApiBase() + '/interpreter/setting')
       .success(function(data, status, headers, config) {
         $scope.interpreterSettings = data.body;
         checkDownloadingDependencies();
       }).error(function(data, status, headers, config) {
-        if (status === 401) {
-          ngToast.danger({
-            content: 'You don\'t have permission on this page',
-            verticalPosition: 'bottom',
-            timeout: '3000'
-          });
-          setTimeout(function() {
-            window.location.replace('/');
-          }, 3000);
-        }
-        console.log('Error %o %o', status, data.message);
-      });
-    };
-
-    var checkDownloadingDependencies = function() {
-      var isDownloading = false;
-      for (var index = 0; index < $scope.interpreterSettings.length; index++) {
-        var setting = $scope.interpreterSettings[index];
-        if (setting.status === 'DOWNLOADING_DEPENDENCIES') {
-          isDownloading = true;
-        }
-
-        if (setting.status === 'ERROR' || setting.errorReason) {
-          ngToast.danger({content: 'Error setting properties for interpreter \'' +
-            setting.group + '.' + setting.name + '\': ' + setting.errorReason,
-            verticalPosition: 'top', dismissOnTimeout: false});
-        }
+      if (status === 401) {
+        ngToast.danger({
+          content: 'You don\'t have permission on this page',
+          verticalPosition: 'bottom',
+          timeout: '3000'
+        });
+        setTimeout(function() {
+          window.location.replace('/');
+        }, 3000);
       }
-
-      if (isDownloading) {
-        $timeout(function() {
-          if ($route.current.$$route.originalPath === '/interpreter') {
-            getInterpreterSettings();
-          }
-        }, 2000);
+      console.log('Error %o %o', status, data.message);
+    });
+  };
+
+  var checkDownloadingDependencies = function() {
+    var isDownloading = false;
+    for (var index = 0; index < $scope.interpreterSettings.length; index++) {
+      var setting = $scope.interpreterSettings[index];
+      if (setting.status === 'DOWNLOADING_DEPENDENCIES') {
+        isDownloading = true;
       }
-    };
-
-    var getAvailableInterpreters = function() {
-      $http.get(baseUrlSrv.getRestApiBase() + '/interpreter').success(function(data, status, headers, config) {
-        $scope.availableInterpreters = data.body;
-      }).error(function(data, status, headers, config) {
-        console.log('Error %o %o', status, data.message);
-      });
-    };
-
-    var emptyNewProperty = function(object) {
-      angular.extend(object, {propertyValue: '', propertyKey: ''});
-    };
-
-    var emptyNewDependency = function(object) {
-      angular.extend(object, {depArtifact: '', depExclude: ''});
-    };
-
-    var removeTMPSettings = function(index) {
-      interpreterSettingsTmp.splice(index, 1);
-    };
-
-    $scope.copyOriginInterpreterSettingProperties = function(settingId) {
-      var index = _.findIndex($scope.interpreterSettings, {'id': settingId});
-      interpreterSettingsTmp[index] = angular.copy($scope.interpreterSettings[index]);
-    };
 
-    $scope.setPerNoteOption = function(settingId, sessionOption) {
-      var option;
-      if (settingId === undefined) {
-        option = $scope.newInterpreterSetting.option;
-      } else {
-        var index = _.findIndex($scope.interpreterSettings, {'id': settingId});
-        var setting = $scope.interpreterSettings[index];
-        option = setting.option;
+      if (setting.status === 'ERROR' || setting.errorReason) {
+        ngToast.danger({content: 'Error setting properties for interpreter \'' +
+        setting.group + '.' + setting.name + '\': ' + setting.errorReason,
+          verticalPosition: 'top', dismissOnTimeout: false});
       }
+    }
 
-      if (sessionOption === 'isolated') {
-        option.perNote = sessionOption;
-        option.session = false;
-        option.process = true;
-      } else if (sessionOption === 'scoped') {
-        option.perNote = sessionOption;
-        option.session = true;
-        option.process = false;
-      } else {
-        option.perNote = 'shared';
-        option.session = false;
-        option.process = false;
-      }
-    };
+    if (isDownloading) {
+      $timeout(function() {
+        if ($route.current.$$route.originalPath === '/interpreter') {
+          getInterpreterSettings();
+        }
+      }, 2000);
+    }
+  };
+
+  var getAvailableInterpreters = function() {
+    $http.get(baseUrlSrv.getRestApiBase() + '/interpreter').success(function(data, status, headers, config) {
+      $scope.availableInterpreters = data.body;
+    }).error(function(data, status, headers, config) {
+      console.log('Error %o %o', status, data.message);
+    });
+  };
+
+  var emptyNewProperty = function(object) {
+    angular.extend(object, {propertyValue: '', propertyKey: ''});
+  };
+
+  var emptyNewDependency = function(object) {
+    angular.extend(object, {depArtifact: '', depExclude: ''});
+  };
+
+  var removeTMPSettings = function(index) {
+    interpreterSettingsTmp.splice(index, 1);
+  };
+
+  $scope.copyOriginInterpreterSettingProperties = function(settingId) {
+    var index = _.findIndex($scope.interpreterSettings, {'id': settingId});
+    interpreterSettingsTmp[index] = angular.copy($scope.interpreterSettings[index]);
+  };
+
+  $scope.setPerNoteOption = function(settingId, sessionOption) {
+    var option;
+    if (settingId === undefined) {
+      option = $scope.newInterpreterSetting.option;
+    } else {
+      var index = _.findIndex($scope.interpreterSettings, {'id': settingId});
+      var setting = $scope.interpreterSettings[index];
+      option = setting.option;
+    }
+
+    if (sessionOption === 'isolated') {
+      option.perNote = sessionOption;
+      option.session = false;
+      option.process = true;
+    } else if (sessionOption === 'scoped') {
+      option.perNote = sessionOption;
+      option.session = true;
+      option.process = false;
+    } else {
+      option.perNote = 'shared';
+      option.session = false;
+      option.process = false;
+    }
+  };
+
+  $scope.setPerUserOption = function(settingId, sessionOption) {
+    var option;
+    if (settingId === undefined) {
+      option = $scope.newInterpreterSetting.option;
+    } else {
+      var index = _.findIndex($scope.interpreterSettings, {'id': settingId});
+      var setting = $scope.interpreterSettings[index];
+      option = setting.option;
+    }
+
+    if (sessionOption === 'isolated') {
+      option.perUser = sessionOption;
+      option.session = false;
+      option.process = true;
+    } else if (sessionOption === 'scoped') {
+      option.perUser = sessionOption;
+      option.session = true;
+      option.process = false;
+    } else {
+      option.perUser = 'shared';
+      option.session = false;
+      option.process = false;
+    }
+  };
+
+  $scope.getPerNoteOption = function(settingId) {
+    var option;
+    if (settingId === undefined) {
+      option = $scope.newInterpreterSetting.option;
+    } else {
+      var index = _.findIndex($scope.interpreterSettings, {'id': settingId});
+      var setting = $scope.interpreterSettings[index];
+      option = setting.option;
+    }
+
+    if (option.perNote === 'scoped') {
+      return 'scoped';
+    } else if (option.perNote === 'isolated') {
+      return 'isolated';
+    } else {
+      return 'shared';
+    }
+  };
+
+  $scope.getPerUserOption = function(settingId) {
+    var option;
+    if (settingId === undefined) {
+      option = $scope.newInterpreterSetting.option;
+    } else {
+      var index = _.findIndex($scope.interpreterSettings, {'id': settingId});
+      var setting = $scope.interpreterSettings[index];
+      option = setting.option;
+    }
+
+    if (option.perUser === 'scoped') {
+      return 'scoped';
+    } else if (option.perUser === 'isolated') {
+      return 'isolated';
+    } else {
+      return 'shared';
+    }
+  };
+
+  $scope.getInterpreterRunningOption = function(settingId) {
+    var sharedModeName = 'shared';
+
+    var globallyModeName = 'Globally';
+    var perNoteModeName = 'Per Note';
+    var perUserModeName = 'Per User';
+
+    var option;
+    if (settingId === undefined) {
+      option = $scope.newInterpreterSetting.option;
+    } else {
+      var index = _.findIndex($scope.interpreterSettings, {'id': settingId});
+      var setting = $scope.interpreterSettings[index];
+      option = setting.option;
+    }
 
-    $scope.setPerUserOption = function(settingId, sessionOption) {
-      var option;
-      if (settingId === undefined) {
-        option = $scope.newInterpreterSetting.option;
-      } else {
-        var index = _.findIndex($scope.interpreterSettings, {'id': settingId});
-        var setting = $scope.interpreterSettings[index];
-        option = setting.option;
-      }
+    var perNote = option.perNote;
+    var perUser = option.perUser;
 
-      if (sessionOption === 'isolated') {
-        option.perUser = sessionOption;
-        option.session = false;
-        option.process = true;
-      } else if (sessionOption === 'scoped') {
-        option.perUser = sessionOption;
-        option.session = true;
-        option.process = false;
-      } else {
-        option.perUser = 'shared';
-        option.session = false;
-        option.process = false;
-      }
-    };
+    // Globally == shared_perNote + shared_perUser
+    if (perNote === sharedModeName && perUser === sharedModeName) {
+      return globallyModeName;
+    }
 
-    $scope.getPerNoteOption = function(settingId) {
-      var option;
-      if (settingId === undefined) {
-        option = $scope.newInterpreterSetting.option;
-      } else {
-        var index = _.findIndex($scope.interpreterSettings, {'id': settingId});
-        var setting = $scope.interpreterSettings[index];
-        option = setting.option;
+    if ($rootScope.ticket.ticket === 'anonymous' && $rootScope.ticket.roles === '[]') {
+      if (perNote !== undefined && typeof perNote === 'string' && perNote !== '') {
+        return perNoteModeName;
       }
-
-      if (option.perNote === 'scoped') {
-        return 'scoped';
-      } else if (option.perNote === 'isolated') {
-        return 'isolated';
-      } else {
-        return 'shared';
+    } else if ($rootScope.ticket.ticket !== 'anonymous') {
+      if (perNote !== undefined && typeof perNote === 'string' && perNote !== '') {
+        if (perUser !== undefined && typeof perUser === 'string' && perUser !== '') {
+          return perUserModeName;
+        }
+        return perNoteModeName;
       }
-    };
+    }
+
+    option.perNote = sharedModeName;
+    option.perUser = sharedModeName;
+    return globallyModeName;
+  };
+
+  $scope.setInterpreterRunningOption = function(settingId, isPerNoteMode, isPerUserMode) {
+    var option;
+    if (settingId === undefined) {
+      option = $scope.newInterpreterSetting.option;
+    } else {
+      var index = _.findIndex($scope.interpreterSettings, {'id': settingId});
+      var setting = $scope.interpreterSettings[index];
+      option = setting.option;
+    }
+    option.perNote = isPerNoteMode;
+    option.perUser = isPerUserMode;
+  };
+
+  $scope.updateInterpreterSetting = function(form, settingId) {
+    var thisConfirm = BootstrapDialog.confirm({
+      closable: false,
+      closeByBackdrop: false,
+      closeByKeyboard: false,
+      title: '',
+      message: 'Do you want to update this interpreter and restart with new settings?',
+      callback: function(result) {
+        if (result) {
+          var index = _.findIndex($scope.interpreterSettings, {'id': settingId});
+          var setting = $scope.interpreterSettings[index];
+          if (setting.propertyKey !== '' || setting.propertyKey) {
+            $scope.addNewInterpreterProperty(settingId);
+          }
+          if (setting.depArtifact !== '' || setting.depArtifact) {
+            $scope.addNewInterpreterDependency(settingId);
+          }
+          // add missing field of option
+          if (!setting.option) {
+            setting.option = {};
+          }
+          if (setting.option.isExistingProcess === undefined) {
+            setting.option.isExistingProcess = false;
+          }
+          if (setting.option.setPermission === undefined) {
+            setting.option.setPermission = false;
+          }
+          if (setting.option.isUserImpersonate === undefined) {
+            setting.option.isUserImpersonate = false;
+          }
+          if (!($scope.getInterpreterRunningOption(settingId) === 'Per User' &&
+            $scope.getPerUserOption(settingId) === 'isolated')) {
+            setting.option.isUserImpersonate = false;
+          }
+          if (setting.option.remote === undefined) {
+            // remote always true for now
+            setting.option.remote = true;
+          }
+          setting.option.users = angular.element('#' + setting.name + 'Users').val();
 
-    $scope.getPerUserOption = function(settingId) {
-      var option;
-      if (settingId === undefined) {
-        option = $scope.newInterpreterSetting.option;
-      } else {
-        var index = _.findIndex($scope.interpreterSettings, {'id': settingId});
-        var setting = $scope.interpreterSettings[index];
-        option = setting.option;
-      }
+          var request = {
+            option: angular.copy(setting.option),
+            properties: angular.copy(setting.properties),
+            dependencies: angular.copy(setting.dependencies)
+          };
 
-      if (option.perUser === 'scoped') {
-        return 'scoped';
-      } else if (option.perUser === 'isolated') {
-        return 'isolated';
-      } else {
-        return 'shared';
+          thisConfirm.$modalFooter.find('button').addClass('disabled');
+          thisConfirm.$modalFooter.find('button:contains("OK")')
+            .html('<i class="fa fa-circle-o-notch fa-spin"></i> Saving Setting');
+
+          $http.put(baseUrlSrv.getRestApiBase() + '/interpreter/setting/' + settingId, request)
+            .success(function(data, status, headers, config) {
+              $scope.interpreterSettings[index] = data.body;
+              removeTMPSettings(index);
+              checkDownloadingDependencies();
+              thisConfirm.close();
+            })
+            .error(function(data, status, headers, config) {
+              console.log('Error %o %o', status, data.message);
+              ngToast.danger({content: data.message, verticalPosition: 'bottom'});
+              form.$show();
+              thisConfirm.close();
+            });
+          return false;
+        } else {
+          form.$show();
+        }
       }
-    };
-
-    $scope.getInterpreterRunningOption = function(settingId) {
-      var sharedModeName = 'shared';
-
-      var globallyModeName = 'Globally';
-      var perNoteModeName = 'Per Note';
-      var perUserModeName = 'Per User';
-
-      var option;
-      if (settingId === undefined) {
-        option = $scope.newInterpreterSetting.option;
-      } else {
-        var index = _.findIndex($scope.interpreterSettings, {'id': settingId});
-        var setting = $scope.interpreterSettings[index];
-        option = setting.option;
+    });
+  };
+
+  $scope.resetInterpreterSetting = function(settingId) {
+    var index = _.findIndex($scope.interpreterSettings, {'id': settingId});
+
+    // Set the old settings back
+    $scope.interpreterSettings[index] = angular.copy(interpreterSettingsTmp[index]);
+    removeTMPSettings(index);
+  };
+
+  $scope.removeInterpreterSetting = function(settingId) {
+    BootstrapDialog.confirm({
+      closable: true,
+      title: '',
+      message: 'Do you want to delete this interpreter setting?',
+      callback: function(result) {
+        if (result) {
+          $http.delete(baseUrlSrv.getRestApiBase() + '/interpreter/setting/' + settingId)
+            .success(function(data, status, headers, config) {
+
+              var index = _.findIndex($scope.interpreterSettings, {'id': settingId});
+              $scope.interpreterSettings.splice(index, 1);
+            }).error(function(data, status, headers, config) {
+            console.log('Error %o %o', status, data.message);
+          });
+        }
       }
-
-      var perNote = option.perNote;
-      var perUser = option.perUser;
-
-      // Globally == shared_perNote + shared_perUser
-      if (perNote === sharedModeName && perUser === sharedModeName) {
-        return globallyModeName;
+    });
+  };
+
+  $scope.newInterpreterGroupChange = function() {
+    var el = _.pluck(_.filter($scope.availableInterpreters, {'name': $scope.newInterpreterSetting.group}),
+      'properties');
+    var properties = {};
+    for (var i = 0; i < el.length; i++) {
+      var intpInfo = el[i];
+      for (var key in intpInfo) {
+        properties[key] = {
+          value: intpInfo[key].defaultValue,
+          description: intpInfo[key].description
+        };
       }
-
-      if ($rootScope.ticket.ticket === 'anonymous' && $rootScope.ticket.roles === '[]') {
-        if (perNote !== undefined && typeof perNote === 'string' && perNote !== '') {
-          return perNoteModeName;
-        }
-      } else if ($rootScope.ticket.ticket !== 'anonymous') {
-        if (perNote !== undefined && typeof perNote === 'string' && perNote !== '') {
-          if (perUser !== undefined && typeof perUser === 'string' && perUser !== '') {
-            return perUserModeName;
-          }
-          return perNoteModeName;
+    }
+    $scope.newInterpreterSetting.properties = properties;
+  };
+
+  $scope.restartInterpreterSetting = function(settingId) {
+    BootstrapDialog.confirm({
+      closable: true,
+      title: '',
+      message: 'Do you want to restart this interpreter?',
+      callback: function(result) {
+        if (result) {
+          $http.put(baseUrlSrv.getRestApiBase() + '/interpreter/setting/restart/' + settingId)
+            .success(function(data, status, headers, config) {
+              var index = _.findIndex($scope.interpreterSettings, {'id': settingId});
+              $scope.interpreterSettings[index] = data.body;
+            }).error(function(data, status, headers, config) {
+            console.log('Error %o %o', status, data.message);
+          });
         }
       }
+    });
+  };
 
-      option.perNote = sharedModeName;
-      option.perUser = sharedModeName;
-      return globallyModeName;
-    };
-
-    $scope.setInterpreterRunningOption = function(settingId, isPerNoteMode, isPerUserMode) {
-      var option;
-      if (settingId === undefined) {
-        option = $scope.newInterpreterSetting.option;
-      } else {
-        var index = _.findIndex($scope.interpreterSettings, {'id': settingId});
-        var setting = $scope.interpreterSettings[index];
-        option = setting.option;
-      }
-      option.perNote = isPerNoteMode;
-      option.perUser = isPerUserMode;
-    };
-
-    $scope.updateInterpreterSetting = function(form, settingId) {
-      var thisConfirm = BootstrapDialog.confirm({
-        closable: false,
-        closeByBackdrop: false,
-        closeByKeyboard: false,
-        title: '',
-        message: 'Do you want to update this interpreter and restart with new settings?',
-        callback: function(result) {
-          if (result) {
-            var index = _.findIndex($scope.interpreterSettings, {'id': settingId});
-            var setting = $scope.interpreterSettings[index];
-            if (setting.propertyKey !== '' || setting.propertyKey) {
-              $scope.addNewInterpreterProperty(settingId);
-            }
-            if (setting.depArtifact !== '' || setting.depArtifact) {
-              $scope.addNewInterpreterDependency(settingId);
-            }
-            // add missing field of option
-            if (!setting.option) {
-              setting.option = {};
-            }
-            if (setting.option.isExistingProcess === undefined) {
-              setting.option.isExistingProcess = false;
-            }
-            if (setting.option.setPermission === undefined) {
-              setting.option.setPermission = false;
-            }
-            if (setting.option.isUserImpersonate === undefined) {
-              setting.option.isUserImpersonate = false;
-            }
-            if (!($scope.getInterpreterRunningOption(settingId) === 'Per User' &&
-                $scope.getPerUserOption(settingId) === 'isolated')) {
-              setting.option.isUserImpersonate = false;
-            }
-            if (setting.option.remote === undefined) {
-              // remote always true for now
-              setting.option.remote = true;
-            }
-            setting.option.users = angular.element('#' + setting.name + 'Users').val();
-
-            var request = {
-              option: angular.copy(setting.option),
-              properties: angular.copy(setting.properties),
-              dependencies: angular.copy(setting.dependencies)
-            };
-
-            thisConfirm.$modalFooter.find('button').addClass('disabled');
-            thisConfirm.$modalFooter.find('button:contains("OK")')
-              .html('<i class="fa fa-circle-o-notch fa-spin"></i> Saving Setting');
-
-            $http.put(baseUrlSrv.getRestApiBase() + '/interpreter/setting/' + settingId, request)
-              .success(function(data, status, headers, config) {
-                $scope.interpreterSettings[index] = data.body;
-                removeTMPSettings(index);
-                checkDownloadingDependencies();
-                thisConfirm.close();
-              })
-              .error(function(data, status, headers, config) {
-                console.log('Error %o %o', status, data.message);
-                ngToast.danger({content: data.message, verticalPosition: 'bottom'});
-                form.$show();
-                thisConfirm.close();
-              });
-            return false;
-          } else {
-            form.$show();
-          }
-        }
+  $scope.addNewInterpreterSetting = function() {
+    //user input validation on interpreter creation
+    if (!$scope.newInterpreterSetting.name ||
+      !$scope.newInterpreterSetting.name.trim() || !$scope.newInterpreterSetting.group) {
+      BootstrapDialog.alert({
+        closable: true,
+        title: 'Add interpreter',
+        message: 'Please fill in interpreter name and choose a group'
       });
-    };
-
-    $scope.resetInterpreterSetting = function(settingId) {
-      var index = _.findIndex($scope.interpreterSettings, {'id': settingId});
+      return;
+    }
 
-      // Set the old settings back
-      $scope.interpreterSettings[index] = angular.copy(interpreterSettingsTmp[index]);
-      removeTMPSettings(index);
-    };
-
-    $scope.removeInterpreterSetting = function(settingId) {
-      BootstrapDialog.confirm({
+    if ($scope.newInterpreterSetting.name.indexOf('.') >= 0) {
+      BootstrapDialog.alert({
         closable: true,
-        title: '',
-        message: 'Do you want to delete this interpreter setting?',
-        callback: function(result) {
-          if (result) {
-            $http.delete(baseUrlSrv.getRestApiBase() + '/interpreter/setting/' + settingId)
-              .success(function(data, status, headers, config) {
-
-                var index = _.findIndex($scope.interpreterSettings, {'id': settingId});
-                $scope.interpreterSettings.splice(index, 1);
-              }).error(function(data, status, headers, config) {
-              console.log('Error %o %o', status, data.message);
-            });
-          }
-        }
+        title: 'Add interpreter',
+        message: '\'.\' is invalid for interpreter name'
       });
-    };
+      return;
+    }
 
-    $scope.newInterpreterGroupChange = function() {
-      var el = _.pluck(_.filter($scope.availableInterpreters, {'name': $scope.newInterpreterSetting.group}),
-        'properties');
-      var properties = {};
-      for (var i = 0; i < el.length; i++) {
-        var intpInfo = el[i];
-        for (var key in intpInfo) {
-          properties[key] = {
-            value: intpInfo[key].defaultValue,
-            description: intpInfo[key].description
-          };
-        }
-      }
-      $scope.newInterpreterSetting.properties = properties;
-    };
-
-    $scope.restartInterpreterSetting = function(settingId) {
-      BootstrapDialog.confirm({
+    if (_.findIndex($scope.interpreterSettings, {'name': $scope.newInterpreterSetting.name}) >= 0) {
+      BootstrapDialog.alert({
         closable: true,
-        title: '',
-        message: 'Do you want to restart this interpreter?',
-        callback: function(result) {
-          if (result) {
-            $http.put(baseUrlSrv.getRestApiBase() + '/interpreter/setting/restart/' + settingId)
-              .success(function(data, status, headers, config) {
-                var index = _.findIndex($scope.interpreterSettings, {'id': settingId});
-                $scope.interpreterSettings[index] = data.body;
-              }).error(function(data, status, headers, config) {
-              console.log('Error %o %o', status, data.message);
-            });
-          }
-        }
+        title: 'Add interpreter',
+        message: 'Name ' + $scope.newInterpreterSetting.name + ' already exists'
       });
-    };
+      return;
+    }
+
+    var newSetting = $scope.newInterpreterSetting;
+    if (newSetting.propertyKey !== '' || newSetting.propertyKey) {
+      $scope.addNewInterpreterProperty();
+    }
+    if (newSetting.depArtifact !== '' || newSetting.depArtifact) {
+      $scope.addNewInterpreterDependency();
+    }
+    if (newSetting.option.setPermission === undefined) {
+      newSetting.option.setPermission = false;
+    }
+    newSetting.option.users = angular.element('#newInterpreterUsers').val();
+
+    var request = angular.copy($scope.newInterpreterSetting);
+
+    // Change properties to proper request format
+    var newProperties = {};
+    for (var p in newSetting.properties) {
+      newProperties[p] = newSetting.properties[p].value;
+    }
+    request.properties = newProperties;
+
+    $http.post(baseUrlSrv.getRestApiBase() + '/interpreter/setting', request)
+      .success(function(data, status, headers, config) {
+        $scope.resetNewInterpreterSetting();
+        getInterpreterSettings();
+        $scope.showAddNewSetting = false;
+        checkDownloadingDependencies();
+      }).error(function(data, status, headers, config) {
+      console.log('Error %o %o', status, data.message);
+      ngToast.danger({content: data.message, verticalPosition: 'bottom'});
+    });
+  };
 
-    $scope.addNewInterpreterSetting = function() {
-      //user input validation on interpreter creation
-      if (!$scope.newInterpreterSetting.name ||
-          !$scope.newInterpreterSetting.name.trim() || !$scope.newInterpreterSetting.group) {
-        BootstrapDialog.alert({
-          closable: true,
-          title: 'Add interpreter',
-          message: 'Please fill in interpreter name and choose a group'
-        });
-        return;
-      }
+  $scope.cancelInterpreterSetting = function() {
+    $scope.showAddNewSetting = false;
+    $scope.resetNewInterpreterSetting();
+  };
+
+  $scope.resetNewInterpreterSetting = function() {
+    $scope.newInterpreterSetting = {
+      name: undefined,
+      group: undefined,
+      properties: {},
+      dependencies: [],
+      option: {
+        remote: true,
+        isExistingProcess: false,
+        setPermission: false,
+        session: false,
+        process: false
 
-      if ($scope.newInterpreterSetting.name.indexOf('.') >= 0) {
-        BootstrapDialog.alert({
-          closable: true,
-          title: 'Add interpreter',
-          message: '\'.\' is invalid for interpreter name'
-        });
-        return;
       }
+    };
+    emptyNewProperty($scope.newInterpreterSetting);
+  };
 
-      if (_.findIndex($scope.interpreterSettings, {'name': $scope.newInterpreterSetting.name}) >= 0) {
-        BootstrapDialog.alert({
-          closable: true,
-          title: 'Add interpreter',
-          message: 'Name ' + $scope.newInterpreterSetting.name + ' already exists'
+  $scope.removeInterpreterProperty = function(key, settingId) {
+    if (settingId === undefined) {
+      delete $scope.newInterpreterSetting.properties[key];
+    } else {
+      var index = _.findIndex($scope.interpreterSettings, {'id': settingId});
+      delete $scope.interpreterSettings[index].properties[key];
+    }
+  };
+
+  $scope.removeInterpreterDependency = function(artifact, settingId) {
+    if (settingId === undefined) {
+      $scope.newInterpreterSetting.dependencies = _.reject($scope.newInterpreterSetting.dependencies,
+        function(el) {
+          return el.groupArtifactVersion === artifact;
         });
-        return;
-      }
-
-      var newSetting = $scope.newInterpreterSetting;
-      if (newSetting.propertyKey !== '' || newSetting.propertyKey) {
-        $scope.addNewInterpreterProperty();
-      }
-      if (newSetting.depArtifact !== '' || newSetting.depArtifact) {
-        $scope.addNewInterpreterDependency();
-      }
-      if (newSetting.option.setPermission === undefined) {
-        newSetting.option.setPermission = false;
-      }
-      newSetting.option.users = angular.element('#newInterpreterUsers').val();
-
-      var request = angular.copy($scope.newInterpreterSetting);
+    } else {
+      var index = _.findIndex($scope.interpreterSettings, {'id': settingId});
+      $scope.interpreterSettings[index].dependencies = _.reject($scope.interpreterSettings[index].dependencies,
+        function(el) {
+          return el.groupArtifactVersion === artifact;
+        });
+    }
+  };
 
-      // Change properties to proper request format
-      var newProperties = {};
-      for (var p in newSetting.properties) {
-        newProperties[p] = newSetting.properties[p].value;
+  $scope.addNewInterpreterProperty = function(settingId) {
+    if (settingId === undefined) {
+      // Add new property from create form
+      if (!$scope.newInterpreterSetting.propertyKey || $scope.newInterpreterSetting.propertyKey === '') {
+        return;
       }
-      request.properties = newProperties;
 
-      $http.post(baseUrlSrv.getRestApiBase() + '/interpreter/setting', request)
-        .success(function(data, status, headers, config) {
-          $scope.resetNewInterpreterSetting();
-          getInterpreterSettings();
-          $scope.showAddNewSetting = false;
-          checkDownloadingDependencies();
-        }).error(function(data, status, headers, config) {
-        console.log('Error %o %o', status, data.message);
-        ngToast.danger({content: data.message, verticalPosition: 'bottom'});
-      });
-    };
-
-    $scope.cancelInterpreterSetting = function() {
-      $scope.showAddNewSetting = false;
-      $scope.resetNewInterpreterSetting();
-    };
-
-    $scope.resetNewInterpreterSetting = function() {
-      $scope.newInterpreterSetting = {
-        name: undefined,
-        group: undefined,
-        properties: {},
-        dependencies: [],
-        option: {
-          remote: true,
-          isExistingProcess: false,
-          setPermission: false,
-          session: false,
-          process: false
-
-        }
+      $scope.newInterpreterSetting.properties[$scope.newInterpreterSetting.propertyKey] = {
+        value: $scope.newInterpreterSetting.propertyValue
       };
       emptyNewProperty($scope.newInterpreterSetting);
-    };
+    } else {
+      // Add new property from edit form
+      var index = _.findIndex($scope.interpreterSettings, {'id': settingId});
+      var setting = $scope.interpreterSettings[index];
 
-    $scope.removeInterpreterProperty = function(key, settingId) {
-      if (settingId === undefined) {
-        delete $scope.newInterpreterSetting.properties[key];
-      } else {
-        var index = _.findIndex($scope.interpreterSettings, {'id': settingId});
-        delete $scope.interpreterSettings[index].properties[key];
+      if (!setting.propertyKey || setting.propertyKey === '') {
+        return;
       }
-    };
-
-    $scope.removeInterpreterDependency = function(artifact, settingId) {
-      if (settingId === undefined) {
-        $scope.newInterpreterSetting.dependencies = _.reject($scope.newInterpreterSetting.dependencies,
-          function(el) {
-            return el.groupArtifactVersion === artifact;
-          });
-      } else {
-        var index = _.findIndex($scope.interpreterSettings, {'id': settingId});
-        $scope.interpreterSettings[index].dependencies = _.reject($scope.interpreterSettings[index].dependencies,
-          function(el) {
-            return el.groupArtifactVersion === artifact;
-          });
+      setting.properties[setting.propertyKey] = setting.propertyValue;
+      emptyNewProperty(setting);
+    }
+  };
+
+  $scope.addNewInterpreterDependency = function(settingId) {
+    if (settingId === undefined) {
+      // Add new dependency from create form
+      if (!$scope.newInterpreterSetting.depArtifact || $scope.newInterpreterSetting.depArtifact === '') {
+        return;
       }
-    };
-
-    $scope.addNewInterpreterProperty = function(settingId) {
-      if (settingId === undefined) {
-        // Add new property from create form
-        if (!$scope.newInterpreterSetting.propertyKey || $scope.newInterpreterSetting.propertyKey === '') {
-          return;
-        }
-
-        $scope.newInterpreterSetting.properties[$scope.newInterpreterSetting.propertyKey] = {
-          value: $scope.newInterpreterSetting.propertyValue
-        };
-        emptyNewProperty($scope.newInterpreterSetting);
-      } else {
-        // Add new property from edit form
-        var index = _.findIndex($scope.interpreterSettings, {'id': settingId});
-        var setting = $scope.interpreterSettings[index];
 
-        if (!setting.propertyKey || setting.propertyKey === '') {
-          return;
+      // overwrite if artifact already exists
+      var newSetting = $scope.newInterpreterSetting;
+      for (var d in newSetting.dependencies) {
+        if (newSetting.dependencies[d].groupArtifactVersion === newSetting.depArtifact) {
+          newSetting.dependencies[d] = {
+            'groupArtifactVersion': newSetting.depArtifact,
+            'exclusions': newSetting.depExclude
+          };
+          newSetting.dependencies.splice(d, 1);
         }
-        setting.properties[setting.propertyKey] = setting.propertyValue;
-        emptyNewProperty(setting);
       }
-    };
 
-    $scope.addNewInterpreterDependency = function(settingId) {
-      if (settingId === undefined) {
-        // Add new dependency from create form
-        if (!$scope.newInterpreterSetting.depArtifact || $scope.newInterpreterSetting.depArtifact === '') {
-          return;
-        }
-
-        // overwrite if artifact already exists
-        var newSetting = $scope.newInterpreterSetting;
-        for (var d in newSetting.dependencies) {
-          if (newSetting.dependencies[d].groupArtifactVersion === newSetting.depArtifact) {
-            newSetting.dependencies[d] = {
-              'groupArtifactVersion': newSetting.depArtifact,
-              'exclusions': newSetting.depExclude
-            };
-            newSetting.dependencies.splice(d, 1);
-          }
-        }
-
-        newSetting.dependencies.push({
-          'groupArtifactVersion': newSetting.depArtifact,
-          'exclusions': (newSetting.depExclude === '') ? [] : newSetting.depExclude
-        });
-        emptyNewDependency(newSetting);
-      } else {
-        // Add new dependency from edit form
-        var index = _.findIndex($scope.interpreterSettings, {'id': settingId});
-        var setting = $scope.interpreterSettings[index];
-        if (!setting.depArtifact || setting.depArtifact === '') {
-          return;
-        }
+      newSetting.dependencies.push({
+        'groupArtifactVersion': newSetting.depArtifact,
+        'exclusions': (newSetting.depExclude === '') ? [] : newSetting.depExclude
+      });
+      emptyNewDependency(newSetting);
+    } else {
+      // Add new dependency from edit form
+      var index = _.findIndex($scope.interpreterSettings, {'id': settingId});
+      var setting = $scope.interpreterSettings[index];
+      if (!setting.depArtifact || setting.depArtifact === '') {
+        return;
+      }
 
-        // overwrite if artifact already exists
-        for (var dep in setting.dependencies) {
-          if (setting.dependencies[dep].groupArtifactVersion === setting.depArtifact) {
-            setting.dependencies[dep] = {
-              'groupArtifactVersion': setting.depArtifact,
-              'exclusions': setting.depExclude
-            };
-            setting.dependencies.splice(dep, 1);
-          }
+      // overwrite if artifact already exists
+      for (var dep in setting.dependencies) {
+        if (setting.dependencies[dep].groupArtifactVersion === setting.depArtifact) {
+          setting.dependencies[dep] = {
+            'groupArtifactVersion': setting.depArtifact,
+            'exclusions': setting.depExclude
+          };
+          setting.dependencies.splice(dep, 1);
         }
-
-        setting.dependencies.push({
-          'groupArtifactVersion': setting.depArtifact,
-          'exclusions': (setting.depExclude === '') ? [] : setting.depExclude
-        });
-        emptyNewDependency(setting);
       }
-    };
 
-    $scope.resetNewRepositorySetting = function() {
-      $scope.newRepoSetting = {
-        id: '',
-        url: '',
-        snapshot: false,
-        username: '',
-        password: '',
-        proxyProtocol: 'HTTP',
-        proxyHost: '',
-        proxyPort: null,
-        proxyLogin: '',
-        proxyPassword: ''
-      };
-    };
-
-    var getRepositories = function() {
-      $http.get(baseUrlSrv.getRestApiBase() + '/interpreter/repository')
-        .success(function(data, status, headers, config) {
-          $scope.repositories = data.body;
-        }).error(function(data, status, headers, config) {
-        console.log('Error %o %o', status, data.message);
+      setting.dependencies.push({
+        'groupArtifactVersion': setting.depArtifact,
+        'exclusions': (setting.depExclude === '') ? [] : setting.depExclude
       });
-    };
+      emptyNewDependency(setting);
+    }
+  };
+
+  $scope.resetNewRepositorySetting = function() {
+    $scope.newRepoSetting = {
+      id: '',
+      url: '',
+      snapshot: false,
+      username: '',
+      password: '',
+      proxyProtocol: 'HTTP',
+      proxyHost: '',
+      proxyPort: null,
+      proxyLogin: '',
+      proxyPassword: ''
+    };
+  };
+
+  var getRepositories = function() {
+    $http.get(baseUrlSrv.getRestApiBase() + '/interpreter/repository')
+      .success(function(data, status, headers, config) {
+        $scope.repositories = data.body;
+      }).error(function(data, status, headers, config) {
+      console.log('Error %o %o', status, data.message);
+    });
+  };
 
-    $scope.addNewRepository = function() {
-      var request = angular.copy($scope.newRepoSetting);
+  $scope.addNewRepository = function() {
+    var request = angular.copy($scope.newRepoSetting);
 
-      $http.post(baseUrlSrv.getRestApiBase() + '/interpreter/repository', request)
-        .success(function(data, status, headers, config) {
-          getRepositories();
-          $scope.resetNewRepositorySetting();
-          angular.element('#repoModal').modal('hide');
-        }).error(function(data, status, headers, config) {
-        console.log('Error %o %o', headers, config);
-      });
-    };
-
-    $scope.removeRepository = function(repoId) {
-      BootstrapDialog.confirm({
-        closable: true,
-        title: '',
-        message: 'Do you want to delete this repository?',
-        callback: function(result) {
-          if (result) {
-            $http.delete(baseUrlSrv.getRestApiBase() + '/interpreter/repository/' + repoId)
-              .success(function(data, status, headers, config) {
-                var index = _.findIndex($scope.repositories, {'id': repoId});
-                $scope.repositories.splice(index, 1);
-              }).error(function(data, status, headers, config) {
-              console.log('Error %o %o', status, data.message);
-            });
-          }
+    $http.post(baseUrlSrv.getRestApiBase() + '/interpreter/repository', request)
+      .success(function(data, status, headers, config) {
+        getRepositories();
+        $scope.resetNewRepositorySetting();
+        angular.element('#repoModal').modal('hide');
+      }).error(function(data, status, headers, config) {
+      console.log('Error %o %o', headers, config);
+    });
+  };
+
+  $scope.removeRepository = function(repoId) {
+    BootstrapDialog.confirm({
+      closable: true,
+      title: '',
+      message: 'Do you want to delete this repository?',
+      callback: function(result) {
+        if (result) {
+          $http.delete(baseUrlSrv.getRestApiBase() + '/interpreter/repository/' + repoId)
+            .success(function(data, status, headers, config) {
+              var index = _.findIndex($scope.repositories, {'id': repoId});
+              $scope.repositories.splice(index, 1);
+            }).error(function(data, status, headers, config) {
+            console.log('Error %o %o', status, data.message);
+          });
         }
-      });
-    };
-
-    $scope.isDefaultRepository = function(repoId) {
-      if (repoId === 'central' || repoId === 'local') {
-        return true;
-      } else {
-        return false;
       }
-    };
-
-    $scope.showErrorMessage = function(setting) {
-      BootstrapDialog.show({
-        title: 'Error downloading dependencies',
-        message: setting.errorReason
-      });
-    };
+    });
+  };
+
+  $scope.isDefaultRepository = function(repoId) {
+    if (repoId === 'central' || repoId === 'local') {
+      return true;
+    } else {
+      return false;
+    }
+  };
+
+  $scope.showErrorMessage = function(setting) {
+    BootstrapDialog.show({
+      title: 'Error downloading dependencies',
+      message: setting.errorReason
+    });
+  };
 
-    var init = function() {
-      $scope.resetNewInterpreterSetting();
-      $scope.resetNewRepositorySetting();
+  var init = function() {
+    $scope.resetNewInterpreterSetting();
+    $scope.resetNewRepositorySetting();
 
-      getInterpreterSettings();
-      getAvailableInterpreters();
-      getRepositories();
-    };
+    getInterpreterSettings();
+    getAvailableInterpreters();
+    getRepositories();
+  };
 
-    $scope.showSparkUI = function(settingId) {
-      $http.get(baseUrlSrv.getRestApiBase() + '/interpreter/getmetainfos/' + settingId + '?propName=url')
-        .success(function(data, status, headers, config) {
-          var url = data.body.url;
-          if (!url) {
-            BootstrapDialog.alert({
-              message: 'No spark application running'
-            });
-            return;
-          }
-          window.open(url, '_blank');
-        }).error(function(data, status, headers, config) {
-         console.log('Error %o %o', status, data.message);
-       });
-    };
+  $scope.showSparkUI = function(settingId) {
+    $http.get(baseUrlSrv.getRestApiBase() + '/interpreter/getmetainfos/' + settingId + '?propName=url')
+      .success(function(data, status, headers, config) {
+        var url = data.body.url;
+        if (!url) {
+          BootstrapDialog.alert({
+            message: 'No spark application running'
+          });
+          return;
+        }
+        window.open(url, '_blank');
+      }).error(function(data, status, headers, config) {
+      console.log('Error %o %o', status, data.message);
+    });
+  };
 
-    init();
-  }
+  init();
+}
 
-})();

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/4c60b27c/zeppelin-web/src/app/interpreter/interpreter.filter.js
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/app/interpreter/interpreter.filter.js b/zeppelin-web/src/app/interpreter/interpreter.filter.js
index 59510b0..c5f1572 100644
--- a/zeppelin-web/src/app/interpreter/interpreter.filter.js
+++ b/zeppelin-web/src/app/interpreter/interpreter.filter.js
@@ -11,15 +11,12 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
 
-  angular.module('zeppelinWebApp').filter('sortByKey', sortByKey);
+angular.module('zeppelinWebApp').filter('sortByKey', sortByKey);
 
-  function sortByKey() {
-    return function(properties) {
-      var sortedKeys = properties ? Object.keys(properties) : [];
-      return sortedKeys.sort();
-    };
-  }
-
-})();
+function sortByKey() {
+  return function(properties) {
+    var sortedKeys = properties ? Object.keys(properties) : [];
+    return sortedKeys.sort();
+  };
+}


[2/6] zeppelin git commit: [ZEPPELIN-1927] Remove useless function wrapping in all js files

Posted by mo...@apache.org.
http://git-wip-us.apache.org/repos/asf/zeppelin/blob/4c60b27c/zeppelin-web/src/components/login/login.controller.js
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/components/login/login.controller.js b/zeppelin-web/src/components/login/login.controller.js
index e498084..f4a6dd9 100644
--- a/zeppelin-web/src/components/login/login.controller.js
+++ b/zeppelin-web/src/components/login/login.controller.js
@@ -11,53 +11,51 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
-
-  angular.module('zeppelinWebApp').controller('LoginCtrl', LoginCtrl);
-
-  LoginCtrl.$inject = ['$scope', '$rootScope', '$http', '$httpParamSerializer', 'baseUrlSrv'];
-  function LoginCtrl($scope, $rootScope, $http, $httpParamSerializer, baseUrlSrv) {
-    $scope.SigningIn = false;
-    $scope.loginParams = {};
-    $scope.login = function() {
-
-      $scope.SigningIn = true;
-      $http({
-        method: 'POST',
-        url: baseUrlSrv.getRestApiBase() + '/login',
-        headers: {
-          'Content-Type': 'application/x-www-form-urlencoded'
-        },
-        data: $httpParamSerializer({
-          'userName': $scope.loginParams.userName,
-          'password': $scope.loginParams.password
-        })
-      }).then(function successCallback(response) {
-        $rootScope.ticket = response.data.body;
-        angular.element('#loginModal').modal('toggle');
-        $rootScope.$broadcast('loginSuccess', true);
-        $rootScope.userName = $scope.loginParams.userName;
-      }, function errorCallback(errorResponse) {
-        $scope.loginParams.errorText = 'The username and password that you entered don\'t match.';
-        $scope.SigningIn = false;
-      });
 
-    };
+angular.module('zeppelinWebApp').controller('LoginCtrl', LoginCtrl);
+
+LoginCtrl.$inject = ['$scope', '$rootScope', '$http', '$httpParamSerializer', 'baseUrlSrv'];
+function LoginCtrl($scope, $rootScope, $http, $httpParamSerializer, baseUrlSrv) {
+  $scope.SigningIn = false;
+  $scope.loginParams = {};
+  $scope.login = function() {
+
+    $scope.SigningIn = true;
+    $http({
+      method: 'POST',
+      url: baseUrlSrv.getRestApiBase() + '/login',
+      headers: {
+        'Content-Type': 'application/x-www-form-urlencoded'
+      },
+      data: $httpParamSerializer({
+        'userName': $scope.loginParams.userName,
+        'password': $scope.loginParams.password
+      })
+    }).then(function successCallback(response) {
+      $rootScope.ticket = response.data.body;
+      angular.element('#loginModal').modal('toggle');
+      $rootScope.$broadcast('loginSuccess', true);
+      $rootScope.userName = $scope.loginParams.userName;
+    }, function errorCallback(errorResponse) {
+      $scope.loginParams.errorText = 'The username and password that you entered don\'t match.';
+      $scope.SigningIn = false;
+    });
 
-    var initValues = function() {
-      $scope.loginParams = {
-        userName: '',
-        password: ''
-      };
+  };
+
+  var initValues = function() {
+    $scope.loginParams = {
+      userName: '',
+      password: ''
     };
+  };
 
-    /*
-    ** $scope.$on functions below
-    */
+  /*
+   ** $scope.$on functions below
+   */
 
-    $scope.$on('initLoginValues', function() {
-      initValues();
-    });
-  }
+  $scope.$on('initLoginValues', function() {
+    initValues();
+  });
+}
 
-})();

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/4c60b27c/zeppelin-web/src/components/navbar/navbar.controller.js
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/components/navbar/navbar.controller.js b/zeppelin-web/src/components/navbar/navbar.controller.js
index 14daf44..8622971 100644
--- a/zeppelin-web/src/components/navbar/navbar.controller.js
+++ b/zeppelin-web/src/components/navbar/navbar.controller.js
@@ -11,135 +11,133 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
-
-  angular.module('zeppelinWebApp').controller('NavCtrl', NavCtrl);
-
-  NavCtrl.$inject = [
-    '$scope',
-    '$rootScope',
-    '$http',
-    '$routeParams',
-    '$location',
-    'noteListDataFactory',
-    'baseUrlSrv',
-    'websocketMsgSrv',
-    'arrayOrderingSrv',
-    'searchService',
-    'TRASH_FOLDER_ID'
-  ];
-
-  function NavCtrl($scope, $rootScope, $http, $routeParams, $location,
-                   noteListDataFactory, baseUrlSrv, websocketMsgSrv,
-                   arrayOrderingSrv, searchService, TRASH_FOLDER_ID) {
-    var vm = this;
-    vm.arrayOrderingSrv = arrayOrderingSrv;
-    vm.connected = websocketMsgSrv.isConnected();
-    vm.isActive = isActive;
-    vm.logout = logout;
-    vm.notes = noteListDataFactory;
-    vm.search = search;
-    vm.searchForm = searchService;
-    vm.showLoginWindow = showLoginWindow;
-    vm.TRASH_FOLDER_ID = TRASH_FOLDER_ID;
-
-    $scope.query = {q: ''};
-
-    initController();
-
-    function getZeppelinVersion() {
-      $http.get(baseUrlSrv.getRestApiBase() + '/version').success(
-        function(data, status, headers, config) {
-          $rootScope.zeppelinVersion = data.body;
-        }).error(
-        function(data, status, headers, config) {
-          console.log('Error %o %o', status, data.message);
-        });
-    }
-
-    function initController() {
-      $scope.isDrawNavbarNoteList = false;
-      angular.element('#notebook-list').perfectScrollbar({suppressScrollX: true});
 
-      angular.element(document).click(function() {
-        $scope.query.q = '';
+angular.module('zeppelinWebApp').controller('NavCtrl', NavCtrl);
+
+NavCtrl.$inject = [
+  '$scope',
+  '$rootScope',
+  '$http',
+  '$routeParams',
+  '$location',
+  'noteListDataFactory',
+  'baseUrlSrv',
+  'websocketMsgSrv',
+  'arrayOrderingSrv',
+  'searchService',
+  'TRASH_FOLDER_ID'
+];
+
+function NavCtrl($scope, $rootScope, $http, $routeParams, $location,
+                 noteListDataFactory, baseUrlSrv, websocketMsgSrv,
+                 arrayOrderingSrv, searchService, TRASH_FOLDER_ID) {
+  var vm = this;
+  vm.arrayOrderingSrv = arrayOrderingSrv;
+  vm.connected = websocketMsgSrv.isConnected();
+  vm.isActive = isActive;
+  vm.logout = logout;
+  vm.notes = noteListDataFactory;
+  vm.search = search;
+  vm.searchForm = searchService;
+  vm.showLoginWindow = showLoginWindow;
+  vm.TRASH_FOLDER_ID = TRASH_FOLDER_ID;
+
+  $scope.query = {q: ''};
+
+  initController();
+
+  function getZeppelinVersion() {
+    $http.get(baseUrlSrv.getRestApiBase() + '/version').success(
+      function(data, status, headers, config) {
+        $rootScope.zeppelinVersion = data.body;
+      }).error(
+      function(data, status, headers, config) {
+        console.log('Error %o %o', status, data.message);
       });
+  }
 
-      getZeppelinVersion();
-      loadNotes();
-    }
+  function initController() {
+    $scope.isDrawNavbarNoteList = false;
+    angular.element('#notebook-list').perfectScrollbar({suppressScrollX: true});
 
-    function isActive(noteId) {
-      return ($routeParams.noteId === noteId);
-    }
+    angular.element(document).click(function() {
+      $scope.query.q = '';
+    });
 
-    function loadNotes() {
-      websocketMsgSrv.getNoteList();
-    }
+    getZeppelinVersion();
+    loadNotes();
+  }
 
-    function logout() {
-      var logoutURL = baseUrlSrv.getRestApiBase() + '/login/logout';
+  function isActive(noteId) {
+    return ($routeParams.noteId === noteId);
+  }
 
-      //for firefox and safari
-      logoutURL = logoutURL.replace('//', '//false:false@');
+  function loadNotes() {
+    websocketMsgSrv.getNoteList();
+  }
+
+  function logout() {
+    var logoutURL = baseUrlSrv.getRestApiBase() + '/login/logout';
+
+    //for firefox and safari
+    logoutURL = logoutURL.replace('//', '//false:false@');
+    $http.post(logoutURL).error(function() {
+      //force authcBasic (if configured) to logout
       $http.post(logoutURL).error(function() {
-        //force authcBasic (if configured) to logout
-        $http.post(logoutURL).error(function() {
-          $rootScope.userName = '';
-          $rootScope.ticket.principal = '';
-          $rootScope.ticket.ticket = '';
-          $rootScope.ticket.roles = '';
-          BootstrapDialog.show({
-            message: 'Logout Success'
-          });
-          setTimeout(function() {
-            window.location.replace('/');
-          }, 1000);
+        $rootScope.userName = '';
+        $rootScope.ticket.principal = '';
+        $rootScope.ticket.ticket = '';
+        $rootScope.ticket.roles = '';
+        BootstrapDialog.show({
+          message: 'Logout Success'
         });
+        setTimeout(function() {
+          window.location.replace('/');
+        }, 1000);
       });
-    }
-
-    function search(searchTerm) {
-      $location.path('/search/' + searchTerm);
-    }
-
-    function showLoginWindow() {
-      setTimeout(function() {
-        angular.element('#userName').focus();
-      }, 500);
-    }
-
-    /*
-    ** $scope.$on functions below
-    */
-
-    $scope.$on('setNoteMenu', function(event, notes) {
-      noteListDataFactory.setNotes(notes);
-      initNotebookListEventListener();
     });
+  }
 
-    $scope.$on('setConnectedStatus', function(event, param) {
-      vm.connected = param;
-    });
+  function search(searchTerm) {
+    $location.path('/search/' + searchTerm);
+  }
 
-    $scope.$on('loginSuccess', function(event, param) {
-      loadNotes();
-    });
+  function showLoginWindow() {
+    setTimeout(function() {
+      angular.element('#userName').focus();
+    }, 500);
+  }
 
-    /*
-    ** Performance optimization for Browser Render.
-    */
-    function initNotebookListEventListener() {
-      angular.element(document).ready(function() {
-        angular.element('.notebook-list-dropdown').on('show.bs.dropdown', function() {
-          $scope.isDrawNavbarNoteList = true;
-        });
+  /*
+   ** $scope.$on functions below
+   */
+
+  $scope.$on('setNoteMenu', function(event, notes) {
+    noteListDataFactory.setNotes(notes);
+    initNotebookListEventListener();
+  });
+
+  $scope.$on('setConnectedStatus', function(event, param) {
+    vm.connected = param;
+  });
+
+  $scope.$on('loginSuccess', function(event, param) {
+    loadNotes();
+  });
+
+  /*
+   ** Performance optimization for Browser Render.
+   */
+  function initNotebookListEventListener() {
+    angular.element(document).ready(function() {
+      angular.element('.notebook-list-dropdown').on('show.bs.dropdown', function() {
+        $scope.isDrawNavbarNoteList = true;
+      });
 
-        angular.element('.notebook-list-dropdown').on('hide.bs.dropdown', function() {
-          $scope.isDrawNavbarNoteList = false;
-        });
+      angular.element('.notebook-list-dropdown').on('hide.bs.dropdown', function() {
+        $scope.isDrawNavbarNoteList = false;
       });
-    }
+    });
   }
+}
 
-})();

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/4c60b27c/zeppelin-web/src/components/ngenter/ngenter.directive.js
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/components/ngenter/ngenter.directive.js b/zeppelin-web/src/components/ngenter/ngenter.directive.js
index c962ccc..8b4fe8b 100644
--- a/zeppelin-web/src/components/ngenter/ngenter.directive.js
+++ b/zeppelin-web/src/components/ngenter/ngenter.directive.js
@@ -11,23 +11,21 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
 
-  angular.module('zeppelinWebApp').directive('ngEnter', ngEnter);
+angular.module('zeppelinWebApp').directive('ngEnter', ngEnter);
 
-  function ngEnter() {
-    return function(scope, element, attrs) {
-      element.bind('keydown keypress', function(event) {
-        if (event.which === 13) {
-          if (!event.shiftKey) {
-            scope.$apply(function() {
-              scope.$eval(attrs.ngEnter);
-            });
-          }
-          event.preventDefault();
+function ngEnter() {
+  return function(scope, element, attrs) {
+    element.bind('keydown keypress', function(event) {
+      if (event.which === 13) {
+        if (!event.shiftKey) {
+          scope.$apply(function() {
+            scope.$eval(attrs.ngEnter);
+          });
         }
-      });
-    };
-  }
+        event.preventDefault();
+      }
+    });
+  };
+}
 
-})();

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/4c60b27c/zeppelin-web/src/components/ngescape/ngescape.directive.js
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/components/ngescape/ngescape.directive.js b/zeppelin-web/src/components/ngescape/ngescape.directive.js
index fc0ad82..4c404aa 100644
--- a/zeppelin-web/src/components/ngescape/ngescape.directive.js
+++ b/zeppelin-web/src/components/ngescape/ngescape.directive.js
@@ -11,21 +11,19 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
 
-  angular.module('zeppelinWebApp').directive('ngEscape', ngEscape);
+angular.module('zeppelinWebApp').directive('ngEscape', ngEscape);
 
-  function ngEscape() {
-    return function(scope, element, attrs) {
-      element.bind('keydown keyup', function(event) {
-        if (event.which === 27) {
-          scope.$apply(function() {
-            scope.$eval(attrs.ngEscape);
-          });
-          event.preventDefault();
-        }
-      });
-    };
-  }
+function ngEscape() {
+  return function(scope, element, attrs) {
+    element.bind('keydown keyup', function(event) {
+      if (event.which === 27) {
+        scope.$apply(function() {
+          scope.$eval(attrs.ngEscape);
+        });
+        event.preventDefault();
+      }
+    });
+  };
+}
 
-})();

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/4c60b27c/zeppelin-web/src/components/noteAction/noteAction.service.js
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/components/noteAction/noteAction.service.js b/zeppelin-web/src/components/noteAction/noteAction.service.js
index 97bd5f6..0b9160b 100644
--- a/zeppelin-web/src/components/noteAction/noteAction.service.js
+++ b/zeppelin-web/src/components/noteAction/noteAction.service.js
@@ -11,175 +11,173 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
-
-  angular.module('zeppelinWebApp').service('noteActionSrv', noteActionSrv);
-
-  noteActionSrv.$inject = ['websocketMsgSrv', '$location', 'renameSrv', 'noteListDataFactory'];
-
-  function noteActionSrv(websocketMsgSrv, $location, renameSrv, noteListDataFactory) {
-    this.moveNoteToTrash = function(noteId, redirectToHome) {
-      BootstrapDialog.confirm({
-        closable: true,
-        title: 'Move this note to trash?',
-        message: 'This note will be moved to <strong>trash</strong>.',
-        callback: function(result) {
-          if (result) {
-            websocketMsgSrv.moveNoteToTrash(noteId);
-            if (redirectToHome) {
-              $location.path('/');
-            }
-          }
-        }
-      });
-    };
-
-    this.moveFolderToTrash = function(folderId) {
-      BootstrapDialog.confirm({
-        closable: true,
-        title: 'Move this folder to trash?',
-        message: 'This folder will be moved to <strong>trash</strong>.',
-        callback: function(result) {
-          if (result) {
-            websocketMsgSrv.moveFolderToTrash(folderId);
+
+angular.module('zeppelinWebApp').service('noteActionSrv', noteActionSrv);
+
+noteActionSrv.$inject = ['websocketMsgSrv', '$location', 'renameSrv', 'noteListDataFactory'];
+
+function noteActionSrv(websocketMsgSrv, $location, renameSrv, noteListDataFactory) {
+  this.moveNoteToTrash = function(noteId, redirectToHome) {
+    BootstrapDialog.confirm({
+      closable: true,
+      title: 'Move this note to trash?',
+      message: 'This note will be moved to <strong>trash</strong>.',
+      callback: function(result) {
+        if (result) {
+          websocketMsgSrv.moveNoteToTrash(noteId);
+          if (redirectToHome) {
+            $location.path('/');
           }
         }
-      });
-    };
-
-    this.removeNote = function(noteId, redirectToHome) {
-      BootstrapDialog.confirm({
-        type: BootstrapDialog.TYPE_WARNING,
-        closable: true,
-        title: 'WARNING! This note will be removed permanently',
-        message: 'This cannot be undone. Are you sure?',
-        callback: function(result) {
-          if (result) {
-            websocketMsgSrv.deleteNote(noteId);
-            if (redirectToHome) {
-              $location.path('/');
-            }
-          }
+      }
+    });
+  };
+
+  this.moveFolderToTrash = function(folderId) {
+    BootstrapDialog.confirm({
+      closable: true,
+      title: 'Move this folder to trash?',
+      message: 'This folder will be moved to <strong>trash</strong>.',
+      callback: function(result) {
+        if (result) {
+          websocketMsgSrv.moveFolderToTrash(folderId);
         }
-      });
-    };
-
-    this.removeFolder = function(folderId) {
-      BootstrapDialog.confirm({
-        type: BootstrapDialog.TYPE_WARNING,
-        closable: true,
-        title: 'WARNING! This folder will be removed permanently',
-        message: 'This cannot be undone. Are you sure?',
-        callback: function(result) {
-          if (result) {
-            websocketMsgSrv.removeFolder(folderId);
+      }
+    });
+  };
+
+  this.removeNote = function(noteId, redirectToHome) {
+    BootstrapDialog.confirm({
+      type: BootstrapDialog.TYPE_WARNING,
+      closable: true,
+      title: 'WARNING! This note will be removed permanently',
+      message: 'This cannot be undone. Are you sure?',
+      callback: function(result) {
+        if (result) {
+          websocketMsgSrv.deleteNote(noteId);
+          if (redirectToHome) {
+            $location.path('/');
           }
         }
-      });
-    };
-
-    this.restoreAll = function() {
-      BootstrapDialog.confirm({
-        closable: true,
-        title: 'Are you sure want to restore all notes in the trash?',
-        message: 'Folders and notes in the trash will be ' +
-          '<strong>merged</strong> into their original position.',
-        callback: function(result) {
-          if (result) {
-            websocketMsgSrv.restoreAll();
-          }
+      }
+    });
+  };
+
+  this.removeFolder = function(folderId) {
+    BootstrapDialog.confirm({
+      type: BootstrapDialog.TYPE_WARNING,
+      closable: true,
+      title: 'WARNING! This folder will be removed permanently',
+      message: 'This cannot be undone. Are you sure?',
+      callback: function(result) {
+        if (result) {
+          websocketMsgSrv.removeFolder(folderId);
         }
-      });
-    };
-
-    this.emptyTrash = function() {
-      BootstrapDialog.confirm({
-        type: BootstrapDialog.TYPE_WARNING,
-        closable: true,
-        title: 'WARNING! Notes under trash will be removed permanently',
-        message: 'This cannot be undone. Are you sure?',
-        callback: function(result) {
-          if (result) {
-            websocketMsgSrv.emptyTrash();
-          }
+      }
+    });
+  };
+
+  this.restoreAll = function() {
+    BootstrapDialog.confirm({
+      closable: true,
+      title: 'Are you sure want to restore all notes in the trash?',
+      message: 'Folders and notes in the trash will be ' +
+      '<strong>merged</strong> into their original position.',
+      callback: function(result) {
+        if (result) {
+          websocketMsgSrv.restoreAll();
         }
-      });
-    };
-
-    this.clearAllParagraphOutput = function(noteId) {
-      BootstrapDialog.confirm({
-        closable: true,
-        title: '',
-        message: 'Do you want to clear all output?',
-        callback: function(result) {
-          if (result) {
-            websocketMsgSrv.clearAllParagraphOutput(noteId);
-          }
+      }
+    });
+  };
+
+  this.emptyTrash = function() {
+    BootstrapDialog.confirm({
+      type: BootstrapDialog.TYPE_WARNING,
+      closable: true,
+      title: 'WARNING! Notes under trash will be removed permanently',
+      message: 'This cannot be undone. Are you sure?',
+      callback: function(result) {
+        if (result) {
+          websocketMsgSrv.emptyTrash();
         }
-      });
-    };
-
-    this.renameNote = function(noteId, notePath) {
-      renameSrv.openRenameModal({
-        title: 'Rename note',
-        oldName: notePath,
-        callback: function(newName) {
-          websocketMsgSrv.renameNote(noteId, newName);
+      }
+    });
+  };
+
+  this.clearAllParagraphOutput = function(noteId) {
+    BootstrapDialog.confirm({
+      closable: true,
+      title: '',
+      message: 'Do you want to clear all output?',
+      callback: function(result) {
+        if (result) {
+          websocketMsgSrv.clearAllParagraphOutput(noteId);
         }
-      });
-    };
-
-    this.renameFolder = function(folderId) {
-      renameSrv.openRenameModal({
-        title: 'Rename folder',
-        oldName: folderId,
-        callback: function(newName) {
-          var newFolderId = normalizeFolderId(newName);
-          if (_.has(noteListDataFactory.flatFolderMap, newFolderId)) {
-            BootstrapDialog.confirm({
-              type: BootstrapDialog.TYPE_WARNING,
-              closable: true,
-              title: 'WARNING! The folder will be MERGED',
-              message: 'The folder will be merged into <strong>' + newFolderId + '</strong>. Are you sure?',
-              callback: function(result) {
-                if (result) {
-                  websocketMsgSrv.renameFolder(folderId, newFolderId);
-                }
+      }
+    });
+  };
+
+  this.renameNote = function(noteId, notePath) {
+    renameSrv.openRenameModal({
+      title: 'Rename note',
+      oldName: notePath,
+      callback: function(newName) {
+        websocketMsgSrv.renameNote(noteId, newName);
+      }
+    });
+  };
+
+  this.renameFolder = function(folderId) {
+    renameSrv.openRenameModal({
+      title: 'Rename folder',
+      oldName: folderId,
+      callback: function(newName) {
+        var newFolderId = normalizeFolderId(newName);
+        if (_.has(noteListDataFactory.flatFolderMap, newFolderId)) {
+          BootstrapDialog.confirm({
+            type: BootstrapDialog.TYPE_WARNING,
+            closable: true,
+            title: 'WARNING! The folder will be MERGED',
+            message: 'The folder will be merged into <strong>' + newFolderId + '</strong>. Are you sure?',
+            callback: function(result) {
+              if (result) {
+                websocketMsgSrv.renameFolder(folderId, newFolderId);
               }
-            });
-          } else {
-            websocketMsgSrv.renameFolder(folderId, newFolderId);
-          }
+            }
+          });
+        } else {
+          websocketMsgSrv.renameFolder(folderId, newFolderId);
         }
-      });
-    };
-
-    function normalizeFolderId(folderId) {
-      folderId = folderId.trim();
-
-      while (folderId.indexOf('\\') > -1) {
-        folderId = folderId.replace('\\', '/');
       }
+    });
+  };
 
-      while (folderId.indexOf('///') > -1) {
-        folderId = folderId.replace('///', '/');
-      }
+  function normalizeFolderId(folderId) {
+    folderId = folderId.trim();
 
-      folderId = folderId.replace('//', '/');
+    while (folderId.indexOf('\\') > -1) {
+      folderId = folderId.replace('\\', '/');
+    }
 
-      if (folderId === '/') {
-        return '/';
-      }
+    while (folderId.indexOf('///') > -1) {
+      folderId = folderId.replace('///', '/');
+    }
 
-      if (folderId[0] === '/') {
-        folderId = folderId.substring(1);
-      }
+    folderId = folderId.replace('//', '/');
 
-      if (folderId.slice(-1) === '/') {
-        folderId = folderId.slice(0, -1);
-      }
+    if (folderId === '/') {
+      return '/';
+    }
 
-      return folderId;
+    if (folderId[0] === '/') {
+      folderId = folderId.substring(1);
     }
+
+    if (folderId.slice(-1) === '/') {
+      folderId = folderId.slice(0, -1);
+    }
+
+    return folderId;
   }
-})();
+}

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/4c60b27c/zeppelin-web/src/components/noteListDataFactory/noteList.datafactory.js
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/components/noteListDataFactory/noteList.datafactory.js b/zeppelin-web/src/components/noteListDataFactory/noteList.datafactory.js
index 9d74600..9b20033 100644
--- a/zeppelin-web/src/components/noteListDataFactory/noteList.datafactory.js
+++ b/zeppelin-web/src/components/noteListDataFactory/noteList.datafactory.js
@@ -11,74 +11,72 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
 
-  angular.module('zeppelinWebApp').factory('noteListDataFactory', noteListDataFactory);
+angular.module('zeppelinWebApp').factory('noteListDataFactory', noteListDataFactory);
 
-  noteListDataFactory.$inject = ['TRASH_FOLDER_ID'];
+noteListDataFactory.$inject = ['TRASH_FOLDER_ID'];
 
-  function noteListDataFactory(TRASH_FOLDER_ID) {
-    var notes = {
-      root: {children: []},
-      flatList: [],
-      flatFolderMap: {},
+function noteListDataFactory(TRASH_FOLDER_ID) {
+  var notes = {
+    root: {children: []},
+    flatList: [],
+    flatFolderMap: {},
 
-      setNotes: function(notesList) {
-        // a flat list to boost searching
-        notes.flatList = _.map(notesList, (note) => {
-          note.isTrash = note.name ?
-            note.name.split('/')[0] === TRASH_FOLDER_ID : false;
-          return note;
-        });
+    setNotes: function(notesList) {
+      // a flat list to boost searching
+      notes.flatList = _.map(notesList, (note) => {
+        note.isTrash = note.name ?
+          note.name.split('/')[0] === TRASH_FOLDER_ID : false;
+        return note;
+      });
 
-        // construct the folder-based tree
-        notes.root = {children: []};
-        notes.flatFolderMap = {};
-        _.reduce(notesList, function(root, note) {
-          var noteName = note.name || note.id;
-          var nodes = noteName.match(/([^\/][^\/]*)/g);
+      // construct the folder-based tree
+      notes.root = {children: []};
+      notes.flatFolderMap = {};
+      _.reduce(notesList, function(root, note) {
+        var noteName = note.name || note.id;
+        var nodes = noteName.match(/([^\/][^\/]*)/g);
 
-          // recursively add nodes
-          addNode(root, nodes, note.id);
+        // recursively add nodes
+        addNode(root, nodes, note.id);
 
-          return root;
-        }, notes.root);
-      }
-    };
+        return root;
+      }, notes.root);
+    }
+  };
 
-    var addNode = function(curDir, nodes, noteId) {
-      if (nodes.length === 1) {  // the leaf
-        curDir.children.push({
-          name: nodes[0],
-          id: noteId,
-          path: curDir.id ? curDir.id + '/' + nodes[0] : nodes[0],
+  var addNode = function(curDir, nodes, noteId) {
+    if (nodes.length === 1) {  // the leaf
+      curDir.children.push({
+        name: nodes[0],
+        id: noteId,
+        path: curDir.id ? curDir.id + '/' + nodes[0] : nodes[0],
+        isTrash: curDir.id ? curDir.id.split('/')[0] === TRASH_FOLDER_ID : false
+      });
+    } else {  // a folder node
+      var node = nodes.shift();
+      var dir = _.find(curDir.children,
+        function(c) {return c.name === node && c.children !== undefined;});
+      if (dir !== undefined) { // found an existing dir
+        addNode(dir, nodes, noteId);
+      } else {
+        var newDir = {
+          id: curDir.id ? curDir.id + '/' + node : node,
+          name: node,
+          hidden: true,
+          children: [],
           isTrash: curDir.id ? curDir.id.split('/')[0] === TRASH_FOLDER_ID : false
-        });
-      } else {  // a folder node
-        var node = nodes.shift();
-        var dir = _.find(curDir.children,
-          function(c) {return c.name === node && c.children !== undefined;});
-        if (dir !== undefined) { // found an existing dir
-          addNode(dir, nodes, noteId);
-        } else {
-          var newDir = {
-            id: curDir.id ? curDir.id + '/' + node : node,
-            name: node,
-            hidden: true,
-            children: [],
-            isTrash: curDir.id ? curDir.id.split('/')[0] === TRASH_FOLDER_ID : false
-          };
+        };
 
-          // add the folder to flat folder map
-          notes.flatFolderMap[newDir.id] = newDir;
+        // add the folder to flat folder map
+        notes.flatFolderMap[newDir.id] = newDir;
 
-          curDir.children.push(newDir);
-          addNode(newDir, nodes, noteId);
-        }
+        curDir.children.push(newDir);
+        addNode(newDir, nodes, noteId);
       }
-    };
+    }
+  };
 
-    return notes;
-  }
+  return notes;
+}
 
-})();

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/4c60b27c/zeppelin-web/src/components/noteName-create/notename.controller.js
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/components/noteName-create/notename.controller.js b/zeppelin-web/src/components/noteName-create/notename.controller.js
index 9b99ce3..e6e66c3 100644
--- a/zeppelin-web/src/components/noteName-create/notename.controller.js
+++ b/zeppelin-web/src/components/noteName-create/notename.controller.js
@@ -11,104 +11,102 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
-
-  angular.module('zeppelinWebApp').controller('NotenameCtrl', NotenameCtrl);
-
-  NotenameCtrl.$inject = [
-    '$scope',
-    'noteListDataFactory',
-    '$routeParams',
-    'websocketMsgSrv'
-  ];
-
-  function NotenameCtrl($scope, noteListDataFactory, $routeParams, websocketMsgSrv) {
-    var vm = this;
-    vm.clone = false;
-    vm.notes = noteListDataFactory;
-    vm.websocketMsgSrv = websocketMsgSrv;
-    $scope.note = {};
-    $scope.interpreterSettings = {};
-    $scope.note.defaultInterpreter = null;
-
-    vm.createNote = function() {
-      if (!vm.clone) {
-        var defaultInterpreterId = '';
-        if ($scope.note.defaultInterpreter !== null) {
-          defaultInterpreterId = $scope.note.defaultInterpreter.id;
-        }
-        vm.websocketMsgSrv.createNotebook($scope.note.notename, defaultInterpreterId);
-        $scope.note.defaultInterpreter = $scope.interpreterSettings[0];
-      } else {
-        var noteId = $routeParams.noteId;
-        vm.websocketMsgSrv.cloneNote(noteId, $scope.note.notename);
+
+angular.module('zeppelinWebApp').controller('NotenameCtrl', NotenameCtrl);
+
+NotenameCtrl.$inject = [
+  '$scope',
+  'noteListDataFactory',
+  '$routeParams',
+  'websocketMsgSrv'
+];
+
+function NotenameCtrl($scope, noteListDataFactory, $routeParams, websocketMsgSrv) {
+  var vm = this;
+  vm.clone = false;
+  vm.notes = noteListDataFactory;
+  vm.websocketMsgSrv = websocketMsgSrv;
+  $scope.note = {};
+  $scope.interpreterSettings = {};
+  $scope.note.defaultInterpreter = null;
+
+  vm.createNote = function() {
+    if (!vm.clone) {
+      var defaultInterpreterId = '';
+      if ($scope.note.defaultInterpreter !== null) {
+        defaultInterpreterId = $scope.note.defaultInterpreter.id;
       }
-    };
-
-    vm.handleNameEnter = function() {
-      angular.element('#noteNameModal').modal('toggle');
-      vm.createNote();
-    };
-
-    vm.preVisible = function(clone, sourceNoteName) {
-      vm.clone = clone;
-      vm.sourceNoteName = sourceNoteName;
-      $scope.note.notename = vm.clone ? vm.cloneNoteName() : vm.newNoteName();
-      $scope.$apply();
-    };
-
-    vm.newNoteName = function() {
-      var newCount = 1;
-      angular.forEach(vm.notes.flatList, function(noteName) {
-        noteName = noteName.name;
-        if (noteName.match(/^Untitled Note [0-9]*$/)) {
-          var lastCount = noteName.substr(14) * 1;
-          if (newCount <= lastCount) {
-            newCount = lastCount + 1;
-          }
-        }
-      });
-      return 'Untitled Note ' + newCount;
-    };
-
-    vm.cloneNoteName = function() {
-      var copyCount = 1;
-      var newCloneName = '';
-      var lastIndex = vm.sourceNoteName.lastIndexOf(' ');
-      var endsWithNumber = !!vm.sourceNoteName.match('^.+?\\s\\d$');
-      var noteNamePrefix = endsWithNumber ? vm.sourceNoteName.substr(0, lastIndex) : vm.sourceNoteName;
-      var regexp = new RegExp('^' + noteNamePrefix + ' .+');
-
-      angular.forEach(vm.notes.flatList, function(noteName) {
-        noteName = noteName.name;
-        if (noteName.match(regexp)) {
-          var lastCopyCount = noteName.substr(lastIndex).trim();
-          newCloneName = noteNamePrefix;
-          lastCopyCount = parseInt(lastCopyCount);
-          if (copyCount <= lastCopyCount) {
-            copyCount = lastCopyCount + 1;
-          }
+      vm.websocketMsgSrv.createNotebook($scope.note.notename, defaultInterpreterId);
+      $scope.note.defaultInterpreter = $scope.interpreterSettings[0];
+    } else {
+      var noteId = $routeParams.noteId;
+      vm.websocketMsgSrv.cloneNote(noteId, $scope.note.notename);
+    }
+  };
+
+  vm.handleNameEnter = function() {
+    angular.element('#noteNameModal').modal('toggle');
+    vm.createNote();
+  };
+
+  vm.preVisible = function(clone, sourceNoteName) {
+    vm.clone = clone;
+    vm.sourceNoteName = sourceNoteName;
+    $scope.note.notename = vm.clone ? vm.cloneNoteName() : vm.newNoteName();
+    $scope.$apply();
+  };
+
+  vm.newNoteName = function() {
+    var newCount = 1;
+    angular.forEach(vm.notes.flatList, function(noteName) {
+      noteName = noteName.name;
+      if (noteName.match(/^Untitled Note [0-9]*$/)) {
+        var lastCount = noteName.substr(14) * 1;
+        if (newCount <= lastCount) {
+          newCount = lastCount + 1;
         }
-      });
+      }
+    });
+    return 'Untitled Note ' + newCount;
+  };
 
-      if (!newCloneName) {
-        newCloneName = vm.sourceNoteName;
+  vm.cloneNoteName = function() {
+    var copyCount = 1;
+    var newCloneName = '';
+    var lastIndex = vm.sourceNoteName.lastIndexOf(' ');
+    var endsWithNumber = !!vm.sourceNoteName.match('^.+?\\s\\d$');
+    var noteNamePrefix = endsWithNumber ? vm.sourceNoteName.substr(0, lastIndex) : vm.sourceNoteName;
+    var regexp = new RegExp('^' + noteNamePrefix + ' .+');
+
+    angular.forEach(vm.notes.flatList, function(noteName) {
+      noteName = noteName.name;
+      if (noteName.match(regexp)) {
+        var lastCopyCount = noteName.substr(lastIndex).trim();
+        newCloneName = noteNamePrefix;
+        lastCopyCount = parseInt(lastCopyCount);
+        if (copyCount <= lastCopyCount) {
+          copyCount = lastCopyCount + 1;
+        }
       }
-      return newCloneName + ' ' + copyCount;
-    };
+    });
 
-    vm.getInterpreterSettings = function() {
-      vm.websocketMsgSrv.getInterpreterSettings();
-    };
-    
+    if (!newCloneName) {
+      newCloneName = vm.sourceNoteName;
+    }
+    return newCloneName + ' ' + copyCount;
+  };
 
-    $scope.$on('interpreterSettings', function(event, data) {
-      $scope.interpreterSettings = data.interpreterSettings;
+  vm.getInterpreterSettings = function() {
+    vm.websocketMsgSrv.getInterpreterSettings();
+  };
 
-      //initialize default interpreter with Spark interpreter
-      $scope.note.defaultInterpreter = data.interpreterSettings[0];
-    });
 
-  }
+  $scope.$on('interpreterSettings', function(event, data) {
+    $scope.interpreterSettings = data.interpreterSettings;
+
+    //initialize default interpreter with Spark interpreter
+    $scope.note.defaultInterpreter = data.interpreterSettings[0];
+  });
+
+}
 
-})();

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/4c60b27c/zeppelin-web/src/components/noteName-create/visible.directive.js
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/components/noteName-create/visible.directive.js b/zeppelin-web/src/components/noteName-create/visible.directive.js
index 6d80302..403fd60 100644
--- a/zeppelin-web/src/components/noteName-create/visible.directive.js
+++ b/zeppelin-web/src/components/noteName-create/visible.directive.js
@@ -11,37 +11,35 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
 
-  angular.module('zeppelinWebApp').directive('modalvisible', modalvisible);
+angular.module('zeppelinWebApp').directive('modalvisible', modalvisible);
 
-  function modalvisible() {
-    return {
-      restrict: 'A',
-      scope: {
-        preVisibleCallback: '&previsiblecallback',
-        postVisibleCallback: '&postvisiblecallback',
-        targetinput: '@targetinput'
-      },
-      link: function(scope, element, attrs) {
-        // Add some listeners
-        var previsibleMethod = scope.preVisibleCallback;
-        var postVisibleMethod = scope.postVisibleCallback;
-        element.on('show.bs.modal',function(e) {
-          var relatedTarget = angular.element(e.relatedTarget);
-          var clone = relatedTarget.data('clone');
-          var sourceNoteName = relatedTarget.data('source-note-name');
-          var cloneNote = clone ? true : false;
-          previsibleMethod()(cloneNote, sourceNoteName);
-        });
-        element.on('shown.bs.modal', function(e) {
-          if (scope.targetinput) {
-            angular.element(e.target).find('input#' + scope.targetinput).select();
-          }
-          postVisibleMethod();
-        });
-      }
-    };
-  }
+function modalvisible() {
+  return {
+    restrict: 'A',
+    scope: {
+      preVisibleCallback: '&previsiblecallback',
+      postVisibleCallback: '&postvisiblecallback',
+      targetinput: '@targetinput'
+    },
+    link: function(scope, element, attrs) {
+      // Add some listeners
+      var previsibleMethod = scope.preVisibleCallback;
+      var postVisibleMethod = scope.postVisibleCallback;
+      element.on('show.bs.modal',function(e) {
+        var relatedTarget = angular.element(e.relatedTarget);
+        var clone = relatedTarget.data('clone');
+        var sourceNoteName = relatedTarget.data('source-note-name');
+        var cloneNote = clone ? true : false;
+        previsibleMethod()(cloneNote, sourceNoteName);
+      });
+      element.on('shown.bs.modal', function(e) {
+        if (scope.targetinput) {
+          angular.element(e.target).find('input#' + scope.targetinput).select();
+        }
+        postVisibleMethod();
+      });
+    }
+  };
+}
 
-})();

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/4c60b27c/zeppelin-web/src/components/noteName-import/notenameImport.controller.js
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/components/noteName-import/notenameImport.controller.js b/zeppelin-web/src/components/noteName-import/notenameImport.controller.js
index eba7293..10f04f4 100644
--- a/zeppelin-web/src/components/noteName-import/notenameImport.controller.js
+++ b/zeppelin-web/src/components/noteName-import/notenameImport.controller.js
@@ -1,140 +1,138 @@
 /*
-* Licensed under the Apache License, Version 2.0 (the "License");
-* you may not use this file except in compliance with the License.
-* You may obtain a copy of the License at
-*
-*     http://www.apache.org/licenses/LICENSE-2.0
-*
-* Unless required by applicable law or agreed to in writing, software
-* distributed under the License is distributed on an "AS IS" BASIS,
-* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-* See the License for the specific language governing permissions and
-* limitations under the License.
-*/
-(function() {
-
-  angular.module('zeppelinWebApp').controller('NoteImportCtrl', NoteImportCtrl);
-
-  NoteImportCtrl.$inject = ['$scope', '$timeout', 'websocketMsgSrv'];
-
-  function NoteImportCtrl($scope, $timeout, websocketMsgSrv) {
-    var vm = this;
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+angular.module('zeppelinWebApp').controller('NoteImportCtrl', NoteImportCtrl);
+
+NoteImportCtrl.$inject = ['$scope', '$timeout', 'websocketMsgSrv'];
+
+function NoteImportCtrl($scope, $timeout, websocketMsgSrv) {
+  var vm = this;
+  $scope.note = {};
+  $scope.note.step1 = true;
+  $scope.note.step2 = false;
+  $scope.maxLimit = '';
+  var limit = 0;
+
+  websocketMsgSrv.listConfigurations();
+  $scope.$on('configurationsInfo', function(scope, event) {
+    limit = event.configurations['zeppelin.websocket.max.text.message.size'];
+    $scope.maxLimit = Math.round(limit / 1048576);
+  });
+
+  vm.resetFlags = function() {
     $scope.note = {};
     $scope.note.step1 = true;
     $scope.note.step2 = false;
-    $scope.maxLimit = '';
-    var limit = 0;
+    angular.element('#noteImportFile').val('');
+  };
 
-    websocketMsgSrv.listConfigurations();
-    $scope.$on('configurationsInfo', function(scope, event) {
-      limit = event.configurations['zeppelin.websocket.max.text.message.size'];
-      $scope.maxLimit = Math.round(limit / 1048576);
-    });
+  $scope.uploadFile = function() {
+    angular.element('#noteImportFile').click();
+  };
 
-    vm.resetFlags = function() {
-      $scope.note = {};
-      $scope.note.step1 = true;
-      $scope.note.step2 = false;
-      angular.element('#noteImportFile').val('');
-    };
-
-    $scope.uploadFile = function() {
-      angular.element('#noteImportFile').click();
-    };
+  $scope.importFile = function(element) {
+    $scope.note.errorText = '';
+    $scope.note.importFile = element.files[0];
+    var file = $scope.note.importFile;
+    var reader = new FileReader();
 
-    $scope.importFile = function(element) {
-      $scope.note.errorText = '';
-      $scope.note.importFile = element.files[0];
-      var file = $scope.note.importFile;
-      var reader = new FileReader();
-
-      if (file.size > limit) {
-        $scope.note.errorText = 'File size limit Exceeded!';
-        $scope.$apply();
-        return;
-      }
-
-      reader.onloadend = function() {
-        vm.processImportJson(reader.result);
-      };
-
-      if (file) {
-        reader.readAsText(file);
-      }
-    };
-
-    $scope.uploadURL = function() {
-      $scope.note.errorText = '';
-      $scope.note.step1 = false;
-      $timeout(function() {
-        $scope.note.step2 = true;
-      }, 400);
-    };
+    if (file.size > limit) {
+      $scope.note.errorText = 'File size limit Exceeded!';
+      $scope.$apply();
+      return;
+    }
 
-    vm.importBack = function() {
-      $scope.note.errorText = '';
-      $timeout(function() {
-        $scope.note.step1 = true;
-      }, 400);
-      $scope.note.step2 = false;
+    reader.onloadend = function() {
+      vm.processImportJson(reader.result);
     };
 
-    vm.importNote = function() {
-      $scope.note.errorText = '';
-      if ($scope.note.importUrl) {
-        jQuery.ajax({
-          url: $scope.note.importUrl,
-          type: 'GET',
-          dataType: 'json',
-          jsonp: false,
-          xhrFields: {
-            withCredentials: false
-          },
-          error: function(xhr, ajaxOptions, thrownError) {
-            $scope.note.errorText = 'Unable to Fetch URL';
-            $scope.$apply();
-          }}).done(function(data) {
-            vm.processImportJson(data);
-          });
-      } else {
-        $scope.note.errorText = 'Enter URL';
+    if (file) {
+      reader.readAsText(file);
+    }
+  };
+
+  $scope.uploadURL = function() {
+    $scope.note.errorText = '';
+    $scope.note.step1 = false;
+    $timeout(function() {
+      $scope.note.step2 = true;
+    }, 400);
+  };
+
+  vm.importBack = function() {
+    $scope.note.errorText = '';
+    $timeout(function() {
+      $scope.note.step1 = true;
+    }, 400);
+    $scope.note.step2 = false;
+  };
+
+  vm.importNote = function() {
+    $scope.note.errorText = '';
+    if ($scope.note.importUrl) {
+      jQuery.ajax({
+        url: $scope.note.importUrl,
+        type: 'GET',
+        dataType: 'json',
+        jsonp: false,
+        xhrFields: {
+          withCredentials: false
+        },
+        error: function(xhr, ajaxOptions, thrownError) {
+          $scope.note.errorText = 'Unable to Fetch URL';
+          $scope.$apply();
+        }}).done(function(data) {
+        vm.processImportJson(data);
+      });
+    } else {
+      $scope.note.errorText = 'Enter URL';
+      $scope.$apply();
+    }
+  };
+
+  vm.processImportJson = function(result) {
+    if (typeof result !== 'object') {
+      try {
+        result = JSON.parse(result);
+      } catch (e) {
+        $scope.note.errorText = 'JSON parse exception';
         $scope.$apply();
+        return;
       }
-    };
 
-    vm.processImportJson = function(result) {
-      if (typeof result !== 'object') {
-        try {
-          result = JSON.parse(result);
-        } catch (e) {
-          $scope.note.errorText = 'JSON parse exception';
-          $scope.$apply();
-          return;
-        }
-
-      }
-      if (result.paragraphs && result.paragraphs.length > 0) {
-        if (!$scope.note.noteImportName) {
-          $scope.note.noteImportName = result.name;
-        } else {
-          result.name = $scope.note.noteImportName;
-        }
-        websocketMsgSrv.importNote(result);
-        //angular.element('#noteImportModal').modal('hide');
+    }
+    if (result.paragraphs && result.paragraphs.length > 0) {
+      if (!$scope.note.noteImportName) {
+        $scope.note.noteImportName = result.name;
       } else {
-        $scope.note.errorText = 'Invalid JSON';
+        result.name = $scope.note.noteImportName;
       }
-      $scope.$apply();
-    };
-
-    /*
-    ** $scope.$on functions below
-    */
-
-    $scope.$on('setNoteMenu', function(event, notes) {
-      vm.resetFlags();
-      angular.element('#noteImportModal').modal('hide');
-    });
-  }
+      websocketMsgSrv.importNote(result);
+      //angular.element('#noteImportModal').modal('hide');
+    } else {
+      $scope.note.errorText = 'Invalid JSON';
+    }
+    $scope.$apply();
+  };
+
+  /*
+   ** $scope.$on functions below
+   */
+
+  $scope.$on('setNoteMenu', function(event, notes) {
+    vm.resetFlags();
+    angular.element('#noteImportModal').modal('hide');
+  });
+}
 
-})();

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/4c60b27c/zeppelin-web/src/components/notevarshareService/notevarshare.service.js
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/components/notevarshareService/notevarshare.service.js b/zeppelin-web/src/components/notevarshareService/notevarshare.service.js
index 04e3341..0a3b7db 100644
--- a/zeppelin-web/src/components/notevarshareService/notevarshare.service.js
+++ b/zeppelin-web/src/components/notevarshareService/notevarshare.service.js
@@ -11,31 +11,29 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
 
-  angular.module('zeppelinWebApp').service('noteVarShareService', noteVarShareService);
+angular.module('zeppelinWebApp').service('noteVarShareService', noteVarShareService);
 
-  noteVarShareService.$inject = [];
+noteVarShareService.$inject = [];
 
-  function noteVarShareService() {
-    var store = {};
+function noteVarShareService() {
+  var store = {};
 
-    this.clear = function() {
-      store = {};
-    };
+  this.clear = function() {
+    store = {};
+  };
 
-    this.put = function(key, value) {
-      store[key] = value;
-    };
+  this.put = function(key, value) {
+    store[key] = value;
+  };
 
-    this.get = function(key) {
-      return store[key];
-    };
+  this.get = function(key) {
+    return store[key];
+  };
 
-    this.del = function(key) {
-      var v = store[key];
-      delete store[key];
-      return v;
-    };
+  this.del = function(key) {
+    var v = store[key];
+    delete store[key];
+    return v;
   };
-})();
+}

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/4c60b27c/zeppelin-web/src/components/popover-html-unsafe/popover-html-unsafe-popup.directive.js
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/components/popover-html-unsafe/popover-html-unsafe-popup.directive.js b/zeppelin-web/src/components/popover-html-unsafe/popover-html-unsafe-popup.directive.js
index 04e4092..595ed2f 100644
--- a/zeppelin-web/src/components/popover-html-unsafe/popover-html-unsafe-popup.directive.js
+++ b/zeppelin-web/src/components/popover-html-unsafe/popover-html-unsafe-popup.directive.js
@@ -11,17 +11,15 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
 
-  angular.module('zeppelinWebApp').directive('popoverHtmlUnsafePopup', popoverHtmlUnsafePopup);
+angular.module('zeppelinWebApp').directive('popoverHtmlUnsafePopup', popoverHtmlUnsafePopup);
 
-  function popoverHtmlUnsafePopup() {
-    return {
-      restrict: 'EA',
-      replace: true,
-      scope: {title: '@', content: '@', placement: '@', animation: '&', isOpen: '&'},
-      templateUrl: 'components/popover-html-unsafe/popover-html-unsafe-popup.html'
-    };
-  }
+function popoverHtmlUnsafePopup() {
+  return {
+    restrict: 'EA',
+    replace: true,
+    scope: {title: '@', content: '@', placement: '@', animation: '&', isOpen: '&'},
+    templateUrl: 'components/popover-html-unsafe/popover-html-unsafe-popup.html'
+  };
+}
 
-})();

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/4c60b27c/zeppelin-web/src/components/popover-html-unsafe/popover-html-unsafe.directive.js
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/components/popover-html-unsafe/popover-html-unsafe.directive.js b/zeppelin-web/src/components/popover-html-unsafe/popover-html-unsafe.directive.js
index 20327dd..386a358 100644
--- a/zeppelin-web/src/components/popover-html-unsafe/popover-html-unsafe.directive.js
+++ b/zeppelin-web/src/components/popover-html-unsafe/popover-html-unsafe.directive.js
@@ -11,14 +11,12 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
 
-  angular.module('zeppelinWebApp').directive('popoverHtmlUnsafe', popoverHtmlUnsafe);
+angular.module('zeppelinWebApp').directive('popoverHtmlUnsafe', popoverHtmlUnsafe);
 
-  popoverHtmlUnsafe.$inject = ['$tooltip'];
+popoverHtmlUnsafe.$inject = ['$tooltip'];
 
-  function popoverHtmlUnsafe($tooltip) {
-    return $tooltip('popoverHtmlUnsafe', 'popover', 'click');
-  }
+function popoverHtmlUnsafe($tooltip) {
+  return $tooltip('popoverHtmlUnsafe', 'popover', 'click');
+}
 
-})();

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/4c60b27c/zeppelin-web/src/components/rename/rename.controller.js
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/components/rename/rename.controller.js b/zeppelin-web/src/components/rename/rename.controller.js
index 2f40d4b..232f1e7 100644
--- a/zeppelin-web/src/components/rename/rename.controller.js
+++ b/zeppelin-web/src/components/rename/rename.controller.js
@@ -11,39 +11,37 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
 
-  angular.module('zeppelinWebApp').controller('RenameCtrl', RenameCtrl);
+angular.module('zeppelinWebApp').controller('RenameCtrl', RenameCtrl);
 
-  RenameCtrl.$inject = ['$scope'];
+RenameCtrl.$inject = ['$scope'];
 
-  function RenameCtrl($scope) {
-    var self = this;
+function RenameCtrl($scope) {
+  var self = this;
 
-    $scope.params = {newName: ''};
-    $scope.isValid = true;
+  $scope.params = {newName: ''};
+  $scope.isValid = true;
 
-    $scope.rename = function() {
-      angular.element('#renameModal').modal('hide');
-      self.callback($scope.params.newName);
-    };
+  $scope.rename = function() {
+    angular.element('#renameModal').modal('hide');
+    self.callback($scope.params.newName);
+  };
 
-    $scope.$on('openRenameModal', function(event, options) {
-      self.validator = options.validator || defaultValidator;
-      self.callback = options.callback || function() {};
+  $scope.$on('openRenameModal', function(event, options) {
+    self.validator = options.validator || defaultValidator;
+    self.callback = options.callback || function() {};
 
-      $scope.title = options.title || 'Rename';
-      $scope.params.newName = options.oldName || '';
-      $scope.validate = function() {
-        $scope.isValid = self.validator($scope.params.newName);
-      };
+    $scope.title = options.title || 'Rename';
+    $scope.params.newName = options.oldName || '';
+    $scope.validate = function() {
+      $scope.isValid = self.validator($scope.params.newName);
+    };
 
-      angular.element('#renameModal').modal('show');
-    });
+    angular.element('#renameModal').modal('show');
+  });
 
-    function defaultValidator(str) {
-      return !!str.trim();
-    }
+  function defaultValidator(str) {
+    return !!str.trim();
   }
+}
 
-})();

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/4c60b27c/zeppelin-web/src/components/rename/rename.service.js
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/components/rename/rename.service.js b/zeppelin-web/src/components/rename/rename.service.js
index b1cdf16..2c252d5 100644
--- a/zeppelin-web/src/components/rename/rename.service.js
+++ b/zeppelin-web/src/components/rename/rename.service.js
@@ -11,24 +11,22 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
 
-  angular.module('zeppelinWebApp').service('renameSrv', renameSrv);
+angular.module('zeppelinWebApp').service('renameSrv', renameSrv);
 
-  renameSrv.$inject = ['$rootScope'];
+renameSrv.$inject = ['$rootScope'];
 
-  function renameSrv($rootScope) {
-    var self = this;
+function renameSrv($rootScope) {
+  var self = this;
 
-    /**
-     * <options schema>
-     * title: string - Modal title
-     * oldName: string - name to initialize input
-     * callback: (newName: string)=>void - callback onButtonClick
-     * validator: (str: string)=>boolean - input validator
-     */
-    self.openRenameModal = function(options) {
-      $rootScope.$broadcast('openRenameModal', options);
-    };
-  }
-})();
+  /**
+   * <options schema>
+   * title: string - Modal title
+   * oldName: string - name to initialize input
+   * callback: (newName: string)=>void - callback onButtonClick
+   * validator: (str: string)=>boolean - input validator
+   */
+  self.openRenameModal = function(options) {
+    $rootScope.$broadcast('openRenameModal', options);
+  };
+}

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/4c60b27c/zeppelin-web/src/components/resizable/resizable.directive.js
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/components/resizable/resizable.directive.js b/zeppelin-web/src/components/resizable/resizable.directive.js
index e6a99fb..afcfd1b 100644
--- a/zeppelin-web/src/components/resizable/resizable.directive.js
+++ b/zeppelin-web/src/components/resizable/resizable.directive.js
@@ -11,62 +11,60 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
 
-  angular.module('zeppelinWebApp').directive('resizable', resizable);
+angular.module('zeppelinWebApp').directive('resizable', resizable);
 
-  function resizable() {
-    var resizableConfig = {
-      autoHide: true,
-      handles: 'se',
-      helper: 'resizable-helper',
-      stop: function() {
-        angular.element(this).css({'width': '100%', 'height': '100%'});
-      }
-    };
+function resizable() {
+  var resizableConfig = {
+    autoHide: true,
+    handles: 'se',
+    helper: 'resizable-helper',
+    stop: function() {
+      angular.element(this).css({'width': '100%', 'height': '100%'});
+    }
+  };
 
-    return {
-      restrict: 'A',
-      scope: {
-        callback: '&onResize'
-      },
-      link: function postLink(scope, elem, attrs) {
-        attrs.$observe('resize', function(resize) {
-          var resetResize = function(elem, resize) {
-            var colStep = window.innerWidth / 12;
-            elem.off('resizestop');
-            var conf = angular.copy(resizableConfig);
-            if (resize.graphType === 'TABLE' || resize.graphType === 'TEXT') {
-              conf.grid = [colStep, 10];
-              conf.minHeight = 100;
-            } else {
-              conf.grid = [colStep, 10000];
-              conf.minHeight = 0;
-            }
-            conf.maxWidth = window.innerWidth;
+  return {
+    restrict: 'A',
+    scope: {
+      callback: '&onResize'
+    },
+    link: function postLink(scope, elem, attrs) {
+      attrs.$observe('resize', function(resize) {
+        var resetResize = function(elem, resize) {
+          var colStep = window.innerWidth / 12;
+          elem.off('resizestop');
+          var conf = angular.copy(resizableConfig);
+          if (resize.graphType === 'TABLE' || resize.graphType === 'TEXT') {
+            conf.grid = [colStep, 10];
+            conf.minHeight = 100;
+          } else {
+            conf.grid = [colStep, 10000];
+            conf.minHeight = 0;
+          }
+          conf.maxWidth = window.innerWidth;
 
-            elem.resizable(conf);
-            elem.on('resizestop', function() {
-              if (scope.callback) {
-                var height = elem.height();
-                if (height < 50) {
-                  height = 300;
-                }
-                scope.callback({width: Math.ceil(elem.width() / colStep), height: height});
+          elem.resizable(conf);
+          elem.on('resizestop', function() {
+            if (scope.callback) {
+              var height = elem.height();
+              if (height < 50) {
+                height = 300;
               }
-            });
-          };
+              scope.callback({width: Math.ceil(elem.width() / colStep), height: height});
+            }
+          });
+        };
 
-          resize = JSON.parse(resize);
-          if (resize.allowresize === 'true') {
+        resize = JSON.parse(resize);
+        if (resize.allowresize === 'true') {
+          resetResize(elem, resize);
+          angular.element(window).resize(function() {
             resetResize(elem, resize);
-            angular.element(window).resize(function() {
-              resetResize(elem, resize);
-            });
-          }
-        });
-      }
-    };
-  }
+          });
+        }
+      });
+    }
+  };
+}
 
-})();

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/4c60b27c/zeppelin-web/src/components/saveAs/saveAs.service.js
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/components/saveAs/saveAs.service.js b/zeppelin-web/src/components/saveAs/saveAs.service.js
index 9d1e940..378da4c 100644
--- a/zeppelin-web/src/components/saveAs/saveAs.service.js
+++ b/zeppelin-web/src/components/saveAs/saveAs.service.js
@@ -11,44 +11,42 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
 
-  angular.module('zeppelinWebApp').service('saveAsService', saveAsService);
+angular.module('zeppelinWebApp').service('saveAsService', saveAsService);
 
-  saveAsService.$inject = ['browserDetectService'];
+saveAsService.$inject = ['browserDetectService'];
 
-  function saveAsService(browserDetectService) {
-    this.saveAs = function(content, filename, extension) {
-      var BOM = '\uFEFF';
-      if (browserDetectService.detectIE()) {
-        angular.element('body').append('<iframe id="SaveAsId" style="display: none"></iframe>');
-        var frameSaveAs = angular.element('body > iframe#SaveAsId')[0].contentWindow;
-        content = BOM + content;
-        frameSaveAs.document.open('text/json', 'replace');
-        frameSaveAs.document.write(content);
-        frameSaveAs.document.close();
-        frameSaveAs.focus();
-        var t1 = Date.now();
-        frameSaveAs.document.execCommand('SaveAs', false, filename + '.' + extension);
-        var t2 = Date.now();
+function saveAsService(browserDetectService) {
+  this.saveAs = function(content, filename, extension) {
+    var BOM = '\uFEFF';
+    if (browserDetectService.detectIE()) {
+      angular.element('body').append('<iframe id="SaveAsId" style="display: none"></iframe>');
+      var frameSaveAs = angular.element('body > iframe#SaveAsId')[0].contentWindow;
+      content = BOM + content;
+      frameSaveAs.document.open('text/json', 'replace');
+      frameSaveAs.document.write(content);
+      frameSaveAs.document.close();
+      frameSaveAs.focus();
+      var t1 = Date.now();
+      frameSaveAs.document.execCommand('SaveAs', false, filename + '.' + extension);
+      var t2 = Date.now();
 
-        //This means, this version of IE dosen't support auto download of a file with extension provided in param
-        //falling back to ".txt"
-        if (t1 === t2) {
-          frameSaveAs.document.execCommand('SaveAs', true, filename + '.txt');
-        }
-        angular.element('body > iframe#SaveAsId').remove();
-      } else {
-        content = 'data:image/svg;charset=utf-8,' + BOM + encodeURIComponent(content);
-        angular.element('body').append('<a id="SaveAsId"></a>');
-        var saveAsElement = angular.element('body > a#SaveAsId');
-        saveAsElement.attr('href', content);
-        saveAsElement.attr('download', filename + '.' + extension);
-        saveAsElement.attr('target', '_blank');
-        saveAsElement[0].click();
-        saveAsElement.remove();
+      //This means, this version of IE dosen't support auto download of a file with extension provided in param
+      //falling back to ".txt"
+      if (t1 === t2) {
+        frameSaveAs.document.execCommand('SaveAs', true, filename + '.txt');
       }
-    };
-  }
+      angular.element('body > iframe#SaveAsId').remove();
+    } else {
+      content = 'data:image/svg;charset=utf-8,' + BOM + encodeURIComponent(content);
+      angular.element('body').append('<a id="SaveAsId"></a>');
+      var saveAsElement = angular.element('body > a#SaveAsId');
+      saveAsElement.attr('href', content);
+      saveAsElement.attr('download', filename + '.' + extension);
+      saveAsElement.attr('target', '_blank');
+      saveAsElement[0].click();
+      saveAsElement.remove();
+    }
+  };
+}
 
-})();

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/4c60b27c/zeppelin-web/src/components/searchService/search.service.js
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/components/searchService/search.service.js b/zeppelin-web/src/components/searchService/search.service.js
index c5177e8..97468dd 100644
--- a/zeppelin-web/src/components/searchService/search.service.js
+++ b/zeppelin-web/src/components/searchService/search.service.js
@@ -11,26 +11,24 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
 
-  angular.module('zeppelinWebApp').service('searchService', searchService);
+angular.module('zeppelinWebApp').service('searchService', searchService);
 
-  searchService.$inject = ['$resource', 'baseUrlSrv'];
+searchService.$inject = ['$resource', 'baseUrlSrv'];
 
-  function searchService($resource, baseUrlSrv) {
-    this.search = function(term) {
-      this.searchTerm = term.q;
-      console.log('Searching for: %o', term.q);
-      if (!term.q) { //TODO(bzz): empty string check
-        return;
-      }
-      var encQuery = window.encodeURIComponent(term.q);
-      return $resource(baseUrlSrv.getRestApiBase() + '/notebook/search?q=' + encQuery, {}, {
-        query: {method: 'GET'}
-      });
-    };
+function searchService($resource, baseUrlSrv) {
+  this.search = function(term) {
+    this.searchTerm = term.q;
+    console.log('Searching for: %o', term.q);
+    if (!term.q) { //TODO(bzz): empty string check
+      return;
+    }
+    var encQuery = window.encodeURIComponent(term.q);
+    return $resource(baseUrlSrv.getRestApiBase() + '/notebook/search?q=' + encQuery, {}, {
+      query: {method: 'GET'}
+    });
+  };
 
-    this.searchTerm = '';
-  }
+  this.searchTerm = '';
+}
 
-})();

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/4c60b27c/zeppelin-web/src/components/websocketEvents/websocketEvents.factory.js
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/components/websocketEvents/websocketEvents.factory.js b/zeppelin-web/src/components/websocketEvents/websocketEvents.factory.js
index c3e0334..5436f34 100644
--- a/zeppelin-web/src/components/websocketEvents/websocketEvents.factory.js
+++ b/zeppelin-web/src/components/websocketEvents/websocketEvents.factory.js
@@ -11,176 +11,174 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
 
-  angular.module('zeppelinWebApp').factory('websocketEvents', websocketEvents);
+angular.module('zeppelinWebApp').factory('websocketEvents', websocketEvents);
 
-  websocketEvents.$inject = ['$rootScope', '$websocket', '$location', 'baseUrlSrv'];
+websocketEvents.$inject = ['$rootScope', '$websocket', '$location', 'baseUrlSrv'];
 
-  function websocketEvents($rootScope, $websocket, $location, baseUrlSrv) {
-    var websocketCalls = {};
-    var pingIntervalId;
+function websocketEvents($rootScope, $websocket, $location, baseUrlSrv) {
+  var websocketCalls = {};
+  var pingIntervalId;
 
-    websocketCalls.ws = $websocket(baseUrlSrv.getWebsocketUrl());
-    websocketCalls.ws.reconnectIfNotNormalClose = true;
+  websocketCalls.ws = $websocket(baseUrlSrv.getWebsocketUrl());
+  websocketCalls.ws.reconnectIfNotNormalClose = true;
 
-    websocketCalls.ws.onOpen(function() {
-      console.log('Websocket created');
-      $rootScope.$broadcast('setConnectedStatus', true);
-      pingIntervalId = setInterval(function() {
-        websocketCalls.sendNewEvent({op: 'PING'});
-      }, 10000);
-    });
+  websocketCalls.ws.onOpen(function() {
+    console.log('Websocket created');
+    $rootScope.$broadcast('setConnectedStatus', true);
+    pingIntervalId = setInterval(function() {
+      websocketCalls.sendNewEvent({op: 'PING'});
+    }, 10000);
+  });
 
-    websocketCalls.sendNewEvent = function(data) {
-      if ($rootScope.ticket !== undefined) {
-        data.principal = $rootScope.ticket.principal;
-        data.ticket = $rootScope.ticket.ticket;
-        data.roles = $rootScope.ticket.roles;
-      } else {
-        data.principal = '';
-        data.ticket = '';
-        data.roles = '';
-      }
-      console.log('Send >> %o, %o, %o, %o, %o', data.op, data.principal, data.ticket, data.roles, data);
-      websocketCalls.ws.send(JSON.stringify(data));
-    };
+  websocketCalls.sendNewEvent = function(data) {
+    if ($rootScope.ticket !== undefined) {
+      data.principal = $rootScope.ticket.principal;
+      data.ticket = $rootScope.ticket.ticket;
+      data.roles = $rootScope.ticket.roles;
+    } else {
+      data.principal = '';
+      data.ticket = '';
+      data.roles = '';
+    }
+    console.log('Send >> %o, %o, %o, %o, %o', data.op, data.principal, data.ticket, data.roles, data);
+    websocketCalls.ws.send(JSON.stringify(data));
+  };
 
-    websocketCalls.isConnected = function() {
-      return (websocketCalls.ws.socket.readyState === 1);
-    };
+  websocketCalls.isConnected = function() {
+    return (websocketCalls.ws.socket.readyState === 1);
+  };
 
-    websocketCalls.ws.onMessage(function(event) {
-      var payload;
-      if (event.data) {
-        payload = angular.fromJson(event.data);
+  websocketCalls.ws.onMessage(function(event) {
+    var payload;
+    if (event.data) {
+      payload = angular.fromJson(event.data);
+    }
+    console.log('Receive << %o, %o', payload.op, payload);
+    var op = payload.op;
+    var data = payload.data;
+    if (op === 'NOTE') {
+      $rootScope.$broadcast('setNoteContent', data.note);
+    } else if (op === 'NEW_NOTE') {
+      $location.path('/notebook/' + data.note.id);
+    } else if (op === 'NOTES_INFO') {
+      $rootScope.$broadcast('setNoteMenu', data.notes);
+    } else if (op === 'LIST_NOTE_JOBS') {
+      $rootScope.$broadcast('setNoteJobs', data.noteJobs);
+    } else if (op === 'LIST_UPDATE_NOTE_JOBS') {
+      $rootScope.$broadcast('setUpdateNoteJobs', data.noteRunningJobs);
+    } else if (op === 'AUTH_INFO') {
+      var btn = [];
+      if ($rootScope.ticket.roles === '[]') {
+        btn = [{
+          label: 'Close',
+          action: function(dialog) {
+            dialog.close();
+          }
+        }];
+      } else {
+        btn = [{
+          label: 'Login',
+          action: function(dialog) {
+            dialog.close();
+            angular.element('#loginModal').modal({
+              show: 'true'
+            });
+          }
+        }, {
+          label: 'Cancel',
+          action: function(dialog) {
+            dialog.close();
+            $location.path('/');
+          }
+        }];
       }
-      console.log('Receive << %o, %o', payload.op, payload);
-      var op = payload.op;
-      var data = payload.data;
-      if (op === 'NOTE') {
-        $rootScope.$broadcast('setNoteContent', data.note);
-      } else if (op === 'NEW_NOTE') {
-        $location.path('/notebook/' + data.note.id);
-      } else if (op === 'NOTES_INFO') {
-        $rootScope.$broadcast('setNoteMenu', data.notes);
-      } else if (op === 'LIST_NOTE_JOBS') {
-        $rootScope.$broadcast('setNoteJobs', data.noteJobs);
-      } else if (op === 'LIST_UPDATE_NOTE_JOBS') {
-        $rootScope.$broadcast('setUpdateNoteJobs', data.noteRunningJobs);
-      } else if (op === 'AUTH_INFO') {
-        var btn = [];
-        if ($rootScope.ticket.roles === '[]') {
-          btn = [{
-            label: 'Close',
-            action: function(dialog) {
-              dialog.close();
-            }
-          }];
-        } else {
-          btn = [{
-            label: 'Login',
-            action: function(dialog) {
-              dialog.close();
-              angular.element('#loginModal').modal({
-                show: 'true'
-              });
-            }
-          }, {
-            label: 'Cancel',
-            action: function(dialog) {
-              dialog.close();
-              $location.path('/');
-            }
-          }];
-        }
 
-        BootstrapDialog.show({
-          closable: false,
-          closeByBackdrop: false,
-          closeByKeyboard: false,
-          title: 'Insufficient privileges',
-          message: data.info.toString(),
-          buttons: btn
-        });
+      BootstrapDialog.show({
+        closable: false,
+        closeByBackdrop: false,
+        closeByKeyboard: false,
+        title: 'Insufficient privileges',
+        message: data.info.toString(),
+        buttons: btn
+      });
 
-      } else if (op === 'PARAGRAPH') {
-        $rootScope.$broadcast('updateParagraph', data);
-      } else if (op === 'PARAGRAPH_APPEND_OUTPUT') {
-        $rootScope.$broadcast('appendParagraphOutput', data);
-      } else if (op === 'PARAGRAPH_UPDATE_OUTPUT') {
-        $rootScope.$broadcast('updateParagraphOutput', data);
-      } else if (op === 'PROGRESS') {
-        $rootScope.$broadcast('updateProgress', data);
-      } else if (op === 'COMPLETION_LIST') {
-        $rootScope.$broadcast('completionList', data);
-      } else if (op === 'EDITOR_SETTING') {
-        $rootScope.$broadcast('editorSetting', data);
-      } else if (op === 'ANGULAR_OBJECT_UPDATE') {
-        $rootScope.$broadcast('angularObjectUpdate', data);
-      } else if (op === 'ANGULAR_OBJECT_REMOVE') {
-        $rootScope.$broadcast('angularObjectRemove', data);
-      } else if (op === 'APP_APPEND_OUTPUT') {
-        $rootScope.$broadcast('appendAppOutput', data);
-      } else if (op === 'APP_UPDATE_OUTPUT') {
-        $rootScope.$broadcast('updateAppOutput', data);
-      } else if (op === 'APP_LOAD') {
-        $rootScope.$broadcast('appLoad', data);
-      } else if (op === 'APP_STATUS_CHANGE') {
-        $rootScope.$broadcast('appStatusChange', data);
-      } else if (op === 'LIST_REVISION_HISTORY') {
-        $rootScope.$broadcast('listRevisionHistory', data);
-      } else if (op === 'NOTE_REVISION') {
-        $rootScope.$broadcast('noteRevision', data);
-      } else if (op === 'INTERPRETER_BINDINGS') {
-        $rootScope.$broadcast('interpreterBindings', data);
-      } else if (op === 'ERROR_INFO') {
-        BootstrapDialog.show({
-          closable: false,
-          closeByBackdrop: false,
-          closeByKeyboard: false,
-          title: 'Details',
-          message: data.info.toString(),
-          buttons: [{
-            // close all the dialogs when there are error on running all paragraphs
-            label: 'Close',
-            action: function() {
-              BootstrapDialog.closeAll();
-            }
-          }]
-        });
-      } else if (op === 'CONFIGURATIONS_INFO') {
-        $rootScope.$broadcast('configurationsInfo', data);
-      } else if (op === 'INTERPRETER_SETTINGS') {
-        $rootScope.$broadcast('interpreterSettings', data);
-      } else if (op === 'PARAGRAPH_ADDED') {
-        $rootScope.$broadcast('addParagraph', data.paragraph, data.index);
-      } else if (op === 'PARAGRAPH_REMOVED') {
-        $rootScope.$broadcast('removeParagraph', data.id);
-      } else if (op === 'PARAGRAPH_MOVED') {
-        $rootScope.$broadcast('moveParagraph', data.id, data.index);
-      } else if (op === 'NOTE_UPDATED') {
-        $rootScope.$broadcast('updateNote', data.name, data.config, data.info);
-      } else if (op === 'SET_NOTE_REVISION') {
-        $rootScope.$broadcast('setNoteRevisionResult', data);
-      }
-    });
+    } else if (op === 'PARAGRAPH') {
+      $rootScope.$broadcast('updateParagraph', data);
+    } else if (op === 'PARAGRAPH_APPEND_OUTPUT') {
+      $rootScope.$broadcast('appendParagraphOutput', data);
+    } else if (op === 'PARAGRAPH_UPDATE_OUTPUT') {
+      $rootScope.$broadcast('updateParagraphOutput', data);
+    } else if (op === 'PROGRESS') {
+      $rootScope.$broadcast('updateProgress', data);
+    } else if (op === 'COMPLETION_LIST') {
+      $rootScope.$broadcast('completionList', data);
+    } else if (op === 'EDITOR_SETTING') {
+      $rootScope.$broadcast('editorSetting', data);
+    } else if (op === 'ANGULAR_OBJECT_UPDATE') {
+      $rootScope.$broadcast('angularObjectUpdate', data);
+    } else if (op === 'ANGULAR_OBJECT_REMOVE') {
+      $rootScope.$broadcast('angularObjectRemove', data);
+    } else if (op === 'APP_APPEND_OUTPUT') {
+      $rootScope.$broadcast('appendAppOutput', data);
+    } else if (op === 'APP_UPDATE_OUTPUT') {
+      $rootScope.$broadcast('updateAppOutput', data);
+    } else if (op === 'APP_LOAD') {
+      $rootScope.$broadcast('appLoad', data);
+    } else if (op === 'APP_STATUS_CHANGE') {
+      $rootScope.$broadcast('appStatusChange', data);
+    } else if (op === 'LIST_REVISION_HISTORY') {
+      $rootScope.$broadcast('listRevisionHistory', data);
+    } else if (op === 'NOTE_REVISION') {
+      $rootScope.$broadcast('noteRevision', data);
+    } else if (op === 'INTERPRETER_BINDINGS') {
+      $rootScope.$broadcast('interpreterBindings', data);
+    } else if (op === 'ERROR_INFO') {
+      BootstrapDialog.show({
+        closable: false,
+        closeByBackdrop: false,
+        closeByKeyboard: false,
+        title: 'Details',
+        message: data.info.toString(),
+        buttons: [{
+          // close all the dialogs when there are error on running all paragraphs
+          label: 'Close',
+          action: function() {
+            BootstrapDialog.closeAll();
+          }
+        }]
+      });
+    } else if (op === 'CONFIGURATIONS_INFO') {
+      $rootScope.$broadcast('configurationsInfo', data);
+    } else if (op === 'INTERPRETER_SETTINGS') {
+      $rootScope.$broadcast('interpreterSettings', data);
+    } else if (op === 'PARAGRAPH_ADDED') {
+      $rootScope.$broadcast('addParagraph', data.paragraph, data.index);
+    } else if (op === 'PARAGRAPH_REMOVED') {
+      $rootScope.$broadcast('removeParagraph', data.id);
+    } else if (op === 'PARAGRAPH_MOVED') {
+      $rootScope.$broadcast('moveParagraph', data.id, data.index);
+    } else if (op === 'NOTE_UPDATED') {
+      $rootScope.$broadcast('updateNote', data.name, data.config, data.info);
+    } else if (op === 'SET_NOTE_REVISION') {
+      $rootScope.$broadcast('setNoteRevisionResult', data);
+    }
+  });
 
-    websocketCalls.ws.onError(function(event) {
-      console.log('error message: ', event);
-      $rootScope.$broadcast('setConnectedStatus', false);
-    });
+  websocketCalls.ws.onError(function(event) {
+    console.log('error message: ', event);
+    $rootScope.$broadcast('setConnectedStatus', false);
+  });
 
-    websocketCalls.ws.onClose(function(event) {
-      console.log('close message: ', event);
-      if (pingIntervalId !== undefined) {
-        clearInterval(pingIntervalId);
-        pingIntervalId = undefined;
-      }
-      $rootScope.$broadcast('setConnectedStatus', false);
-    });
+  websocketCalls.ws.onClose(function(event) {
+    console.log('close message: ', event);
+    if (pingIntervalId !== undefined) {
+      clearInterval(pingIntervalId);
+      pingIntervalId = undefined;
+    }
+    $rootScope.$broadcast('setConnectedStatus', false);
+  });
 
-    return websocketCalls;
-  }
+  return websocketCalls;
+}
 
-})();