202 lines
4.7 KiB
PHP
202 lines
4.7 KiB
PHP
<?php
|
|
use Elementor\Widget_Base;
|
|
use Elementor\Controls_Manager;
|
|
|
|
if ( ! defined( 'ABSPATH' ) ) {
|
|
exit;
|
|
}
|
|
|
|
class Elementor_3d_Element extends Widget_Base {
|
|
public function get_name() {
|
|
return '3d_element';
|
|
}
|
|
|
|
public function get_title() {
|
|
return esc_html__( '3D Element', 'elementor-addon' );
|
|
}
|
|
|
|
public function get_icon() {
|
|
return 'eicon-3d-cube';
|
|
}
|
|
|
|
public function get_categories() {
|
|
return [ 'hashtalk' ];
|
|
}
|
|
|
|
public function get_keywords() {
|
|
return [ '3d', 'three', 'gltf', 'logo', 'hashtalk' ];
|
|
}
|
|
|
|
public function get_style_depends() {
|
|
return [ 'elementor-addon-main-css' ];
|
|
}
|
|
|
|
public function get_script_depends() {
|
|
return [ 'three-js', 'three-gltfloader', 'elementor-addon-main-js' ];
|
|
}
|
|
|
|
protected function register_controls() {
|
|
$this->start_controls_section(
|
|
'section_content',
|
|
[
|
|
'label' => esc_html__( '3D Model', 'elementor-addon' ),
|
|
]
|
|
);
|
|
|
|
$this->add_control(
|
|
'model_url',
|
|
[
|
|
'label' => esc_html__( 'Model URL', 'elementor-addon' ),
|
|
'type' => Controls_Manager::TEXT,
|
|
'label_block' => true,
|
|
'default' => ELEMENTOR_ADDON_URL . 'assets/models/Logo_Hashtalk_Model.gltf',
|
|
'placeholder' => 'https://example.com/model.gltf',
|
|
]
|
|
);
|
|
|
|
$this->add_responsive_control(
|
|
'height',
|
|
[
|
|
'label' => esc_html__( 'Height', 'elementor-addon' ),
|
|
'type' => Controls_Manager::SLIDER,
|
|
'size_units' => [ 'px', 'vh' ],
|
|
'range' => [
|
|
'px' => [
|
|
'min' => 160,
|
|
'max' => 900,
|
|
],
|
|
'vh' => [
|
|
'min' => 20,
|
|
'max' => 100,
|
|
],
|
|
],
|
|
'default' => [
|
|
'size' => 520,
|
|
'unit' => 'px',
|
|
],
|
|
'selectors' => [
|
|
'{{WRAPPER}} .hashtalk-3d-element' => 'height: {{SIZE}}{{UNIT}};',
|
|
],
|
|
]
|
|
);
|
|
|
|
$this->add_control(
|
|
'auto_rotate_speed',
|
|
[
|
|
'label' => esc_html__( 'Auto Rotate Speed', 'elementor-addon' ),
|
|
'type' => Controls_Manager::NUMBER,
|
|
'min' => 0,
|
|
'max' => 0.08,
|
|
'step' => 0.001,
|
|
'default' => 0.008,
|
|
]
|
|
);
|
|
|
|
$this->add_control(
|
|
'cursor_strength',
|
|
[
|
|
'label' => esc_html__( 'Cursor Tracking Strength', 'elementor-addon' ),
|
|
'type' => Controls_Manager::NUMBER,
|
|
'min' => 0,
|
|
'max' => 1.5,
|
|
'step' => 0.05,
|
|
'default' => 0.45,
|
|
]
|
|
);
|
|
|
|
$this->add_control(
|
|
'floating_strength',
|
|
[
|
|
'label' => esc_html__( 'Floating Strength', 'elementor-addon' ),
|
|
'type' => Controls_Manager::NUMBER,
|
|
'min' => 0,
|
|
'max' => 0.5,
|
|
'step' => 0.01,
|
|
'default' => 0.06,
|
|
]
|
|
);
|
|
|
|
$this->add_control(
|
|
'model_scale',
|
|
[
|
|
'label' => esc_html__( 'Model Scale', 'elementor-addon' ),
|
|
'type' => Controls_Manager::NUMBER,
|
|
'min' => 0.1,
|
|
'max' => 10,
|
|
'step' => 0.1,
|
|
'default' => 2.6,
|
|
]
|
|
);
|
|
|
|
$this->add_control(
|
|
'camera_z',
|
|
[
|
|
'label' => esc_html__( 'Camera Distance', 'elementor-addon' ),
|
|
'type' => Controls_Manager::NUMBER,
|
|
'min' => 1,
|
|
'max' => 20,
|
|
'step' => 0.1,
|
|
'default' => 5,
|
|
]
|
|
);
|
|
|
|
$this->end_controls_section();
|
|
}
|
|
|
|
protected function render() {
|
|
$settings = $this->get_settings_for_display();
|
|
|
|
$model_url = ! empty( $settings['model_url'] )
|
|
? $settings['model_url']
|
|
: $this->get_default_model_url();
|
|
|
|
$model_url = $this->normalize_model_url( $model_url );
|
|
|
|
$config = [
|
|
'modelUrl' => esc_url_raw( $model_url ),
|
|
'autoRotateSpeed' => isset( $settings['auto_rotate_speed'] ) ? (float) $settings['auto_rotate_speed'] : 0.008,
|
|
'cursorStrength' => isset( $settings['cursor_strength'] ) ? (float) $settings['cursor_strength'] : 0.45,
|
|
'floatingStrength' => isset( $settings['floating_strength'] ) ? (float) $settings['floating_strength'] : 0.06,
|
|
'modelScale' => isset( $settings['model_scale'] ) ? (float) $settings['model_scale'] : 2.6,
|
|
'cameraZ' => isset( $settings['camera_z'] ) ? (float) $settings['camera_z'] : 5,
|
|
];
|
|
?>
|
|
<div
|
|
class="hashtalk-3d-element"
|
|
data-hashtalk-3d="<?php echo esc_attr( wp_json_encode( $config ) ); ?>"
|
|
></div>
|
|
<?php
|
|
}
|
|
|
|
private function get_default_model_url() {
|
|
return ELEMENTOR_ADDON_URL . 'assets/models/Logo_Hashtalk_Model.gltf';
|
|
}
|
|
|
|
private function normalize_model_url( $url ) {
|
|
$url = trim( (string) $url );
|
|
|
|
if ( '' === $url ) {
|
|
return $this->get_default_model_url();
|
|
}
|
|
|
|
// Fix: http://wp-content/plugins/...
|
|
$url = preg_replace( '#^https?://wp-content/#i', '/wp-content/', $url );
|
|
|
|
// Fix: wp-content/plugins/...
|
|
if ( 0 === strpos( $url, 'wp-content/' ) ) {
|
|
$url = '/' . $url;
|
|
}
|
|
|
|
// Fix: /wp-content/plugins/...
|
|
if ( 0 === strpos( $url, '/wp-content/' ) ) {
|
|
$url = home_url( $url );
|
|
}
|
|
|
|
if ( is_ssl() ) {
|
|
$url = set_url_scheme( $url, 'https' );
|
|
}
|
|
|
|
return $url;
|
|
}
|
|
}
|