154 lines
4.6 KiB
JavaScript
154 lines
4.6 KiB
JavaScript
/* global fusionBuilderText, FusionPageBuilderApp, fusionAllElements, FusionApp, FusionEvents */
|
|
/* eslint no-shadow: 0 */
|
|
var FusionPageBuilder = FusionPageBuilder || {};
|
|
|
|
( function( $ ) {
|
|
|
|
$( document ).ready( function() {
|
|
|
|
FusionPageBuilder.ModuleSettingsChartView = FusionPageBuilder.ElementSettingsView.extend( {
|
|
|
|
events: function() {
|
|
return _.extend( {}, FusionPageBuilder.ElementSettingsView.prototype.events, {
|
|
'click .fusion-chart-edit-table': 'editTable'
|
|
} );
|
|
},
|
|
|
|
editTable: function( event ) {
|
|
var viewSettings = {
|
|
model: this.model,
|
|
collection: this.collection,
|
|
attributes: {
|
|
settingsView: this
|
|
}
|
|
},
|
|
modalView,
|
|
dialogTitle = 'Edit Chart Data Table';
|
|
|
|
event.preventDefault();
|
|
|
|
modalView = new FusionPageBuilder.ModuleSettingsChartTableView( viewSettings );
|
|
|
|
jQuery( modalView.render().el ).dialog( {
|
|
title: dialogTitle,
|
|
width: FusionApp.dialog.dialogData.width,
|
|
height: FusionApp.dialog.dialogData.height,
|
|
position: FusionApp.dialog.dialogData.position,
|
|
dialogClass: 'fusion-builder-dialog fusion-builder-settings-dialog',
|
|
minWidth: 360,
|
|
|
|
open: function( event ) {
|
|
var $dialogContent = jQuery( event.target ),
|
|
$parentDialog = jQuery( $dialogContent ).closest( '.ui-dialog' ),
|
|
dialogContentWidth = $dialogContent.find( '.fusion-builder-table' ).width() + 90;
|
|
|
|
if ( dialogContentWidth > jQuery( window ).width() ) {
|
|
dialogContentWidth = jQuery( window ).width() - 50;
|
|
}
|
|
|
|
$parentDialog.width( dialogContentWidth + 'px' );
|
|
$parentDialog.css( 'left', ( jQuery( window ).width() - dialogContentWidth ) / 2 );
|
|
|
|
// On start can sometimes be laggy/late.
|
|
FusionApp.dialog.addResizingHoverEvent();
|
|
|
|
$dialogContent.find( '.fusion-builder-section-name' ).blur();
|
|
|
|
FusionPageBuilderApp.$el.addClass( 'fusion-builder-no-ui' );
|
|
|
|
jQuery( '.ui-dialog' ).not( $dialogContent.closest( '.ui-dialog' ) ).hide();
|
|
},
|
|
|
|
dragStart: function( event ) {
|
|
|
|
// Used to close any open drop-downs in TinyMce.
|
|
jQuery( event.target ).trigger( 'click' );
|
|
},
|
|
|
|
beforeClose: function() {
|
|
FusionEvents.trigger( 'fusion-content-changed' );
|
|
FusionPageBuilderApp.$el.removeClass( 'fusion-builder-no-ui' );
|
|
jQuery( '.ui-dialog:not( .fusion-video-dialog )' ).first().show();
|
|
modalView.saveSettings();
|
|
},
|
|
|
|
resizeStart: function() {
|
|
FusionApp.dialog.addResizingClasses();
|
|
},
|
|
|
|
resizeStop: function() {
|
|
FusionApp.dialog.removeResizingClasses();
|
|
}
|
|
|
|
} );
|
|
|
|
},
|
|
|
|
template: FusionPageBuilder.template( $( '#fusion-builder-block-module-settings-chart-template' ).html() ),
|
|
|
|
filterAttributes: function( attributes ) {
|
|
attributes.frontOptions = [
|
|
fusionAllElements[ attributes.element_type ].params.chart_type,
|
|
fusionAllElements[ attributes.element_type ].params.title
|
|
];
|
|
|
|
attributes.chartOptions = {
|
|
chart_bg_color: {
|
|
heading: fusionBuilderText.chart_bg_color_title,
|
|
description: fusionBuilderText.chart_bg_color_desc,
|
|
param_name: 'chart_bg_color',
|
|
type: 'colorpickeralpha',
|
|
default: FusionApp.settings.chart_bg_color
|
|
},
|
|
chart_padding: {
|
|
heading: fusionBuilderText.chart_padding_title,
|
|
description: fusionBuilderText.chart_padding_desc,
|
|
param_name: 'chart_padding',
|
|
type: 'dimension',
|
|
value: {
|
|
padding_top: '',
|
|
padding_right: '',
|
|
padding_bottom: '',
|
|
padding_left: ''
|
|
}
|
|
},
|
|
chart_border_size: {
|
|
heading: fusionBuilderText.chart_border_size_heading,
|
|
description: fusionBuilderText.chart_border_size_desc,
|
|
param_name: 'chart_border_size',
|
|
type: 'range',
|
|
min: 0,
|
|
max: 50,
|
|
step: 1,
|
|
value: 0
|
|
},
|
|
chart_axis_text_color: {
|
|
heading: fusionBuilderText.chart_axis_text_color_title,
|
|
description: fusionBuilderText.chart_axis_text_color_desc,
|
|
param_name: 'chart_axis_text_color',
|
|
type: 'colorpickeralpha',
|
|
default: FusionApp.settings.chart_axis_text_color
|
|
},
|
|
chart_gridline_color: {
|
|
heading: fusionBuilderText.chart_gridline_color_title,
|
|
description: fusionBuilderText.chart_gridline_color_desc,
|
|
param_name: 'chart_gridline_color',
|
|
type: 'colorpickeralpha',
|
|
default: FusionApp.settings.chart_gridline_color
|
|
}
|
|
};
|
|
|
|
attributes.chartOptions = jQuery.extend( true, attributes.chartOptions, fusionAllElements[ attributes.element_type ].params );
|
|
|
|
delete attributes.chartOptions.chart_type;
|
|
delete attributes.chartOptions.title;
|
|
|
|
return attributes;
|
|
}
|
|
|
|
} );
|
|
|
|
} );
|
|
|
|
}( jQuery ) );
|