app/src/main/webapp/roller-ui/authoring/editors/xinha-1.5.1/plugins/InsertSnippet2/InsertSnippet2.js

/*------------------------------------------*\
 InsertSnippet2 for Xinha
 _______________________
 
 Insert HTML fragments or template variables
 
\*------------------------------------------*/

function InsertSnippet2(editor) {
  this.editor = editor;

  var cfg = editor.config;
  var self = this;
  

  cfg.registerButton({
  id       : "InsertSnippet2",
  tooltip  : this._lc("Insert Snippet"),
  image    : editor.imgURL("ed_snippet.gif", "InsertSnippet2"),
  textMode : false,
  action   : function(editor) {
          self.buttonPress(editor);
      }
  });
  cfg.addToolbarElement("InsertSnippet2", "insertimage", -1);
  this.snippets = null;
  this.categories = null;
  this.html =null;
      
  Xinha._getback(cfg.InsertSnippet2.snippets,function (txt,req) {
                  var xml=req.responseXML;
                  var c = xml.getElementsByTagName('c');
                  self.categories = [];
                  for (var i=0;i<c.length;i++)
                  {
                      self.categories.push(c[i].getAttribute('n'));	
                  }
                  var s = xml.getElementsByTagName('s');
                  self.snippets = [];
                  var textContent,item;
                  
                  for (var i=0;i<s.length;i++)
                  {
                      item = {};
                      for (var j=0;j<s[i].attributes.length;j++)
                      {
                          item[s[i].attributes[j].nodeName] = s[i].attributes[j].nodeValue;
                      }
                      item.html = s[i].text || s[i].textContent;
                      self.snippets.push(item);
                  }
  });
  Xinha.loadStyle('InsertSnippet.css','InsertSnippet2','IScss');
}

InsertSnippet2.prototype.onUpdateToolbar = function() 
{
  if (!this.snippets)
  {
      this.editor._toolbarObjects.InsertSnippet2.state("enabled", false);
  }
  else InsertSnippet2.prototype.onUpdateToolbar = null;
}

InsertSnippet2._pluginInfo = {
  name          : "InsertSnippet2",
  version       : "1.2",
  developer     : "Raimund Meyer",
  developer_url : "http://x-webservice.net",
  c_owner       : "Raimund Meyer",
  sponsor       : "",
  sponsor_url   : "",
  license       : "htmlArea"
};

Xinha.Config.prototype.InsertSnippet2 =
{
  'snippets' : Xinha.getPluginDir('InsertSnippet2')+'/snippets.xml'
};
    
InsertSnippet2.prototype._lc = function(string) {
    return Xinha._lc(string, 'InsertSnippet2');
};

InsertSnippet2.prototype.onGenerateOnce = function()
{
    this._prepareDialog();
};
InsertSnippet2.prototype._prepareDialog = function()
{
  var self = this;
  if(!this.html) // retrieve the raw dialog contents
  {
    Xinha._getback(Xinha.getPluginDir('InsertSnippet2')+'/dialog.html', function(getback) { self.html = getback; self._prepareDialog(); });
    return;
  }
  if (!this.snippets)
  {
    setTimeout(function(){self._prepareDialog()},50);
    return;
  }
  var editor = this.editor;
  var InsertSnippet2 = this;
  
  this.dialog = new Xinha.Dialog(editor, this.html, 'InsertSnippet2',{width:800,height:400},{modal:true});
  Xinha._addClass( this.dialog.rootElem, 'InsertSnippet2' );
  
  var dialog = this.dialog;
  var main = this.dialog.main;
  var caption = this.dialog.captionBar;
  
  this.snippetTable = dialog.getElementById('snippettable');
  
  this.drawCatTabs();
  this.drawSnippetTable();
  this.preparePreview();
  
  dialog.onresize = function() {self.resize(); } 
  
  this.dialog.getElementById('search').onkeyup = function() { self.search ()};
  this.dialog.getElementById('wordbegin').onclick = function() { self.search ()};
  this.dialog.getElementById('cancel').onclick = function() { self.dialog.hide ()};
  
}

