Etherpad jQuery Plugin Example

Usage:

Include jQuery.js, include etherpad.js

Example #1: Sets the pad id and puts the pad in the div

$('#examplePadBasic').pad({'padId':'test'});

Example #2: Sets the pad id, some more parameters and puts the pad in the div

$('#examplePadIntense').pad({'padId':'test2','showChat':'true'});

Example #3: Sets the pad id, some plugin parameters and puts the pad in the div

$('#examplePadPlugins').pad({'padId':'test3','plugins':{'pageview':'true'}});

Example #4: Gets the padContents from Example #2

$('#examplePadIntense').pad({'getContents':'exampleGetContents'});

Available options and parameters

               'host'             : 'http://beta.etherpad.org', // the host and port of the Etherpad instance, by default the foundation will host your pads for you
               'baseUrl'          : '/p/',                      // The base URL of the pads
               'showControls'     : false,                      // If you want to show controls IE bold, italic, etc.
               'showChat'         : false,                      // If you want to show the chat button or not
               'showLineNumbers'  : false,                      // If you want to show the line numbers or not
               'userName'         : 'unnamed',                  // The username you want to pass to the pad
               'useMonospaceFont' : false,                      // Use monospaced fonts
               'noColors'         : false,                      // Disable background colors on author text
               'userColor'        : false,                      // The background color of this authors text in hex format IE #000
               'hideQRCode'       : false,                      // Hide QR code
               'alwaysShowChat'   : false,                      // Always show the chat on the UI
               'width'            : 100,                        // The width of the embedded IFrame
               'height'           : 100,                        // The height of the embedded IFrame
               'border'           : 0,                          // The width of the border (make sure to append px to a numerical value)
               'borderStyle'      : 'solid'                     // The CSS style of the border [none, dotted, dashed, solid, double, groove, ridge, inset, outset]
               'plugins'          : {},                         // The options related to the plugins, not to the basic Etherpad configuration
               'rtl'              : false                       // Show right to left text
        

If you are confused, view the source code for examples