Changeset 466654

Timestamp:

11/23/2011 06:06:12 PM (13 years ago)

Author:

taylorde

Message:

actually uploading 0.1.3's trunk

Location:

tdd-progress-bar/trunk

Files:

• css/default.css (modified) (1 diff)
• inc/admin.php (modified) (11 diffs)
• js/animate.js (modified) (1 diff)
• readme.txt (modified) (3 diffs)
• screenshot-2.png (modified) (previous)
• tdd-progress-bar.php (modified) (10 diffs)

tdd-progress-bar/trunk/css/default.css

@@ -18 +18 @@
 
 .red {
-    background-position-y:0;
+    background-position0;
     }
 
 .race .red {
-    background-position-y:-12px;
+    background-position-12px;
     }
 
 .orange {
-    background-position-y:-50px;
+    background-position-50px;
     }
 
 .race .orange {
-    background-position-y:-62px;
+    background-position-62px;
     }
 
 .yellow {
-    background-position-y:-100px;
+    background-position-100px;
     }
 
 .race .yellow {
-    background-position-y:-112px;
+    background-position-112px;
     }
 
 .green {
-    background-position-y:-150px;
+    background-position-150px;
     }
 
 .race .green {
-    background-position-y:-162px;
+    background-position-162px;
     }
 
 .teal {
-    background-position-y:-200px;
+    background-position-200px;
     }
 
 .race .teal {
-    background-position-y:-212px;
+    background-position-212px;
     }
 
 .lightblue {
-    background-position-y:-250px;
+    background-position-250px;
     }
 
 .race .lightblue {
-    background-position-y:-262px;
+    background-position-262px;
     }
 
 .blue {
-    background-position-y:-300px;
+    background-position-300px;
     }
 
 .race .blue {
-    background-position-y:-312px;
+    background-position-312px;
     }
 
 .purple {
-    background-position-y:-350px;
+    background-position-350px;
     }
 
 .race .purple {
-    background-position-y:-362px;
+    background-position-362px;
     }
 
 .fuchsia {
-    background-position-y:-400px;
+    background-position-400px;
     }
     
 .race .fuchsia {
-    background-position-y:-415px;
+    background-position-415px;
     }
 
 .strawberry {
-    background-position-y:-450px;
+    background-position-450px;
     }
     
 .race .strawberry {
-    background-position-y:-415px;
+    background-position5px;
     }
 

tdd-progress-bar/trunk/inc/admin.php

@@ -1 +1 @@
 <?php
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
 /*
 * Setup custom meta boxes for the tdd_bp custom post type page
 */
 function tdd_pb_metabox_create() {
-    add_meta_box( 'tdd_pb_meta', 'Progress Bar Options', 'tdd_pb_metabox_display', 'tdd_pb' );
+    add_meta_box( 'tdd_pb_meta', , 'tdd_pb_metabox_display', 'tdd_pb' );
 }
 add_action( 'add_meta_boxes', 'tdd_pb_metabox_create' );
 
+
+
+
 function tdd_pb_metabox_display($post) {
-/*
-        bar specific options:
-            - color/graphic
-            - percentage (or API call)
-*/
     $tdd_pb_color = get_post_meta( $post->ID, '_tdd_pb_color', true );
     $tdd_pb_percentage = get_post_meta( $post->ID, '_tdd_pb_percentage', true );
-
 ?>
 
@@ -23 +37 @@
             <th scope="row"><label for="td_pb_color">Bar Color</label></th>
             <td><select name="tdd_pb_color">
-                <option value="strawberry" <?php selected( $tdd_pb_color, 'strawberry' ); ?>>Strawberry</option>
-                <option value="fuchsia" <?php selected( $tdd_pb_color, 'fuchsia' ); ?>>Fuchsia</option>
-                <option value="purple" <?php selected( $tdd_pb_color, 'purple' ); ?>>Purple</option>
-                <option value="blue" <?php selected( $tdd_pb_color, 'blue' ); ?>>Blue</option>
-                <option value="lightblue" <?php selected( $tdd_pb_color, 'lightblue' ); ?>>Light Blue</option>
-                <option value="teal" <?php selected( $tdd_pb_color, 'teal' ); ?>>Teal</option>
-                <option value="green" <?php selected( $tdd_pb_color, 'green' ); ?>>Green</option>
-                <option value="yellow" <?php selected( $tdd_pb_color, 'yellow' ); ?>>Yellow</option>
-                <option value="orange" <?php selected( $tdd_pb_color, 'orange' ); ?>>Orange</option>
-                <option value="red" <?php selected( $tdd_pb_color, 'red' ); ?>>Red</option>
+                <?php global $colors; ?>
+                <?php foreach ($colors as $color=>$label ): ?>
+                    <option value="<?php echo $color; ?>" <?php selected( $tdd_pb_color, $color ); ?>"><?php echo $label; ?></option>
+                <?php endforeach; ?>
                 </select></td>
         </tr>
@@ -40 +48 @@
         </tr>
     </table>
-
-    <p>Example shortcode: <code>[progress id=<?php the_ID(); ?>]</code> </p>
+    <?php $id = get_the_ID(); ?>
+    <p><?php _e( "Example shortcode: <code>[progress id={$id}]</code>", 'tdd_pb'); ?> </p>
+    
+    <?php echo tdd_pb_get_bars( array(
+        'ids' => array( get_the_ID() ),
+        'class' => 'race',
+    ) );
+    ?>
+    
 <?php
 }
