Skip to content

Instantly share code, notes, and snippets.

@pommiegranit

pommiegranit/ft_shortcode.php

Last active August 29, 2015 13:57
Show Gist options
  • Save pommiegranit/9804745 to your computer and use it in GitHub Desktop.
Save pommiegranit/9804745 to your computer and use it in GitHub Desktop.
Download ZIP
WordPress Flowtime Integration
Raw
ft_shortcode.php
function ft_shortcode( $atts, $content = null){
$html_element = 'span';
if ( $atts == '' ) {
$ft_classes = 'ft-fragment';
} else {
if ( in_array( 'frag' , $atts ) )
$ft_classes = 'ft-fragment';
if ( in_array( 'shy' , $atts ) )
$ft_classes = 'ft-fragment shy';
if ( in_array( 'step' , $atts ) )
$ft_classes = 'ft-fragment step';
if ( in_array( 'stacked' , $atts ) )
$ft_classes .= ' stacked';
if ( in_array( 'stacked-center' , $atts ) )
$ft_classes .= ' stacked-center';
if ( in_array( 'stack' , $atts ) ) {
$ft_classes .= ' stack';
$html_element = 'div';
}
if ( in_array( 'stack-center' , $atts ) ) {
$ft_classes .= ' stack-center';
$html_element = 'div';
}
}
return '<' . $html_element . ' class="' . $ft_classes . '">' . do_shortcode( $content ) . '</' . $html_element . '>';
}
add_shortcode( 'ft', 'ft_shortcode' );
add_shortcode( 'ft2', 'ft_shortcode' );
add_shortcode( 'ft3', 'ft_shortcode' );
add_shortcode( 'ft4', 'ft_shortcode' );
Raw
single_presentation.php
<!DOCTYPE HTML>
<!--[if IE 6]>
<html id="ie6" lang="en-US" class="ie ie6 lt-ie9">
<![endif]-->
<!--[if IE 7]>
<html id="ie7" lang="en-US" class="ie ie7 lt-ie9">
<![endif]-->
<!--[if IE 8]>
<html id="ie8" lang="en-US" class="ie ie8 lt-ie9">
<![endif]-->
<!--[if gte IE 9]>
<html lang="en-US" class="ie ie9">
<![endif]-->
<!--[if !(IE)]><!-->
<html lang="en-US" class="">
<!--<![endif]-->
<head>
<meta charset="UTF-8">
<meta name="viewport" content="initial-scale=1.0 minimal-ui">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="author" content="marcolago">
<meta property="og:title" content="Flowtime.js A HTML Presentation Framework">
<meta property="og:type" content="website">
<meta property="og:url" content="http://flowtime-js.marcolago.com">
<meta property="og:image" content="http://flowtime-js.marcolago.com/assets/img/share-image.jpg">
<meta property="og:site_name" content="Flowtime.js">
<meta property="fb:admins" content="1293500397">
<meta name="twitter:card" content="summary">
<meta name="twitter:url" content="http://flowtime-js.marcolago.com">
<meta name="twitter:title" content="Flowtime.js - A HTML Presentation Framework">
<meta name="twitter:description" content="Flowtime.js is an open source framework for easily build HTML presentations or websites. It’s built with web standards in mind and on top of a solid full page grid layout powered by CSS3 hardware accelerated transition and comes with a complete set of Javascript API for deep customization.">
<meta name="twitter:image" content="http://flowtime-js.marcolago.com/assets/img/share-image.jpg">
<meta name="twitter:creator" content="@marcolago">
<meta name="description" content="Flowtime.js is an open source framework for easily build HTML presentations or websites. It’s built with web standards in mind and on top of a solid full page grid layout powered by CSS3 hardware accelerated transition and comes with a complete set of Javascript API for deep customization.">
<title>Flowtime.js</title>
<link rel="stylesheet" href="<?php echo plugins_url( '../flowtime/assets/css/reset.css' , __FILE__ ); ?>">
<link rel="stylesheet" href="<?php echo plugins_url( '../flowtime/css/flowtime.css' , __FILE__ ); ?>">
<link rel="stylesheet" href="<?php echo plugins_url( '../flowtime/css/themes/default.css' , __FILE__ ); ?>">
<link rel="stylesheet" href="<?php echo plugins_url( '../flowtime/assets/css/prism.css' , __FILE__ ); ?>">
<link rel="apple-touch-icon-precomposed" href="<?php echo plugins_url( '../flowtime/img/touch-icon-iphone.png' , __FILE__ ); ?>">
<link rel="apple-touch-icon-precomposed" sizes="72x72" href="<?php echo plugins_url( '../flowtime/img/touch-icon-ipad.png' , __FILE__ ); ?>">
<link rel="apple-touch-icon-precomposed" sizes="114x114" href="<?php echo plugins_url( '../flowtime/img/touch-icon-iphone-retina.png' , __FILE__ ); ?>">
<link rel="apple-touch-icon-precomposed" sizes="144x144" href="<?php echo plugins_url( '../flowtime/img/touch-icon-ipad-retina.png' , __FILE__ ); ?>">
<link rel="apple-touch-startup-image" href="<?php echo plugins_url( '../flowtime/img/startup-640x920.png' , __FILE__ ); ?>" media="(device-width: 320px) and (device-height: 480px) and (-webkit-device-pixel-ratio: 2)">
<link rel="apple-touch-startup-image" href="<?php echo plugins_url( '../flowtime/img/startup-640x1096.png' , __FILE__ ); ?>" media="(device-width: 320px) and (device-height: 568px) and (-webkit-device-pixel-ratio: 2)">
</head>
<body class="">
<div class="flowtime">
<?php
global $post;
// first page comes from the presentation
?>
<div class="ft-section" data-id="section-1">
<div id="/section-1/page-1" class="ft-page" data-id="page-1" data-title="<?php echo $post->post_title; ?>">
<div class="stack-center">
<div class="stacked-center">
<?php echo apply_filters( 'the_content' , $post->post_content ); ?>
</div>
</div>
</div>
<?php
// add the slides
$section = 1;
$s_page = 1;
$args = array (
'post_type' => 'slide',
'order' => 'ASC',
'orderby' => 'meta_value_num',
'meta_key' => 'slideorder',
'posts_per_page' => -1,
'post_parent' => $post->ID,
);
// The Query
$slides = new WP_Query( $args );
while ( $slides->have_posts() ) {
$slides->the_post();
// check order, throw new section if necessary
$slide_order = get_post_meta( get_the_ID() , 'slideorder', true );
if ( is_numeric($slide_order) ) {
if ( $slide_order > ( $section + 0.99 ) ) {
// close current section
echo '</div> <!-- section ' . $section . '-->';
// open new section
$section = floor( $slide_order );
$s_page = 0;
echo '<div class="ft-section" data-id="section-' . $section . '">';
}
$s_page += 1; //$slide_order - $section;
// output slide
echo '<div data-slideorder="' . $slide_order . '" id="/section-' . $section . '/page-' . $s_page . '" class="ft-page" data-id="page-' . $s_page . '">';
$post_title = get_the_title();
if ( substr( $post_title, 0, 1 ) != '!' )
echo '<h1>'. $post_title . '</h1>';
echo apply_filters( 'the_content' , get_the_content() ) .
'</div> <!-- slide ' . $s_page . ' -->';
}
}
echo '</div> <!-- section ' . $section . '-->';
wp_reset_postdata();
?>
</div>
</div>
<script src="<?php echo plugins_url( '../flowtime/js/brav1toolbox.js', __FILE__ ) ?>"></script>
<script src="<?php echo plugins_url( '../flowtime/js/flowtime.js' , __FILE__ ) ?>"></script>
<script src="<?php echo plugins_url( '../flowtime/assets/js/prism.js' , __FILE__ ) ?>"></script>
<script type="text/javascript">
var cacheTitle = document.title.replace("Flowtime.js | ", "");
// Configuration API test
Flowtime.showProgress(true);
Flowtime.parallaxInPx(true);
//
// event management
Flowtime.addEventListener("flowtimenavigation", onNavigation, false);
function onNavigation(e)
{
cacheTitle = document.title.replace("Flowtime.js | ", "");
}
// starts the application with configuration options
Flowtime.start();
</script>
<script type="text/javascript" src="http://slidemote.jit.su/slidemote.js#flowtime"></script>
</body>
</html>
Raw
slide_order_metabox.php
/* Displays the meta box. */
function slide_order_metabox( $post ) {
// Add an nonce field so we can check for it later.
wp_nonce_field( 'slide_order_metabox', 'slide_order_nonce' );
$slideorder = get_post_meta( $post->ID, 'slideorder' , true );
echo '<label for="slideorder">Enter as section.page</label>&nbsp;&nbsp;';
echo '<input type="text" id="slideorder" name="slideorder" value="' . esc_attr( $slideorder ) . '" size="5" />';
}
function save_slideorder( $post_id ) {
/*
* We need to verify this came from the our screen and with proper authorization,
* because save_post can be triggered at other times.
*/
// Check if our nonce is set.
if ( ! isset( $_POST['slide_order_nonce'] ) ) return $post_id;
$nonce = $_POST['slide_order_nonce'];
// Verify that the nonce is valid.
if ( ! wp_verify_nonce( $nonce, 'slide_order_metabox' ) ) return $post_id;
// If this is an autosave, our form has not been submitted, so we don't want to do anything.
if ( defined( 'DOING_AUTOSAVE' ) && DOING_AUTOSAVE ) return $post_id;
// Check the user's permissions.
if ( 'page' == $_POST['post_type'] ) {
if ( ! current_user_can( 'edit_page', $post_id ) )
return $post_id;
} else {
if ( ! current_user_can( 'edit_post', $post_id ) )
return $post_id;
}
/* OK, its safe for us to save the data now. */
// Sanitize user input.
$slideorder = sanitize_text_field( $_POST['slideorder'] );
// Update the meta field in the database.
update_post_meta( $post_id, 'slideorder', $slideorder );
}
/* Hook meta box to just the 'slide' post type. */
add_action( 'add_meta_boxes_slide' , 'my_add_meta_boxes' );
/* Add the saving of the slideorder to save_post action */
add_action( 'save_post' , 'save_slideorder' );
Raw
slide_presentation_metabox.php
/* Displays the presentation meta box. */
function slide_presentation_metabox( $post ) {
$parents = get_posts(
array(
'post_type' => 'presentation',
'orderby' => 'title',
'order' => 'ASC',
'numberposts' => -1
)
);
if ( !empty( $parents ) ) {
echo '<select name="parent_id" class="widefat">'; // !Important! Don't change the 'parent_id' name attribute.
foreach ( $parents as $parent ) {
printf( '<option value="%s"%s>%s</option>', esc_attr( $parent->ID ), selected( $parent->ID, $post->post_parent, false ), esc_html( $parent->post_title ) );
}
echo '</select>';
}
}
Raw
sorting_slides.php
function slide_list_queries( $query ) {
global $pagenow;
if ( !is_admin() ) return;
if ( 'edit.php' !== $pagenow) return $query;
if ( !isset( $_REQUEST['post_type'] ) || $_REQUEST['post_type'] != 'slide' ) return $query;
$query->set('meta_key','slideorder');
$query->set('orderby','meta_value_num');
$query->set('order','ASC');
return $query;
}
add_action( 'pre_get_posts', 'slide_list_queries' );
function edit_slides_orderby($orderby_statement) {
global $pagenow;
if ( !is_admin() ) return $orderby_statement;
if ( 'edit.php' !== $pagenow) return $orderby_statement;
if ( !isset( $_REQUEST['post_type'] ) || $_REQUEST['post_type'] != 'slide' ) return $orderby_statement;
$orderby_statement = "post_parent DESC, " . $orderby_statement;
return $orderby_statement;
}
add_filter( 'posts_orderby', 'edit_slides_orderby' );
Raw
stacked_center.html
[ft2 stack-center]<img class="stacked-center" alt="mi2-concept-art" src="http://test.dev/wp-content/uploads/2014/03/mi2-concept-art.jpg" width="1192" height="643" />[/ft2][ft2 stack-center]<img class="stacked-center ft-fragment" alt="mi2-original" src="http://test.dev/wp-content/uploads/2014/03/mi2-original.jpg" width="1192" height="643" />[/ft2][ft2 stack-center]<img class="stacked-center ft-fragment" alt="mi2-special-edition" src="http://test.dev/wp-content/uploads/2014/03/mi2-special-edition.jpg" width="1192" height="643" />[/ft2]
Raw
stacked_images.html
[ft stack]<img class="stacked" alt="mi1-stacked-0" src="http://test.dev/wp-content/uploads/2014/03/mi1-stacked-0.png" width="1280" height="576" /><img class="stacked ft-fragment" alt="mi1-stacked-1" src="http://test.dev/wp-content/uploads/2014/03/mi1-stacked-1.png" width="1280" height="576" /><img class="stacked ft-fragment" alt="mi1-stacked-2" src="http://test.dev/wp-content/uploads/2014/03/mi1-stacked-2.png" width="1280" height="576" /><img class="stacked ft-fragment" alt="mi1-stacked-3" src="http://test.dev/wp-content/uploads/2014/03/mi1-stacked-3.png" width="1280" height="576" /><img class="stacked ft-fragment" alt="mi1-stacked-4" src="http://test.dev/wp-content/uploads/2014/03/mi1-stacked-4.png" width="1280" height="576" /><img class="stacked ft-fragment" src="http://test.dev/wp-content/uploads/2014/03/mi1-stacked-5.png" width="1280" height="576" /><img class="stacked ft-fragment" alt="mi1-stacked-6" src="http://test.dev/wp-content/uploads/2014/03/mi1-stacked-6.png" width="1280" height="576" />[/ft]
Raw
template_include.php
function get_presentation_template( $original_template ) {
if ( is_singular( 'presentation' ) ) {
return dirname( __FILE__ ) . '/templates/single-presentation.php';
} else {
return $original_template;
}
}
add_filter( 'template_include', 'get_presentation_template' );
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment