Skip to content

Commit

Permalink
Major change: Direct embed is now the default, iframe embed is optional.
Browse files Browse the repository at this point in the history
  • Loading branch information
fwolf committed Jan 5, 2018
1 parent b876686 commit 1aa0688
Show file tree
Hide file tree
Showing 4 changed files with 118 additions and 23 deletions.
19 changes: 19 additions & 0 deletions embed-content.css
View file
Expand Up @@ -3,6 +3,7 @@
*/
.mastodon-embed {
font-family: "Roboto", "Ubuntu Sans", "Nimbus Sans L", "Droid Sans", Arial, sans-serif;
margin: 1.5rem 0;
}
.mastodon-embed .activity-stream {
box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
Expand Down Expand Up @@ -107,10 +108,28 @@
}
.mastodon-embed .detailed-status.light .status__content {
color: #282c37;
/*
.e-content.show-nsfw {
display: block !important;
transition: all 0.3s;
}*/
}
.mastodon-embed .detailed-status.light .status__content a {
color: #2b90d9;
}
.mastodon-embed .detailed-status.light .status__content a.status__content__spoiler-link {
border-radius: 2px;
display: inline-block;
/**
* Original (and user-unfriendly):
*/
font-size: 0.85rem;
font-weight: 500;
padding: 0 6px;
text-transform: uppercase;
background-color: #9baec8;
color: #fff;
}
.mastodon-embed .detailed-status.light .detailed-status__meta {
color: #9baec8;
font-size: 14px;
Expand Down
27 changes: 27 additions & 0 deletions embed-content.less
View file
Expand Up @@ -7,6 +7,7 @@
.mastodon-embed {

font-family: @mastodon_embed_font;
margin: 1.5rem 0;

.activity-stream {
box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
Expand Down Expand Up @@ -139,6 +140,32 @@
a {
color: #2b90d9;
}

a.status__content__spoiler-link {
border-radius: 2px;
display: inline-block;

/**
* Original (and user-unfriendly):
*/
//font-size: 11px;

font-size: 0.85rem;

font-weight: 500;
padding: 0 6px;
text-transform: uppercase;

background-color: #9baec8;
color: #fff;
}

/*
.e-content.show-nsfw {
display: block !important;
transition: all 0.3s;
}*/

}


Expand Down
78 changes: 60 additions & 18 deletions mastodon-embed.php
View file
Expand Up @@ -2,8 +2,8 @@
/**
* Plugin Name: Mastodon Embed Improved
* Plugin URI: http://f2w.de/mastodon-embed
* Description: A plugin to embed Mastodon statuses. Complete rewrite of <a href="https://github.com/DavidLibeau/mastodon-tools">Mastodon embed</a> by David Libeau. Tested up to WP 4.8-nightly
* Version: 2.4.3
* Description: A plugin to embed Mastodon statuses. Complete rewrite of <a href="https://github.com/DavidLibeau/mastodon-tools">Mastodon embed</a> by David Libeau. Tested up to WP 5.0-nightly
* Version: 2.5
* Author: Fabian Wolf
* Author URI: http://usability-idealist.de
* License: GNU GPL v2 or later
Expand All @@ -14,15 +14,16 @@
* - working caching
* - proper shortcode initialization
* - backward compatiblity for mastodon-embed
* - fallback to "direct" embeds if embed via iframe is forbidden (eg. when testing on localhost)
* - directly embed toots instead of relying on the iframe method
* - fallback method: iframe (explicitely enabled via shortcode attribute 'use_iframe' (alias: 'iframe') and set it to '1'
* - direct embed with reverse-engineered CSS file (including LESS base) and override option (filter: mastodon_embed_content_style)
* - uses different shortcode ('mastodon_embed' instead of 'mastodon') if the original mastodon-embed is active as well
* - uses simple_html_dom instead of XPath
* - cache refresh via attribute ('flush')
* - improved debugging (WP_DEBUG + extended constants)
* - alias for no_iframe attribute: disable_iframe
* - force URL scheme attribute ('force_scheme') to further improve SSL only vs. unencrypted http-only sites (ie. fun with SSL enforcement in WP ;))
* - automatically picks out specific single toot; to display the complete conversation, set 'no_center' to 1; also, only works with "direct" toot embedding (ie. parameter "no_iframe" set to 1)
* - automatically picks out specific single toot; to display the complete conversation, set 'no_center' to 1; also, only works with "direct" toot embedding
*/

if( !class_exists( 'simple_html_dom' ) ) {
Expand Down Expand Up @@ -76,18 +77,35 @@ function __construct( $plugin_init = false ) {
function init_assets() {
/**
* @hook mastodon_embed_content_style URL to the direct embed content CSS.
* @hook mastodon:embed_font_awesome_url Font Awesome CDN URL. Replace with your own or set to null to disable it from being loaded at all.
* @hook mastodon_embed_content_style_dark URL to the dark themed embed content CSS.
* @hook mastodon_embed_font_awesome_url Font Awesome CDN URL. Replace with your own or set to null to disable it from being loaded at all.
*/


$embed_content_style = apply_filters( $this->pluginPrefix . 'content_style', plugin_dir_url(__FILE__) . 'embed-content.css' );
$embed_content_style_dark = apply_filters( $this->pluginPrefix . 'content_style_dark', plugin_dir_url( __FILE__ ) . 'embed-content-dark.css' );

$embed_content_fa_url = apply_filters( $this->pluginPrefix . 'font_awesome_url', '//maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css' );

if( !empty( $embed_content_fa_url ) ) {
wp_register_style( $this->pluginPrefix . 'font-awesome', $embed_content_fa_url );
}

wp_register_style( $this->pluginPrefix . 'content', $embed_content_style );
if( !empty( $embed_content_style ) || !empty( $embed_content_style_dark ) ) {
$strEmbedStyleURL = ( empty( $embed_content_style ) ? $embed_content_style_dark : $embed_content_style );

wp_register_style( $this->pluginPrefix . 'content', $strEmbedStyleURL );
}

/**
* @hook mastodon_embed_js_helpers_url URL to the default Javascript helper bundle.
*/

$embed_js_helpers = apply_filters( $this->pluginPrefix . 'js_helpers_url', plugin_dir_url( __FILE__ ) . 'mastodon-embed.js' );

if( !empty( $embed_js_helpers ) ) {
wp_register_script( $this->pluginPrefix . 'helpers', $embed_js_helpers, array('jquery' ), false, true );
}
}


Expand Down Expand Up @@ -122,24 +140,31 @@ function shortcode( $atts = null, $content = null ) {
/**
* NOTE: Insecure - use default attributes + @function wp_parse_args or @function shortcode_atts (do essentially the same)
*/

/**
* @hook mastodon_embed_default_attributes - The default shortcode attributes; admin settings or custom config file hooks into this, too
*/

$default_atts = array(
$default_atts = apply_filters( $this->pluginPrefix . 'default_attributes', array(
'url' => '', // backward compatiblity (avoid having to increase the major version number)
'container_class' => 'mastodon-embed',
'width' => 700,
'height' => 200,
'css' => 'overflow: hidden',
'cache_timeout' => 24 * 60 * 60, // in seconds; defaults to 1 day
'no_iframe' => 0, // workaround for localhost / testing purposes
'disable_iframe' => 0, // alias
'use_iframe' => 0, // workaround for localhost / testing purposes
'iframe' => 0, // alias
'no_iframe' => 1, // backward compatiblity to < 2.5
'disable_iframe' => 0, // backward compatiblity mode
'disable_font_awesome' => 0,
'force_scheme' => '',
'no_fa' => 0,
'flush' => 0, // intentionally flush the cache
/*'center' => 1, // picks out only the main toot out of a conversation (entry-center class)*/
'no_center' => 0, // disable "centering" function
'enable_debug' => 0, // specific debug parameter
);
'show_delay' => 350, // in ms
) );

$atts = shortcode_atts( $default_atts, $atts );

Expand Down Expand Up @@ -192,13 +217,21 @@ function shortcode( $atts = null, $content = null ) {
$http_code = wp_remote_retrieve_response_code($response);
$body = wp_remote_retrieve_body( $response );

if( !empty( $iframe ) || !empty( $use_iframe ) ) {
$iframe = true;
}

/**
* NOTE: Obsolete code from @version 2.4.3
*/

/*
if( !empty( $no_iframe ) || !empty( $disable_iframe ) ) {
if( !empty( $disable_iframe ) ) {
$no_iframe = true;
}

}

*/
/**
* NOTE: Switch case is so much easier .. not to mention a proper $return.
*/
Expand All @@ -223,7 +256,7 @@ function shortcode( $atts = null, $content = null ) {



if( empty( $no_iframe ) ) { // use iframe
if( !empty( $iframe ) ) { // use iframe
$atom_url = $dom->find( "link[type='application/atom+xml']", 0);


Expand Down Expand Up @@ -260,11 +293,25 @@ function shortcode( $atts = null, $content = null ) {
}
}


wp_enqueue_style( $this->pluginPrefix . 'content' );

if( empty( $disable_font_awesome ) && empty( $no_fa ) ) {
wp_enqueue_style( $this->pluginPrefix . 'font-awesome' );
}


// always load JS
wp_enqueue_script( $this->pluginPrefix . 'helpers' );

// check if nsfw / cw is enabled
/*if( strpos( $embed_content, 'class="p-summary' ) !== false || strpos( $embed_content, 'class="status__content__spoiler-link' ) !== false ) {
// if so, enqueue JS
wp_enqueue_script( $this->pluginPrefix . 'helpers' );
}*/



}


Expand Down Expand Up @@ -328,12 +375,7 @@ function shortcode( $atts = null, $content = null ) {
if( !empty( $strCenteredWrap ) ) {
$strWrap = str_replace( '%s', $strCenteredWrap, $strWrap ); // wrap centered toot into original div tag to avoid breaking the supplied CSS
}

/*
if( !empty( $no_iframe ) && ( !empty( $height) || !empty( $width ) ) {

}*/

$return = sprintf( $strWrap, $return );

// append debug data (if available)
Expand Down
17 changes: 12 additions & 5 deletions readme.txt
View file
Expand Up @@ -2,7 +2,7 @@
Contributors: usability.idealist
Tags: mastodon, social networks, social, opensocial, twitter, embed, shortcode, status, toot
Requires at least: 4.5
Tested up to: 4.8
Tested up to: 4.9
Stable tag: 2.4.3
License: GPLv2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Expand All @@ -20,7 +20,9 @@ Currently implemented features:
* working caching
* proper shortcode initialization
* backward compatiblity for mastodon-embed
* fallback to "direct" embeds if embed via iframe is forbidden (eg. when testing on localhost); use shortcode attribute `no_iframe` and set it to `1` (eg. `[mastodon no_iframe="1"]http://my.mastodon.instance/@mastodon_user/12345[/mastodon]`)
* directly embed toots instead of relying on the iframe method
* fallback: if direct import fails, try using the iframe method; add the attribute `use_iframe` (alias: `iframe`) to the shortcode and set it to `1` (eg. `[mastodon use_iframe="1"]http://my.mastodon.instance/@mastodon_user/12345[/mastodon]`)
* former fallback: to "direct" embeds if embed via iframe is forbidden (eg. when testing on localhost); use shortcode attribute `no_iframe` and set it to `1` (eg. `[mastodon no_iframe="1"]http://my.mastodon.instance/@mastodon_user/12345[/mastodon]`)
* Reverse-engineered CSS file (including LESS base) and override option (filter: mastodon_content_style)
* Uses different shortcode ('mastodon' instead of 'mastodon') if the original mastodon-embed is active as well
* Uses simple_html_dom class instead of XPath
Expand All @@ -31,12 +33,13 @@ Currently implemented features:

= Work in progress =

* Auto-Embed: An oEmbed-like embedding option (ie. just drop the URL into your post and its being automagickally turned into a proper Mastodon status embed)
* Settings screen in the admin interface
* Custom config file for advanced users (just drop it into the uploads folder, and tadaa! instant settings)

= Future plans =

* Auto-Embed: An oEmbed-like embedding option (ie. just drop the URL into your post and its being automagickally turned into a proper Mastodon status embed)
* Optionally use the regular Mastodon API to retrieve toots (requires a working mastodon user account)
* Maybe a settings page or a custom config file
* Shortcode insertion via a nice user interface in the editor
* Properly implemented shortcode asset loading via a separate class / plugin

Expand Down Expand Up @@ -89,14 +92,18 @@ All available shortcode attributes:
A. First test if there are any shortcode-interferring plugins. That could also be the original mastodon-embed. Aside of that, there was a mistake in the documentation before version 2.2.3, incorrectly stating the shortcode tag is 'mastodon_embed', while in reality it's **mastodon**.

= Q. "Center"ing on a specific toot does not work =
A. This currently only works with directly embedding the toot (set 'no_iframe' to '1'), not with the iframe method. Probably, the latter is never going to work, thanks to XSS / same-site policies in modern browsers.
A. This only works with directly embedding the toot, not with the iframe method. Probably, the latter is never going to work, thanks to XSS / same-site policies in modern browsers.

= Q. I have a question =
A. Chances are, someone else has asked it. Either check out the support forum at WP or take a look at the official issue tracker:
http://github.com/ginsterbusch/mastodon-embed/issues

== Changelog ==

= 2.5 =

* "direct embed" function is the default behaviour

= 2.4.3 =

* Replaced 'center' parameter with 'no_center', thus reversing its functionality (kinda); ie. center function is now enabled by default, but still only works in conjunction with the 'no_iframe' attribute set to '1'
Expand Down

0 comments on commit 1aa0688

Please sign in to comment.