This is an automated email from the ASF dual-hosted git repository.
jongyoul pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/zeppelin.git
The following commit(s) were added to refs/heads/master by this push:
new 7afcf3e59d [ZEPPELIN-2729] Paragraph numbering
7afcf3e59d is described below
commit 7afcf3e59dc930f4e5e05366de155a0a84afdc0a
Author: Timo <[email protected]>
AuthorDate: Thu Apr 10 10:44:34 2025 +0200
[ZEPPELIN-2729] Paragraph numbering
### What is this PR for?
Added a button on the top toolbar of the notebook to toggle paragraph
numbering. It adds a "Paragraph N" on the top-right of each paragraph, mainly
useful when collaborating and guiding others to the right place.
### What type of PR is it?
Feature
### What is the Jira issue?
[ZEPPELIN-2729](https://issues.apache.org/jira/browse/ZEPPELIN-2729)
### Screenshots
[gfycat mp4 video](https://gfycat.com/LeafyAntiqueCrab)
### Questions:
* Does the licenses files need update? no
* Is there breaking changes for older versions? no
* Does this needs documentation? no
Closes #2782 from timovwb/paragraph-numbering.
Signed-off-by: Jongyoul Lee <[email protected]>
---
.../src/app/notebook/notebook-actionBar.html | 8 +++++++
.../src/app/notebook/notebook.controller.js | 19 ++++++++++++++++
.../app/notebook/paragraph/paragraph-control.html | 4 ++++
.../app/notebook/paragraph/paragraph.controller.js | 26 ++++++++++++++++++++++
4 files changed, 57 insertions(+)
diff --git a/zeppelin-web/src/app/notebook/notebook-actionBar.html
b/zeppelin-web/src/app/notebook/notebook-actionBar.html
index 4822f66876..e3d4fff507 100644
--- a/zeppelin-web/src/app/notebook/notebook-actionBar.html
+++ b/zeppelin-web/src/app/notebook/notebook-actionBar.html
@@ -51,6 +51,14 @@ limitations under the License.
ng-disabled="revisionView">
<i ng-class="tableToggled ? 'fa icon-notebook' : 'fa
icon-book-open'"></i>
</button>
+ <button type="button"
+ class="btn btn-default btn-xs"
+ ng-click="toggleAllNumbering()"
+ ng-hide="viewOnly"
+ tooltip-placement="bottom" uib-tooltip="Toggle paragraph
numbering"
+ ng-disabled="revisionView">
+ <i class="fa fa-list-ol"></i>
+ </button>
<button type="button"
class="btn btn-default btn-xs"
ng-click="clearAllParagraphOutput(note.id)"
diff --git a/zeppelin-web/src/app/notebook/notebook.controller.js
b/zeppelin-web/src/app/notebook/notebook.controller.js
index 20e6d267b8..4d1abfce01 100644
--- a/zeppelin-web/src/app/notebook/notebook.controller.js
+++ b/zeppelin-web/src/app/notebook/notebook.controller.js
@@ -464,6 +464,22 @@ function NotebookCtrl($scope, $route, $routeParams,
$location, $rootScope,
$scope.$broadcast('closeTable');
};
+ $scope.toggleAllNumbering = function () {
+ if ($scope.note.config.numberingToggled) {
+ $scope.$broadcast('setNumbering', false)
+ } else {
+ $scope.$broadcast('setNumbering', true)
+ }
+ $scope.note.config.numberingToggled = !$scope.note.config.numberingToggled
+ $scope.setConfig()
+ }
+
+ $scope.updateParagraphNumbering = function () {
+ for (let i = 0; i < $scope.note.paragraphs.length; i++) {
+ $scope.note.paragraphs[i].number = i + 1
+ }
+ }
+
/**
* @returns {boolean} true if one more paragraphs are running. otherwise
return false.
*/
@@ -608,6 +624,7 @@ function NotebookCtrl($scope, $route, $routeParams,
$location, $rootScope,
return;
}
addPara(paragraph, index);
+ $scope.updateParagraphNumbering();
});
$scope.$on('removeParagraph', function(event, paragraphId) {
@@ -615,6 +632,7 @@ function NotebookCtrl($scope, $route, $routeParams,
$location, $rootScope,
return;
}
removePara(paragraphId);
+ $scope.updateParagraphNumbering();
});
$scope.$on('moveParagraph', function(event, paragraphId, newIdx) {
@@ -625,6 +643,7 @@ function NotebookCtrl($scope, $route, $routeParams,
$location, $rootScope,
if (removedPara && removedPara.length === 1) {
addPara(removedPara[0], newIdx);
}
+ $scope.updateParagraphNumbering()
});
$scope.$on('updateNote', function(event, name, config, info) {
diff --git a/zeppelin-web/src/app/notebook/paragraph/paragraph-control.html
b/zeppelin-web/src/app/notebook/paragraph/paragraph-control.html
index 9ac5b07d07..81d711155d 100644
--- a/zeppelin-web/src/app/notebook/paragraph/paragraph-control.html
+++ b/zeppelin-web/src/app/notebook/paragraph/paragraph-control.html
@@ -13,6 +13,10 @@ limitations under the License.
-->
<div id="{{paragraph.id}}_control" class="control" ng-show="!asIframe">
+ <span class="numbering"
+ ng-if="paragraph.config.numbering">
+ Paragraph<span ng-bind-html="paragraph.number"></span> |
+ </span>
<span>
<span ng-show="paragraph.runtimeInfos.jobUrl.values.length == 1">
<a href="{{paragraph.runtimeInfos.jobUrl.values[0].jobUrl}}"
target="_blank" rel="noopener noreferrer" style="text-decoration: none;"
diff --git a/zeppelin-web/src/app/notebook/paragraph/paragraph.controller.js
b/zeppelin-web/src/app/notebook/paragraph/paragraph.controller.js
index 4053cd8af3..3d21fec343 100644
--- a/zeppelin-web/src/app/notebook/paragraph/paragraph.controller.js
+++ b/zeppelin-web/src/app/notebook/paragraph/paragraph.controller.js
@@ -155,6 +155,8 @@ function ParagraphCtrl($scope, $rootScope, $route, $window,
$routeParams, $locat
noteVarShareService.put($scope.paragraph.id + '_paragraphScope',
paragraphScope);
initializeDefault($scope.paragraph.config);
+
+ $scope.updateParagraphNumbering();
};
$scope.$on('noteRunningStatus', function(event, status) {
@@ -177,6 +179,10 @@ function ParagraphCtrl($scope, $rootScope, $route,
$window, $routeParams, $locat
config.enabled = true;
}
+ if (config.numbering === undefined) {
+ config.numbering = $scope.note.config.numberingToggled
+ }
+
for (let idx in forms) {
if (forms[idx]) {
if (forms[idx].options) {
@@ -643,6 +649,18 @@ function ParagraphCtrl($scope, $rootScope, $route,
$window, $routeParams, $locat
commitParagraph(paragraph);
};
+ $scope.showNumbering = function(paragraph) {
+ console.log('show numbering');
+ paragraph.config.numbering = true;
+ commitParagraph(paragraph);
+ };
+
+ $scope.hideNumbering = function(paragraph) {
+ console.log('hide numbering');
+ paragraph.config.numbering = false;
+ commitParagraph(paragraph);
+ };
+
let openEditorAndCloseTable = function(paragraph) {
manageEditorAndTableState(paragraph, false, true);
};
@@ -1806,6 +1824,14 @@ function ParagraphCtrl($scope, $rootScope, $route,
$window, $routeParams, $locat
$scope.closeTable($scope.paragraph);
});
+ $scope.$on('setNumbering', function(event, value) {
+ if (value) {
+ $scope.showNumbering($scope.paragraph)
+ } else {
+ $scope.hideNumbering($scope.paragraph)
+ }
+ });
+
$scope.$on('resultRendered', function(event, paragraphId) {
if ($scope.paragraph.id !== paragraphId) {
return;