@@ -68 +83 @@
     unset($columns['date']);
     return array_merge($columns, 
-              array('percentage' => 'Percentage',
-                    'color' => 'Color' ,
+              array('progress_bar' => 'Progress Bar',
                     'shortcode' => 'Shortcode',
                     'date' => __('Date'),
@@ -84 +98 @@
     
     switch ( $column ){
-        case 'color':
-            echo get_post_meta( $post->ID, '_tdd_pb_color', true );
-            break;
-        case 'percentage':
-            echo get_post_meta( $post->ID, '_tdd_pb_percentage', true ) . '% complete';
+        case 'progress_bar':
+            echo tdd_pb_get_bars( array( 
+                'ids' => array( $post->ID ),
+                'class' => 'race',
+            ) );
+
             break;
         case 'shortcode':
-            echo '<code>[progress id='. $post->ID .']';
+            echo '<code>[progress id='. $post->ID .']';
             break;
     }
 }
 add_action( 'manage_posts_custom_column' , 'tdd_pb_custom_columns' );
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
 
 
@@ -107 +234 @@
 <div class="wrap">
     <?php screen_icon( 'plugins' ); ?>
-    <h2>TDD Progress Bars</h2>
+    <h2></h2>
     
     <form action="options.php" method="post">
     <?php settings_fields( 'tdd_pb_options' ); ?>
     <?php do_settings_sections(  __FILE__ ); ?>
-    <input name="Submit" type="submit" value="Save Changes" class="button-primary" />
+    <input name="Submit" type="submit" value="" class="button-primary" />
     </form>
 </div>
@@ -123 +250 @@
     
     //register Scripts and Styles section & controls
-    add_settings_section( 'tdd_pb_sas', 'Scripts and Styles', 'tdd_pb_admin_sasheader', __FILE__ );
-    add_settings_field( 'animate', 'Animate Bars', 'tdd_pb_admin_form_animate', __FILE__ , 'tdd_pb_sas' );
-    add_settings_field( 'default_css', 'Use Default CSS', 'tdd_pb_admin_form_default_css', __FILE__, 'tdd_pb_sas');
+    add_settings_section( 'tdd_pb_sas', , 'tdd_pb_admin_sasheader', __FILE__ );
+    add_settings_field( 'animate', , 'tdd_pb_admin_form_animate', __FILE__ , 'tdd_pb_sas' );
+    add_settings_field( 'default_css', , 'tdd_pb_admin_form_default_css', __FILE__, 'tdd_pb_sas');
 
     //register Percent section & controls
-    add_settings_section( 'tdd_pb_percent', 'Percentage Displays', 'tdd_pb_admin_percentheader', __FILE__ );
-    add_settings_field( 'display_percentage', 'Display Percent Complete', 'tdd_pb_admin_form_perecent_display', __FILE__, 'tdd_pb_percent' );
-    add_settings_field( 'percentage_color', 'Color of Percentage Text', 'tdd_pb_admin_form_percentage_color', __FILE__, 'tdd_pb_percent' );
-    add_settings_field( 'bar_background_color', 'Color of Bar Background', 'tdd_pb_admin_form_bar_background_color', __FILE__, 'tdd_pb_percent' );
+    add_settings_section( 'tdd_pb_percent', , 'tdd_pb_admin_percentheader', __FILE__ );
+    add_settings_field( 'display_percentage', , 'tdd_pb_admin_form_perecent_display', __FILE__, 'tdd_pb_percent' );
+    add_settings_field( 'percentage_color', , 'tdd_pb_admin_form_percentage_color', __FILE__, 'tdd_pb_percent' );
+    add_settings_field( 'bar_background_color', , 'tdd_pb_admin_form_bar_background_color', __FILE__, 'tdd_pb_percent' );
 
 }
@@ -138 +265 @@
 //Scripts & Styles section header
 function tdd_pb_admin_sasheader(){
-    echo "<p>The following two boxes allow you to stop including the animation javascript and the default CSS on each page load. It's highly suggested that you don't turn off the Default CSS option unless you have a replacement in mind. The Animate Bars option can be turned off freely if you'd prefer the bars didn't have that cool animation (or you want to save HTTP requests).</p>";
+    ;
 }
 
@@ -145 +272 @@
     $options = get_option('tdd_pb_options');
     $checked = ($options['animate']) ? ' checked="checked" ' : '';
-    echo "<input name='tdd_pb_options[animate]' id='animate' type='checkbox' ". $checked ."> <br />
-            <small>This script depends on jQuery, so it will ensure that is loaded as well</small>";
+    echo "<input name='tdd_pb_options[animate]' id='animate' type='checkbox' ". $checked ."> <br />
+    ;
 }
 
