Xinha Discussion Forum

xinha_config.ListType.mode = 'panel';

xinha_config.fullScreen = true;

/*------------------------------------------*\
 YourPlugin for Xinha
 _______________________
     
\*------------------------------------------*/

function YourPlugin(editor) {
    this.editor = editor;
    
    var cfg = editor.config;
    var self = this;
    
    cfg.registerButton
    ({
        id       : "YourPlugin",
        tooltip  : this._lc("YourPlugin"),
        image    : _editor_url+"plugins/YourPlugin/img/smartquotes.gif",
        textMode : false,
        action   : function() { self.buttonPress(); }
    });
    cfg.addToolbarElement("YourPlugin", "htmlmode", 1);

}

YourPlugin._pluginInfo = {
  name          : "YourPlugin",
  version       : "1.0",
  developer     : "Raimund Meyer",
  developer_url : "http://rheinauf.de",
  c_owner       : "Raimund Meyer",
  sponsor       : "",
  sponsor_url   : "",
  license       : "htmlArea"
};

YourPlugin.prototype._lc = function(string) {
    return Xinha._lc(string, 'YourPlugin');
};

Xinha.Config.prototype.YourPlugin =
{
    // configName : "configDefaultValue"
}
YourPlugin.prototype.buttonPress = function(opts, obj)
{
    var self = this;

    if ( this.shown) // same as cancel
    {
        return this.hide();
    }

    var inputValues = // this fills the inputs with values
    {
        exampleInput : "value to put in"
    };
    this.dialog.setValues(inputValues);
    this.dialog.show();
    this.shown = true;
};

YourPlugin.prototype.onGenerateOnce = function()
{
  var self = this;
  this._prepareDialog();
  // if the dialog is supposed to be hidden in text mode
  this.editor.notifyOn('modechange',
      function(e,args)
      {
        switch(args.mode)
        {
          case 'text':
          {
            if (self.shown) self.dialog.hide();
            break;
          }
          case 'wysiwyg':
          {
            if (self.shown) self.dialog.show(); 
            break;
          }
        }
      }
    );
};

YourPlugin.prototype._prepareDialog = function()
{
  var self = this;
  var editor = this.editor;
  if ( typeof Xinha.PanelDialog == 'undefined') 
  { 
      Xinha._loadback( _editor_url + 'modules/Dialogs/panel-dialog.js', this._prepareDialog,this); 
    return;
  }
  if(!this.html)
  {
    Xinha._getback(_editor_url + 'plugins/YourPlugin/dialog.html', function(getback) { self.html = getback; self._prepareDialog(); });
    return;
  }
  
  // Now we have everything we need, so we can build the dialog.
  this.dialog = new Xinha.PanelDialog(editor, 'top',this.html);

  
  this.dialog.getElementById('ok').onclick = function () 
  {
      // onOK
    var values = self.hide(); // this gets us the values from the inputs in the dialog as an object
    // do something
  }
  this.dialog.getElementById('cancel').onclick = function ()
  {
      self.hide();
  }
  this.ready = true;
  this.hide();
};

YourPlugin.prototype.hide = function()
{
  this.shown = false;
  return this.dialog.hide();
};

<h1><l10n>YourPlugin</l10n></h1>
<input type="text" name="[exampleInput]" />
<div class="buttons">
   <input type="button" id="[ok]"     value="_(OK)"     />
    <input type="button" id="[cancel]" value="_(Cancel)" />
</div>