CKSource

Javascript API

I couldn't find documentation on how to talk to the javascript API. I figured that through CKEDITOR.instances.id_of_textarea.setData(string); I could update the contents or get it with getData();

First thing I learned I can also access an instance of an editor through: CKEDITOR.instances["id_of_textarea"].setData(string); //This is more usefull in generic code.

I wanted to see which functions are available for me and show that in... the editor itself. I did the following.

var objEditor=CKEDITOR.instances["id_of_textarea"];
var str="";
for (var item in objEditor) {
  str+="<strong>"+item+"</strong>="+objEditor[item].toString().str_replace("\n", "<br>").str_replace(";", ";<br>  ").str_replace("{", "{<br>  ").str_replace("}", "}<br>").str_replace(";<br>  }", ";<br>}")+"<br>";
}
objEditor.setData(str);

With this output (I aligned the code a bit for readibility):

getThemeSpace=function(l){
  var m='cke_'+l,n=this._[m]||(this._[m]=a.document.getById(m+'_'+this.name));
  return n;
}

focus=function(){
  var n=l(this);
  if(n)n.focus();
}

setMode=function(n){
  var o,p=this.getThemeSpace('contents'),q=this.checkDirty();
  if(this.mode){
  if(n==this.mode)return;
  var r=l(this);
  o=r.getData();
  r.unload(p);
  this.mode='';
}
p.setHtml('');
  var s=l(this,n);
  if(!s)throw '[CKEDITOR.editor.setMode] Unknown mode "'+n+'".';
  if(!q)this.on('mode',
    function(){
      this.resetDirty();
      this.removeListener('mode',arguments.callee);
    }
  );
  s.load(p,typeof o!='string'?this.getData():o);
}

addMode=function(n,o){
  o.name=n;
  (this._.modes||(this._.modes={}))[n]=o;
}

mode=openDialog=function(l){
  var m=a.dialog._.dialogDefinitions[l];
  if(typeof m=='function'){
    var n=this._.storedDialogs||(this._.storedDialogs={}), o=n[l]||(n[l]=new a.dialog(this,l));
    o.show();
    return o;
  }
  var p=a.document.getBody(),q=p.$.style.cursor,r=this;
  p.setStyle('cursor','wait');
  a.scriptLoader.load(a.getUrl(m),
    function(){
      r.openDialog(l);
      p.setStyle('cursor',q);
    }
  );
  return null;
}

restoreRealElement=function(l){
  var m=decodeURIComponent(l.getAttribute('_cke_realelement'));
  return g.createFromHtml(m,this.document);
}

createFakeParserElement=function(l,m,n,o){
  var p=new a.htmlParser.basicWriter();
  l.writeHtml(p);
  var q=p.getHtml(),r={'class':m,src:a.getUrl('images/spacer.gif'),_cke_realelement:encodeURIComponent(q)};
  if(n)r._cke_real_element_type=n;
  if(o)r._cke_resizable=o;
  return new a.htmlParser.element('img',r);
}

createFakeElement=function(l,m,n,o){
  var p={'class':m,src:a.getUrl('images/spacer.gif'),_cke_realelement:encodeURIComponent(l.getOuterHtml())};
   
  if(n)p._cke_real_element_type=n;
  if(o)p._cke_resizable=o;
  return this.document.createElement('img',{attributes:p});
}

forceNextSelectionCheck=function(){
  delete this._.selectionPreviousPath;
}

getSelection=function(){
  var u=this;
  var s=u.document?u.document.getSelection():null;
  if(s&&c){
    var t=s.getNative().createRange();
    if(!t)return null;
    else if(t.item)return t.item(0).ownerDocument==u.document.$?s:null;
    else return t.parentElement().ownerDocument==u.document.$?s:null;
  }
  return s;
}

getMenuItem=function(l){
  return this._.menuItems[l];
}

addMenuItems=function(l){
  for(var m in l)this.addMenuItem(m,l[m]);
}

addMenuItem=function(l,m){
  if(this._.menuGroups[m.group])this._.menuItems[l]=new a.menuItem(this,l,m);
}

attachStyleStateChange=function(l,m){
  var n=this._.styleStateChangeCallbacks;
  if(!n){
    n=this._.styleStateChangeCallbacks=[];
    this.on('selectionChange',
      function(o){
        for(var p=0;p  p++){
          var q=n[p],r=q.style.checkActive(o.data.path)?1:2;
          if(q.state!==r){
            q.fn.call(this,r);
            q.state!==r;
          }
        }
      }
    );
  }
  n.push({style:l,fn:m});
}

