plugin updates
This commit is contained in:
Tony Volpe
@@ -0,0 +1,148 @@
|
||||
// External Dependencies
|
||||
import React, {Component} from 'react';
|
||||
import $ from 'jquery';
|
||||
// Internal Dependencies
|
||||
import './style.css';
|
||||
|
||||
class WpmfPdfEmbedDivi extends Component {
|
||||
|
||||
static slug = 'wpmf_pdf_embed';
|
||||
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
html: '',
|
||||
loading: true,
|
||||
embed: true
|
||||
};
|
||||
this.wrap = React.createRef();
|
||||
}
|
||||
|
||||
componentWillMount() {
|
||||
if (typeof this.props.url !== "undefined") {
|
||||
this.loadHtml(this.props);
|
||||
}
|
||||
}
|
||||
|
||||
componentWillReceiveProps(nextProps) {
|
||||
if (this.props.url !== nextProps.url || this.props.embed !== nextProps.embed || this.props.target !== nextProps.target) {
|
||||
this.loadHtml(nextProps);
|
||||
}
|
||||
}
|
||||
|
||||
loadHtml(props) {
|
||||
if (!this.state.loading) {
|
||||
this.setState({
|
||||
loading: true
|
||||
});
|
||||
}
|
||||
let width = '';
|
||||
let height = '';
|
||||
if (typeof props.width !== "undefined") {
|
||||
width = props.width;
|
||||
} else {
|
||||
if (typeof props.max_width !== "undefined") {
|
||||
width = props.max_width;
|
||||
}
|
||||
}
|
||||
|
||||
if (typeof props.height !== "undefined") {
|
||||
height = props.height;
|
||||
} else {
|
||||
if (typeof props.max_height !== "undefined") {
|
||||
height = props.max_height;
|
||||
}
|
||||
}
|
||||
fetch(window.et_fb_options.ajaxurl + `?action=wpmf_divi_load_pdf_embed_html&url=${props.url}&embed=${props.embed}&target=${props.target}&width=${width}&height=${height}&et_admin_load_nonce=${window.et_fb_options.et_admin_load_nonce}`)
|
||||
.then(res => res.json())
|
||||
.then(
|
||||
(result) => {
|
||||
this.setState({
|
||||
html: result.html,
|
||||
loading: false,
|
||||
embed: false
|
||||
});
|
||||
},
|
||||
// errors
|
||||
(error) => {
|
||||
this.setState({
|
||||
html: '',
|
||||
loading: true
|
||||
});
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
componentDidUpdate(prevProps, prevState) {
|
||||
if (this.props.embed === 'on' && !this.state.embed) {
|
||||
this.setState({
|
||||
embed: true
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
render() {
|
||||
const loadingIcon = (
|
||||
<svg className={'wpfd-loading'} width="100%" height="100%" xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 100 100" preserveAspectRatio="xMidYMid">
|
||||
<g transform="translate(25 50)">
|
||||
<circle cx="0" cy="0" r="10" fill="#cfcfcf" transform="scale(0.590851 0.590851)">
|
||||
<animateTransform attributeName="transform" type="scale" begin="-0.8666666666666667s"
|
||||
calcMode="spline"
|
||||
keySplines="0.3 0 0.7 1;0.3 0 0.7 1" values="0.5;1;0.5" keyTimes="0;0.5;1"
|
||||
dur="2.6s"
|
||||
repeatCount="indefinite"/>
|
||||
</circle>
|
||||
</g>
|
||||
<g transform="translate(50 50)">
|
||||
<circle cx="0" cy="0" r="10" fill="#cfcfcf" transform="scale(0.145187 0.145187)">
|
||||
<animateTransform attributeName="transform" type="scale" begin="-0.43333333333333335s"
|
||||
calcMode="spline"
|
||||
keySplines="0.3 0 0.7 1;0.3 0 0.7 1" values="0.5;1;0.5" keyTimes="0;0.5;1"
|
||||
dur="2.6s"
|
||||
repeatCount="indefinite"/>
|
||||
</circle>
|
||||
</g>
|
||||
<g transform="translate(75 50)">
|
||||
<circle cx="0" cy="0" r="10" fill="#cfcfcf" transform="scale(0.0339143 0.0339143)">
|
||||
<animateTransform attributeName="transform" type="scale" begin="0s" calcMode="spline"
|
||||
keySplines="0.3 0 0.7 1;0.3 0 0.7 1" values="0.5;1;0.5" keyTimes="0;0.5;1"
|
||||
dur="2.6s"
|
||||
repeatCount="indefinite"/>
|
||||
</circle>
|
||||
</g>
|
||||
</svg>
|
||||
);
|
||||
|
||||
if (typeof this.props.url === "undefined") {
|
||||
return (
|
||||
<div className="wpmf-divi-container">
|
||||
<div id="divi-pdf-embed-placeholder" className="divi-pdf-embed-placeholder">
|
||||
<span className="wpmf-divi-message">
|
||||
{'Please select a PDF file to activate the preview'}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
if (this.state.loading) {
|
||||
return (
|
||||
<div className="wpmf-divi-container">
|
||||
<div className={'wpmf-loading-wrapper'}>
|
||||
<i className={'wpmf-loading'}>{loadingIcon}</i>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
if (!this.state.loading) {
|
||||
return (
|
||||
<div className="wpmf-pdf-embed-wrap" ref={this.wrap}
|
||||
dangerouslySetInnerHTML={{__html: this.state.html}}/>
|
||||
);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export default WpmfPdfEmbedDivi;
|
||||
@@ -0,0 +1,134 @@
|
||||
<?php
|
||||
/* Prohibit direct script loading */
|
||||
defined('ABSPATH') || die('No direct script access allowed!');
|
||||
|
||||
/**
|
||||
* Class WpmfPdfEmbedDivi
|
||||
*/
|
||||
class WpmfPdfEmbedDivi extends ET_Builder_Module
|
||||
{
|
||||
|
||||
/**
|
||||
* Module slug
|
||||
*
|
||||
* @var string
|
||||
*/
|
||||
public $slug = 'wpmf_pdf_embed';
|
||||
|
||||
/**
|
||||
* Whether module support visual builder. e.g `on` or `off`.
|
||||
*
|
||||
* @var string
|
||||
*/
|
||||
public $vb_support = 'on';
|
||||
|
||||
/**
|
||||
* Credits of all custom modules.
|
||||
*
|
||||
* @var array
|
||||
*/
|
||||
protected $module_credits = array(
|
||||
'module_uri' => 'https://www.joomunited.com/',
|
||||
'author' => 'Joomunited',
|
||||
'author_uri' => 'https://www.joomunited.com/',
|
||||
);
|
||||
|
||||
/**
|
||||
* Init
|
||||
*
|
||||
* @return void
|
||||
*/
|
||||
public function init()
|
||||
{
|
||||
$this->name = esc_html__('WPMF PDF Embed', 'wpmf');
|
||||
}
|
||||
|
||||
/**
|
||||
* Advanced Fields Config
|
||||
*
|
||||
* @return array
|
||||
*/
|
||||
public function get_advanced_fields_config() // phpcs:ignore PSR1.Methods.CamelCapsMethodName.NotCamelCaps -- Method extends from ET_Builder_Module class
|
||||
{
|
||||
return array(
|
||||
'button' => false,
|
||||
'link_options' => false
|
||||
);
|
||||
}
|
||||
|
||||
/**
|
||||
* Get the settings fields data for this element.
|
||||
*
|
||||
* @return array
|
||||
*/
|
||||
public function get_fields() // phpcs:ignore PSR1.Methods.CamelCapsMethodName.NotCamelCaps -- Method extends from ET_Builder_Module class
|
||||
{
|
||||
return array(
|
||||
'url' => array(
|
||||
'type' => 'upload',
|
||||
'data_type' => 'application/pdf',
|
||||
'option_category' => 'configuration',
|
||||
'upload_button_text' => esc_attr__('Select an PDF', 'wpmf'),
|
||||
'choose_text' => esc_attr__('Choose an PDF', 'wpmf'),
|
||||
'update_text' => esc_attr__('Set As PDF', 'wpmf'),
|
||||
'hide_metadata' => true,
|
||||
'affects' => array(
|
||||
'alt',
|
||||
'title_text',
|
||||
),
|
||||
'description' => esc_html__('Upload your desired PDF, or type in the URL to the image you would like to display.', 'wpmf'),
|
||||
),
|
||||
'embed' => array(
|
||||
'label' => esc_html__('Embed', 'wpmf'),
|
||||
'type' => 'yes_no_button',
|
||||
'option_category' => 'configuration',
|
||||
'options' => array(
|
||||
'on' => esc_html__('On', 'wpmf'),
|
||||
'off' => esc_html__('Off', 'wpmf'),
|
||||
),
|
||||
'default' => 'on',
|
||||
'default_on_front' => 'on'
|
||||
),
|
||||
'target' => array(
|
||||
'label' => esc_html__('Target', 'wpmf'),
|
||||
'type' => 'select',
|
||||
'option_category' => 'configuration',
|
||||
'options' => array(
|
||||
'_blank' => esc_html__('New Window', 'wpmf'),
|
||||
'self' => esc_html__('Same Window', 'wpmf'),
|
||||
),
|
||||
'default_on_front' => 'self',
|
||||
'depends_show_if' => 'on'
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
/**
|
||||
* Render content
|
||||
*
|
||||
* @param array $attrs List of attributes.
|
||||
* @param string $content Content being processed.
|
||||
* @param string $render_slug Slug of module that is used for rendering output.
|
||||
*
|
||||
* @return string
|
||||
*/
|
||||
public function render($attrs, $content, $render_slug) // phpcs:ignore PEAR.Functions.ValidDefaultValue.NotAtEnd -- Method extends from ET_Builder_Module class
|
||||
{
|
||||
if (empty($this->props['url'])) {
|
||||
$html = '<div class="wpmf-divi-container">
|
||||
<div id="divi-pdf-embed-placeholder" class="divi-pdf-embed-placeholder">
|
||||
<span class="wpmf-divi-message">
|
||||
' . esc_html__('Please select a PDF file to activate the preview', 'wpmf') . '
|
||||
</span>
|
||||
</div>
|
||||
</div>';
|
||||
return $html;
|
||||
}
|
||||
$url = str_replace(array('-pdf.jpg', '-pdf.jpeg', '-pdf.png'), '.pdf', $this->props['url']);
|
||||
$width = (!empty($this->props['width']) && $this->props['width'] !== 'auto') ? $this->props['width'] : '100%';
|
||||
$height = (!empty($this->props['height']) && $this->props['height'] !== 'auto') ? $this->props['height'] : '800';
|
||||
return do_shortcode('[wpmfpdf url="' . esc_url($url) . '" width="'. $width .'" height="'. $height .'" embed="' . esc_attr($this->props['embed']) . '" target="' . esc_attr($this->props['target']) . '"]');
|
||||
}
|
||||
}
|
||||
|
||||
new WpmfPdfEmbedDivi;
|
||||
Reference in New Issue
Block a user