| 1 |
// External Dependencies |
| 2 |
import $ from 'jquery'; |
| 3 |
import React, { Component } from 'react'; |
| 4 |
class QuadMenu extends Component { |
| 5 |
|
| 6 |
static slug = 'et_pb_quadmenu'; |
| 7 |
constructor(props) { |
| 8 |
super(props); |
| 9 |
this.state = { |
| 10 |
error: false |
| 11 |
} |
| 12 |
} |
| 13 |
|
| 14 |
changeTheme(oldTheme) { |
| 15 |
this.$el = $(this.el); |
| 16 |
this.$el.find('nav#quadmenu').removeClass('quadmenu-' + oldTheme).addClass('quadmenu-' + this.props.menu_theme); |
| 17 |
} |
| 18 |
|
| 19 |
createQuadMenu() { |
| 20 |
|
| 21 |
this.$el = $(this.el); |
| 22 |
|
| 23 |
var body = new FormData(); |
| 24 |
body.append('action', 'ajax_quadmenu_divi_module'); |
| 25 |
body.append('post_id', window.ETBuilderBackend.postId); |
| 26 |
body.append('menu_id', this.props.menu_id); |
| 27 |
body.append('menu_theme', this.props.menu_theme); |
| 28 |
|
| 29 |
fetch(window.et_fb_options.ajaxurl, {body: body, method: 'POST'}) |
| 30 |
.then(res => res.json()) |
| 31 |
.then((response) => { |
| 32 |
if (response.success) { |
| 33 |
this.$el.html($(response.data).quadmenu()); |
| 34 |
} else { |
| 35 |
this.setState({ |
| 36 |
error: response.data |
| 37 |
}); |
| 38 |
} |
| 39 |
}, (error) => { |
| 40 |
this.setState({ |
| 41 |
error: error |
| 42 |
}); |
| 43 |
}); |
| 44 |
} |
| 45 |
|
| 46 |
componentDidMount() { |
| 47 |
this.createQuadMenu(this.props.menu_id); |
| 48 |
} |
| 49 |
|
| 50 |
componentDidUpdate(prevProps) { |
| 51 |
if (prevProps.menu_id !== this.props.menu_id) { |
| 52 |
this.createQuadMenu(this.props.menu_id); |
| 53 |
} else if (prevProps.menu_theme !== this.props.menu_theme) { |
| 54 |
this.changeTheme(prevProps.menu_theme); |
| 55 |
} |
| 56 |
} |
| 57 |
|
| 58 |
render() { |
| 59 |
|
| 60 |
if (this.state.error) { |
| 61 |
return (<div>{this.state.error}</div>); |
| 62 |
} |
| 63 |
|
| 64 |
return (<div className="et_pb_row et_pb_fullwidth_menu clearfix" ref={(el) => { |
| 65 |
this.el = el |
| 66 |
}}></div>); |
| 67 |
|
| 68 |
} |
| 69 |
|
| 70 |
} |
| 71 |
|
| 72 |
export default QuadMenu; |