InsertSnippet2.prototype.drawSnippetTable = function()
{
  if (!this.snippets.length) return;
  var self = this;
  var tbody = this.snippetTable;
  var snippets = this.snippets;

  while (tbody.hasChildNodes())
  {
    tbody.removeChild(tbody.lastChild);
  }
  var id,snippet_name, snippet_html, snippet_cat, snippet_varname, trow, newCell, cellNo, btn;

  for(var i = 0,trowNo=0; i < snippets.length; i++) 
  {
    id = i;
    snippet_name = snippets[i]['n'];
    snippet_cat = snippets[i]['c'];
    snippet_varname = snippets[i]['v']
    snippet_html = snippets[i]['html'];
    
    if (this.categoryFilter && snippet_cat != this.categoryFilter && this.categoryFilter != 'all') continue;

    trow = tbody.insertRow(trowNo);
    trowNo++;

    cellNo = 0;
    newCell = trow.insertCell(cellNo);

    newCell.onmouseover = function(event) {return self.preview(event || window.event)};
    newCell.onmouseout  = function() {return self.preview()};
    newCell.appendChild(document.createTextNode(snippet_name));
    newCell.snID = id;
    
    newCell.id = 'cell' + id;
    cellNo++;

    newCell = trow.insertCell(cellNo);
    
    newCell.style.whiteSpace = 'nowrap';
    btn = document.createElement('button');
    btn.snID = id;
    btn._insAs = 'html';
    btn.onclick = function(event) {self.doInsert(event || window.event); return false};
    btn.appendChild(document.createTextNode(this._lc("HTML")));
    btn.title = this._lc("Insert as HTML");
    newCell.appendChild(btn);
    
    if (snippet_varname)
    {
      newCell.appendChild(document.createTextNode(' '));
      var btn = document.createElement('button');
          btn.snID = id;
          btn._insAs = 'variable';
          btn.onclick = function(event) {self.doInsert(event || window.event); return false};
          btn.appendChild(document.createTextNode(this._lc("Variable")));
          btn.title = this._lc("Insert as template variable");

      newCell.appendChild(btn);
    }

    cellNo++;
  }
}
InsertSnippet2.prototype.drawCatTabs = function()
{
  if (!this.categories.length) return;
  var self = this;
  var tabsdiv = this.dialog.getElementById("cattabs");
  
  while (tabsdiv.hasChildNodes())
  {
    tabsdiv.removeChild(tabsdiv.lastChild);
  }
  var tabs_i = 1;
  var tab = document.createElement('a');
      tab.href = "javascript:void(0);";
      tab.appendChild(document.createTextNode(this._lc("All Categories")));
      tab.cat = 'all';
      tab.className = "tab"+tabs_i;
      tab.onclick = function() {self.categoryFilter = self.cat; self.drawCatTabs();self.drawSnippetTable(); self.search ()} 
      if (!this.categoryFilter || this.categoryFilter == 'all')
      {
        Xinha._addClass(tab,'active');
        tab.onclick = null;
      }
  tabsdiv.appendChild(tab);
  tabs_i++;

  for (var i = 0;i < this.categories.length;i++)
  {
    var name = this.categories[i];
    var tab = document.createElement('a');
        tab.href = "javascript:void(0);";
        tab.appendChild(document.createTextNode(name));
        tab.cat = name;
        tab.className = "tab"+tabs_i;
        tab.onclick = function() {self.categoryFilter = this.cat; self.drawCatTabs();self.drawSnippetTable(); self.search ()} 
        if (name == this.categoryFilter)
        {
            Xinha._addClass(tab,'active');
            tab.onclick = null;
        }
    tabsdiv.appendChild(tab);
    if (Xinha.is_gecko) tabsdiv.appendChild(document.createTextNode(String.fromCharCode(8203)));
    tabs_i = (tabs_i<16) ? tabs_i +1 : 1;
  }

  if (!this.catTabsH)
  {
    this.catTabsH = tabsdiv.offsetHeight;
  }
}
InsertSnippet2.prototype.search = function ()
{
  var tbody = this.dialog.getElementById("snippettable");
  var searchField =this.dialog.getElementById('search');
  if (searchField.value)
  {
    var val =  searchField.value;

        val = val.replace(/\.?([*?+])/g,'.$1');

    var wordstart = (this.dialog.getElementById('wordbegin').checked) ? '^' : '';
    try { var re = new RegExp (wordstart+val,'i'); } catch (e) {var re = null};
  }
  else var re = null;

  for (var i=0;i<tbody.childNodes.length;i++)
  {
    var tr = tbody.childNodes[i]; 
    var name = tr.firstChild.firstChild.data;
    if (re && !name.match(re))
    {
      tr.style.display = 'none';
    }
    else 
    {
      tr.style.display = '';
    }
  }
}
InsertSnippet2.prototype.preview = function(event)
{
  if (!event)
  {
    this.previewBody.innerHTML = '';
    return;
  }
  var target = event.target || event.srcElement;
  var snID = target.snID;
  if (!this.previewBody)
  {
    this.preparePreview();
    return;
  }
  if (this.previewIframe.style.display == 'none')
  {
    this.previewIframe.style.display = 'block';
  }
  this.previewBody.innerHTML = this.snippets[snID].html;
}
InsertSnippet2.prototype.preparePreview = function()
{
  var editor = this.editor;
  var self = this;
  var preview_iframe = this.previewIframe = this.dialog.getElementById('preview_iframe');

  var doc = null;
  
  try
  {
    if ( preview_iframe.contentDocument )
    {
      doc = preview_iframe.contentDocument;        
    }
    else
    {
      doc = preview_iframe.contentWindow.document;
    }
    // try later
    if ( !doc )
    {
      if ( Xinha.is_gecko )
      {
        setTimeout(function() { self.preparePreview(snID); }, 50);
        return false;
      }
      else
      {
        throw("ERROR: IFRAME can't be initialized.");
      }
    }
  }
  catch(ex)
  { // try later
    setTimeout(function() { self.preparePreview(snID);  }, 50);
  }
  doc.open("text/html","replace");

  var html = '<html><head><title></title>';
  html += "<meta http-equiv=\"Content-Type\" content=\"text/html; charset=" + editor.config.charSet + "\">\n";
  html += '<style type="text/css">body {background-color:#fff} </style>';
  if ( typeof editor.config.baseHref != 'undefined' && editor.config.baseHref !== null )
  {
    html += "<base href=\"" + editor.config.baseHref + "\"/>\n";
  }
  
  if ( editor.config.pageStyle )
  {
    html += "<style type=\"text/css\">\n" + editor.config.pageStyle + "\n</style>";
  }

  if ( typeof editor.config.pageStyleSheets !== 'undefined' )
  {
    for ( var i = 0; i < editor.config.pageStyleSheets.length; i++ )
    {
      if ( editor.config.pageStyleSheets[i].length > 0 )
      {
        html += "<link rel=\"stylesheet\" type=\"text/css\" href=\"" + editor.config.pageStyleSheets[i] + "\">";
        //html += "<style> @import url('" + editor.config.pageStyleSheets[i] + "'); </style>\n";
      }
    }
  }
  html += "</head>\n";
  html += "<body>\n";
  html += "</body>\n";
  html += "</html>";

  doc.write(html);
  doc.close();
  setTimeout(function() {
    self.previewBody = doc.getElementsByTagName('body')[0];
  },100);
}

InsertSnippet2.prototype.buttonPress = function(editor)
{
  this.dialog.toggle();
}

InsertSnippet2.prototype.doInsert = function(event)
{
  var target = event.target || event.srcElement;
  var sn  = this.snippets[target.snID];
  this.dialog.hide();
  var cfg = this.editor.config.InsertSnippet2;
  if (target._insAs == 'variable') 
  {
      this.editor.insertHTML(sn.v);
  } 
  else 
  {
      this.editor.insertHTML(sn.html);
  }	
}

InsertSnippet2.prototype.resize = function ()
{
  var insertDiv = this.dialog.getElementById('insert_div');
  var preview_iframe = this.dialog.getElementById('preview_iframe');
  var win = {h:this.dialog.height,w:this.dialog.width};

  var h = win.h - 90;
  if (this.categories.length) h -= this.catTabsH;
  insertDiv.style.height = preview_iframe.style.height =  h + 'px';
  
  //insertDiv.style.width =  win.w + 'px';

  return true;
}