@@ -159 +286 @@
 //Percentage displays section header
 function tdd_pb_admin_percentheader(){
-echo "<p>By default, the percentage progress is displayed in the bar. This allows you to optionally turn that off and/or set the color of the text</p>";
+;
 }
 
@@ -173 +300 @@
 function tdd_pb_admin_form_percentage_color(){
     $options = get_option('tdd_pb_options');
-    echo "#<input name='tdd_pb_options[percentage_color]' id='percentage_color' type='text' value='{$options['percentage_color']}' maxlength='6' size='6' />";
+    ;
 }
 

tdd-progress-bar/trunk/js/animate.js

@@ -1 +1 @@
 jQuery(document).ready(function($){
 
-    var i = -700;
+    /* http://keith-wood.name/backgroundPos.html
+       Background position animation for jQuery v1.0.1.
+       Written by Keith Wood (kbwood{at}iinet.com.au) November 2010.
+       Dual licensed under the GPL (http://dev.jquery.com/browser/trunk/jquery/GPL-LICENSE.txt) and 
+       MIT (http://dev.jquery.com/browser/trunk/jquery/MIT-LICENSE.txt) licenses. 
+       Please attribute the author if you use it. */
+    (function($){var g='bgPos';$.fx.step['backgroundPosition']=$.fx.step['background-position']=function(a){if(!a.set){var b=$(a.elem);var c=b.data(g);b.css('backgroundPosition',c);a.start=parseBackgroundPosition(c);a.end=parseBackgroundPosition($.fn.jquery>='1.6'?a.end:a.options.curAnim['backgroundPosition']||a.options.curAnim['background-position']);for(var i=0;i<a.end.length;i++){if(a.end[i][0]){a.end[i][1]=a.start[i][1]+(a.end[i][0]=='-='?-1:+1)*a.end[i][1]}}a.set=true}$(a.elem).css('background-position',((a.pos*(a.end[0][1]-a.start[0][1])+a.start[0][1])+a.end[0][2])+' '+((a.pos*(a.end[1][1]-a.start[1][1])+a.start[1][1])+a.end[1][2]))};function parseBackgroundPosition(c){var d={center:'50%',left:'0%',right:'100%',top:'0%',bottom:'100%'};var e=c.split(/ /);var f=function(a){var b=(d[e[a]]||e[a]||'50%').match(/^([+-]=)?([+-]?\d+(\.\d*)?)(.*)$/);e[a]=[b[1],parseFloat(b[2]),b[4]||'px']};if(e.length==1&&$.inArray(e[0],['top','bottom'])>-1){e[1]=e[0];e[0]='50%'}f(0);f(1);return e}$.fn.animate=function(e){return function(a,b,c,d){if(a['backgroundPosition']||a['background-position']){this.data(g,this.css('backgroundPosition')||'center')}return e.apply(this,[a,b,c,d])}}($.fn.animate)})(jQuery);
 
-    setInterval(function() {
-    
-            $('.tdd_pb_bar').animate( {'background-position-x': i}, 18000, 'linear' );
-            i = i - 700;
 
-    } , 1000);
+    //Width of graphic in pixels. Just to keep things logical.
+    //Also the amount that it will move every x seconds...
+    var i = -400;
 
-});
+    //for each .tdd_pb_bar, set a function that does this thing...
+    $('.tdd_pb_bar').each(function(index,value){
+
+        //Get the background position (x and y), split into an array
+        var currbackgroundposn = $(value).css('background-position').split(' ', 2 );
+        var x = Number(currbackgroundposn[0].split('px',1));
+        var y = currbackgroundposn[1];
+
+        //Run it once to start us off.      
+        $(value).animate( {'background-position': i + 'px ' + y }, 15000, 'linear' );
+
+        
+        setInterval( function(){
+
+            var currbackgroundposn = $(value).css('background-position').split(' ', 2 );
+            var x = Number(currbackgroundposn[0].split('px',1));
+
+            var posn = x+i + 'px ' + y;
+            
+            $(value).animate( {'background-position': posn }, 15000, 'linear' );
+                
+        }, 15000 );
+        
+    }); // .each
+        
+
+}); //doc.ready

