Changeset 3630

Timestamp:

07/07/2016 05:03:29 AM (8 years ago)

Author:

pento

Message:

Breathe: Make the Welcome message dismissable.

It will re-appear if the content is changed, so folks will see updates.

Fixes #1804.

Location:

sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-breathe

Files:

• functions.php (modified) (1 diff)
• header.php (modified) (2 diffs)
• style.css (modified) (2 diffs)

sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-breathe/functions.php

@@ -7 +7 @@
 
     // Cacheing hack
-    wp_enqueue_style( 'wporg-breathe', get_stylesheet_uri(), array( 'p2-breathe' ), '20160704a' );
+    wp_enqueue_style( 'wporg-breathe', get_stylesheet_uri(), array( 'p2-breathe' ), '20160707' );
 }
 add_action( 'wp_enqueue_scripts', __NAMESPACE__ . '\styles', 11 );
+
+function inline_scripts() {
+    ?>
+    <script type="text/javascript">
+        var el = document.getElementById( 'make-welcome-hide' );
+        if ( el ) {
+            el.addEventListener( 'click', function( e ) {
+                document.cookie = el.dataset.cookie + '=' + el.dataset.hash + '; expires=Fri, 31 Dec 9999 23:59:59 GMT';
+                var wrapper = document.getElementsByClassName( 'make-welcome-wrapper' ).item( 0 );
+                if ( wrapper ) {
+                    jQuery( wrapper ).slideUp();
+                }
+            } );
+        }
+    </script>
+    <?php
+}
+add_action( 'wp_footer', __NAMESPACE__ . '\inline_scripts' );

sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-breathe/header.php

@@ -13 +13 @@
 
         <nav id="site-navigation" class="navigation-main clear" role="navigation">
-            <div class="screen-reader-text skip-link"><a href="#content" title="<?php esc_attr_e( 'Skip to content', 'p2-breathe' ); ?>"><?php _e( 'Skip to content', 'p2-breathe' ); ?></a></div>
+            <div class="screen-reader-text skip-link"><a href="#content" title="<?php _e( 'Skip to content', 'p2-breathe' ); ?>"><?php _e( 'Skip to content', 'p2-breathe' ); ?></a></div>
 
             <?php wp_nav_menu( array( 'theme_location' => 'primary', 'fallback_cb' => false ) ); ?>
@@ -23 +23 @@
 $welcome = get_page_by_path( 'welcome' );
 
-if ( $welcome ) {
+$cookie = 'welcome-' . get_current_blog_id();
+
+$hash = isset( $_COOKIE[ $cookie ] ) ? $_COOKIE[ $cookie ] : '';
+
+if ( $welcome && md5( $welcome->post_content ) !== $hash ) {
     setup_postdata( $welcome );
 ?>
-<div class="make-welcome-wrapper"><div class="make-welcome">
-    <?php
-    the_content();
-    edit_post_link( __( 'Edit', 'o2' ), '<p class="make-welcome-edit">', '</p>', $welcome->ID );
-    ?>
-</div></div>
+<div class="make-welcome-wrapper">
+    <span id="make-welcome-hide" class="dashicons dashicons-no" data-hash="<?php echo md5( $welcome->post_content ); ?>" data-cookie="<?php echo $cookie; ?>" title="<?php _e( 'Hide this message', 'p2-breathe' ); ?>"></span>
+    <div class="make-welcome">
+        <?php
+        the_content();
+        edit_post_link( __( 'Edit', 'o2' ), '<p class="make-welcome-edit">', '</p>', $welcome->ID );
+        ?>
+    </div>
+</div>
 <?php
     wp_reset_postdata();

sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-breathe/style.css

@@ -308 +308 @@
     width:100%;
     background: #eeeeee;
+    /* jQuery slideUp overrides the margin, causing the animation to be a bit funky. !important stops that. */
+    margin: -4em 0 4em 0 !important;
+}
+
+#make-welcome-hide {
+    float: right;
+    margin: 30px;
+    cursor: pointer;
 }
 
@@ -316 +324 @@
     width: 100%;
     max-width: 960px;
-    margin: calc(-4em + 16px) auto 4em auto;
+    margin: 0px auto;
     padding-bottom: 14px;
 }