Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse files

Add touch gesture support.

Includes updates and corrections to inline documentation. Closes #84.
  • Loading branch information...
commit b2d1c321998c62a08d67a0382854afbe8b9ff25b 1 parent e27f04e
Michael Sisk authored
View
104 -/js/gestures.js
@@ -0,0 +1,104 @@
+/** Enable touch gesture navigation. */
+jQuery( function( $ ) {
+ var canvas, end, start, scroll;
+
+ $( '[data-webcomic-gestures]' ).on( 'touchstart', function( e ) {
+ canvas = $( this );
+ start = e.originalEvent;
+ scroll = $( e.target );
+
+ if ( scroll.width() > $( this ).width() || scroll.height() > $( this ).height() ) {
+ scroll = {
+ x: scroll.width() > $( this ).width(),
+ y: scroll.height() > $( this ).height(),
+ e: scroll
+
+ };
+
+ while ( scroll.e = scroll.e.parent() ) {
+ if ( scroll.e.prop( 'scrollWidth' ) > scroll.e.width() || scroll.e.prop( 'scrollHeight' ) > scroll.e.height() ) {
+ break;
+ }
+
+ if ( scroll.e[ 0 ] === $( this )[ 0 ] ) {
+ scroll = false;
+
+ break;
+ }
+ }
+ } else {
+ scroll = false;
+ }
+ } );
+
+ $( '[data-webcomic-gestures]' ).on( 'touchmove', function( e ) {
+ end = e.originalEvent;
+ } );
+
+ $( '[data-webcomic-gestures]' ).on( 'touchend', function( e ) {
+ if ( end ) {
+ var x, y, a, b, d, $e;
+
+ x = end.pageX - start.pageX;
+ y = end.pageY - start.pageY;
+ a = Math.abs( x );
+ b = Math.abs( y );
+
+ if ( a > b ) {
+ d = 0 > x ? 'left' : 'right';
+ } else {
+ d = 0 > y ? 'up' : 'down';
+ }
+
+ if ( !webcomic_scrolling( d ) ) {
+ if ( 1 === end.touches.length ) {
+ if ( 'left' === d ) {
+ $e = $( '.previous-webcomic-link[href]:first', canvas );
+ } else if ( 'right' === d ) {
+ $e = $( '.next-webcomic-link[href]:first', canvas );
+ }
+ } else if ( 2 == end.touches.length ) {
+ if ( 'left' === d ) {
+ $e = $( '.first-webcomic-link[href]:first', canvas );
+ } else if ( 'right' === d ) {
+ $e = $( '.last-webcomic-link[href]:first', canvas );
+ } else if ( 'up' === d ) {
+ $e = $( '.purchase-webcomic-link[href]:first', canvas );
+ } else if ( 'down' === d ) {
+ $e = $( '.random-webcomic-link[href]:first', canvas );
+ }
+ }
+
+ if ( $e && $e.length ) {
+ e.preventDefault();
+
+ if ( $e.closest( '[data-webcomic-container]' ).length ) {
+ $e.trigger( 'click' );
+ } else {
+ window.location.href = $e.attr( 'href' );
+ }
+ }
+ }
+ }
+ } );
+
+ $( '[data-webcomic-gestures]' ).on( 'touchcancel', function( e ) {
+ end = start = scroll = false;
+ } );
+
+ function webcomic_scrolling( direction ) {
+ if ( scroll && 1 === end.touches.length ) {
+ if ( 'left' === direction && scroll.x ) {
+ return scroll.e.prop( 'scrollWidth' ) - scroll.e.scrollLeft() !== scroll.e.outerWidth();
+ } else if ( 'right' === direction && scroll.x ) {
+ return 0 !== scroll.e.scrollLeft();
+ } else if ( 'up' === direction && scroll.y ) {
+ return scroll.e.prop( 'scrollHeight' ) - scroll.e.scrollTop() === scroll.e.outerHeight();
+ } else if ( 'down' === direction && scroll.y ) {
+ return 0 !== scroll.e.scrollTop();
+ }
+ }
+
+ return false;
+ }
+} );
View
1  -/php/admin.php
@@ -92,6 +92,7 @@ public function activate() {
'thanks' => true,
'convert' => false,
'dynamic' => false,
+ 'gestures' => false,
'integrate' => false,
'shortcuts' => false,
'uninstall' => false,
View
2  -/php/config.php
@@ -230,6 +230,7 @@ public function integrate() {
public function navigate() {
?>
<label><input type="checkbox" name="webcomic_dynamic" id="webcomic_dynamic"<?php checked( self::$config[ 'dynamic' ] ); ?>> <?php _e( 'Enable dynamic webcomic navigation', 'webcomic' ); ?></label><br>
+ <label><input type="checkbox" name="webcomic_gestures"<?php checked( self::$config[ 'gestures' ] ); ?>> <?php _e( 'Enable touch gestures for webcomic navigation', 'webcomic' ); ?></label><br>
<label><input type="checkbox" name="webcomic_shortcuts"<?php checked( self::$config[ 'shortcuts' ] ); ?>> <?php _e( 'Enable keyboard shortcuts for webcomic navigation', 'webcomic' ); ?></label>
<?php
}
@@ -1009,6 +1010,7 @@ public function save( $options ) {
}
} else {
self::$config[ 'dynamic' ] = isset( $_POST[ 'webcomic_dynamic' ] );
+ self::$config[ 'gestures' ] = isset( $_POST[ 'webcomic_gestures' ] );
self::$config[ 'integrate' ] = isset( $_POST[ 'webcomic_integrate' ] );
self::$config[ 'shortcuts' ] = isset( $_POST[ 'webcomic_shortcuts' ] );
self::$config[ 'uninstall' ] = isset( $_POST[ 'webcomic_uninstall' ] );
View
22 -/php/help.php
@@ -328,7 +328,7 @@ private function sidebar() {
<hr>
<p><a href="support@webcomic.nu">%s</a></p>',
__( 'For more information:', 'webcomic' ),
- __( "Beginners Guide", 'webcomic' ),
+ __( "Beginner's Guide", 'webcomic' ),
__( 'Video Tutorials', 'webcomic' ),
__( 'Support Forum', 'webcomic' ),
__( 'Issue Tracker', 'webcomic' ),
@@ -940,28 +940,12 @@ private function settings_general() {
<p>%s</p>
<ul>
<li>%s</li>
- <li>
- %s
- <ul>
- <li>%s</li>
- <li>%s</li>
- <li>%s</li>
- <li>%s</li>
- <li>%s</li>
- <li>%s</li>
- </ul>
- </li>
+ <li>%s</li>
<li>%s</li>
</ul>',
__( 'The settings on this page affect your entire site:', 'webcomic' ),
__( "<strong>Integrate</strong> - Webcomic will attempt to automatically integrate basic functionality into your site. Integration may not work with certain WordPress themes and plugins.", 'webcomic' ),
- __( '<strong>Navigate</strong> - Changes how users browse through webcomics on your site. Dynamic navigation will attempt to load webcomics without refreshing the page. This makes browsing significantly faster, but may not work in all situations and will affect cost per impression advertising. When shortcuts are enabled users can press the following button combinations to navigate through webcomics:', 'webcomic' ),
- __( '<em>&larr;</em> Previous Webcomic', 'webcomic' ),
- __( '<em>&rarr;</em> Next Webcomic', 'webcomic' ),
- __( '<em>Shift + &larr;</em> First Webcomic', 'webcomic' ),
- __( '<em>Shift + &rarr;</em> Last Webcomic', 'webcomic' ),
- __( '<em>Shift + &darr;</em> Random Webcomic', 'webcomic' ),
- __( '<em>Shift + &uarr;</em> Purchase Webcomic', 'webcomic' ),
+ sprintf( __( '<strong>Navigate</strong> - Changes how users browse through webcomics on your site. <a href="%1$s" target="_blank">Dynamic navigation</a> will attempt to load webcomics without refreshing the page. This makes browsing significantly faster, but may not work in all situations and will affect cost per impression advertising. When <a href="%2$s" target="_blank">touch gestures</a> are enabled readers can use various touch gestures to navigate your webcomics. When <a href="%3$s" target="_blank">keyboard shortcuts</a> are enabled users can press certain button combinations to navigate through webcomics.', 'webcomic' ), '//github.com/mgsisk/webcomic/wiki/Dynamic-Navigation', '//github.com/mgsisk/webcomic/wiki/Touch-Gestures', '//github.com/mgsisk/webcomic/wiki/Keyboard-Shortcuts' ),
__( '<strong>Uninstall</strong> - Deletes all data associated with Webcomic when the plugin is deactivated, including settings, webcomics, storylines, characters, transcripts, and languages (this cannot be undone; uploaded media will not be deleted). You may optionally choose to convert webcomics and transcripts into posts, storylines into categories, and characters and languages into tags.', 'webcomic' )
);
}
View
2  -/php/integrate/loop_start.php
@@ -32,7 +32,7 @@
<?php } ?>
<?php if ( is_front_page() ) { ?>
- <div data-webcomic-container="integrated">
+ <div data-webcomic-container="integrated" data-webcomic-shortcuts data-webcomic-gestures>
<div class="integrated-webcomic">
<nav class="webcomic-above"><?php first_webcomic_link(); previous_webcomic_link(); random_webcomic_link(); next_webcomic_link(); last_webcomic_link(); ?></nav><!-- .webcomic-above -->
<div class="webcomic-img"><?php the_webcomic( 'full', 'next' ); ?></div><!-- .webcomic-img -->
View
16 -/php/upgrade.php
@@ -14,12 +14,17 @@ class WebcomicUpgrade extends Webcomic {
* @uses Webcomic::$config
* @uses Webcomic::$version
* @uses WebcomicUpgrade::_403
+ * @uses WebcomicUpgrade::_406
*/
public function __construct() {
if ( version_compare( self::$config[ 'version' ], '4.0.3', '<' ) ) {
$this->_403();
}
+ if ( version_compare( self::$config[ 'version' ], '4.0.6', '<' ) ) {
+ $this->_406();
+ }
+
self::$config[ 'version' ] = self::$version;
update_option( 'webcomic_options', self::$config );
@@ -44,4 +49,15 @@ private function _403() {
}
}
}
+
+ /** Upgrade to 4.0.6
+ *
+ * @seeh github.com/mgsisk/webcomic/issues/84
+ * @uses Webcomic::$config
+ */
+ private function _406() {
+ if ( empty( self::$config[ 'gestures' ] ) ) {
+ self::$config[ 'gestures' ] = false;
+ }
+ }
}
View
2  readme.md
@@ -39,7 +39,7 @@ Once installed and activated you can use Webcomic in one of three ways:
### Where can I get help with Webcomic?
-- [Beginners Guide](//github.com/mgsisk/webcomic/wiki)
+- [Beginner's Guide](//github.com/mgsisk/webcomic/wiki)
- [Video Tutorials](//vimeo.com/channels/webcomic)
- [Support Forum](//groups.google.com/d/forum/webcomicnu)
- [Issue Tracker](//github.com/mgsisk/webcomic/issues)
View
6 webcomic.php
@@ -894,6 +894,12 @@ public function wp_enqueue_scripts() {
wp_enqueue_script( 'webcomic-dynamic' );
}
+ if ( self::$config[ 'gestures' ] ) {
+ wp_register_script( 'webcomic-gestures', self::$url . '-/js/gestures.js', array( 'jquery' ), false, true );
+
+ wp_enqueue_script( 'webcomic-gestures' );
+ }
+
wp_register_script( 'webcomic-dropdown', self::$url . '-/js/dropdown.js', array( 'jquery' ), false, true );
wp_enqueue_script( 'webcomic-dropdown' );
}
Please sign in to comment.
Something went wrong with that request. Please try again.