release: fixes

selul · web-flow · commit c3fb3cef7fcd · 2021-08-04T22:45:03.000+03:00
- Fix broken dropdown style issue 
- Add block support in widget area
- Add wp alpha color picker support
- Fix broken chart layout issue when add long title
diff --git a/classes/Visualizer/Gutenberg/Block.php b/classes/Visualizer/Gutenberg/Block.php
@@ -80,6 +80,14 @@ public function enqueue_gutenberg_scripts() {
 			$version = $this->version;
 		}
 
+		if ( ! wp_script_is( 'visualizer-datatables', 'registered' ) ) {
+			wp_register_script( 'visualizer-datatables', VISUALIZER_ABSURL . 'js/lib/datatables.min.js', array( 'jquery-ui-core' ), Visualizer_Plugin::VERSION );
+		}
+
+		if ( ! wp_style_is( 'visualizer-datatables', 'registered' ) ) {
+			wp_register_style( 'visualizer-datatables', VISUALIZER_ABSURL . 'css/lib/datatables.min.css', array(), Visualizer_Plugin::VERSION );
+		}
+
 		// Enqueue the bundled block JS file
 		wp_enqueue_script( 'handsontable', $handsontableJS );
 		wp_enqueue_script( 'visualizer-gutenberg-block', $blockPath, array( 'wp-api', 'handsontable', 'visualizer-datatables', 'moment' ), $version, true );
