diff --git a/content-reference-archive.php b/content-reference-archive.php index 345fa49..825c27e 100644 --- a/content-reference-archive.php +++ b/content-reference-archive.php @@ -17,4 +17,17 @@

Source: :

+ post_count; + $uses = get_uses()->post_count; + ?> +
+ Used by + | + Uses + #examples">2 examples + */ ?> +
\ No newline at end of file diff --git a/content-reference.php b/content-reference.php index 6b0030c..cb93b23 100644 --- a/content-reference.php +++ b/content-reference.php @@ -44,11 +44,50 @@ - -
Used by TODO | Uses TODO | TODO Examples
+ +
+
+
+

+ +
+ +
+

+ +
+ +
- */ ?> post_name, $b->post_name ); } + function show_usage_info() { + $p2p_enabled = function_exists( 'p2p_register_connection_type' ); + + return $p2p_enabled && post_type_has_usage_info( get_post_type() ); + } + + /** + * Does the post type support usage information? + * + * @param string $post_type Optional. The post type name. If blank, assumes current post type. + * + * @return boolean + */ + function post_type_has_usage_info( $post_type = null ) { + $post_type = $post_type ? $post_type : get_post_type(); + $post_types_with_usage = array( 'wp-parser-function', 'wp-parser-method', 'wp-parser-hook' ); + + return in_array( $post_type, $post_types_with_usage ); + } + + /** + * Does the post type support uses information? + * + * @param string $post_type Optional. The post type name. If blank, assumes current post type. + * + * @return boolean + */ + function post_type_has_uses_info( $post_type = null ) { + $post_type = $post_type ? $post_type : get_post_type(); + $post_types_with_uses = array( 'wp-parser-function', 'wp-parser-method' ); + + return in_array( $post_type, $post_types_with_uses ); + } + + /** + * Retrieve a WP_Query object for the posts that the current post uses + * + * @return WP_Query A WP_Query object for the posts the current post uses + */ + function get_uses() { + + if ( 'wp-parser-function' === get_post_type() ) { + $connection_types = array( 'functions_to_functions', 'functions_to_methods', 'functions_to_hooks' ); + } else { + $connection_types = array( 'methods_to_functions', 'methods_to_methods', 'methods_to_hooks' ); + } + + $connected = new \WP_Query( array( + 'post_type' => array( 'wp-parser-function', 'wp-parser-method', 'wp-parser-hook' ), + 'connected_type' => $connection_types, + 'connected_direction' => array( 'from', 'from', 'from' ), + 'connected_items' => get_the_ID(), + 'nopaging' => true, + ) ); + + return $connected; + } + + function get_used_by( $post_id = null ) { + + if ( empty( $post_id ) ) { + $post_id = get_the_ID(); + } + + switch ( get_post_type() ) { + + case 'wp-parser-function': + $connection_types = array( 'functions_to_functions', 'methods_to_functions' ); + break; + + case 'wp-parser-method': + $connection_types = array( 'functions_to_methods', 'methods_to_methods', ); + break; + + case 'wp-parser-hook': + $connection_types = array( 'functions_to_hooks', 'methods_to_hooks' ); + break; + } + + $connected = new \WP_Query( array( + 'post_type' => array( 'wp-parser-function', 'wp-parser-method' ), + 'connected_type' => $connection_types, + 'connected_direction' => array( 'to', 'to' ), + 'connected_items' => $post_id, + 'nopaging' => true, + ) ); + + return $connected; + } + /** * Does the post type have source code? * diff --git a/inc/user-content.php b/inc/user-content.php index e85cf3e..c7dbca6 100644 --- a/inc/user-content.php +++ b/inc/user-content.php @@ -61,14 +61,23 @@ public static function do_init() { * Enqueues scripts and styles. */ public static function scripts_and_styles() { - if ( is_singular() && ( '0' != get_comments_number() || \DevHub\post_type_has_source_code() ) ) { - wp_enqueue_script( 'wporg-developer-function-reference', get_template_directory_uri() . '/js/function-reference.js', array( 'jquery', 'syntaxhighlighter-core', 'syntaxhighlighter-brush-php' ), '20140515', true ); - wp_enqueue_style( 'syntaxhighlighter-core' ); - wp_enqueue_style( 'syntaxhighlighter-theme-default' ); - - wp_enqueue_script( 'wporg-developer-user-notes', get_template_directory_uri() . '/js/user-notes.js', array(), '20140912', true ); - if ( get_option( 'thread_comments' ) ) { - wp_enqueue_script( 'comment-reply' ); + if ( is_singular() ) { + wp_enqueue_script( 'wporg-developer-function-reference', get_template_directory_uri() . '/js/function-reference.js', array( 'jquery' ), '20140515', true ); + + if ( \DevHub\post_type_has_source_code() ) { + wp_enqueue_script( 'syntaxhighlighter-core' ); + wp_enqueue_script( 'syntaxhighlighter-brush-php' ); + + wp_enqueue_style( 'syntaxhighlighter-core' ); + wp_enqueue_style( 'syntaxhighlighter-theme-default' ); + } + + if ( '0' != get_comments_number() ) { + wp_enqueue_script( 'wporg-developer-user-notes', get_template_directory_uri() . '/js/user-notes.js', array(), '20140912', true ); + + if ( get_option( 'thread_comments' ) ) { + wp_enqueue_script( 'comment-reply' ); + } } } } diff --git a/js/function-reference.js b/js/function-reference.js index ee80690..99c177b 100644 --- a/js/function-reference.js +++ b/js/function-reference.js @@ -4,25 +4,24 @@ * Handles all interactivity on the single function page */ ( function( $ ) { - var $sourceContent, $sourceCodeContainer, $sourceCodeTable, $showCompleteSource, $lessCompleteSource, sourceCollapsedHeight; - - function toggleCompleteSource( e ) { - e.preventDefault(); + 'use strict'; - if ( $showCompleteSource.is(':visible') ) { - var heightGoal = $sourceCodeTable.height() + 45; // takes into consideration potential x-scrollbar - } else { - var heightGoal = sourceCollapsedHeight; - } + var $sourceContent, $sourceCodeContainer, $sourceCodeTable, $showCompleteSource, $lessCompleteSource, sourceCollapsedHeight; - $sourceCodeContainer.animate( { height: heightGoal + 'px' } ); + var $usesList, $usedByList, $showMoreUses, $hideMoreUses, $showMoreUsedBy, $hideMoreUsedBy; - $showCompleteSource.toggle(); - $lessCompleteSource.toggle(); + function onLoad() { + sourceCodeHighlightInit(); + toggleUsageListInit(); } - function onLoad() { + function sourceCodeHighlightInit() { + + // We require the SyntaxHighlighter javascript library + if ( undefined === window.SyntaxHighlighter ) { + return; + } // We only expect one source-content per document $sourceContent = $( '.source-content' ); @@ -49,7 +48,61 @@ $showCompleteSource.on( 'click', toggleCompleteSource ); $lessCompleteSource.on( 'click', toggleCompleteSource ); } + } + + function toggleCompleteSource( e ) { + e.preventDefault(); + + if ( $showCompleteSource.is(':visible') ) { + var heightGoal = $sourceCodeTable.height() + 45; // takes into consideration potential x-scrollbar + } else { + var heightGoal = sourceCollapsedHeight; + } + + $sourceCodeContainer.animate( { height: heightGoal + 'px' } ); + + $showCompleteSource.toggle(); + $lessCompleteSource.toggle(); + + } + + function toggleUsageListInit() { + + // We only expect one used_by and uses per document + $usedByList = $( '.used-by' ).find( 'li' ); + $usesList = $( '.uses' ).find( 'li' ); + + if ( $usedByList.length > 5 ) { + $usedByList = $usedByList.slice( 5 ).hide(); + + $showMoreUsedBy = $( '.used-by .show-more' ).show().on( 'click', toggleMoreUsedBy ); + $hideMoreUsedBy = $( '.used-by .hide-more' ).on( 'click', toggleMoreUsedBy ); + } + + if ( $usesList.length > 5 ) { + $usesList = $usesList.slice( 5 ).hide(); + + $showMoreUses = $( '.uses .show-more' ).show().on( 'click', toggleMoreUses ); + $hideMoreUses = $( '.uses .hide-more' ).on( 'click', toggleMoreUses ); + } + } + + function toggleMoreUses( e ) { + e.preventDefault(); + + $usesList.toggle(); + + $showMoreUses.toggle(); + $hideMoreUses.toggle(); + } + + function toggleMoreUsedBy( e ) { + e.preventDefault(); + + $usedByList.toggle(); + $showMoreUsedBy.toggle(); + $hideMoreUsedBy.toggle(); } $( onLoad ); diff --git a/scss/_mixins.scss b/scss/_mixins.scss new file mode 100644 index 0000000..62aae3c --- /dev/null +++ b/scss/_mixins.scss @@ -0,0 +1,11 @@ +@mixin clearfix { + &:before, + &:after { + content: " "; + display: table; + } + + &:after { + clear: both; + } +} \ No newline at end of file diff --git a/scss/main.scss b/scss/main.scss index 897267b..67a0ab5 100644 --- a/scss/main.scss +++ b/scss/main.scss @@ -1,6 +1,8 @@ @import "reset"; @import "global"; +@import "mixins"; + .home .devhub-wrap { #content { padding: 0; @@ -886,6 +888,8 @@ } .wp-parser-class, .wp-parser-function, .wp-parser-hook, .wp-parser-method { border-bottom: 1px solid #dfdfdf; + + @include clearfix(); h1 { margin: 24px 0; padding-left: 100px; @@ -966,6 +970,36 @@ } } + /* = Usage + ----------------------------------------------- */ + .usage { + @include clearfix; + + article { + float: left; + width: 50%; + } + + .used-by { + padding-right: 30px; + } + + .uses { + padding-left: 30px; + } + + ul { + line-height: 1.7; // Slightly increase the line height for more readability + list-style-type: none; + margin: 0; + } + + .show-more, .hide-more { + display: none; + } + } + + .source-content { overflow: auto; } @@ -1203,6 +1237,17 @@ } } } + + &.archive, &.search { + .meta { + font-size: 100%; + margin-bottom: 1.5em; + + a { + color: #21759b; + } + } + } } @media ( max-width: 59.999999em ) { @@ -1229,6 +1274,20 @@ } } +@media ( min-width: 43em ) { + .devhub-wrap { + &.archive, &.search { + .meta { + float: right; + } + + .sourcefile { + float: left; + } + } + } +} + @media ( max-width: 43em ) { #content-area.has-sidebar { @@ -1313,5 +1372,11 @@ .two-columns .box { width: 99%; } + + .usage { + article { + width: 100%; + } + } } } \ No newline at end of file diff --git a/stylesheets/main.css b/stylesheets/main.css index db6736e..8cf0cb0 100644 --- a/stylesheets/main.css +++ b/stylesheets/main.css @@ -298,6 +298,8 @@ input { /* * section styles */ + /* = Usage + ----------------------------------------------- */ /* Comments */ /* * Content @@ -1097,6 +1099,13 @@ input { .devhub-wrap .wp-parser-class, .devhub-wrap .wp-parser-function, .devhub-wrap .wp-parser-hook, .devhub-wrap .wp-parser-method { border-bottom: 1px solid #dfdfdf; } +.devhub-wrap .wp-parser-class:before, .devhub-wrap .wp-parser-class:after, .devhub-wrap .wp-parser-function:before, .devhub-wrap .wp-parser-function:after, .devhub-wrap .wp-parser-hook:before, .devhub-wrap .wp-parser-hook:after, .devhub-wrap .wp-parser-method:before, .devhub-wrap .wp-parser-method:after { + content: " "; + display: table; +} +.devhub-wrap .wp-parser-class:after, .devhub-wrap .wp-parser-function:after, .devhub-wrap .wp-parser-hook:after, .devhub-wrap .wp-parser-method:after { + clear: both; +} .devhub-wrap .wp-parser-class h1, .devhub-wrap .wp-parser-function h1, .devhub-wrap .wp-parser-hook h1, .devhub-wrap .wp-parser-method h1 { margin: 24px 0; padding-left: 100px; @@ -1157,6 +1166,31 @@ input { .devhub-wrap .single .wp-parser-class, .devhub-wrap .single .wp-parser-function, .devhub-wrap .single .wp-parser-hook, .devhub-wrap .single .wp-parser-method { border-bottom-style: none; } +.devhub-wrap .usage:before, .devhub-wrap .usage:after { + content: " "; + display: table; +} +.devhub-wrap .usage:after { + clear: both; +} +.devhub-wrap .usage article { + float: left; + width: 50%; +} +.devhub-wrap .usage .used-by { + padding-right: 30px; +} +.devhub-wrap .usage .uses { + padding-left: 30px; +} +.devhub-wrap .usage ul { + line-height: 1.7; + list-style-type: none; + margin: 0; +} +.devhub-wrap .usage .show-more, .devhub-wrap .usage .hide-more { + display: none; +} .devhub-wrap .source-content { overflow: auto; } @@ -1331,6 +1365,13 @@ input { .devhub-wrap ul.items li a { color: #555 !important; } +.devhub-wrap.archive .meta, .devhub-wrap.search .meta { + font-size: 100%; + margin-bottom: 1.5em; +} +.devhub-wrap.archive .meta a, .devhub-wrap.search .meta a { + color: #21759b; +} @media (max-width: 60em) { .devhub-wrap { @@ -1351,6 +1392,14 @@ input { padding-left: 0; } } +@media (min-width: 43em) { + .devhub-wrap.archive .meta, .devhub-wrap.search .meta { + float: right; + } + .devhub-wrap.archive .sourcefile, .devhub-wrap.search .sourcefile { + float: left; + } +} @media (max-width: 43em) { #content-area.has-sidebar main { float: right; @@ -1423,4 +1472,7 @@ input { .devhub-wrap .two-columns .box { width: 99%; } + .devhub-wrap .usage article { + width: 100%; + } }