tdd-progress-bar/trunk/readme.txt

@@ -5 +5 @@
 Requires at least: 3.2.1
 Tested up to: 3.2.1
-Stable tag: 0.1.2
+Stable tag: 0.1.
 
 A progress bar plugin solution.
@@ -42 +42 @@
 == Changelog ==
 
-= 1.2 =
+= 0.1.3=
+* Given the major change to the CSS, the javascript to make things animate also had to change pretty extensively. One side effect is that the animations on a page will eventually slow to a standstill at the rate of about 1-2 pixels every 15 seconds or so. The animation is still a work in progress...
+* Major bug fixes for the CSS to show up in, well, pretty much everything but Chrome. Didn't realize I was using an unsupported style.
+* Small CSS fix for the "Strawberry" color - now shows up correctly
+* Quick Edit mode on the "Manage Progress Bars" page now has the ability to change percentage and bar color. No need to specifically edit the progress bar now.
+* Added the function tdd_pb_get_bars() function, which could be used in templates, but I'm going to leave undocumented for the moment so If it needs to change, it can. It's mostly designed for internal use.
+* Added [tdd_pb] as a shortcode alias for [progress]. I think most people will use [progress], but I wanted to use [tdd_pb] since it's all over the code
+* The Default CSS and Javascript are now added to the progress bar pages in wp-admin.
+* Progress bars are now displayed in wp-admin on the "Manage Progress Bars" and the "Edit Progress Bar" screens
+
+= 0.1.2 =
 * Settings page actually works now
 * Settings page now references __FILE__ instead of some arbitrary tag.
 
-= 1.1 =
+= 1.1 =
 * Left some debugging code for the advanced debug bar in the script. Have to remove it to make this thing work.
 
@@ -54 +64 @@
 == Upgrade Notice ==
 
-= 1.2 =
+= 0.1.3 =
+* Major fix for CSS and Javascript. Now works in Firefox (and likely other browsers, but still testing).
+* Added some features to the "Manage Progress Bars" page
+* If you use custom CSS (or javascript for that matter), you will need to also include it for use in wp-admin. See admin_enqueue_scripts for examples of how to do this. This is to enable the proper display of progress bars in wp-admin. Alternatively, you could leave the default styles checkbox on (which will enable them for the admin side as well), and remove the action that adds the styles to the public side.
+
+= 0.1.2 =
 * If you'd like the settings page to work, upgrade.
 
-= 1.1 =
+= 1.1 =
 * Blocking bugfix. Plugin won't work unless you upgrade
 

tdd-progress-bar/trunk/tdd-progress-bar.php

@@ -4 +4 @@
 Plugin URI: http://github.com/tddewey/tdd-progress
 Description: Manage and display progress bars
-Version: 0.1.2
+Version: 0.1.
 Author: Taylor D. Dewey
 Author URI: http://websitesthatdontsuck.com
@@ -38 +38 @@
                 
 */
+
+
+
+
+
+
+
+
+
+
+
 $tdd_pb_options = get_option( 'tdd_pb_options');
+
 
 /* load some default settings during plugin activation */
@@ -61 +73 @@
 function tdd_pb_load_styles() {
     wp_enqueue_style( 'tdd_pb_style', plugins_url( 'css/default.css', __FILE__ ), '', '.1' );
+
 }
 
 if ( $tdd_pb_options['default_css'] ){
     add_action( 'init', 'tdd_pb_load_styles', 99 );
+
 }
 
@@ -83 +97 @@
 if ( $tdd_pb_options['animate'] ){
     add_action( 'init', 'tdd_pb_load_js', 99 );
+
 }
 
