Skip to content

Commit

Permalink
Merge pull request #25 from plausible/issue/17
Browse files Browse the repository at this point in the history 
Stats within WP dashboard #17
  • Loading branch information
@mehul0810
mehul0810 authored Apr 17, 2021
2 parents f974d1b + d4408fe commit 681418a
Show file tree
Hide file tree
Showing 3 changed files with 152 additions and 25 deletions.
46 changes: 30 additions & 16 deletions assets/src/css/admin/general.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,12 +10,19 @@
@extend .plausible-analytics-hidden;
}

.plausible-analytics-statistics-not-loaded {
margin: 20px 0 0 -10px;
padding: 0 30px;
font-size: 15px;
line-height: 24px;
}

.plausible-analytics-header {
display: flex;
align-items: center;
background-color: #fff;
padding: 0;
padding: 0;
position: relative;
margin: 0 0 0 -20px;

.plausible-analytics-logo {
Expand Down Expand Up @@ -49,26 +56,27 @@
margin-bottom: 20px;
padding: 15px;

.plausible-analytics-admin-field-header {
display: flex;
justify-content: space-between;
align-items: center;
label {
font-weight: 700;

label {
font-weight: 700;
.plausible-analytics-admin-field-input {
font-weight: 400;
font-size: 14px;

.plausible-analytics-admin-field-input {
font-weight: 400;
font-size: 14px;

input[type='text'] {
background-color: #f5f5f5;
border: none;
border-radius: 5px;
}
input[type='text'] {
background-color: #f5f5f5;
border: none;
border-radius: 5px;
}
}
}

.plausible-analytics-admin-field-header {
display: flex;
justify-content: space-between;
align-items: center;
}

.plausible-analytics-description {
font-style: italic;
color: #989898;
Expand All @@ -80,5 +88,11 @@
margin: 5px 15px;
}
}

.plausible-analytics-admin-field-content {
border-top: 1px dashed #e5e5e5;
margin-top: 15px;
padding: 15px 0 0 0;
}
}
}
6 changes: 6 additions & 0 deletions assets/src/js/admin/main.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -39,7 +39,11 @@ document.addEventListener( 'DOMContentLoaded', () => {
const isSelfHostedAnalytics = null !== selfHostedAnalyticsElement ? selfHostedAnalyticsElement.checked : false;
const trackAdminElement = formElement.querySelector( 'input[name="plausible_analytics_settings[track_administrator]"]:checked' );
const isTrackAdmin = null !== trackAdminElement ? parseInt( trackAdminElement.value ) : 0;
const embedAnalyticsElement = formElement.querySelector( 'input[name="plausible_analytics_settings[embed_analytics]"]:checked' );
const canEmbedAnalytics = null !== embedAnalyticsElement ? parseInt( embedAnalyticsElement.value ) : 0;
const roadBlock = null !== formElement.querySelector( '.plausible-analytics-admin-settings-roadblock' ) ? document.querySelector( '.plausible-analytics-admin-settings-roadblock' ).value : '';
const sharedLinkElement = formElement.querySelector( 'input[name="plausible_analytics_settings[shared_link]"]' );
const sharedLink = null !== sharedLinkElement ? sharedLinkElement.value : 0;

spinner.style.display = 'block';
saveSettings.setAttribute( 'disabled', 'disabled' );
Expand All @@ -51,6 +55,8 @@ document.addEventListener( 'DOMContentLoaded', () => {
formData.append( 'custom_domain_prefix', customDomainPrefix );
formData.append( 'is_self_hosted_analytics', isSelfHostedAnalytics === true );
formData.append( 'self_hosted_domain', selfHostedDomain );
formData.append( 'embed_analytics', canEmbedAnalytics === 1 );
formData.append( 'shared_link', sharedLink );
formData.append( 'track_administrator', isTrackAdmin === 1 );

fetch(
Expand Down
125 changes: 116 additions & 9 deletions src/Admin/Settings.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -40,6 +40,13 @@ public function __construct() {
* @return void
*/
public function register_menu() {
add_dashboard_page(
esc_html__( 'Analytics', 'plausible-analytics' ),
esc_html__( 'Analytics', 'plausible-analytics' ),
'manage_options',
'plausible-analytics-statistics',
[ $this, 'statistics_page' ]
);
add_options_page(
esc_html__( 'Plausible Analytics', 'plausible-analytics' ),
esc_html__( 'Plausible Analytics', 'plausible-analytics' ),
Expand All @@ -50,25 +57,23 @@ public function register_menu() {
}

/**
* Settings Page.
* Get Admin Header.
*
* @since 1.0.0
* @param string $name Header Name.
*
* @since 1.2.0
* @access public
*
* @return void
* @return mixed
*/
public function plausible_analytics_settings_page() {
$settings = Helpers::get_settings();
$domain = ! empty( $settings['domain_name'] ) ? $settings['domain_name'] : Helpers::get_domain();
$custom_domain_prefix = ! empty( $settings['custom_domain_prefix'] ) ? $settings['custom_domain_prefix'] : 'analytics';
$self_hosted_domain = ! empty( $settings['self_hosted_domain'] ) ? $settings['self_hosted_domain'] : 'example.com';
public function get_header( $name ) {
?>
<div class="plausible-analytics-header">
<div class="plausible-analytics-logo">
<img src="<?php echo PLAUSIBLE_ANALYTICS_PLUGIN_URL . '/assets/dist/images/icon.png'; ?>" alt="<?php esc_html_e( 'Plausible Analytics', 'plausible-analytics' ); ?>" />
</div>
<div class="plausible-analytics-title">
<h1><?php esc_html_e( 'Settings', 'plausible-analytics' ); ?></h1>
<h1><?php echo $name; ?></h1>
</div>
<div class="plausible-analytics-actions">
<a class="plausible-analytics-btn" href="https://github.com/plausible/wordpress/issues/new" target="_blank">
Expand All @@ -79,6 +84,26 @@ public function plausible_analytics_settings_page() {
</a>
</div>
</div>
<?php
}

/**
* Settings Page.
*
* @since 1.0.0
* @access public
*
* @return void
*/
public function plausible_analytics_settings_page() {
$settings = Helpers::get_settings();
$domain = ! empty( $settings['domain_name'] ) ? $settings['domain_name'] : Helpers::get_domain();
$custom_domain_prefix = ! empty( $settings['custom_domain_prefix'] ) ? $settings['custom_domain_prefix'] : 'analytics';
$self_hosted_domain = ! empty( $settings['self_hosted_domain'] ) ? $settings['self_hosted_domain'] : 'example.com';
$shared_link = ! empty( $settings['shared_link'] ) ? $settings['shared_link'] : "https://plausible.io/share/{$domain}?auth=XXXXXXXXXXXX";

echo $this->get_header( esc_html__( 'Settings', 'plausible-analytics' ) );
?>
<div class="wrap plausible-analytics-wrap">
<form id="plausible-analytics-settings-form" class="plausible-analytics-form">
<div class="plausible-analytics-admin-field plausible-analytics-admin-menu">
Expand Down Expand Up @@ -150,6 +175,36 @@ public function plausible_analytics_settings_page() {
?>
</div>
</div>
<div class="plausible-analytics-admin-field">
<div class="plausible-analytics-admin-field-header">
<label for="embed-analytics">
<?php esc_html_e( 'View your stats in your WordPress dashboard', 'plausible-analytics' ); ?>
</label>
<?php echo Helpers::display_toggle_switch( 'embed_analytics' ); ?>
</div>
<div class="plausible-analytics-admin-field-content">
<label>
<?php esc_html_e( 'Shared Link:', 'plausible-analytics' ); ?>
<span class="plausible-analytics-admin-field-input">
<input style="min-width: 550px;" type="text" name="plausible_analytics_settings[shared_link]" value="<?php echo $shared_link; ?>" />
</span>
</label>
</div>
<div class="plausible-analytics-description">
<?php
echo sprintf(
'<ol><li>%1$s <a href="%2$s" target="_blank">%3$s</a></li><li>%4$s</li><li>%5$s <a href="%6$s">%7$s</a></li></ol>',
esc_html__( 'Create a secure and private shared link in your Plausible account.', 'plausible-analytics' ),
esc_url( 'https://plausible.io/docs/shared-links' ),
esc_html__( 'See how &raquo;', 'plausible-analytics' ),
esc_html__( 'Enable this setting and paste your shared link to view your stats in your WordPress dashboard.', 'plausible-analytics' ),
esc_html__( 'View your site statistics within your WordPress Dashboard.', 'plausible-analytics' ),
admin_url( 'index.php?page=plausible-analytics-statistics' ),
esc_html__( 'View Statistics &raquo;', 'plausible-analytics' ),
);
?>
</div>
</div>
<div class="plausible-analytics-admin-field">
<div class="plausible-analytics-admin-field-header">
<label for="track-administrator">
Expand Down Expand Up @@ -208,4 +263,56 @@ class="plausible-analytics-btn plausible-analytics-save-btn"
</div>
<?php
}

/**
* Statistics Page via Embed feature.
*
* @since 1.2.0
* @access public
*
* @return void
*/
public function statistics_page() {
$settings = Helpers::get_settings();
$domain = Helpers::get_domain();
$can_embed_analytics = ! empty( $settings['embed_analytics'] ) ? $settings['embed_analytics'] : false;
$shared_link = ! empty( $settings['shared_link'] ) ?
add_query_arg(
[
'embed' => true,
'theme' => 'light',
'background' => '%23f0f0f1',
],
$settings['shared_link']
) :
'';

// Display admin header.
echo $this->get_header( esc_html__( 'Analytics', 'plausible-analytics' ) );

if ( $can_embed_analytics && ! empty( $shared_link ) ) {
?>
<iframe plausible-embed src="<?php echo $shared_link; ?>" scrolling="no" frameborder="0" loading="lazy" style="width: 100%; height: 1750px; margin: -120px 0 0 -10px; z-index: 1;"></iframe>
<script async src="https://plausible.io/js/embed.host.js"></script>
<?php
} else {
?>
<div class="plausible-analytics-statistics-not-loaded">
<?php
echo sprintf(
'%1$s <a href="%2$s">%3$s</a> %4$s %5$s <a href="%6$s">%7$s</a> %8$s',
esc_html( 'Please', 'plausible-analytics' ),
esc_url_raw( "https://plausible.io/{$domain}/settings/visibility" ),
esc_html( 'click here', 'plausible-analytics' ),
esc_html( 'to generate your shared link from your Plausible Analytics dashboard.', 'plausible-analytics' ),
esc_html( 'Now, copy the generated shared link and', 'plausible-analytics' ),
admin_url( 'options-general.php?page=plausible-analytics' ),
esc_html( 'paste here', 'plausible-analytics' ),
esc_html( 'under Embed Analytics to view Plausible Analytics dashboard within your WordPress site.', 'plausible-analytics' ),
);
?>
</p>
<?php
}
}
}

0 comments on commit 681418a

Please sign in to comment.