blsmedia/bot
2
0
Fork 0
Code Activity

feat(wp): 🎨 Deploy v2.1.0

Browse Source
This commit is contained in:
Baptiste Arnaud
2022-03-14 15:13:45 +01:00
parent 69701d12b9
commit 8f07df8a05
6 changed files with 113 additions and 93 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
packages/wordpress/package.json
View File

@@ -1,6 +1,6 @@
{ {
"name": "wordpress", "name": "wordpress",
"version": "2.0.0", "version": "2.1.0",
"main": "index.js", "main": "index.js",
"repository": "https://github.com/typebot-io/wordpress.git", "repository": "https://github.com/typebot-io/wordpress.git",
"author": "baptisteArno", "author": "baptisteArno",
@@ -10,7 +10,7 @@
}, },
"scripts": { "scripts": {
"deploy": "yarn copy && yarn commit", "deploy": "yarn copy && yarn commit",
"copy": "svn copy ./trunk ./tags/2.0.0", "copy": "svn copy ./trunk ./tags/2.1.0",
"commit": "svn ci -m 'Support Typebot 2.0'" "commit": "svn ci -m 'Switch to URL only'"
} }
} }

3
packages/wordpress/trunk/README.txt
View File

@@ -26,6 +26,9 @@ This plugin relies on Typebot which is a tool that allows you to create conversa
3. Activate your Typebot with the "Typebot" admin button located in the sidebar 3. Activate your Typebot with the "Typebot" admin button located in the sidebar
== Changelog == == Changelog ==
= 2.1.0 =
* Added auto open delay for bubble embed
= 2.0.0 = = 2.0.0 =
* Support for Typebot 2.0 * Support for Typebot 2.0

79
packages/wordpress/trunk/admin/class-typebot-admin.php
View File

