WIP format columns

Author: contactashish13

classes/Visualizer/Render/Sidebar/Type/DataTable.php

@@ -115,7 +115,7 @@ protected function _toHTML() {
 		$this->_supportsAnimation = false;
 		$this->_renderGeneralSettings();
 		$this->_renderTableSettings();
-		$this->_renderSeriesSettings();
+		// $this->_renderColumnSettings();
 		$this->_renderAdvancedSettings();
 	}
 
@@ -350,17 +350,6 @@ protected function _renderTableSettings() {
 		self::_renderGroupEnd();
 	}
 
-	/**
-	 * Renders concreate series settings.
-	 *
-	 * @since 1.4.0
-	 *
-	 * @access protected
-	 * @param int $index The series index.
-	 */
-	protected function _renderSeries( $index ) {
-		$this->_renderFormatField( $index );
-	}
 
 	/**
 	 * Renders combo series settings
@@ -369,8 +358,16 @@ protected function _renderSeries( $index ) {
 	 *
 	 * @access protected
 	 */
-	protected function _renderSeriesSettings() {
-
+	protected function _renderColumnSettings() {
+		self::_renderGroupStart( esc_html__( 'Column Settings', 'visualizer' ) );
+		for ( $i = 0, $cnt = count( $this->__series ) - 1; $i < $cnt; $i++ ) {
+			if ( ! empty( $this->__series[ $i ]['label'] ) ) {
+				self::_renderSectionStart( esc_html( $this->__series[ $i ]['label'] ), false );
+					$this->_renderFormatField( $i );
+				self::_renderSectionEnd();
+			}
+		}
+		self::_renderGroupEnd();
 	}
 
 }

js/render-datatables.js

@@ -9,7 +9,7 @@
     }
 
     function renderSpecificChart(id, chart, v) {
-        var render, container, series, data, table, settings, i, j, row, date, axis, property, format, formatter;
+        var render, container, series, data, table, settings, i, j, row, date, axis, property, format, formatter, type, rows, cols;
 
         if(chart.library !== 'datatables'){
             return;
@@ -27,24 +27,6 @@
             $('#' + id).append($('<table class="dataTable table table-striped"></table>'));
         }
 
-        var cols = [];
-        for (j = 0; j < series.length; j++) {
-            var col = { title: series[j].label, data: series[j].label, type: series[j].type };
-            if(typeof chart.settings['cssClassNames'] !== 'undefined' && typeof chart.settings['cssClassNames']['tableCell'] !== 'undefined'){
-                col['className'] = chart.settings['cssClassNames']['tableCell'];
-            }
-            cols.push(col);
-        }
-
-        var rows = [];
-        for (i = 0; i < data.length; i++) {
-            row = [];
-            for (j = 0; j < series.length; j++) {
-                row[ series[j].label ] = data[i][j];
-            }
-            rows.push(row);
-        }
-
         settings = {
             destroy: true,
             paging: false,
@@ -125,6 +107,39 @@
 
         $.extend( $.fn.dataTable.defaults, settings );
 
+        cols = [];
+        for (j = 0; j < series.length; j++) {
+            type = series[j].type;
+            switch(type){
+                case 'number':
+                    type = 'num';
+                    break;
+                case 'date':
+                case 'datetime':
+                case 'timeofday':
+                    type = 'date';
+                    break;
+            }
+            var col = { title: series[j].label, data: series[j].label, type: type };
+            if(typeof chart.settings['cssClassNames'] !== 'undefined' && typeof chart.settings['cssClassNames']['tableCell'] !== 'undefined'){
+                col['className'] = chart.settings['cssClassNames']['tableCell'];
+            }
+            cols.push(col);
+        }
+
+        rows = [];
+        for (i = 0; i < data.length; i++) {
+            row = [];
+            for (j = 0; j < series.length; j++) {
+                var datum = data[i][j];
+                if(typeof settings.series[j] !== 'undefined' && typeof settings.series[j].format !== 'undefined'){
+                    datum = formatData(data[i][j], settings.series[j].type, settings.series[j].format);
+                }
+                row[ series[j].label ] = datum;
+            }
+            rows.push(row);
+        }
+
         // allow user to extend the settings.
         $('body').trigger('visualizer:chart:settings:extend', {id: id, chart: chart, settings: settings});
 
@@ -137,6 +152,18 @@
         $('.loader').remove();
     }
 
+    function formatData(datum, type, format){
+        switch(type){
+            case 'number':
+                break;
+            case 'date':
+            case 'datetime':
+            case 'timeofday':
+                break;
+        }
+        return datum;
+    }
+
     function render(v) {
         for (var id in (all_charts || {})) {
             renderChart(id, v);