modify latest version to work with Pick-em

  • The code below enabled a previous Football Pool version to be a pick-em (no scores, just pick team)

    Since it’s no longer using a table to display, how can i modify this code to work on the latest version?

    // pick'em style predictions (v2.3.8 and below)
jQuery( document ).ready( function() {
	jQuery( 'table.matchinfo.input tr' ).filter( function() {
		$this = jQuery( this );
		return $this.attr( 'id' ) && $this.attr( 'id' ).substr( 0, 5 ) === 'match';
	} )
	.each( function() {
		selected = 0;
		jQuery( 'td.score', this ).each( function( index ) {
			$this = jQuery( this );
			value = $this.text();
			if ( value == '' && $this.children().length > 0 ) {
				$this.siblings( '.home, .away' )
					.css( 'cursor', 'pointer' )
					.bind( 'click', function() {
						$this = jQuery( this );
						team = $this.attr( 'class' ); // home or away
						$this.siblings( '.score' ).find( 'input[name^="_' + team + '"]' ).val( '1' );
						$this.siblings( '.score' ).find( ':not(input[name^="_' + team + '"])' ).val( '0' );
						$this.css( 'font-weight', 'bold' ).css( 'color', 'orange' );
						$this.siblings( ':not(.' + team + ')' ).css( 'font-weight', 'normal' ).css( 'color', '' );
					} );

				value = jQuery( 'input', this ).val();
			}

			selector = ( index == 0 ) ? '.home' : '.away';
			if ( value == '1' ) $this.siblings( selector ).css( 'font-weight', 'bold' )
															.css( 'color', 'orange' );

			$this.hide();
		} );
	} );

	jQuery( 'table.matchinfo.input' ).show();
} );
Viewing 1 replies (of 1 total)
  • Plugin Author AntoineH

    (@antoineh)

    You can still use the classic layout (tables) if you want (enable it in the football pool options).

    But I’ve also changed the javascript a bit:

    // pick'em style predictions (flex layout in v2.8.0 and above)
jQuery( document ).ready( function() {
	jQuery( '.matchinfo.input.new-layout div' ).filter( function() {
		$this = jQuery( this );
		return $this.attr( 'id' ) && $this.attr( 'id' ).substr( 0, 5 ) === 'match';
	} )
	.each( function() {
		jQuery( 'div.score', this ).each( function( index ) {
			$this = jQuery( this );
			value = $this.text().replace( /\s/g, '' );
			if ( value === '' && $this.children().length > 0 ) {
				// the match is editable, so we hide the inputs and bind a click event
				$this.siblings( '.home, .away' )
					.css( 'cursor', 'pointer' )
					.bind( 'click', function() {
						$this = jQuery( this );
						team = $this.attr( 'class' ); // home or away
						$this.siblings( '.score' ).find( 'input[name^="_' + team + '"]' ).val( '1' );
						$this.siblings( '.score' ).find( ':not(input[name^="_' + team + '"])' ).val( '0' );
						$this.css( 'color', 'orange' );
						$this.siblings( ':not(.' + team + ')' ).css( 'color', '' );
					} );

				value = jQuery( 'input', this ).val();
			}

			selector = ( index === 0 ) ? '.home' : '.away';
			if ( value === '1' ) {
				$this.siblings( selector )
					.css( 'color', 'orange' );
			}
			
			$this.hide();
		} );
	} );

	jQuery( '.matchinfo.input.new-layout' ).show();
} );

    I think this should be it. But didn’t have time to test it real good.

Viewing 1 replies (of 1 total)
  • The topic ‘modify latest version to work with Pick-em’ is closed to new replies.

Tags