Skip to content

Commit ee6584d

Browse files
Gutenberg: annotations don't appear - WIP
1 parent bc57000 commit ee6584d

File tree

6 files changed

+4057
-122
lines changed

6 files changed

+4057
-122
lines changed

classes/Visualizer/Gutenberg/Block.php

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -334,7 +334,8 @@ public function get_visualizer_data( $post ) {
334334
}
335335
if ( ! empty( $serie['role'] ) ) {
336336
// this series is some kind of annotation, so let's collect its index.
337-
$annotations[] = $index;
337+
// the index will be +1 because the X axis value is index 0, which is being ignored.
338+
$annotations['role' . ( intval( $index ) + 1 )] = $serie['role'];
338339
}
339340
}
340341
}
@@ -349,8 +350,8 @@ public function get_visualizer_data( $post ) {
349350
if( $index === 0) {
350351
continue;
351352
}
352-
if ( in_array( $index, $annotations, true ) ) {
353-
$series_names[] = (object) array( 'role' => $serie['type'] );
353+
if ( array_key_exists( 'role' . $index, $annotations ) ) {
354+
$series_names[] = (object) array( 'role' => $annotations['role' . $index], 'type' => $serie['type'] );
354355
} else {
355356
$series_names[] = $serie['label'];
356357
}
@@ -360,10 +361,10 @@ public function get_visualizer_data( $post ) {
360361
foreach( $data['visualizer-data'] as $datum ) {
361362
// skip X axis data.
362363
unset( $datum[0] );
363-
$exploded_data[] = $datum;
364+
$exploded_data[] = array(1,2,3);//$datum;
364365
}
365366
error_log("finally " . print_r($exploded_data,true));
366-
$data['visualizer-data-exploded'] = $exploded_data;
367+
$data['visualizer-data-exploded'] = array( $exploded_data );
367368
}
368369
}
369370

Lines changed: 238 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1,238 @@
1-
.visualizer-settings{background-color:#f8f9f9;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif;font-size:13px;position:relative}.visualizer-settings .visualizer-settings__title{margin:0;padding:1.5rem 0;text-align:center;border-bottom:1px solid #e6eaee}.visualizer-settings .visualizer-settings__title .dashicon{vertical-align:top;margin-right:.25em}.visualizer-settings .visualizer-settings__content{padding:2.5em 0}.visualizer-settings .visualizer-settings__content .visualizer-settings__content-description{margin:0 0 1.5em 0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif;font-size:18px;text-align:center}.visualizer-settings .visualizer-settings__content .visualizer-settings__content-option{display:-webkit-box;display:flex;-webkit-box-align:start;align-items:flex-start;flex-wrap:wrap;margin:0 auto;padding:1.25em 1.5em;max-width:80%;background:#fff;border-width:1px 1px 0;border-style:solid;border-color:#e6eaee;cursor:pointer}.visualizer-settings .visualizer-settings__content .visualizer-settings__content-option.locked{cursor:default}.visualizer-settings .visualizer-settings__content .visualizer-settings__content-option.locked:hover{background:#ffffff}.visualizer-settings .visualizer-settings__content .visualizer-settings__content-option:hover{background:#f5f5f5}.visualizer-settings .visualizer-settings__content .visualizer-settings__content-option:last-of-type{border-bottom-width:1px}.visualizer-settings .visualizer-settings__content .visualizer-settings__content-option .visualizer-settings__content-option-title{max-width:80%;display:block;font-size:1.25em}.visualizer-settings .visualizer-settings__content .visualizer-settings__content-option .visualizer-settings__content-option-icon{align-self:center;margin-left:auto;color:#b9bcc2}.visualizer-settings .visualizer-settings__content .visualizer-settings__content-option .visualizer-settings__content-option-icon .dashicon{height:25px;width:25px}.visualizer-settings .visualizer-settings__charts{text-align:center;padding-bottom:25px}.visualizer-settings .visualizer-settings__charts .visualizer-settings__charts-grid{display:grid;grid-template-columns:50% 50%}.visualizer-settings .visualizer-settings__charts .visualizer-settings__charts-grid .visualizer-settings__charts-single{margin:25px;padding-bottom:50px;background-color:#efefef;position:relative}.visualizer-settings .visualizer-settings__charts .visualizer-settings__charts-grid .visualizer-settings__charts-single .visualizer-settings__charts-title{padding:10px;font-weight:bold;text-align:center}.visualizer-settings .visualizer-settings__charts .visualizer-settings__charts-grid .visualizer-settings__charts-single .visualizer-settings__charts-controls{width:100%;position:absolute;bottom:0;padding:10px;font-weight:bold;text-align:center;cursor:pointer}.visualizer-settings .visualizer-settings__charts .dataTables_wrapper{background:#fff;padding:10px}.visualizer-settings .visualizer-settings__charts .visualizer-no-charts{padding-top:25px}.visualizer-settings .visualizer-settings__chart{text-align:center}.visualizer-settings .visualizer-settings__chart .dataTables_wrapper{background:#fff;padding:10px}.visualizer-settings .visualizer-settings__controls{margin:0;padding:1.5rem 0;text-align:center;border-top:1px solid #e6eaee}.visualizer-advanced-panel.components-panel__body.is-opened>.components-panel__body-title{margin-bottom:0}.visualizer-inner-sections{background:#f8f9f9}.visualizer-inner-sections .components-panel__body-toggle:hover{background:#EEEEEE}.visualizer-inner-sections ul.visualizer-list{list-style:disc;margin-left:15px}.components-panel__body-button .components-panel__body-toggle.components-button .dashicons-admin-tools{margin:-2px 6px -2px 0}.components-panel__body-button .components-panel__body-toggle.components-button .dashicons-admin-users{margin:-2px 6px -2px 0}.components-panel__body-button .components-panel__body-toggle.components-button .components-panel__arrow{width:48px;height:48px;right:0;border-top:1px solid #ddd;-webkit-transform:translateY(-50%) rotate(270deg);transform:translateY(-50%) rotate(270deg)}.components-panel__body-button.visualizer-panel-back .components-panel__body-title{background:#f3f3f3}.components-panel__body-button.visualizer-panel-back .components-panel__body-title:hover{background:#f3f3f3}.components-panel__body-button.visualizer-panel-back .components-panel__body-title .components-panel__body-toggle{margin:10px 0;background:#fff}.components-panel__body-button.visualizer-panel-back .components-panel__body-title .components-panel__body-toggle.components-button{padding-left:60px}.components-panel__body-button.visualizer-panel-back .components-panel__body-title .components-panel__body-toggle.components-button:hover .components-panel__arrow{background:#f3f3f3;border-width:1px 1px 0 1px;border-color:#ddd;border-style:solid}.components-panel__body-button.visualizer-panel-back .components-panel__body-title .components-panel__body-toggle.components-button .components-panel__arrow{left:0;-webkit-transform:translateY(-50%) rotate(90deg);transform:translateY(-50%) rotate(90deg)}.visualizer-chart-editor{max-width:100%;margin:25px 25px 0}.visualizer-chart-editor .htEditor{margin-bottom:20px}.visualizer-chart-editor .htEditor .htRowHeaders{height:auto !important;width:auto !important}.visualizer-chart-editor .htEditor .ht_master .wtHolder{height:auto !important;width:auto !important}.htContextMenu:not(.htGhostTable){z-index:999999}.htDatepickerHolder{z-index:999999 !important}@media (max-width: 768px){.visualizer-settings .visualizer-settings__charts .visualizer-settings__charts-grid{display:grid;grid-template-columns:100%}}
1+
.visualizer-settings {
2+
background-color: #f8f9f9;
3+
font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif;
4+
font-size: 13px;
5+
position: relative; }
6+
.visualizer-settings .visualizer-settings__title {
7+
margin: 0;
8+
padding: 1.5rem 0;
9+
text-align: center;
10+
border-bottom: 1px solid #e6eaee; }
11+
.visualizer-settings .visualizer-settings__title .dashicon {
12+
vertical-align: top;
13+
margin-right: .25em; }
14+
.visualizer-settings .visualizer-settings__content {
15+
padding: 2.5em 0; }
16+
.visualizer-settings .visualizer-settings__content .visualizer-settings__content-description {
17+
margin: 0 0 1.5em 0;
18+
font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif;
19+
font-size: 18px;
20+
text-align: center; }
21+
.visualizer-settings .visualizer-settings__content .visualizer-settings__content-option {
22+
display: -webkit-box;
23+
display: flex;
24+
-webkit-box-align: start;
25+
align-items: flex-start;
26+
flex-wrap: wrap;
27+
margin: 0 auto;
28+
padding: 1.25em 1.5em;
29+
max-width: 80%;
30+
background: #fff;
31+
border-width: 1px 1px 0;
32+
border-style: solid;
33+
border-color: #e6eaee;
34+
cursor: pointer; }
35+
.visualizer-settings .visualizer-settings__content .visualizer-settings__content-option.locked {
36+
cursor: default; }
37+
.visualizer-settings .visualizer-settings__content .visualizer-settings__content-option.locked:hover {
38+
background: #ffffff; }
39+
.visualizer-settings .visualizer-settings__content .visualizer-settings__content-option:hover {
40+
background: #f5f5f5; }
41+
.visualizer-settings .visualizer-settings__content .visualizer-settings__content-option:last-of-type {
42+
border-bottom-width: 1px; }
43+
.visualizer-settings .visualizer-settings__content .visualizer-settings__content-option .visualizer-settings__content-option-title {
44+
max-width: 80%;
45+
display: block;
46+
font-size: 1.25em; }
47+
.visualizer-settings .visualizer-settings__content .visualizer-settings__content-option .visualizer-settings__content-option-icon {
48+
align-self: center;
49+
margin-left: auto;
50+
color: #b9bcc2; }
51+
.visualizer-settings .visualizer-settings__content .visualizer-settings__content-option .visualizer-settings__content-option-icon .dashicon {
52+
height: 25px;
53+
width: 25px; }
54+
.visualizer-settings .visualizer-settings__charts {
55+
text-align: center;
56+
padding-bottom: 25px; }
57+
.visualizer-settings .visualizer-settings__charts .visualizer-settings__charts-grid {
58+
display: grid;
59+
grid-template-columns: 50% 50%; }
60+
.visualizer-settings .visualizer-settings__charts .visualizer-settings__charts-grid .visualizer-settings__charts-single {
61+
margin: 25px;
62+
padding-bottom: 50px;
63+
background-color: #efefef;
64+
position: relative; }
65+
.visualizer-settings .visualizer-settings__charts .visualizer-settings__charts-grid .visualizer-settings__charts-single .visualizer-settings__charts-title {
66+
padding: 10px;
67+
font-weight: bold;
68+
text-align: center; }
69+
.visualizer-settings .visualizer-settings__charts .visualizer-settings__charts-grid .visualizer-settings__charts-single .visualizer-settings__charts-controls {
70+
width: 100%;
71+
position: absolute;
72+
bottom: 0;
73+
padding: 10px;
74+
font-weight: bold;
75+
text-align: center;
76+
cursor: pointer; }
77+
.visualizer-settings .visualizer-settings__charts .dataTables_wrapper {
78+
background: #fff;
79+
padding: 10px; }
80+
.visualizer-settings .visualizer-settings__charts .visualizer-no-charts {
81+
padding-top: 25px; }
82+
.visualizer-settings .visualizer-settings__chart {
83+
text-align: center; }
84+
.visualizer-settings .visualizer-settings__chart .dataTables_wrapper {
85+
background: #fff;
86+
padding: 10px; }
87+
.visualizer-settings .visualizer-settings__controls {
88+
margin: 0;
89+
padding: 1.5rem 0;
90+
text-align: center;
91+
border-top: 1px solid #e6eaee; }
92+
93+
.visualizer-advanced-panel.components-panel__body.is-opened > .components-panel__body-title {
94+
margin-bottom: 0; }
95+
96+
.visualizer-inner-sections {
97+
background: #f8f9f9; }
98+
.visualizer-inner-sections .components-panel__body-toggle:hover {
99+
background: #EEEEEE; }
100+
.visualizer-inner-sections ul.visualizer-list {
101+
list-style: disc;
102+
margin-left: 15px; }
103+
104+
.components-panel__body-button .components-panel__body-toggle.components-button .dashicons-admin-tools {
105+
margin: -2px 6px -2px 0; }
106+
107+
.components-panel__body-button .components-panel__body-toggle.components-button .dashicons-admin-users {
108+
margin: -2px 6px -2px 0; }
109+
110+
.components-panel__body-button .components-panel__body-toggle.components-button .components-panel__arrow {
111+
width: 48px;
112+
height: 48px;
113+
right: 0;
114+
border-top: 1px solid #ddd;
115+
-webkit-transform: translateY(-50%) rotate(270deg);
116+
transform: translateY(-50%) rotate(270deg); }
117+
118+
.components-panel__body-button.visualizer-panel-back .components-panel__body-title {
119+
background: #f3f3f3; }
120+
.components-panel__body-button.visualizer-panel-back .components-panel__body-title:hover {
121+
background: #f3f3f3; }
122+
.components-panel__body-button.visualizer-panel-back .components-panel__body-title .components-panel__body-toggle {
123+
margin: 10px 0;
124+
background: #fff; }
125+
.components-panel__body-button.visualizer-panel-back .components-panel__body-title .components-panel__body-toggle.components-button {
126+
padding-left: 60px; }
127+
.components-panel__body-button.visualizer-panel-back .components-panel__body-title .components-panel__body-toggle.components-button:hover .components-panel__arrow {
128+
background: #f3f3f3;
129+
border-width: 1px 1px 0 1px;
130+
border-color: #ddd;
131+
border-style: solid; }
132+
.components-panel__body-button.visualizer-panel-back .components-panel__body-title .components-panel__body-toggle.components-button .components-panel__arrow {
133+
left: 0;
134+
-webkit-transform: translateY(-50%) rotate(90deg);
135+
transform: translateY(-50%) rotate(90deg); }
136+
137+
.visualizer-chart-editor {
138+
max-width: 100%;
139+
margin: 25px 25px 0; }
140+
.visualizer-chart-editor .htEditor {
141+
margin-bottom: 20px; }
142+
.visualizer-chart-editor .htEditor .htRowHeaders {
143+
height: auto !important;
144+
width: auto !important; }
145+
.visualizer-chart-editor .htEditor .ht_master .wtHolder {
146+
height: auto !important;
147+
width: auto !important; }
148+
149+
.visualizer-json-query-modal .components-modal__content {
150+
padding-left: 0;
151+
padding-right: 0; }
152+
.visualizer-json-query-modal .components-modal__content .components-modal__header {
153+
margin: 0; }
154+
155+
.visualizer-json-query-modal .components-icon-button {
156+
margin: 10px 0; }
157+
158+
.visualizer-json-query-modal .visualizer-json-query-modal-headers-panel {
159+
padding: 0 0 1em 2.2em; }
160+
.visualizer-json-query-modal .visualizer-json-query-modal-headers-panel .components-base-control {
161+
display: inline-block; }
162+
.visualizer-json-query-modal .visualizer-json-query-modal-headers-panel .visualizer-json-query-modal-field-separator {
163+
padding: 0 10px; }
164+
165+
.visualizer-json-query-modal .viz-editor-table tbody tr:first-child {
166+
background-color: #ececec !important; }
167+
168+
.visualizer-json-query-modal .viz-editor-table tr th {
169+
background-color: #cccccc; }
170+
171+
.visualizer-json-query-modal .viz-editor-table thead tr th:nth-child(n+1) {
172+
cursor: move !important; }
173+
174+
.visualizer-json-query-modal #visualizer-json-query-table {
175+
margin-bottom: 10px; }
176+
177+
.visualizer-json-query-modal ul {
178+
list-style: disc;
179+
margin-left: 10px; }
180+
181+
.visualizer-db-query-modal .CodeMirror-scroll {
182+
overflow: hidden !important;
183+
height: 50%;
184+
margin: 0;
185+
padding: 0; }
186+
187+
.visualizer-db-query-modal .CodeMirror-wrap {
188+
height: 200px;
189+
padding: 15px;
190+
color: #fff;
191+
background: #282923;
192+
font-size: 15px;
193+
margin-bottom: 20px; }
194+
.visualizer-db-query-modal .CodeMirror-wrap .CodeMirror-cursor {
195+
border-left: 1px solid #fff !important; }
196+
.visualizer-db-query-modal .CodeMirror-wrap .CodeMirror-placeholder {
197+
color: #fff; }
198+
.visualizer-db-query-modal .CodeMirror-wrap pre {
199+
color: #fff !important; }
200+
.visualizer-db-query-modal .CodeMirror-wrap .cm-keyword {
201+
color: #f92472 !important; }
202+
.visualizer-db-query-modal .CodeMirror-wrap .cm-comment {
203+
color: #74705d !important; }
204+
.visualizer-db-query-modal .CodeMirror-wrap .cm-number {
205+
color: #fff !important; }
206+
.visualizer-db-query-modal .CodeMirror-wrap .cm-string {
207+
color: #fff !important; }
208+
209+
.visualizer-db-query-modal ul {
210+
list-style: disc;
211+
margin-left: 10px; }
212+
213+
.visualizer-db-query-modal .db-wizard-error {
214+
color: #f00; }
215+
216+
.visualizer-db-query-modal .visualizer-db-query-actions .components-button:first-child {
217+
margin-right: 10px; }
218+
219+
.htContextMenu:not(.htGhostTable) {
220+
z-index: 999999; }
221+
222+
.htDatepickerHolder,
223+
.CodeMirror-hints,
224+
.DTCR_clonedTable,
225+
.DTCR_pointer {
226+
z-index: 999999 !important; }
227+
228+
@media (min-width: 768px) {
229+
.visualizer-json-query-modal {
230+
width: 668px; }
231+
.visualizer-db-query-modal .CodeMirror-wrap {
232+
min-width: 550px; } }
233+
234+
@media (max-width: 768px) {
235+
.visualizer-settings .visualizer-settings__charts .visualizer-settings__charts-grid {
236+
display: grid;
237+
grid-template-columns: 100%; } }
238+

classes/Visualizer/Gutenberg/build/block.js

Lines changed: 2479 additions & 69 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)