@@ -1,5 +1,5 @@
<?php <?php
if (!defined("ABSPATH")) { if (!defined('ABSPATH')) {
exit(); exit();
} }
@@ -14,13 +14,13 @@ class Typebot_Admin
public function enqueue_styles($hook) public function enqueue_styles($hook)
{ {
if ($hook === "toplevel_page_typebot/settings") { if ($hook === 'toplevel_page_typebot/settings') {
wp_enqueue_style( wp_enqueue_style(
"bulma", 'bulma',
plugin_dir_url(__FILE__) . "css/bulma.min.css", plugin_dir_url(__FILE__) . 'css/bulma.min.css',
[], [],
$this->version, $this->version,
"all" 'all'
); );
} }
} }
@@ -28,61 +28,64 @@ class Typebot_Admin
public function my_admin_menu() public function my_admin_menu()
{ {
add_menu_page( add_menu_page(
"Typebot Settings", 'Typebot Settings',
"Typebot", 'Typebot',
"manage_options", 'manage_options',
"typebot/settings.php", 'typebot/settings.php',
[$this, "typebot_settings_callback"], [$this, 'typebot_settings_callback'],
"dashicons-format-chat", 'dashicons-format-chat',
250 250
); );
} }
public function typebot_settings_callback() public function typebot_settings_callback()
{ {
require_once "partials/typebot-admin-display.php"; require_once 'partials/typebot-admin-display.php';
} }
public function register_typebot_settings() public function register_typebot_settings()
{ {
register_setting("typebot", "publish_id", [ register_setting('typebot', 'url', [
"sanitize_callback" => "sanitize_text_field", 'sanitize_callback' => 'sanitize_text_field',
]); ]);
register_setting("typebot", "embed_type", [ register_setting('typebot', 'embed_type', [
"sanitize_callback" => "sanitize_text_field", 'sanitize_callback' => 'sanitize_text_field',
]); ]);
register_setting("typebot", "popup_delay", [ register_setting('typebot', 'popup_delay', [
"sanitize_callback" => "sanitize_text_field", 'sanitize_callback' => 'sanitize_text_field',
]); ]);
register_setting("typebot", "bubble_delay", [ register_setting('typebot', 'bubble_delay', [
"sanitize_callback" => "sanitize_text_field", 'sanitize_callback' => 'sanitize_text_field',
]); ]);
register_setting("typebot", "avatar", [ register_setting('typebot', 'chat_delay', [
"sanitize_callback" => "sanitize_text_field", 'sanitize_callback' => 'sanitize_text_field',
]); ]);
register_setting("typebot", "text_content", [ register_setting('typebot', 'avatar', [
"sanitize_callback" => "sanitize_text_field", 'sanitize_callback' => 'sanitize_text_field',
]); ]);
register_setting("typebot", "button_color", [ register_setting('typebot', 'text_content', [
"sanitize_callback" => "sanitize_text_field", 'sanitize_callback' => 'sanitize_text_field',
]); ]);
register_setting("typebot", "chat_included_pages", [ register_setting('typebot', 'button_color', [
"sanitize_callback" => "sanitize_text_field", 'sanitize_callback' => 'sanitize_text_field',
]); ]);
register_setting("typebot", "popup_included_pages", [ register_setting('typebot', 'chat_included_pages', [
"sanitize_callback" => "sanitize_text_field", 'sanitize_callback' => 'sanitize_text_field',
]); ]);
register_setting("typebot", "chat_icon", [ register_setting('typebot', 'popup_included_pages', [
"sanitize_callback" => "sanitize_text_field", 'sanitize_callback' => 'sanitize_text_field',
]); ]);
register_setting("typebot", "custom_code", [ register_setting('typebot', 'chat_icon', [
"sanitize_callback" => "sanitize_text_field", 'sanitize_callback' => 'sanitize_text_field',
]); ]);
register_setting("typebot", "config_type", [ register_setting('typebot', 'custom_code', [
"sanitize_callback" => "sanitize_text_field", 'sanitize_callback' => 'sanitize_text_field',
]); ]);
register_setting("typebot", "dont_show_callout_twice", [ register_setting('typebot', 'config_type', [
"sanitize_callback" => "sanitize_text_field", 'sanitize_callback' => 'sanitize_text_field',
]);
register_setting('typebot', 'dont_show_callout_twice', [
'sanitize_callback' => 'sanitize_text_field',
]); ]);
} }
} }

74
packages/wordpress/trunk/admin/partials/typebot-admin-display.php
View File

