CKEditor draggable image [10 PUNTEN]

Hey,

Ik probeer in CKEditor een image draggable te maken, hier zijn geen standaard plugins voor, dus maak ik er zelf een.

Echter, al doe ik $(img).draggable();, ook met timeouts e.d., ik kan alle images verplaatsen, behalve die in de editor.

Weet iemand hoe ik dit kan doen?

Groet,
Milan

/*
KFCKDrag - a drag/drop thing for fckeditor
this plugin allows an external drag/drop item to be dragged into the FCKeditor window.
when the mouse is released, a function is called which decides what to do based on the dragged object type.
*/
window.parent.FCKeditor_OnComplete=function(FCK){
FCK.kfd_dragstate=false;
kfd_windowEventsInit(FCK.EditorWindow,FCK.EditorDocument); // initialise window events
kfd_elementEventsInit(FCK.EditorDocument); // add mouseup drop checker to every element
}
function getEvent(e){
return e?e:(window.event?window.event:"");
}
function getMouseAt(e){
e=getEvent(e);
var m=getWindowScrollAt();
m.x+=e.clientX;
m.y+=e.clientY;
return m;
}
function getWindowSize(){
return {x:window.innerWidth,y:window.innerHeight};
}
function getWindowScrollAt(){
return {x:window.pageXOffset,y:window.pageYOffset};
}
function kfd_elementEventsInit(doc){
var els=doc.getElementsByTagName(*);
for(var i=0;i<els.length;++i){
var el=els[i];
if(el.kfd_initialised)continue;
el.addEventListener(mouseup,kfd_checkForDrop,false);
el.kfd_initialised=true;
}
}
function kfd_windowEventsInit(win,doc){
win.addEventListener(mouseover,function(){
if(FCK.kfd_dragstate)return;
var p=window.parent;
FCK.kfd_dragstate=p.dragType;
if(p.dragType){
FCK.drag_wrapper=p.drag_wrapper.cloneNode(true);
p.drag_wrapper.style.display=none;
FCK.drag_wrapper.id=kfd_dragWrapper;
doc.body.appendChild(FCK.drag_wrapper);
}
},false);
win.addEventListener(mouseout,function(e){
var m=getMouseAt(e),ws=getWindowSize();
if((m.x>=0&&m.x<ws.x&&m.y>=0&&m.y<ws.y))return; // browser bug triggers fake mouseouts sometimes...
kfd_stopDragging();
if(window.parent.drag_wrapper)window.parent.drag_wrapper.style.display=block;
},false);
win.addEventListener(mousemove,function(e){
if(!FCK.kfd_dragstate)return;
var m=getMouseAt(e);
FCK.drag_wrapper.style.left=(m.x+16)+px;
FCK.drag_wrapper.style.top=m.y+px;
window.parent.drag_wrapper.style.display=none;
},false);
}
function kfd_stopDragging(){
if(FCK.kfd_dragstate){
FCK.kfd_dragstate=false;
FCK.EditorDocument.body.removeChild(FCK.drag_wrapper);
FCK.drag_wrapper=null;
}
}
function kfd_checkForDrop(e){
if(!FCK.kfd_dragstate)return; // nothing being dragged
var p=window.parent;
var type=p.dragType,wrapper=p.drag_wrapper;
var id=wrapper.cmp_id,name=wrapper.innerHTML;
FCKSelection.SelectNode(e.currentTarget);
FCKSelection.Collapse(false);
FCK.InsertHtml(<a href="+id+">+name+</a>);
e.stopPropagation();
kfd_stopDragging();
if(window.parent.componentTree_dragFinish)window.parent.componentTree_dragFinish(e);
}

Werkt helaas niet

En wat zegt de debug console?

Over die code van Smiegles of in het algemeen? In beide gevallen niks.

Vergoeding beschikbaar voor diegene met oplossing

Kan je misschien wat meer informatie geven?
O.a. code etc.

De editor is een iframe, afbeelding gewoon een img tag.

Probeer die img in de iframe dus draggable te maken.

$(document).ready(function() {
                    $(iframe).load(function(){
                        $("iframe").contents().find(".dragImg").draggable({
                            iframeFix: true
                        });
                    }); 
                });

Zoiets werkt op jsFiddle, maar niet op de site