@@ -93 +108 @@
 function tdd_pb_register_post_type(){
     $labels = array(
-        'name' => 'Progress Bars',
-        'singular_name' => 'Progress Bar',
-        'add_new' => 'Add New Progress Bar',
-        'add_new_item' => 'Add New Progress Bar',
-        'edit_item' => 'Edit Progress Bar',
-        'new_item' => 'New Progress Bar',
-        'view_item' => 'View Progress Bar',
-        'search_items' => 'Search Progress Bars',
-        'not_found' => 'No Progress Bars Found',
-        'not_found_in_trash' => 'No Progress Bars Found in the Trash',
+        'name' => ,
+        'singular_name' => ,
+        'add_new' => ,
+        'add_new_item' => ,
+        'edit_item' => ,
+        'new_item' => ,
+        'view_item' => ,
+        'search_items' => ,
+        'not_found' => ,
+        'not_found_in_trash' => ,
     );
     
@@ -140 +155 @@
 * [progress ids=1]
 * [progress ids=3,4 width='50px']
-*/
-
-function tdd_pb_shortcode($args){
-    $tdd_pb_options = get_option( 'tdd_pb_options');
+
+* Also any of the above formats using shortcode [tdd_pb]
+*/
+
+
+function tdd_pb_shortcode( $args ){
 
     $args = shortcode_atts( array(
@@ -158 +175 @@
     $idsarr = array_merge($idarr, $idsarr);
     
-    //Filter the array to ensure we're getting things that look like integers.
-    $idsarr = array_filter( $idsarr, 'is_numeric' );
-    
-    //count if this is a race (more than one progress bar being displayed)
+    //Request some bars
+    $return = tdd_pb_get_bars(array(
+        'ids' => $idsarr,
+        'width' => $args['width'],
+        'class' => $args['class'],
+    ));
+    
+    //Return them bars
+    return $return;
+}
+
+add_shortcode('progress', 'tdd_pb_shortcode' );
+add_shortcode('tdd_pb', 'tdd_pb_shortcode' );
+
+
+/*
+* Returns a progress bar container with 1 or more progress bars
+*
+* @param    array   $ids            An array of the ids of progress bars to fetch.
+* @param    str     $width          Width, specified in pixels, percents, em, whatever of the container
+* @param    str     $class          Any additional CSS classes to add to the global container (can force a race this way)
+* @param    str     $default_color  If the color of a bar isn't specified, this is the fallback.
+*/
+function tdd_pb_get_bars( $args ){
+    $defaults = array(
+        'ids' => array(),
+        'width' => 'auto',
+        'class' => '',
+        'default_color' => 'red',
+        );
+
+    $tdd_pb_options = get_option( 'tdd_pb_options');
+
+    
+    //parse incoming arguments against default.
+    $args = wp_parse_args( $args, $defaults );
+
+
+    //Filter the array to ensure we're getting things that look like integers. Will also filter out blank array items (i.e. '' )
+    $idsarr = array_filter( $args['ids'], 'is_numeric' );
+
+    //count if this is a race (more than one progress bar being displayed. The race format can also be forced by passing "race" in the $class argument)
     $race = ( count( $idsarr ) > 1 ) ? 'race' : '';
-    //Load up the $return var with our progress bar container
-    $return = '<div class="tdd_pb_global_container '. $race .' '.$args["class"].'" style="width:'.strip_tags($args["width"]).'">';
+
+    //Set up our global container
+    $return = '<div class="tdd_pb_global_container '.$race.' '.$args['class'].'" style="width:'.strip_tags( $args['width'] ).'">';
+    
+    //If there are no ids to display, this is kind of a moot proccess - so let's say so:
+    if ( count( $idsarr ) <= 0 ){
+        $return .= '<p>' . __( 'No progress bars were set, so there is nothing to display', 'tdd_pb' ). '</p></div>';
+        return $return;
+    }
     
     //Setup a new WP_Query for our progress bars.
@@ -174 +236 @@
         'meta_key' => '_tdd_pb_percentage'
     ));
+
+
+
+
+
+
     
     while ( $tdd_pb_query->have_posts() ): $tdd_pb_query->the_post();
@@ -179 +247 @@
         $color = strip_tags( get_post_meta( get_the_ID(), '_tdd_pb_color', true ) );
         //if no color, define a default
-        $color = (!$color) ? 'red' : $color;
+        $color = (!$color) ?  : $color;
         $return .= '<div title="'.get_the_title() .'" class="tdd_pb_bar_container" style="background-color: #'. $tdd_pb_options["bar_background_color"] .'">';
         if ($tdd_pb_options['display_percentage']){
@@ -187 +255 @@
     
     endwhile;
-    
+
     //Close the progress bar container, and return everything to screen.
     $return .= '</div>';
     return $return;
 }
-add_shortcode('progress', 'tdd_pb_shortcode' );