sfWidgetWordCounterPlugin - 1.0.6

A jQuery word counter that counts the words in a given input field and displays the counter in a html tag.

You are currently browsing
the website for symfony 1

Visit the Symfony2 website


« Back to the Plugins Home

Signin


Forgot your password?
Create an account

Tools

Stats

advanced search
Information Readme Releases Changelog Contribute
Show source

sfWidgetWordCounter plugin (for Symfony 1.3, 1.4)

The sfWidgetWordCounterPlugin is a Symfony widget that adds a jQuery word counter to a form field. This is a jQuery word counter that counts the words in a given input field and displays the counter in a html tag.

Features

The features of the counter are:

  • A word limit can be supplied. This makes the counter count down from the limit

  • A custom message can be displayed when this word limit is breached

  • Negative numbers can be shown. This is used when the limit is breached.

Installation

Install the plugin (via a package)

symfony plugin:install sfWidgetWordCounterPlugin

Activate the plugin in the apps/YOUR_APP/config/ProjectConfiguration.class.php

class ProjectConfiguration extends sfProjectConfiguration
{
  public function setup()
  {
    $this->enablePlugins('sfWidgetWordCounterPlugin');
  }
}

Publish the plugins assets symfony plugin:publish-assets

Add the js path to the view.yml

  javascripts:    [ ../sfWidgetWordCounterPlugin/js/wordCounter.jQuery.js]

Add the widget to the autoload.yml

sfWidgetWordCounterPlugin:
  name:           sfWidgetWordCounterPlugin lib
  path:           %SFPLUGINSDIR%/sfWidgetWordCounterPlugin/lib/Widget/*
  recursive:      on

Add the counter widget to the form

  $this->widgetSchema['counter'] = new sfWidgetWordCounter( array(
      "counterid"=>"IDOFFIELDTOCOUNT",
      "targetid"=> "IDOFCOUNTER",
      "config"=>"{
        //Options

  }"
));

Clear you cache

symfony cc

jQueryPlugin Options

  • limit

    • This is the word limit by default this is set to null so the counter will just just keep counting upwards
  • defaultNoLimitFormat

    • This is the text that is displayed when there isn't a limit by default its set to "Word count: count%"
  • limitExceededFormat

    • This is the text that is displayed if the word count breaches the limit by default its set to "Remove count% word(s)"
  • limitNotExceededFormat

    • This is the text that is displayed if the limit hasn't been exceeded (This is used if limit is true)
  • defaultSearch

    • This is the keyword that is used to search in the messages. This is replaced by the value of the counter

Examples of use

Standard counter

This would produce a basic counter that just increments the count each time a word is added to the input field

// Form
$this->widgetSchema['example_1'] = new sfWidgetWordCounter( array(
    "counterid"=>"example_1",
    "targetid"=> "word_count"
));

// Rendered jQuery
$('example_1').wordCounter('example_1','word_count');

Basic with custom message

This would produce the above but with a custom message

// Form
$this->widgetSchema['example_2'] = new sfWidgetWordCounter( array(
        "counterid"=>"example_2",
        "targetid"=> "word_count"
        "config" => "{
        defaultNoLimitFormat: "You have managed to write count% word(s)"
      }"
 ));

// Rendered jQuery
$('example-2').wordCounter('example-2','word-count-2',{
    defaultNoLimitFormat    : "You have managed to write count% word(s)"
});

Limit example 1

Instead of the word count increasing it decreases until the limit is met. When this happens the user is told how many words are needed to be removed until the word count is 0.

// Form
$this->widgetSchema['example_3'] = new sfWidgetWordCounter( array(
        "counterid"=>"example_3",
        "targetid"=> "word_count"
        "config" => "{
        limit: 5
      }"
 ));

// Rendered jQuery
$('example_3').wordCounter('example_3','word-count-3',{
limit   :   5
});

Limit example 2

Same as previous example but custom messages are used.

// Form
$this->widgetSchema['example_4'] = new sfWidgetWordCounter( array(
    "counterid"=>"example_4",
    "targetid"=> "word_count"
    "config" => "{
        limit : 5,
        limitExceededFormat : 'Oh no you have exceeded the word count by count% word(s)',
        limitNotExceededFormat : 'Words left count%'
      }"
  ));

// Rendered jQuery
$('example_4').wordCounter('example_4','word-count-4',{
    limit : 5,
    limitExceededFormat: 'Oh no you have exceeded the word count by count% word(s)',
    limitNotExceededFormat: 'Words left count%'
});

Showing negative numbers when the limit has been exceeded

// Form
$this->widgetSchema['example_5'] = new sfWidgetWordCounter( array(
    "counterid"=>"example_5",
    "targetid"=> "word_count"
    "config" => "{
        limit : 5,
        limitExceededFormat: 'Words left count%',
        limitNotExceededFormat: 'Words left count%',
        showNegativeNumbers : 1
      }"
 ));

// Rendered jQuery
$('example_5').wordCounter('example_5','word-count-5',{
    limit : 5,
    limitExceededFormat: 'Words left count%',
    limitNotExceededFormat: 'Words left count%',
    showNegativeNumbers : 1
});