insertText=function(l){
  l=e.htmlEncode(l);
  l=l.replace(/(?:\r\n)|\n|\r/g,'
');
  this.insertHtml(l);
}

updateElement=function(){
  var m=this;
  var l=m.element;
  if(l&&m.elementMode==1)if(l.is('textarea'))l.setValue(m.getData());
  else l.setHtml(m.getData());
}

resetDirty=function(){
  if(this.mayBeDirty)this._.previousValue=this.getSnapshot();
}

checkDirty=function(){
  return this.mayBeDirty&&this._.previousValue!==this.getSnapshot();
}

insertElement=function(l){
  this.fire('insertElement',l);
}

insertHtml=function(l){
  this.fire('insertHtml',l);
}

setData=function(l){
  var m={dataValue:l};
  this.fire('setData',m);
  this._.data=m.dataValue;
  this.fire('afterSetData',m);
}

loadSnapshot=function(l){
  this.fire('loadSnapshot',l);
}

getSnapshot=function(){
  var l=this.fire('getSnapshot');
  if(typeof l!='string'){
    var m=this.element;
    if(m&&this.elementMode==1)l=m.is('textarea')?m.getValue():m.getHtml();
  }
  return l;
}

getData=function(){
  var n=this;
  n.fire('beforeGetData');
  var l=n._.data;
  if(typeof l!='string'){
    var m=n.element;
    if(m&&n.elementMode==1)l=m.is('textarea')?m.getValue():m.getHtml();
    else l='';
  }
  l={dataValue:l};
  n.fire('getData',l);
  return l.dataValue;
}

getCommand=function(l){
  return this._.commands[l];
}

execCommand=function(l,m){
  var n=this.getCommand(l),o={name:l,commandData:m,command:n};
  if(n&&n.state!=0)if(this.fire('beforeCommandExec',o)!==true){
    o.returnValue=n.exec(o.commandData);
    if(this.fire('afterCommandExec',o)!==true)return o.returnValue;
  }
  return false;
}

destroy=function(l){
  var m=this;
  if(!l)m.updateElement();
  m.theme.destroy(m);
  a.remove(m);
}

addCss=function(l){
  this._.styles.push(l);
}

addCommand=function(l,m){
  return this._.commands[l]=new a.command(this,m);
}

hasListeners=function(){
  var f=this;
  if(!(f._&&f._.events))a.event.call(f);
  (f[e]=a.event.prototype[e]).apply(f,arguments);
}

removeListener=function(){
  var f=this;
  if(!(f._&&f._.events))a.event.call(f);
  (f[e]=a.event.prototype[e]).apply(f,arguments);
}

fireOnce=function(b,c){
  return a.event.prototype.fireOnce.call(this,b,c,this);
}

fire=function(b,c){
  return a.event.prototype.fire.call(this,b,c,this);
}

_=[object Object]
elementMode=1
_init=function(){
  var z=this;
  var x=g.get(z._.element),y=z._.instanceConfig;
  delete z._.element;
  delete z._.instanceConfig;
  z._.commands={};
  z._.styles=[];
  z.element=x;
  z.name=x&&z.elementMode==1&&(x.getId()||x.getNameAtt())||m();
  z.config=e.prototypedCopy(i);
  z.ui=new k(z);
  z.focusManager=new a.focusManager(z);
  a.fire('instanceCreated',null,z);
  z.on('mode',w);
  p(z,y);
}

element=[object Object]
name=input_memo
config=[object Object]
ui=[object Object]
focusManager=[object Object]
on=function(c,d,e,f,g){
  var h=this._.events[c]||(this._.events[c]=new b(c));
  if(h.getListenerIndex(d)<0){
    var i=h.listeners;
    if(!e)e=this;
    if(isNaN(g))g=10;
    var j=this,k=function(m,n,o,p){
    var q={name:c,sender:this,editor:m,data:n,listenerData:f,stop:o,cancel:p,
      removeListener:function(){
        j.removeListener(c,d);
      }
    };
  d.call(e,q);
  return q.data;
};

k.fn=d;
k.priority=g;
for(var l=i.length-1;l>=0;l--)
  if(i[l].priority<=g){
    i.splice(l+1,0,k);
    return;
  }
i.unshift(k);

}
}

Anybody who wishes to talk to an instance of the CKeditor through the javascript API, now has a starting point and is able to see which functions are available for an instance of an CKeditor.