diff --git a/classes/Visualizer/Gutenberg/build/block.css b/classes/Visualizer/Gutenberg/build/block.css
diff --git a/classes/Visualizer/Gutenberg/build/block.js b/classes/Visualizer/Gutenberg/build/block.js
diff --git a/classes/Visualizer/Gutenberg/src/Components/ChartRender.js b/classes/Visualizer/Gutenberg/src/Components/ChartRender.js
@@ -37,7 +37,7 @@ class ChartRender extends Component {
 
 	render() {
 
-		let chartVersion = google.visualization.Version || 'current';
+		let chartVersion = 'undefined' !== typeof google ? google.visualization.Version : 'current';
 
 		let chart, footer;
 
diff --git a/classes/Visualizer/Gutenberg/src/Components/ChartSelect.js b/classes/Visualizer/Gutenberg/src/Components/ChartSelect.js
@@ -57,7 +57,7 @@ class ChartSelect extends Component {
 
 	render() {
 
-		let chartVersion = google.visualization.Version || 'current';
+		let chartVersion = 'undefined' !== typeof google ? google.visualization.Version : 'current';
 
 		let chart, footer;
 
diff --git a/classes/Visualizer/Gutenberg/src/Components/Charts.js b/classes/Visualizer/Gutenberg/src/Components/Charts.js
@@ -74,7 +74,7 @@ class Charts extends Component {
 
 	render() {
 
-		let chartVersion = google.visualization.Version || 'current';
+		let chartVersion = 'undefined' !== typeof google ? google.visualization.Version : 'current';
 
 		const { charts, isBusy, chartsLoaded, perPage } = this.state;
 
diff --git a/classes/Visualizer/Gutenberg/src/style.scss b/classes/Visualizer/Gutenberg/src/style.scss
@@ -378,6 +378,11 @@
 	z-index: 999999 !important;
 }
 
+.components-panel {
+	.components-select-control {
+		height:auto !important;
+	}
+}
 @media ( min-width: 768px ) {
 	.visualizer-json-query-modal {
 		width: 668px;
diff --git a/classes/Visualizer/Render/Sidebar.php b/classes/Visualizer/Render/Sidebar.php
@@ -309,7 +309,7 @@ protected static function _renderColorPickerItem( $title, $name, $value, $defaul
 		echo '<div class="viz-section-item">';
 			echo '<b>', $title, '</b>';
 			echo '<div>';
-				echo '<input type="text" class="color-picker-hex color-picker" data-alpha="true" name="', $name, '" maxlength="7" placeholder="', esc_attr__( 'Hex Value', 'visualizer' ), '" value="', is_null( $value ) ? $default : esc_attr( $value ), '" data-default-color="', $default, '">';
+				echo '<input type="text" class="color-picker-hex color-picker" data-alpha-enabled="true" name="', $name, '" maxlength="7" placeholder="', esc_attr__( 'Hex Value', 'visualizer' ), '" value="', is_null( $value ) ? $default : esc_attr( $value ), '" data-default-color="', $default, '">';
 			echo '</div>';
 		echo '</div>';
 	}
diff --git a/css/frame.css b/css/frame.css
@@ -370,6 +370,9 @@ div.viz-group-content .viz-group-description {
 	padding: 0;
 }
 
+#viz-tabs .wp-color-picker {
+  width: 4rem !important;
+}
 /******************************************************************************/
 /********************************  TOOLBAR  ***********************************/
 /******************************************************************************/
diff --git a/css/library.css b/css/library.css
@@ -299,6 +299,9 @@ input:checked + .visualizer-slider:before {
 	padding-bottom: 5px;
 	font-weight: bold;
 	text-align: center;
+	text-overflow: ellipsis;
+	white-space: nowrap;
+	overflow: hidden;
 }
 
 div.visualizer-library-form .viz-filter {
diff --git a/cypress/integration/gutenberg-datatable/free-gutenberg-datatable.js b/cypress/integration/gutenberg-datatable/free-gutenberg-datatable.js
@@ -27,7 +27,7 @@ describe('Test Free - gutenberg (datatable)', function() {
         cy.wrap(charts).each((value, i, array) => {
             // insert a visualizer block
             cy.get('div.edit-post-header__toolbar button.edit-post-header-toolbar__inserter-toggle').click();
-            cy.get('.edit-post-layout__inserter-panel-content').then(function ($popup) {
+            cy.get('.edit-post-editor__inserter-panel-content').then(function ($popup) {
                 cy.wrap($popup).find('.block-editor-inserter__search-input').type('visua');
                 cy.wrap($popup).find('.block-editor-block-types-list .editor-block-list-item-visualizer-chart').should('have.length', 1);
                 cy.wrap($popup).find('.block-editor-block-types-list .editor-block-list-item-visualizer-chart').click();
diff --git a/cypress/integration/gutenberg/free-gutenberg.js b/cypress/integration/gutenberg/free-gutenberg.js
@@ -27,7 +27,7 @@ describe('Test Free - gutenberg', function() {
         cy.wrap(charts).each((value, i, array) => {
             // insert a visualizer block
             cy.get('div.edit-post-header__toolbar button.edit-post-header-toolbar__inserter-toggle').click();
-            cy.get('.edit-post-layout__inserter-panel-content').then(function ($popup) {
+            cy.get('.edit-post-editor__inserter-panel-content').then(function ($popup) {
                 cy.wrap($popup).find('.block-editor-inserter__search-input').type('visua');
                 cy.wrap($popup).find('.block-editor-block-types-list .editor-block-list-item-visualizer-chart').should('have.length', 1);
                 cy.wrap($popup).find('.block-editor-block-types-list .editor-block-list-item-visualizer-chart').click();
diff --git a/js/library.js b/js/library.js
@@ -42,6 +42,7 @@
                 margin = width * 0.02;
 
             width *= 0.305;
+            $(this).prev( '.visualizer-chart-title' ).width(width - 14);
             $(this).width(width - 14).height(width * 0.75).parent().css('margin-right', margin + 'px').css('margin-bottom', margin + 'px');
         });
     };

Original file line number	Diff line number	Diff line change
`@@ -309,7 +309,7 @@ protected static function _renderColorPickerItem( $title, $name, $value, $defaul`
`309`	`309`	`echo '<div class="viz-section-item">';`
`310`	`310`	`echo '<b>', $title, '</b>';`
`311`	`311`	`echo '<div>';`
`312`		`- echo '<input type="text" class="color-picker-hex color-picker" data-alpha="true" name="', $name, '" maxlength="7" placeholder="', esc_attr__( 'Hex Value', 'visualizer' ), '" value="', is_null( $value ) ? $default : esc_attr( $value ), '" data-default-color="', $default, '">';`
	`312`	`+ echo '<input type="text" class="color-picker-hex color-picker" data-alpha-enabled="true" name="', $name, '" maxlength="7" placeholder="', esc_attr__( 'Hex Value', 'visualizer' ), '" value="', is_null( $value ) ? $default : esc_attr( $value ), '" data-default-color="', $default, '">';`
`313`	`313`	`echo '</div>';`
`314`	`314`	`echo '</div>';`
`315`	`315`	`}`
Original file line number	Diff line number	Diff line change
`@@ -370,6 +370,9 @@ div.viz-group-content .viz-group-description {`
`370`	`370`	`padding: 0;`
`371`	`371`	`}`
`372`	`372`
	`373`	`+#viz-tabs .wp-color-picker {`
	`374`	`+ width: 4rem !important;`
	`375`	`+}`
`373`	`376`	`/******************************************************************************/`
`374`	`377`	`/****************************** TOOLBAR *********************************/`
`375`	`378`	`/******************************************************************************/`
Original file line number	Diff line number	Diff line change
`@@ -299,6 +299,9 @@ input:checked + .visualizer-slider:before {`
`299`	`299`	`padding-bottom: 5px;`
`300`	`300`	`font-weight: bold;`
`301`	`301`	`text-align: center;`
	`302`	`+ text-overflow: ellipsis;`
	`303`	`+ white-space: nowrap;`
	`304`	`+ overflow: hidden;`
`302`	`305`	`}`
`303`	`306`
`304`	`307`	`div.visualizer-library-form .viz-filter {`