@@ -43,30 +43,30 @@
<a style="text-decoration: underline" href="https://app.typebot.io/typebots" target="_blank">First, you need to create a Typebot with our builder. It's free.</a> <a style="text-decoration: underline" href="https://app.typebot.io/typebots" target="_blank">First, you need to create a Typebot with our builder. It's free.</a>
<form method="post" action="options.php" style="margin-top: 1rem"> <form method="post" action="options.php" style="margin-top: 1rem">
<?php <?php
settings_fields("typebot"); settings_fields('typebot');
do_settings_sections("typebot"); do_settings_sections('typebot');
?> ?>
<div style="display: flex; flex-direction: column;"> <div style="display: flex; flex-direction: column;">
<label> <label>
<input type="radio" name="config_type" onclick="handleClick(this);" value="easy" <?php if ( <input type="radio" name="config_type" onclick="handleClick(this);" value="easy" <?php if (
esc_attr(get_option("config_type")) == "easy" esc_attr(get_option('config_type')) == 'easy'
) { ) {
echo esc_attr("checked"); echo esc_attr('checked');
} ?>> } ?>>
Easy setup Easy setup
</label> </label>
<div id="easy-block" style="display: <?php if ( <div id="easy-block" style="display: <?php if (
esc_attr(get_option("config_type")) == "easy" esc_attr(get_option('config_type')) == 'easy'
) { ) {
echo esc_attr("block"); echo esc_attr('block');
} else { } else {
echo esc_attr("none"); echo esc_attr('none');
} ?>; margin-top:0.5rem"> } ?>; margin-top:0.5rem">
<div class="field"> <div class="field">
<label class="label">Publish ID or Full URL</label> <label class="label">Your typebot URL</label>
<div class="control"> <div class="control">
<input class="input" type="text" placeholder="Found in 'Share' page of your typebot" name="publish_id" value="<?php echo esc_attr( <input class="input" type="url" placeholder="Found in 'Share' page of your typebot" name="url" value="<?php echo esc_attr(
get_option("publish_id") get_option('url')
); ?>"> ); ?>">
</div> </div>
</div> </div>
@@ -91,9 +91,9 @@
</svg> </svg>
<p style="text-align: center; font-size: 20px; margin-bottom: .5rem">Container</p> <p style="text-align: center; font-size: 20px; margin-bottom: .5rem">Container</p>
<input type="radio" onclick="onRadioClick(event)" name="embed_type" id="radio-container" style="display:flex; margin:auto" <?php if ( <input type="radio" onclick="onRadioClick(event)" name="embed_type" id="radio-container" style="display:flex; margin:auto" <?php if (
esc_attr(get_option("embed_type")) === "container" esc_attr(get_option('embed_type')) === 'container'
) { ) {
echo esc_attr("checked"); echo esc_attr('checked');
} ?> value="container"> } ?> value="container">
</label> </label>
<label class="box is-flex-direction-column" style="margin-bottom: 0; margin-right: 1rem; padding: 3rem"> <label class="box is-flex-direction-column" style="margin-bottom: 0; margin-right: 1rem; padding: 3rem">
@@ -110,9 +110,9 @@
</svg> </svg>
<p style="text-align: center; font-size: 20px; margin-bottom: .5rem">Popup</p> <p style="text-align: center; font-size: 20px; margin-bottom: .5rem">Popup</p>
<input type="radio" onclick="onRadioClick(event)" name="embed_type" id="radio-popup" style="display:flex; margin:auto" <?php if ( <input type="radio" onclick="onRadioClick(event)" name="embed_type" id="radio-popup" style="display:flex; margin:auto" <?php if (
esc_attr(get_option("embed_type")) === "popup" esc_attr(get_option('embed_type')) === 'popup'
) { ) {
echo esc_attr("checked"); echo esc_attr('checked');
} ?> value="popup"> } ?> value="popup">
</label> </label>
<label class="box is-flex-direction-column" style="margin-bottom: 0; padding: 3rem"> <label class="box is-flex-direction-column" style="margin-bottom: 0; padding: 3rem">
@@ -122,9 +122,9 @@
</svg> </svg>
<p style="text-align: center; font-size: 20px; margin-bottom: .5rem">Bubble</p> <p style="text-align: center; font-size: 20px; margin-bottom: .5rem">Bubble</p>
<input type="radio" onclick="onRadioClick(event)" name="embed_type" id="radio-bubble" style="display:flex; margin:auto" <?php if ( <input type="radio" onclick="onRadioClick(event)" name="embed_type" id="radio-bubble" style="display:flex; margin:auto" <?php if (
esc_attr(get_option("embed_type")) === "bubble" esc_attr(get_option('embed_type')) === 'bubble'
) { ) {
echo esc_attr("checked"); echo esc_attr('checked');
} ?> value="bubble"> } ?> value="bubble">
</label> </label>
</div> </div>
@@ -134,7 +134,7 @@
<label class="label">Delay before apparition in seconds</label> <label class="label">Delay before apparition in seconds</label>
<div class="control" style="margin-bottom: 1rem;"> <div class="control" style="margin-bottom: 1rem;">
<input class="input" type="number" placeholder="0" name="popup_delay" value="<?php echo esc_attr( <input class="input" type="number" placeholder="0" name="popup_delay" value="<?php echo esc_attr(
get_option("popup_delay") get_option('popup_delay')
); ?>"> ); ?>">
</div> </div>
</div> </div>
@@ -142,7 +142,7 @@
<label class="label">Pages to include separated by a comma (optionnal)</label> <label class="label">Pages to include separated by a comma (optionnal)</label>
<div class="control" style="margin-bottom: 1rem;"> <div class="control" style="margin-bottom: 1rem;">
<input class="input" type="text" placeholder="/my-page/*,/my-other-page" name="popup_included_pages" value="<?php echo esc_attr( <input class="input" type="text" placeholder="/my-page/*,/my-other-page" name="popup_included_pages" value="<?php echo esc_attr(
get_option("popup_included_pages") get_option('popup_included_pages')
); ?>"> ); ?>">
</div> </div>
</div> </div>
@@ -155,7 +155,15 @@
<label class="label">Bubble button color</label> <label class="label">Bubble button color</label>
<div class="control"> <div class="control">
<input class="input" type="text" placeholder="#0042DA" name="button_color" value="<?php echo esc_attr( <input class="input" type="text" placeholder="#0042DA" name="button_color" value="<?php echo esc_attr(
get_option("button_color") get_option('button_color')
); ?>">
</div>
</div>
<div class="field">
<label class="label">Auto open delay (optional)</label>
<div class="control">
<input class="input" type="number" placeholder="Delay before the chat opens up (5)" name="chat_delay" value="<?php echo esc_attr(
get_option('chat_delay')
); ?>"> ); ?>">
</div> </div>
</div> </div>
@@ -163,7 +171,7 @@
<label class="label">Bubble button icon (optional)</label> <label class="label">Bubble button icon (optional)</label>
<div class="control"> <div class="control">
<input class="input" type="text" placeholder="Type an image URL..." name="chat_icon" value="<?php echo esc_attr( <input class="input" type="text" placeholder="Type an image URL..." name="chat_icon" value="<?php echo esc_attr(
get_option("chat_icon") get_option('chat_icon')
); ?>"> ); ?>">
</div> </div>
</div> </div>
@@ -171,24 +179,24 @@
<label class="label">Proactive message (optional)</label> <label class="label">Proactive message (optional)</label>
<div class="control"> <div class="control">
<input class="input" type="text" placeholder="Message (Hey, I have some questions for you 👋)" name="text_content" value="<?php echo esc_attr( <input class="input" type="text" placeholder="Message (Hey, I have some questions for you 👋)" name="text_content" value="<?php echo esc_attr(
get_option("text_content") get_option('text_content')
); ?>"> ); ?>">
</div> </div>
<div class="control" style="margin-top: .5rem"> <div class="control" style="margin-top: .5rem">
<input class="input" type="text" placeholder="Avatar photo URL (https://...)" name="avatar" value="<?php echo esc_attr( <input class="input" type="text" placeholder="Avatar photo URL (https://...)" name="avatar" value="<?php echo esc_attr(
get_option("avatar") get_option('avatar')
); ?>"> ); ?>">
</div> </div>
<div class="control" style="margin-top: .5rem; margin-bottom: 1rem"> <div class="control" style="margin-top: .5rem; margin-bottom: 1rem">
<input class="input" type="number" placeholder="Delay before message apparition (5)" name="bubble_delay" value="<?php echo esc_attr( <input class="input" type="number" placeholder="Delay before message apparition (5)" name="bubble_delay" value="<?php echo esc_attr(
get_option("bubble_delay") get_option('bubble_delay')
); ?>"> ); ?>">
</div> </div>
<label> <label>
<input type="checkbox" <?php if ( <input type="checkbox" <?php if (
esc_attr(get_option("dont_show_callout_twice")) esc_attr(get_option('dont_show_callout_twice'))
) { ) {
echo esc_attr("checked"); echo esc_attr('checked');
} ?> name="dont_show_callout_twice"> } ?> name="dont_show_callout_twice">
Don't show callout message when opened or closed once Don't show callout message when opened or closed once
</label> </label>
@@ -197,12 +205,12 @@
<label class="label">Pages to include separated by a comma (optionnal)</label> <label class="label">Pages to include separated by a comma (optionnal)</label>
<div class="control" style="margin-bottom: 1rem;"> <div class="control" style="margin-bottom: 1rem;">
<input class="input" type="text" placeholder="/my-page/*,/my-other-page" name="chat_included_pages" value="<?php echo esc_attr( <input class="input" type="text" placeholder="/my-page/*,/my-other-page" name="chat_included_pages" value="<?php echo esc_attr(
get_option("chat_included_pages") get_option('chat_included_pages')
); ?>"> ); ?>">
</div> </div>
</div> </div>
</div> </div>
<?php if (esc_attr(get_option("embed_type")) === "container"): ?> <?php if (esc_attr(get_option('embed_type')) === 'container'): ?>
<div class="notification is-link" style="margin-bottom: 1rem;"> <div class="notification is-link" style="margin-bottom: 1rem;">
You can now place your typebot container anywhere in your site using [typebot] shortcode. You can now place your typebot container anywhere in your site using [typebot] shortcode.
<br><br> <br><br>
@@ -217,22 +225,22 @@
<label> <label>
<input type="radio" name="config_type" onclick="handleClick(this);" value="advanced" <?php if ( <input type="radio" name="config_type" onclick="handleClick(this);" value="advanced" <?php if (
esc_attr(get_option("config_type")) == "advanced" esc_attr(get_option('config_type')) == 'advanced'
) { ) {
echo esc_attr("checked"); echo esc_attr('checked');
} ?>> } ?>>
Advanced setup (with code) Advanced setup (with code)
</label> </label>
<div id="code-block" style="display: <?php if ( <div id="code-block" style="display: <?php if (
esc_attr(get_option("config_type")) == "advanced" esc_attr(get_option('config_type')) == 'advanced'
) { ) {
echo esc_attr("block"); echo esc_attr('block');
} else { } else {
echo esc_attr("none"); echo esc_attr('none');
} ?>"> } ?>">
<label>Paste the code from "HTML & Js" in Typebot in the Share tab:</label> <label>Paste the code from "HTML & Js" in Typebot in the Share tab:</label>
<textarea class="textarea" style="margin-top:0.5rem" name="custom_code"><?php echo esc_attr( <textarea class="textarea" style="margin-top:0.5rem" name="custom_code"><?php echo esc_attr(
get_option("custom_code") get_option('custom_code')
); ?></textarea> ); ?></textarea>
</div> </div>

40
packages/wordpress/trunk/public/class-typebot-public.php
View File

@@ -4,7 +4,10 @@ class Typebot_Public
{ {
public function add_head_code() public function add_head_code()
{ {
wp_enqueue_script('typebot', 'https://www.typebot.io/typebot-lib/v2'); wp_enqueue_script(
'typebot',
'https://unpkg.com/typebot-js@2.2.0/dist/index.umd.min.js'
);
wp_add_inline_script('typebot', $this->parse_wp_user()); wp_add_inline_script('typebot', $this->parse_wp_user());
if (get_option('config_type') === 'advanced') { if (get_option('config_type') === 'advanced') {
echo esc_html(get_option('custom_code')); echo esc_html(get_option('custom_code'));
@@ -19,7 +22,7 @@ class Typebot_Public
private function parse_popup_head_code() private function parse_popup_head_code()
{ {
$publish_id = get_option('publish_id'); $url = get_option('url');
if ( if (
get_option('popup_included_pages') !== null && get_option('popup_included_pages') !== null &&
get_option('popup_included_pages') !== '' get_option('popup_included_pages') !== ''
@@ -36,8 +39,8 @@ class Typebot_Public
} }
$params = $params =
'{ '{
publishId: "' . url: "' .
$publish_id . $url .
'", '",
hiddenVariables: typebotWpUser, hiddenVariables: typebotWpUser,
}'; }';
@@ -47,8 +50,8 @@ class Typebot_Public
) { ) {
$params = $params =
'{ '{
publishId: "' . url: "' .
$publish_id . $url .
'", '",
delay: ' . delay: ' .
get_option('popup_delay') * 1000 . get_option('popup_delay') * 1000 .
@@ -86,7 +89,7 @@ class Typebot_Public
private function parse_bubble_head_code() private function parse_bubble_head_code()
{ {
$publish_id = get_option('publish_id'); $url = get_option('url');
$chat_icon = get_option('chat_icon'); $chat_icon = get_option('chat_icon');
if ( if (
get_option('chat_included_pages') !== null && get_option('chat_included_pages') !== null &&
@@ -111,9 +114,12 @@ class Typebot_Public
} }
$params = $params =
'{ '{
publishId: "' . url: "' .
$publish_id . $url .
'", '",
autoOpenDelay: ' .
get_option('chat_delay') * 1000 .
',
button: { button: {
color: "' . color: "' .
$button_color . $button_color .
@@ -132,9 +138,12 @@ class Typebot_Public
get_option('dont_show_callout_twice') === 'on' ? 'true' : 'false'; get_option('dont_show_callout_twice') === 'on' ? 'true' : 'false';
$params = $params =
'{ '{
publishId: "' . url: "' .
$publish_id . $url .
'", '",
autoOpenDelay: ' .
get_option('chat_delay') * 1000 .
',
proactiveMessage: { proactiveMessage: {
avatarUrl: "' . avatarUrl: "' .
get_option('avatar') . get_option('avatar') .
@@ -218,7 +227,7 @@ class Typebot_Public
$width = '100%'; $width = '100%';
$height = '500px'; $height = '500px';
$bg_color = 'rgba(255, 255, 255, 0)'; $bg_color = 'rgba(255, 255, 255, 0)';
$publish_id = get_option('publish_id'); $url = sanitize_text_field($attributes['url']);
if (is_array($attributes)) { if (is_array($attributes)) {
if (array_key_exists('width', $attributes)) { if (array_key_exists('width', $attributes)) {
$width = sanitize_text_field($attributes['width']); $width = sanitize_text_field($attributes['width']);
@@ -229,9 +238,6 @@ class Typebot_Public
if (array_key_exists('background-color', $attributes)) { if (array_key_exists('background-color', $attributes)) {
$bg_color = sanitize_text_field($attributes['background-color']); $bg_color = sanitize_text_field($attributes['background-color']);
} }
if (array_key_exists('url', $attributes)) {
$publish_id = sanitize_text_field($attributes['url']);
}
} }
$container_id = 'typebot-container-' . $this->generateRandomString(4); $container_id = 'typebot-container-' . $this->generateRandomString(4);
@@ -256,8 +262,8 @@ class Typebot_Public
$container_id . $container_id .
'",{ '",{
hiddenVariables: typebotWpUser, hiddenVariables: typebotWpUser,
publishId: "' . url: "' .
$publish_id . $url .
'", '",
})}) })})
</script>'; </script>';

4
packages/wordpress/trunk/typebot.php
View File

@@ -3,7 +3,7 @@
/** /**
* Plugin Name: Typebot * Plugin Name: Typebot
* Description: Convert more with conversational forms * Description: Convert more with conversational forms
* Version: 2.0.0 * Version: 2.1.0
* Author: Typebot * Author: Typebot
* Author URI: http://typebot.io/ * Author URI: http://typebot.io/
* License: GPL-2.0+ * License: GPL-2.0+
@@ -16,7 +16,7 @@ if (!defined('WPINC')) {
die(); die();
} }
define('TYPEBOT_VERSION', '2.0.0'); define('TYPEBOT_VERSION', '2.1.0');
function activate_typebot() function activate_typebot()
{ {