now the widget can be shown as a modal! :D

lib/WP_Auth0_Widget.php

@@ -33,7 +33,8 @@ public function widget( $args, $instance ) {
  echo $args['before_widget'];
 
  $settings = WP_Auth0::buildSettings($instance);
-
+ $settings[ 'show_as_modal' ] = isset($instance[ 'show_as_modal' ]) ? $instance[ 'show_as_modal' ] : false;
+ $settings[ 'modal_trigger_name' ] = isset($instance[ 'modal_trigger_name' ]) ? $instance[ 'modal_trigger_name' ] : 'Login';
 
  require_once WPA0_PLUGIN_DIR . 'templates/login-form.php';
  renderAuth0Form(false, $settings);

templates/a0-widget-setup-form.php

@@ -33,18 +33,10 @@
  <label for="<?php echo $this->get_field_id( 'username_style' ); ?>_email"><?php _e( 'Username' ); ?></label>
 </p>
 <p>
- <label><?php _e( 'Show as modal:' ); ?></label>
-
- <input id="<?php echo $this->get_field_id( 'show_as_modal' ); ?>_yes"
- name="<?php echo $this->get_field_name( 'show_as_modal' ); ?>"
- type="radio" value="1" <?php echo (esc_attr( $show_as_modal ) == 1 ? 'checked="true"' : ''); ?> />
- <label for="<?php echo $this->get_field_id( 'show_as_modal' ); ?>_yes"><?php _e( 'Yes' ); ?></label>
-
- <input id="<?php echo $this->get_field_id( 'show_as_modal' ); ?>_no"
- name="<?php echo $this->get_field_name( 'show_as_modal' ); ?>"
- type="radio" value="0" <?php echo (esc_attr( $show_as_modal ) == 0 ? 'checked="true"' : ''); ?> />
- <label for="<?php echo $this->get_field_id( 'show_as_modal' ); ?>_no"><?php _e( 'No' ); ?></label>
-
+ <input id="<?php echo $this->get_field_id( 'show_as_modal' ); ?>"
+ name="<?php echo $this->get_field_name( 'show_as_modal' ); ?>"
+ type="checkbox" value="1" <?php echo (esc_attr( $show_as_modal ) == 1 ? 'checked="true"' : ''); ?> />
+ <label for="<?php echo $this->get_field_id( 'show_as_modal' ); ?>"><?php _e( 'Show as modal' ); ?></label>
 </p>
 <p>
  <label for="<?php echo $this->get_field_id( 'modal_trigger_name' ); ?>"><?php _e( 'Modal button name' ); ?></label>
@@ -53,83 +45,28 @@
  type="text" value="<?php echo esc_attr( $modal_trigger_name ); ?>" />
 </p>
 <p>
- <label><?php _e( 'Show big social buttons:' ); ?></label>
-
- <input id="<?php echo $this->get_field_id( 'social_big_buttons' ); ?>_yes"
- name="<?php echo $this->get_field_name( 'social_big_buttons' ); ?>"
- type="radio" value="1" <?php echo (esc_attr( $social_big_buttons ) == 1 ? 'checked="true"' : ''); ?> />
- <label for="<?php echo $this->get_field_id( 'social_big_buttons' ); ?>_yes"><?php _e( 'Yes' ); ?></label>
-
- <input id="<?php echo $this->get_field_id( 'social_big_buttons' ); ?>_no"
- name="<?php echo $this->get_field_name( 'social_big_buttons' ); ?>"
- type="radio" value="0" <?php echo (esc_attr( $social_big_buttons ) == 0 ? 'checked="true"' : ''); ?> />
- <label for="<?php echo $this->get_field_id( 'social_big_buttons' ); ?>_no"><?php _e( 'No' ); ?></label>
-
- <input id="<?php echo $this->get_field_id( 'social_big_buttons' ); ?>_inherit"
+ <input id="<?php echo $this->get_field_id( 'social_big_buttons' ); ?>"
  name="<?php echo $this->get_field_name( 'social_big_buttons' ); ?>"
- type="radio" value="" <?php echo (esc_attr( $social_big_buttons ) === '' ? 'checked="true"' : ''); ?> />
- <label for="<?php echo $this->get_field_id( 'social_big_buttons' ); ?>_no"><?php _e( 'Inherit' ); ?></label>
-
+ type="checkbox" value="1" <?php echo (esc_attr( $social_big_buttons ) == 1 ? 'checked="true"' : ''); ?> />
+ <label for="<?php echo $this->get_field_id( 'social_big_buttons' ); ?>"><?php _e( 'Show big social buttons' ); ?></label>
 </p>
 <p>
- <label><?php _e( 'Enable Gravatar integration:' ); ?></label>
-
- <input id="<?php echo $this->get_field_id( 'gravatar' ); ?>_yes"
- name="<?php echo $this->get_field_name( 'gravatar' ); ?>"
- type="radio" value="1" <?php echo (esc_attr( $gravatar ) == 1 ? 'checked="true"' : ''); ?> />
- <label for="<?php echo $this->get_field_id( 'gravatar' ); ?>_yes"><?php _e( 'Yes' ); ?></label>
-
- <input id="<?php echo $this->get_field_id( 'gravatar' ); ?>_no"
+ <input id="<?php echo $this->get_field_id( 'gravatar' ); ?>"
  name="<?php echo $this->get_field_name( 'gravatar' ); ?>"
- type="radio" value="0" <?php echo (esc_attr( $gravatar ) == 0 ? 'checked="true"' : ''); ?> />
- <label for="<?php echo $this->get_field_id( 'gravatar' ); ?>_no"><?php _e( 'No' ); ?></label>
-
- <input id="<?php echo $this->get_field_id( 'gravatar' ); ?>_inherit"
- name="<?php echo $this->get_field_name( 'gravatar' ); ?>"
- type="radio" value="" <?php echo (esc_attr( $gravatar ) === '' ? 'checked="true"' : ''); ?> />
- <label for="<?php echo $this->get_field_id( 'gravatar' ); ?>_no"><?php _e( 'Inherit' ); ?></label>
-
-
+ type="checkbox" value="1" <?php echo (esc_attr( $gravatar ) == 1 ? 'checked="true"' : ''); ?> />
+ <label for="<?php echo $this->get_field_id( 'gravatar' ); ?>"><?php _e( 'Enable Gravatar integration' ); ?></label>
 </p>
 <p>
-
- <label><?php _e( 'Remember last login:' ); ?></label>
-
- <input id="<?php echo $this->get_field_id( 'remember_last_login' ); ?>_yes"
- name="<?php echo $this->get_field_name( 'remember_last_login' ); ?>"
- type="radio" value="1" <?php echo (esc_attr( $remember_last_login ) == 1 ? 'checked="true"' : ''); ?> />
- <label for="<?php echo $this->get_field_id( 'remember_last_login' ); ?>_yes"><?php _e( 'Yes' ); ?></label>
-
- <input id="<?php echo $this->get_field_id( 'remember_last_login' ); ?>_no"
+ <input id="<?php echo $this->get_field_id( 'remember_last_login' ); ?>"
  name="<?php echo $this->get_field_name( 'remember_last_login' ); ?>"
- type="radio" value="0" <?php echo (esc_attr( $remember_last_login ) == 0 ? 'checked="true"' : ''); ?> />
- <label for="<?php echo $this->get_field_id( 'remember_last_login' ); ?>_no"><?php _e( 'No' ); ?></label>
-
- <input id="<?php echo $this->get_field_id( 'remember_last_login' ); ?>_inherit"
- name="<?php echo $this->get_field_name( 'remember_last_login' ); ?>"
- type="radio" value="" <?php echo (esc_attr( $remember_last_login ) === '' ? 'checked="true"' : ''); ?> />
- <label for="<?php echo $this->get_field_id( 'remember_last_login' ); ?>_no"><?php _e( 'Inherit' ); ?></label>
-
+ type="checkbox" value="1" <?php echo (esc_attr( $remember_last_login ) == 1 ? 'checked="true"' : ''); ?> />
+ <label for="<?php echo $this->get_field_id( 'remember_last_login' ); ?>"><?php _e( 'Remember last login' ); ?></label>
 </p>
 <p>
-
- <label><?php _e( 'Show Icon:' ); ?></label>
-
- <input id="<?php echo $this->get_field_id( 'show_icon' ); ?>_yes"
- name="<?php echo $this->get_field_name( 'show_icon' ); ?>"
- type="radio" value="1" <?php echo (esc_attr( $show_icon ) == 1 ? 'checked="true"' : ''); ?> />
- <label for="<?php echo $this->get_field_id( 'show_icon' ); ?>_yes"><?php _e( 'Yes' ); ?></label>
-
- <input id="<?php echo $this->get_field_id( 'show_icon' ); ?>_no"
+ <input id="<?php echo $this->get_field_id( 'show_icon' ); ?>"
  name="<?php echo $this->get_field_name( 'show_icon' ); ?>"
- type="radio" value="0" <?php echo (esc_attr( $show_icon ) == 0 ? 'checked="true"' : ''); ?> />
- <label for="<?php echo $this->get_field_id( 'show_icon' ); ?>_no"><?php _e( 'No' ); ?></label>
-
- <input id="<?php echo $this->get_field_id( 'show_icon' ); ?>_inherit"
- name="<?php echo $this->get_field_name( 'show_icon' ); ?>"
- type="radio" value="" <?php echo (esc_attr( $show_icon ) === '' ? 'checked="true"' : ''); ?> />
- <label for="<?php echo $this->get_field_id( 'show_icon' ); ?>_no"><?php _e( 'Inherit' ); ?></label>
-
+ type="checkbox" value="1" <?php echo (esc_attr( $show_icon ) == 1 ? 'checked="true"' : ''); ?> />
+ <label for="<?php echo $this->get_field_id( 'show_icon' ); ?>"><?php _e( 'Show Icon' ); ?></label>
 </p>
 <p>
  <label for="<?php echo $this->get_field_id( 'icon_url' ); ?>"><?php _e( 'Icon Url:' ); ?></label>
@@ -179,4 +116,3 @@ class="button-secondary"><?php echo _e( 'Choose Icon' ); ?></a>
 
 
 
-

templates/auth0-login-form.php

@@ -5,7 +5,15 @@
 $cdn = WP_Auth0_Options::get('cdn_url');
 $allow_signup = WP_Auth0_Options::get('allow_signup') == 1;
 $extra_css = apply_filters( 'auth0_login_css', '');
+$showAsModal = (isset($specialSettings['show_as_modal']) && $specialSettings['show_as_modal'] == 1);
+$modalTriggerName = 'Login';
+if (isset($specialSettings['modal_trigger_name']) && $specialSettings['modal_trigger_name'] != '')
+{
+ $modalTriggerName = $specialSettings['modal_trigger_name'];
+}
 
+if (isset($specialSettings['show_as_modal'])) unset($specialSettings['show_as_modal']);
+if (isset($specialSettings['modal_trigger_namemodal_trigger_name'])) unset($specialSettings['modal_trigger_name']);
 
 $form_desc = WP_Auth0_Options::get('form_desc');
 if (isset($_GET['interim-login']) && $_GET['interim-login'] == 1) {
@@ -30,8 +38,15 @@
  <div id="form-signin-wrapper" class="auth0-login">
  <?php include 'error-msg.php'; ?>
  <div class="form-signin">
- <div id="auth0-login-form">
- </div>
+
+ <?php if ($showAsModal) { ?>
+
+ <button id="a0LoginButton" onclick="a0ShowLoginModal();" ><?php echo $modalTriggerName; ?></button>
+
+ <?php } else { ?>
+ <div id="auth0-login-form">
+ </div>
+ <?php } ?>
  <?php if ($activated && $wordpress_login_enabled && $canShowLegacyLogin) { ?>
  <div id="extra-options">
  <a href="?wle">Login with WordPress username</a>
@@ -60,24 +75,36 @@
 
  $options_obj = array_merge( array(
  "callbackURL" => site_url('/index.php?auth0=1'),
- "container" => 'auth0-login-form',
  "authParams" => array("state" => $state),
  ), $options_obj );
 
- if (isset($specialSettings))
- {
+ if (isset($specialSettings)){
  $options_obj = array_merge( $options_obj , $specialSettings );
  }
 
+ if ($showAsModal){
+ $options_obj['popup'] = true;
+ }
+ else{
+ $options_obj['container'] = 'auth0-login-form';
+ }
+
+
  $options = json_encode($options_obj);
  ?>
- var options = <?php echo $options; ?>;
+ function a0ShowLoginModal() {
+ var options = <?php echo $options; ?>;
 
  <?php if ($allow_signup) { ?>
  lock.show(options, callback);
  <?php } else { ?>
  lock.showSignin(options, callback);
  <?php } ?>
+ }
+
+ <?php if (!$showAsModal) { ?>
+ a0ShowLoginModal();
+ <?php } ?>
 
  </script>
 <?php