@hpcc-js/other 3.4.10 → 3.4.11

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/src/Paginator.css CHANGED
@@ -1,121 +1,121 @@
1
- .other_Paginator {
2
- display: block;
3
- position:absolute;
4
- white-space: nowrap;
5
- }
6
-
7
- .other_Paginator .pagination {
8
- display: inline-block;
9
- white-space: nowrap;
10
- margin: 0px;
11
- padding: 0px;
12
- }
13
-
14
- .other_Paginator .pagination > li {
15
- display: inline;
16
- }
17
-
18
- .other_Paginator input[type="number"].currentPageNumber {
19
- border: 1px solid #ddd;
20
- outline: 0 none;
21
- position: relative;
22
- width: 37px;
23
- text-align: center;
24
- }
25
-
26
- .other_Paginator div.side {
27
- padding-top: 5px;
28
- padding-left: 8px;
29
- vertical-align: top;
30
- }
31
-
32
- .other_Paginator span.side {
33
- position: relative;
34
- color: #337ab7;
35
- }
36
-
37
- .other_Paginator .pagination > li > a,
38
- .other_Paginator .pagination > div,
39
- .other_Paginator .pagination > li > span {
40
- position: relative;
41
- float: left;
42
- padding: 6px 12px;
43
- margin-left: -1px;
44
- line-height: 1.42857143;
45
- color: #337ab7;
46
- text-decoration: none;
47
- background-color: #fff;
48
- border: 1px solid #ddd;
49
- }
50
- .other_Paginator .pagination > li:first-child > a,
51
- .other_Paginator .pagination > li:first-child > span {
52
- margin-left: 0;
53
- border-top-left-radius: 4px;
54
- border-bottom-left-radius: 4px;
55
- }
56
- .other_Paginator .pagination > li:last-child > a,
57
- .other_Paginator .pagination > li:last-child > span {
58
- border-top-right-radius: 4px;
59
- border-bottom-right-radius: 4px;
60
- }
61
- .other_Paginator .pagination > li > a:hover,
62
- .other_Paginator .pagination > li > span:hover,
63
- .other_Paginator .pagination > li > a:focus,
64
- .other_Paginator .pagination > li > span:focus {
65
- color: #23527c;
66
- background-color: #eee;
67
- border-color: #ddd;
68
- }
69
- .other_Paginator .pagination > .active > a,
70
- .other_Paginator .pagination > .active > span,
71
- .other_Paginator .pagination > .active > a:hover,
72
- .other_Paginator .pagination > .active > span:hover,
73
- .other_Paginator .pagination > .active > a:focus,
74
- .other_Paginator .pagination > .active > span:focus {
75
- z-index: 2;
76
- color: #fff;
77
- cursor: default;
78
- background-color: #337ab7;
79
- border-color: #337ab7;
80
- }
81
- .other_Paginator .pagination > .disabled > span,
82
- .other_Paginator .pagination > .disabled > span:hover,
83
- .other_Paginator .pagination > .disabled > span:focus,
84
- .other_Paginator .pagination > .disabled > a,
85
- .other_Paginator .pagination > .disabled > a:hover,
86
- .other_Paginator .pagination > .disabled > a:focus {
87
- color: #777;
88
- cursor: not-allowed;
89
- background-color: #fff;
90
- border-color: #ddd;
91
- }
92
- .other_Paginator .pagination-lg > li > a,
93
- .other_Paginator .pagination-lg > li > span {
94
- padding: 10px 16px;
95
- font-size: 18px;
96
- }
97
- .other_Paginator .pagination-lg > li:first-child > a,
98
- .other_Paginator .pagination-lg > li:first-child > span {
99
- border-top-left-radius: 6px;
100
- border-bottom-left-radius: 6px;
101
- }
102
- .other_Paginator .pagination-lg > li:last-child > a,
103
- .other_Paginator .pagination-lg > li:last-child > span {
104
- border-top-right-radius: 6px;
105
- border-bottom-right-radius: 6px;
106
- }
107
- .other_Paginator .pagination-sm > li > a,
108
- .other_Paginator .pagination-sm > li > span {
109
- padding: 5px 10px;
110
- font-size: 12px;
111
- }
112
- .other_Paginator .pagination-sm > li:first-child > a,
113
- .other_Paginator .pagination-sm > li:first-child > span {
114
- border-top-left-radius: 3px;
115
- border-bottom-left-radius: 3px;
116
- }
117
- .other_Paginator .pagination-sm > li:last-child > a,
118
- .other_Paginator .pagination-sm > li:last-child > span {
119
- border-top-right-radius: 3px;
120
- border-bottom-right-radius: 3px;
1
+ .other_Paginator {
2
+ display: block;
3
+ position:absolute;
4
+ white-space: nowrap;
5
+ }
6
+
7
+ .other_Paginator .pagination {
8
+ display: inline-block;
9
+ white-space: nowrap;
10
+ margin: 0px;
11
+ padding: 0px;
12
+ }
13
+
14
+ .other_Paginator .pagination > li {
15
+ display: inline;
16
+ }
17
+
18
+ .other_Paginator input[type="number"].currentPageNumber {
19
+ border: 1px solid #ddd;
20
+ outline: 0 none;
21
+ position: relative;
22
+ width: 37px;
23
+ text-align: center;
24
+ }
25
+
26
+ .other_Paginator div.side {
27
+ padding-top: 5px;
28
+ padding-left: 8px;
29
+ vertical-align: top;
30
+ }
31
+
32
+ .other_Paginator span.side {
33
+ position: relative;
34
+ color: #337ab7;
35
+ }
36
+
37
+ .other_Paginator .pagination > li > a,
38
+ .other_Paginator .pagination > div,
39
+ .other_Paginator .pagination > li > span {
40
+ position: relative;
41
+ float: left;
42
+ padding: 6px 12px;
43
+ margin-left: -1px;
44
+ line-height: 1.42857143;
45
+ color: #337ab7;
46
+ text-decoration: none;
47
+ background-color: #fff;
48
+ border: 1px solid #ddd;
49
+ }
50
+ .other_Paginator .pagination > li:first-child > a,
51
+ .other_Paginator .pagination > li:first-child > span {
52
+ margin-left: 0;
53
+ border-top-left-radius: 4px;
54
+ border-bottom-left-radius: 4px;
55
+ }
56
+ .other_Paginator .pagination > li:last-child > a,
57
+ .other_Paginator .pagination > li:last-child > span {
58
+ border-top-right-radius: 4px;
59
+ border-bottom-right-radius: 4px;
60
+ }
61
+ .other_Paginator .pagination > li > a:hover,
62
+ .other_Paginator .pagination > li > span:hover,
63
+ .other_Paginator .pagination > li > a:focus,
64
+ .other_Paginator .pagination > li > span:focus {
65
+ color: #23527c;
66
+ background-color: #eee;
67
+ border-color: #ddd;
68
+ }
69
+ .other_Paginator .pagination > .active > a,
70
+ .other_Paginator .pagination > .active > span,
71
+ .other_Paginator .pagination > .active > a:hover,
72
+ .other_Paginator .pagination > .active > span:hover,
73
+ .other_Paginator .pagination > .active > a:focus,
74
+ .other_Paginator .pagination > .active > span:focus {
75
+ z-index: 2;
76
+ color: #fff;
77
+ cursor: default;
78
+ background-color: #337ab7;
79
+ border-color: #337ab7;
80
+ }
81
+ .other_Paginator .pagination > .disabled > span,
82
+ .other_Paginator .pagination > .disabled > span:hover,
83
+ .other_Paginator .pagination > .disabled > span:focus,
84
+ .other_Paginator .pagination > .disabled > a,
85
+ .other_Paginator .pagination > .disabled > a:hover,
86
+ .other_Paginator .pagination > .disabled > a:focus {
87
+ color: #777;
88
+ cursor: not-allowed;
89
+ background-color: #fff;
90
+ border-color: #ddd;
91
+ }
92
+ .other_Paginator .pagination-lg > li > a,
93
+ .other_Paginator .pagination-lg > li > span {
94
+ padding: 10px 16px;
95
+ font-size: 18px;
96
+ }
97
+ .other_Paginator .pagination-lg > li:first-child > a,
98
+ .other_Paginator .pagination-lg > li:first-child > span {
99
+ border-top-left-radius: 6px;
100
+ border-bottom-left-radius: 6px;
101
+ }
102
+ .other_Paginator .pagination-lg > li:last-child > a,
103
+ .other_Paginator .pagination-lg > li:last-child > span {
104
+ border-top-right-radius: 6px;
105
+ border-bottom-right-radius: 6px;
106
+ }
107
+ .other_Paginator .pagination-sm > li > a,
108
+ .other_Paginator .pagination-sm > li > span {
109
+ padding: 5px 10px;
110
+ font-size: 12px;
111
+ }
112
+ .other_Paginator .pagination-sm > li:first-child > a,
113
+ .other_Paginator .pagination-sm > li:first-child > span {
114
+ border-top-left-radius: 3px;
115
+ border-bottom-left-radius: 3px;
116
+ }
117
+ .other_Paginator .pagination-sm > li:last-child > a,
118
+ .other_Paginator .pagination-sm > li:last-child > span {
119
+ border-top-right-radius: 3px;
120
+ border-bottom-right-radius: 3px;
121
121
  }
package/src/Paginator.ts CHANGED
@@ -1,172 +1,172 @@
1
- import { d3Event, HTMLWidget, select as d3Select } from "@hpcc-js/common";
2
-
3
- import "../src/Paginator.css";
4
-
5
- export class Paginator extends HTMLWidget {
6
- _tNumPages;
7
- _numList;
8
- paginator;
9
- side;
10
- _onSelect;
11
-
12
- constructor() {
13
- super();
14
-
15
- this._tag = "div";
16
-
17
- this._tNumPages = 1; // np
18
-
19
- this._numList = []; // pn
20
- }
21
-
22
- postUpdate(domNode, element) { }
23
-
24
- enter(domNode, element) {
25
- super.enter(domNode, element);
26
- const context = this;
27
-
28
- this.paginator = element.append("ul").attr("class", "paginator pagination pagination-sm");
29
- this.side = element.append("div").attr("class", "paginator pagination side");
30
-
31
- this.side.append("span")
32
- .classed("side", true)
33
- .text("Page ")
34
- ;
35
-
36
- this.side.append("input")
37
- .attr("type", "number")
38
- .attr("class", "currentPageNumber")
39
- .property("value", 1)
40
- .attr("min", 1)
41
- .on("change", function () {
42
- context.pageNumber(this.value);
43
- context._onSelect(this.value);
44
- })
45
- ;
46
-
47
- this.side.append("span")
48
- .classed("side total", true)
49
- .text(" of 1")
50
- ;
51
- }
52
-
53
- update(domNode, element) {
54
- const context = this;
55
- element
56
- .style("bottom", this.bottom() + "px")
57
- .style("right", this.right() + "px")
58
- ;
59
-
60
- this._tNumPages = Math.ceil(this.numItems() / this.itemsPerPage()) || 1;
61
-
62
- if (this.pageNumber() > this._tNumPages) { this.pageNumber(1); }
63
-
64
- this._numList = [];
65
- if (this.numItems()) {
66
- this._numList.push("first");
67
- for (let x = -this.adjacentPages(); x <= this.adjacentPages(); x++) {
68
- if (this.pageNumber() + x > 0 && this.pageNumber() + x <= this._tNumPages) {
69
- this._numList.push(this.pageNumber() + x);
70
- }
71
- }
72
- this._numList.push("last");
73
- }
74
-
75
- this.side.select(".total").text(" of " + this._tNumPages);
76
- this.side.select(".currentPageNumber").property("value", this.pageNumber());
77
- this.side.select(".currentPageNumber").attr("max", this._tNumPages);
78
-
79
- const page = this.paginator.selectAll("li").data(this._numList, function (d) { return d; });
80
- page
81
- .enter()
82
- .append(function (d) {
83
- const li = document.createElement("li");
84
-
85
- if (d !== context.pageNumber()) {
86
- const a = document.createElement("a");
87
- const linkText = document.createTextNode(d);
88
-
89
- a.appendChild(linkText);
90
- a.href = "#";
91
- li.appendChild(a);
92
-
93
- return li;
94
- } else {
95
- const span = document.createElement("span");
96
- span.innerHTML = d;
97
-
98
- li.appendChild(span);
99
-
100
- return li;
101
- }
102
- })
103
- .on("click", function (d, i) {
104
- d3Event().preventDefault();
105
- context.side.select(".currentPageNumber").property("value", context.pageNumber());
106
- switch (d) {
107
- case "first":
108
- if (context.pageNumber() !== 1) {
109
- context.pageNumber(1);
110
- context._onSelect(1, "previous");
111
- }
112
- break;
113
- case "last":
114
- if (context.pageNumber() !== context._tNumPages) {
115
- context.pageNumber(context._tNumPages);
116
- context._onSelect(context._tNumPages, "previous");
117
- }
118
- break;
119
- default:
120
- context.pageNumber(d);
121
- context._onSelect(d);
122
- }
123
- })
124
- ;
125
-
126
- page.classed("active", function (e, j) { return e === context.pageNumber(); })
127
- .select("a")
128
- .text(function (d) { return d; })
129
- ;
130
-
131
- page.exit().remove();
132
- page.order();
133
-
134
- if (this.numItems() === 0) {
135
- d3Select(domNode).remove();
136
- }
137
- }
138
-
139
- exit(domNode, element) {
140
- super.exit(domNode, element);
141
- }
142
- }
143
- Paginator.prototype._class += " other_Paginator";
144
-
145
- export interface Paginator {
146
- itemsPerPage(): number;
147
- itemsPerPage(_: number): this;
148
- itemsPerPage_exists(): boolean;
149
- numItems(): number;
150
- numItems(_: number): this;
151
- numItems_exists(): boolean;
152
- pageNumber(): number;
153
- pageNumber(_: number): this;
154
- pageNumber_exists(): boolean;
155
- adjacentPages(): number;
156
- adjacentPages(_: number): this;
157
- adjacentPages_exists(): boolean
158
- bottom(): number;
159
- bottom(_: number): this;
160
- bottom_exists(): boolean;
161
- right(): number;
162
- right(_: number): this;
163
- right_exists(): boolean;
164
- }
165
-
166
- Paginator.prototype.publish("itemsPerPage", 2, "number", "Pagination items per page", null, { tags: ["Private"] });
167
-
168
- Paginator.prototype.publish("numItems", 10, "number", "Pagination total number of items", null, { tags: ["Private"] });
169
- Paginator.prototype.publish("pageNumber", 1, "number", "Pagination set or get the page number", null, { tags: ["Private"] });
170
- Paginator.prototype.publish("adjacentPages", 2, "number", "Number of page indexes either side of current one", null, { tags: ["Private"] });
171
- Paginator.prototype.publish("bottom", 20, "number", "Pagination bottom offset", null, { tags: ["Private"] });
172
- Paginator.prototype.publish("right", 20, "number", "Pagination right offset", null, { tags: ["Private"] });
1
+ import { d3Event, HTMLWidget, select as d3Select } from "@hpcc-js/common";
2
+
3
+ import "../src/Paginator.css";
4
+
5
+ export class Paginator extends HTMLWidget {
6
+ _tNumPages;
7
+ _numList;
8
+ paginator;
9
+ side;
10
+ _onSelect;
11
+
12
+ constructor() {
13
+ super();
14
+
15
+ this._tag = "div";
16
+
17
+ this._tNumPages = 1; // np
18
+
19
+ this._numList = []; // pn
20
+ }
21
+
22
+ postUpdate(domNode, element) { }
23
+
24
+ enter(domNode, element) {
25
+ super.enter(domNode, element);
26
+ const context = this;
27
+
28
+ this.paginator = element.append("ul").attr("class", "paginator pagination pagination-sm");
29
+ this.side = element.append("div").attr("class", "paginator pagination side");
30
+
31
+ this.side.append("span")
32
+ .classed("side", true)
33
+ .text("Page ")
34
+ ;
35
+
36
+ this.side.append("input")
37
+ .attr("type", "number")
38
+ .attr("class", "currentPageNumber")
39
+ .property("value", 1)
40
+ .attr("min", 1)
41
+ .on("change", function () {
42
+ context.pageNumber(this.value);
43
+ context._onSelect(this.value);
44
+ })
45
+ ;
46
+
47
+ this.side.append("span")
48
+ .classed("side total", true)
49
+ .text(" of 1")
50
+ ;
51
+ }
52
+
53
+ update(domNode, element) {
54
+ const context = this;
55
+ element
56
+ .style("bottom", this.bottom() + "px")
57
+ .style("right", this.right() + "px")
58
+ ;
59
+
60
+ this._tNumPages = Math.ceil(this.numItems() / this.itemsPerPage()) || 1;
61
+
62
+ if (this.pageNumber() > this._tNumPages) { this.pageNumber(1); }
63
+
64
+ this._numList = [];
65
+ if (this.numItems()) {
66
+ this._numList.push("first");
67
+ for (let x = -this.adjacentPages(); x <= this.adjacentPages(); x++) {
68
+ if (this.pageNumber() + x > 0 && this.pageNumber() + x <= this._tNumPages) {
69
+ this._numList.push(this.pageNumber() + x);
70
+ }
71
+ }
72
+ this._numList.push("last");
73
+ }
74
+
75
+ this.side.select(".total").text(" of " + this._tNumPages);
76
+ this.side.select(".currentPageNumber").property("value", this.pageNumber());
77
+ this.side.select(".currentPageNumber").attr("max", this._tNumPages);
78
+
79
+ const page = this.paginator.selectAll("li").data(this._numList, function (d) { return d; });
80
+ page
81
+ .enter()
82
+ .append(function (d) {
83
+ const li = document.createElement("li");
84
+
85
+ if (d !== context.pageNumber()) {
86
+ const a = document.createElement("a");
87
+ const linkText = document.createTextNode(d);
88
+
89
+ a.appendChild(linkText);
90
+ a.href = "#";
91
+ li.appendChild(a);
92
+
93
+ return li;
94
+ } else {
95
+ const span = document.createElement("span");
96
+ span.innerHTML = d;
97
+
98
+ li.appendChild(span);
99
+
100
+ return li;
101
+ }
102
+ })
103
+ .on("click", function (d, i) {
104
+ d3Event().preventDefault();
105
+ context.side.select(".currentPageNumber").property("value", context.pageNumber());
106
+ switch (d) {
107
+ case "first":
108
+ if (context.pageNumber() !== 1) {
109
+ context.pageNumber(1);
110
+ context._onSelect(1, "previous");
111
+ }
112
+ break;
113
+ case "last":
114
+ if (context.pageNumber() !== context._tNumPages) {
115
+ context.pageNumber(context._tNumPages);
116
+ context._onSelect(context._tNumPages, "previous");
117
+ }
118
+ break;
119
+ default:
120
+ context.pageNumber(d);
121
+ context._onSelect(d);
122
+ }
123
+ })
124
+ ;
125
+
126
+ page.classed("active", function (e, j) { return e === context.pageNumber(); })
127
+ .select("a")
128
+ .text(function (d) { return d; })
129
+ ;
130
+
131
+ page.exit().remove();
132
+ page.order();
133
+
134
+ if (this.numItems() === 0) {
135
+ d3Select(domNode).remove();
136
+ }
137
+ }
138
+
139
+ exit(domNode, element) {
140
+ super.exit(domNode, element);
141
+ }
142
+ }
143
+ Paginator.prototype._class += " other_Paginator";
144
+
145
+ export interface Paginator {
146
+ itemsPerPage(): number;
147
+ itemsPerPage(_: number): this;
148
+ itemsPerPage_exists(): boolean;
149
+ numItems(): number;
150
+ numItems(_: number): this;
151
+ numItems_exists(): boolean;
152
+ pageNumber(): number;
153
+ pageNumber(_: number): this;
154
+ pageNumber_exists(): boolean;
155
+ adjacentPages(): number;
156
+ adjacentPages(_: number): this;
157
+ adjacentPages_exists(): boolean
158
+ bottom(): number;
159
+ bottom(_: number): this;
160
+ bottom_exists(): boolean;
161
+ right(): number;
162
+ right(_: number): this;
163
+ right_exists(): boolean;
164
+ }
165
+
166
+ Paginator.prototype.publish("itemsPerPage", 2, "number", "Pagination items per page", null, { tags: ["Private"] });
167
+
168
+ Paginator.prototype.publish("numItems", 10, "number", "Pagination total number of items", null, { tags: ["Private"] });
169
+ Paginator.prototype.publish("pageNumber", 1, "number", "Pagination set or get the page number", null, { tags: ["Private"] });
170
+ Paginator.prototype.publish("adjacentPages", 2, "number", "Number of page indexes either side of current one", null, { tags: ["Private"] });
171
+ Paginator.prototype.publish("bottom", 20, "number", "Pagination bottom offset", null, { tags: ["Private"] });
172
+ Paginator.prototype.publish("right", 20, "number", "Pagination right offset", null, { tags: ["Private"] });