BlogEngine WidgetZone Drag Drop not working on production server

Dec 23, 2009 at 12:57 PM

Hi All,

As the title states I have a problem after uploading my blog to my production server.

On my development machine (Win7 IIS7 BE1.5) I have setup a BE blog succesfully.
I use the Widgetzone on the right hand side and am able to drag and drop the widgets to where ever I may want them in the column.
But after uploading the entire blog to my in house production server (Server2003 IIS6) this no longer works.
As soon as I click on a widget to drag it, I get a javascript error and the widget does not get picked up.

Below is javascript error from IE8

Bericht: Ongeldig argument.
Regel: 2
Teken: 209
Code: 0
URI: http://blog/js.axd?path=%2fadmin%2fwidget.js&v=1.5.0.7

 Anyone got any suggestions about where to start looking?

Coordinator
Dec 24, 2009 at 7:47 PM

Is the URL to the blog on the production server:

http://blog

?

If so, I guess it's an intranet blog?  While logged into the blog, you can try navigating directly to the URL you posted in the error message:

http://blog/js.axd?path=%2fadmin%2fwidget.js&v=1.5.0.7

Dec 25, 2009 at 10:40 AM

Hi Ben,

Correct.
I am using the blog internally for now, that is why I created a DNS record to point http://blog to the internal IIS web server.
Later I will be opening stuff up to the 'real world' and create the http://blog.domain.com host header.

Browsing to the link directly opens a new screen with the question about what I would like to do with the file js.axd.
"Search for a program" or "Save to a location"

Some extra info,
My devlopment machine is runing Win7 with IIS7 -> works oke.
The production server is Server2003 with IIS6 -> fails.
I also tested on a VM Server 2008 with IIS7 -> works oke.

Could it be I am overlooking a setting in IIS6 for the WidgetZone to work?

Thanks,
Arno

Coordinator
Dec 25, 2009 at 4:33 PM

When you browse to that URL directly, and you're asked whether to "Search for a program" or "Save to a location", I would select "Save to a location".  Save it somewhere on your computer, and open it up with Notepad.  There should be some JavaScript in it (probably with white space stripped out).

Can you pull up the RSS feed successfully?  Is everything else in the blog working okay?  For example, can you post a comment?

The only setting I can think of is the MIME type for AXD files.  It needs to exist and be mapped to the ASP.NET ISAPI DLL (aspnet_isapi.dll).  But I think it already is since you get prompted to "Search for a program" or "Save to a location" which means something is coming back from the web server.  The RSS feed (syndication.axd) is also an AXD extension.  So if the RSS feed works, then the AXD extension/MIME type would be working.

It looks like this guy had what looks like the same problem last year.  Not sure if he came up a solution.

Coordinator
Dec 25, 2009 at 5:54 PM

Another possibility could be the contents of the JavaScript file (delivered thru JS.axd) could be encoded incorrectly.

If you download the file (Save to a location), and open it up in Notepad and look for any strange characters.

Dec 26, 2009 at 8:36 AM

Hi Ben,

Thanks again for your input.

Inside the js.axd there is indeed a bunch of javascript, when I look at it through notepad.
So I recon the processing is done oke.

The entire blog is working normally. I can do everything needed to run it.
Create posts, make comments, read the RSS stream, etc.
It is only the admin section on the widget zone.
The reference you gave me from the other user is indeed the same problem.
I will try to contact him, but it is a very old topic.

I am not sure about how to register the aspnet_isapi.dll in IIS 6 or how to check it.
Can you please share some steps?

The internationalization could indeed have something to do about it.
The test machines I used (my Win7 and the Server2008 VM) are both in Dutch language, but the production server is Server2003 UK
I changed some settings to have it localized to the Netherlands, but this did not help.

Since all other functions from the blog are working as expected I thinks this has something to do with the WidgetZone specifically.
Also the titlebars of the widgets do not expand the entire colum in admin mode.
I can share a screen clipping to see this in detail, anywhere I can upload them?

Thanks for all you help and merry christmas by the way.
Arno

Coordinator
Dec 26, 2009 at 8:20 PM

If everything on the blog is functioning normally, except this one part, I'm sure all the extensions are registered correctly for aspnet_isapi.dll.  That should be okay.

I'm wondering if there's any garbage/misencoded characters in the JavaScript file you downloaded.  Maybe you can post the contents of that file here?  With the whitespace stripped out, it's a little under 12KB (It should post here okay).

Any images/screenshots you have can be uploaded at one of the free image uploading services, like Flickr or Photobucket.

Dec 27, 2009 at 12:31 PM

Well, here is the javascript.
It is quite a long blur without the whitespacing.
Maybe copy and markup in VWD?

I'll see what I can do with the images.

Arno

Plain text:

var rectangleBorderWidth = 2;var useRectangle = true;var autoScrollSpeed = 5;function saveData(){var saveString = "";for(var no=0;no<dragableObjectArray.length;no++){if(saveString.length>0)saveString = saveString + ';';ref = dragableObjectArray[no];saveString = saveString + ref['obj'].id.replace('widget','');}BlogEngine.createCallback(BlogEngine.webRoot + "admin/WidgetEditor.aspx?move=" + saveString + "&rnd=" + Math.random(),null);}var dragableElementsParentBox;var opera = navigator.appVersion.indexOf('Opera')>=0?true:false;var rectangleDiv = false;var mouse_x;var mouse_y;var el_x;var el_y;var dragDropTimer = -1;var dragObject = false;var dragObjectNextObj = false;var dragableObjectArray = new Array();var destinationObj = false;var currentDest = false;var allowRectangleMove = true;var dragDropMoveLayer;var autoScrollActive = false;var documentHeight = false;var documentScrollHeight = false;var dragableAreaWidth = false;function getTopPos(inputObj){var returnValue = inputObj.offsetTop;try{while((inputObj = inputObj.offsetParent) != null){if(inputObj.tagName!='HTML')returnValue += inputObj.offsetTop;}}catch (ex){}return returnValue;}function getLeftPos(inputObj){var returnValue = inputObj.offsetLeft;try{while((inputObj = inputObj.offsetParent) != null){if(inputObj.tagName!='HTML')returnValue += inputObj.offsetLeft;}}catch (ex){}return returnValue;}function cancelSelectionEvent(){if(dragDropTimer>=0)return false;return true;}function getObjectFromPosition(x,y){var height = dragObject.offsetHeight;var width = dragObject.offsetWidth;var indexCurrentDragObject=-5;for(var no=0;no<dragableObjectArray.length;no++){ref = dragableObjectArray[no];if(ref['obj']==dragObject)indexCurrentDragObject=no;if(no<dragableObjectArray.length-1 && dragableObjectArray[no+1]['obj']==dragObject)indexCurrentDragObject=no+1;if(ref['obj']==dragObject && useRectangle)continue;if(x > ref['left'] && y>ref['top'] && x<(ref['left'] + (ref['width']/2)) && y<(ref['top'] + ref['height'])){if(!useRectangle && dragableObjectArray[no]['obj']==dragObject)return 'self';if(indexCurrentDragObject==(no-1))return 'self';return Array(dragableObjectArray[no],no);}if(x > (ref['left'] + (ref['width']/2)) && y>ref['top'] && x<(ref['left'] + ref['width']) && y<(ref['top'] + ref['height'])){if(no<dragableObjectArray.length-1){if(no==indexCurrentDragObject || (no==indexCurrentDragObject-1)){return 'self';}if(dragableObjectArray[no]['obj']!=dragObject){return Array(dragableObjectArray[no+1],no+1);}else{if(!useRectangle)return 'self';if(no<dragableObjectArray.length-2)return Array(dragableObjectArray[no+2],no+2);}}else{if(dragableObjectArray[dragableObjectArray.length-1]['obj']!=dragObject)return 'append';}}if(no<dragableObjectArray.length-1){if(x > (ref['left'] + ref['width']) && y>ref['top'] && y<(ref['top'] + ref['height']) && y<dragableObjectArray[no+1]['top']){return Array(dragableObjectArray[no+1],no+1);}}}if(x>ref['left'] && y>(ref['top'] + ref['height']))return 'append';return false;}function initDrag(e){if(document.all)e = event;var target = e.target || e.srcElement;if (target.tagName == 'INPUT' || target.tagName == 'TEXTAREA')
return;mouse_x = e.clientX;mouse_y = e.clientY;if(!documentScrollHeight)documentScrollHeight = document.documentElement.scrollHeight + 100;el_x = getLeftPos(this)/1;el_y = getTopPos(this)/1;dragObject = this;rectangleDiv.style.width = this.clientWidth - (rectangleBorderWidth*2) +'px';rectangleDiv.style.height = this.clientHeight - (rectangleBorderWidth*2) +'px';rectangleDiv.className = this.className;dragDropTimer = 0;dragObjectNextObj = false;if(this.nextSibling){dragObjectNextObj = this.nextSibling;if(!dragObjectNextObj.tagName)dragObjectNextObj = dragObjectNextObj.nextSibling;}initDragTimer();return false;}function initDragTimer(){if(dragDropTimer>=0 && dragDropTimer<10){dragDropTimer++;setTimeout('initDragTimer()',5);return;}if(dragDropTimer==10){dragObject.style.opacity = 0.5;dragObject.style.filter = 'alpha(opacity=50)';dragObject.style.cursor = 'default';}}function autoScroll(direction,yPos){if(document.documentElement.scrollHeight>documentScrollHeight && direction>0)return;window.scrollBy(0,direction);if(direction<0){if(document.documentElement.scrollTop>0){mouse_y = mouse_y - direction;dragObject.style.top = (el_y - mouse_y + yPos) + 'px';}else{autoScrollActive = false;}}else{if(yPos>(documentHeight-50)){mouse_y = mouse_y - direction;dragObject.style.top = (el_y - mouse_y + yPos) + 'px';}else{autoScrollActive = false;}}if(autoScrollActive)
setTimeout('autoScroll('+direction+',' + yPos + ')',5);}function moveDragableElement(e){if (!e) e = window.event;if(dragDropTimer<10)return;if(!allowRectangleMove)return;if(e.clientY<50 || e.clientY>(documentHeight-50)){if(e.clientY<50 && !autoScrollActive){autoScrollActive = true;autoScroll((autoScrollSpeed*-1),e.clientY);}if(e.clientY>(documentHeight-50) && document.documentElement.scrollHeight<=documentScrollHeight && !autoScrollActive){autoScrollActive = true;autoScroll(autoScrollSpeed,e.clientY);}}else{autoScrollActive = false;}if(useRectangle){if(dragObject.style.position!='absolute'){dragObject.style.position = 'absolute';setTimeout('repositionDragObjectArray()',50);}}rectangleDiv.style.display='block';dragObject.style.left = (el_x - mouse_x + e.clientX + Math.max(document.body.scrollLeft,document.documentElement.scrollLeft)) + 'px';dragObject.style.top = (el_y - mouse_y + e.clientY) + 'px';dest = getObjectFromPosition(e.clientX+Math.max(document.body.scrollLeft,document.documentElement.scrollLeft),e.clientY+Math.max(document.body.scrollTop,document.documentElement.scrollTop));if(dest!==false && dest!='append' && dest!='self'){destinationObj = dest[0];if(currentDest!==destinationObj){currentDest = destinationObj;destinationObj['obj'].parentNode.insertBefore(rectangleDiv,destinationObj['obj']);repositionDragObjectArray();}}if(dest=='self' || !dest){destinationObj = dest;}if(dest=='append'){dragableElementsParentBox.appendChild(rectangleDiv);dragableElementsParentBox.appendChild(document.getElementById('clear'));destinationObj = dest;repositionDragObjectArray();}if(!dest){destinationObj = currentDest;}allowRectangleMove = false;setTimeout('allowRectangleMove=true',50);}function stop_dragDropElement(){dragDropTimer = -1;if(destinationObj && destinationObj!='append' && destinationObj!='self'){destinationObj['obj'].parentNode.insertBefore(dragObject,destinationObj['obj']);}if(destinationObj=='append'){dragableElementsParentBox.appendChild(dragObject);dragableElementsParentBox.appendChild(document.getElementById('clear'));}if(dragObject){dragObject.style.opacity = 1;dragObject.style.filter = 'alpha(opacity=100)';dragObject.style.cursor = 'move';dragObject.style.position='static';}rectangleDiv.style.display='none';dragObject = false;currentDest = false;resetObjectArray();if(dragDropMoveLayer){dragDropMoveLayer.style.display='none';dragDropMoveLayer.innerHTML='';}autoScrollActive = false;documentScrollHeight = document.documentElement.scrollHeight + 100;var move = new String(destinationObj);if (move != 'false')
saveData();destinationObj = false;}function cancelEvent(){return false;}function repositionDragObjectArray(){for(var no=0;no<dragableObjectArray.length;no++){ref = dragableObjectArray[no];ref['left'] = getLeftPos(ref['obj']);ref['top'] = getTopPos(ref['obj']);}documentScrollHeight = document.documentElement.scrollHeight + 100;documentHeight = document.documentElement.clientHeight;}function resetObjectArray(){dragableObjectArray.length=0;var subDivs = dragableElementsParentBox.getElementsByTagName('div');var countEl = 0;for(var no=0;no<subDivs.length;no++){var id = subDivs[no].id;if(id.indexOf('widget') == 0){var index = dragableObjectArray.length;dragableObjectArray[index] = new Array();ref = dragableObjectArray[index];ref['obj'] = subDivs[no];ref['width'] = subDivs[no].offsetWidth;ref['height'] = subDivs[no].offsetHeight;ref['left'] = getLeftPos(subDivs[no]);ref['top'] = getTopPos(subDivs[no]);ref['index'] = countEl;countEl++;}}}function initdragableElements(){dragableElementsParentBox = document.getElementById('widgetzone');if (!dragableElementsParentBox)
return;dragableAreaWidth = dragableElementsParentBox.offsetWidth;dragDropMoveLayer = document.createElement('DIV');dragDropMoveLayer.id = 'dragDropMoveLayer';document.body.appendChild(dragDropMoveLayer);var subDivs = dragableElementsParentBox.getElementsByTagName('div');var countEl = 0;for(var no=0;no<subDivs.length;no++){var id = subDivs[no].id;if(id.indexOf('widget') == 0){subDivs[no].style.cursor='move';subDivs[no].onmousedown = initDrag;var index = dragableObjectArray.length;dragableObjectArray[index] = new Array();ref = dragableObjectArray[index];ref['obj'] = subDivs[no];ref['width'] = subDivs[no].offsetWidth;ref['height'] = subDivs[no].offsetHeight;ref['left'] = getLeftPos(subDivs[no]);ref['top'] = getTopPos(subDivs[no]);ref['index'] = countEl;countEl++;}}rectangleDiv = document.createElement('DIV');rectangleDiv.id='rectangle';rectangleDiv.style.display='none';dragableElementsParentBox.appendChild(rectangleDiv);document.body.onmousemove = moveDragableElement;document.body.onmouseup = stop_dragDropElement;document.body.onselectstart = cancelSelectionEvent;document.body.ondragstart = cancelEvent;window.onresize = repositionDragObjectArray;documentHeight = document.documentElement.clientHeight;}function editWidget(name,id){window.scrollTo(0,0);var width = document.documentElement.clientWidth + document.documentElement.scrollLeft;var height = document.documentElement.clientHeight + document.documentElement.scrollTop;var layer = document.createElement('div');layer.style.zIndex = 1002;layer.id = 'layer';layer.style.position = 'absolute';layer.style.top = '0px';layer.style.left = '0px';layer.style.height = document.documentElement.scrollHeight + 'px';layer.style.width = width + 'px';layer.style.backgroundColor = 'black';layer.style.opacity = '.6';layer.style.filter += ("progid:DXImageTransform.Microsoft.Alpha(opacity=60)");document.body.style.position = 'static';document.body.appendChild(layer);var size ={'height': 500,'width': 750};var iframe = document.createElement('iframe');iframe.name = 'Widget Editor';iframe.id = 'WidgetEditor';iframe.src = BlogEngine.webRoot + 'admin/WidgetEditor.aspx?widget=' + name + '&id=' + id;iframe.style.height = size.height + 'px';iframe.style.width = size.width + 'px';iframe.style.position = 'fixed';iframe.style.zIndex = 1003;iframe.style.backgroundColor = 'white';iframe.style.border = '4px solid silver';iframe.frameborder = '0';iframe.style.top = ((height + document.documentElement.scrollTop) / 2) - (size.height / 2) + 'px';iframe.style.left = (width / 2) - (size.width / 2) + 'px';document.body.appendChild(iframe);}function addWidget(type){BlogEngine.createCallback(BlogEngine.webRoot + "admin/WidgetEditor.aspx?add=" + type + "&rnd=" + Math.random(),appendWidget);}function appendWidget(response){if (response == "reload"){location.reload();}else{var zone = BlogEngine.$('widgetzone');zone.innerHTML += response;}}function removeWidget(id){if (confirm('Are you sure you want to remove the widget?')){BlogEngine.createCallback(BlogEngine.webRoot + "admin/WidgetEditor.aspx?remove=" + id + "&rnd=" + Math.random(),null);BlogEngine.$('widget' + id).style.display = 'none';}}function closeEditor(){document.body.removeChild(BlogEngine.$('WidgetEditor'));document.body.removeChild(BlogEngine.$('layer'));document.body.style.position = '';}BlogEngine.addLoadEvent(initdragableElements);

Or in a code snippet:

var rectangleBorderWidth = 2;var useRectangle = true;var autoScrollSpeed = 5;function saveData(){var saveString = "";for(var no=0;no<dragableObjectArray.length;no++){if(saveString.length>0)saveString = saveString + ';';ref = dragableObjectArray[no];saveString = saveString + ref['obj'].id.replace('widget','');}BlogEngine.createCallback(BlogEngine.webRoot + "admin/WidgetEditor.aspx?move=" + saveString + "&rnd=" + Math.random(),null);}var dragableElementsParentBox;var opera = navigator.appVersion.indexOf('Opera')>=0?true:false;var rectangleDiv = false;var mouse_x;var mouse_y;var el_x;var el_y;var dragDropTimer = -1;var dragObject = false;var dragObjectNextObj = false;var dragableObjectArray = new Array();var destinationObj = false;var currentDest = false;var allowRectangleMove = true;var dragDropMoveLayer;var autoScrollActive = false;var documentHeight = false;var documentScrollHeight = false;var dragableAreaWidth = false;function getTopPos(inputObj){var returnValue = inputObj.offsetTop;try{while((inputObj = inputObj.offsetParent) != null){if(inputObj.tagName!='HTML')returnValue += inputObj.offsetTop;}}catch (ex){}return returnValue;}function getLeftPos(inputObj){var returnValue = inputObj.offsetLeft;try{while((inputObj = inputObj.offsetParent) != null){if(inputObj.tagName!='HTML')returnValue += inputObj.offsetLeft;}}catch (ex){}return returnValue;}function cancelSelectionEvent(){if(dragDropTimer>=0)return false;return true;}function getObjectFromPosition(x,y){var height = dragObject.offsetHeight;var width = dragObject.offsetWidth;var indexCurrentDragObject=-5;for(var no=0;no<dragableObjectArray.length;no++){ref = dragableObjectArray[no];if(ref['obj']==dragObject)indexCurrentDragObject=no;if(no<dragableObjectArray.length-1 && dragableObjectArray[no+1]['obj']==dragObject)indexCurrentDragObject=no+1;if(ref['obj']==dragObject && useRectangle)continue;if(x > ref['left'] && y>ref['top'] && x<(ref['left'] + (ref['width']/2)) && y<(ref['top'] + ref['height'])){if(!useRectangle && dragableObjectArray[no]['obj']==dragObject)return 'self';if(indexCurrentDragObject==(no-1))return 'self';return Array(dragableObjectArray[no],no);}if(x > (ref['left'] + (ref['width']/2)) && y>ref['top'] && x<(ref['left'] + ref['width']) && y<(ref['top'] + ref['height'])){if(no<dragableObjectArray.length-1){if(no==indexCurrentDragObject || (no==indexCurrentDragObject-1)){return 'self';}if(dragableObjectArray[no]['obj']!=dragObject){return Array(dragableObjectArray[no+1],no+1);}else{if(!useRectangle)return 'self';if(no<dragableObjectArray.length-2)return Array(dragableObjectArray[no+2],no+2);}}else{if(dragableObjectArray[dragableObjectArray.length-1]['obj']!=dragObject)return 'append';}}if(no<dragableObjectArray.length-1){if(x > (ref['left'] + ref['width']) && y>ref['top'] && y<(ref['top'] + ref['height']) && y<dragableObjectArray[no+1]['top']){return Array(dragableObjectArray[no+1],no+1);}}}if(x>ref['left'] && y>(ref['top'] + ref['height']))return 'append';return false;}function initDrag(e){if(document.all)e = event;var target = e.target || e.srcElement;if (target.tagName == 'INPUT' || target.tagName == 'TEXTAREA')
return;mouse_x = e.clientX;mouse_y = e.clientY;if(!documentScrollHeight)documentScrollHeight = document.documentElement.scrollHeight + 100;el_x = getLeftPos(this)/1;el_y = getTopPos(this)/1;dragObject = this;rectangleDiv.style.width = this.clientWidth - (rectangleBorderWidth*2) +'px';rectangleDiv.style.height = this.clientHeight - (rectangleBorderWidth*2) +'px';rectangleDiv.className = this.className;dragDropTimer = 0;dragObjectNextObj = false;if(this.nextSibling){dragObjectNextObj = this.nextSibling;if(!dragObjectNextObj.tagName)dragObjectNextObj = dragObjectNextObj.nextSibling;}initDragTimer();return false;}function initDragTimer(){if(dragDropTimer>=0 && dragDropTimer<10){dragDropTimer++;setTimeout('initDragTimer()',5);return;}if(dragDropTimer==10){dragObject.style.opacity = 0.5;dragObject.style.filter = 'alpha(opacity=50)';dragObject.style.cursor = 'default';}}function autoScroll(direction,yPos){if(document.documentElement.scrollHeight>documentScrollHeight && direction>0)return;window.scrollBy(0,direction);if(direction<0){if(document.documentElement.scrollTop>0){mouse_y = mouse_y - direction;dragObject.style.top = (el_y - mouse_y + yPos) + 'px';}else{autoScrollActive = false;}}else{if(yPos>(documentHeight-50)){mouse_y = mouse_y - direction;dragObject.style.top = (el_y - mouse_y + yPos) + 'px';}else{autoScrollActive = false;}}if(autoScrollActive)
setTimeout('autoScroll('+direction+',' + yPos + ')',5);}function moveDragableElement(e){if (!e) e = window.event;if(dragDropTimer<10)return;if(!allowRectangleMove)return;if(e.clientY<50 || e.clientY>(documentHeight-50)){if(e.clientY<50 && !autoScrollActive){autoScrollActive = true;autoScroll((autoScrollSpeed*-1),e.clientY);}if(e.clientY>(documentHeight-50) && document.documentElement.scrollHeight<=documentScrollHeight && !autoScrollActive){autoScrollActive = true;autoScroll(autoScrollSpeed,e.clientY);}}else{autoScrollActive = false;}if(useRectangle){if(dragObject.style.position!='absolute'){dragObject.style.position = 'absolute';setTimeout('repositionDragObjectArray()',50);}}rectangleDiv.style.display='block';dragObject.style.left = (el_x - mouse_x + e.clientX + Math.max(document.body.scrollLeft,document.documentElement.scrollLeft)) + 'px';dragObject.style.top = (el_y - mouse_y + e.clientY) + 'px';dest = getObjectFromPosition(e.clientX+Math.max(document.body.scrollLeft,document.documentElement.scrollLeft),e.clientY+Math.max(document.body.scrollTop,document.documentElement.scrollTop));if(dest!==false && dest!='append' && dest!='self'){destinationObj = dest[0];if(currentDest!==destinationObj){currentDest = destinationObj;destinationObj['obj'].parentNode.insertBefore(rectangleDiv,destinationObj['obj']);repositionDragObjectArray();}}if(dest=='self' || !dest){destinationObj = dest;}if(dest=='append'){dragableElementsParentBox.appendChild(rectangleDiv);dragableElementsParentBox.appendChild(document.getElementById('clear'));destinationObj = dest;repositionDragObjectArray();}if(!dest){destinationObj = currentDest;}allowRectangleMove = false;setTimeout('allowRectangleMove=true',50);}function stop_dragDropElement(){dragDropTimer = -1;if(destinationObj && destinationObj!='append' && destinationObj!='self'){destinationObj['obj'].parentNode.insertBefore(dragObject,destinationObj['obj']);}if(destinationObj=='append'){dragableElementsParentBox.appendChild(dragObject);dragableElementsParentBox.appendChild(document.getElementById('clear'));}if(dragObject){dragObject.style.opacity = 1;dragObject.style.filter = 'alpha(opacity=100)';dragObject.style.cursor = 'move';dragObject.style.position='static';}rectangleDiv.style.display='none';dragObject = false;currentDest = false;resetObjectArray();if(dragDropMoveLayer){dragDropMoveLayer.style.display='none';dragDropMoveLayer.innerHTML='';}autoScrollActive = false;documentScrollHeight = document.documentElement.scrollHeight + 100;var move = new String(destinationObj);if (move != 'false')
saveData();destinationObj = false;}function cancelEvent(){return false;}function repositionDragObjectArray(){for(var no=0;no<dragableObjectArray.length;no++){ref = dragableObjectArray[no];ref['left'] = getLeftPos(ref['obj']);ref['top'] = getTopPos(ref['obj']);}documentScrollHeight = document.documentElement.scrollHeight + 100;documentHeight = document.documentElement.clientHeight;}function resetObjectArray(){dragableObjectArray.length=0;var subDivs = dragableElementsParentBox.getElementsByTagName('div');var countEl = 0;for(var no=0;no<subDivs.length;no++){var id = subDivs[no].id;if(id.indexOf('widget') == 0){var index = dragableObjectArray.length;dragableObjectArray[index] = new Array();ref = dragableObjectArray[index];ref['obj'] = subDivs[no];ref['width'] = subDivs[no].offsetWidth;ref['height'] = subDivs[no].offsetHeight;ref['left'] = getLeftPos(subDivs[no]);ref['top'] = getTopPos(subDivs[no]);ref['index'] = countEl;countEl++;}}}function initdragableElements(){dragableElementsParentBox = document.getElementById('widgetzone');if (!dragableElementsParentBox)
return;dragableAreaWidth = dragableElementsParentBox.offsetWidth;dragDropMoveLayer = document.createElement('DIV');dragDropMoveLayer.id = 'dragDropMoveLayer';document.body.appendChild(dragDropMoveLayer);var subDivs = dragableElementsParentBox.getElementsByTagName('div');var countEl = 0;for(var no=0;no<subDivs.length;no++){var id = subDivs[no].id;if(id.indexOf('widget') == 0){subDivs[no].style.cursor='move';subDivs[no].onmousedown = initDrag;var index = dragableObjectArray.length;dragableObjectArray[index] = new Array();ref = dragableObjectArray[index];ref['obj'] = subDivs[no];ref['width'] = subDivs[no].offsetWidth;ref['height'] = subDivs[no].offsetHeight;ref['left'] = getLeftPos(subDivs[no]);ref['top'] = getTopPos(subDivs[no]);ref['index'] = countEl;countEl++;}}rectangleDiv = document.createElement('DIV');rectangleDiv.id='rectangle';rectangleDiv.style.display='none';dragableElementsParentBox.appendChild(rectangleDiv);document.body.onmousemove = moveDragableElement;document.body.onmouseup = stop_dragDropElement;document.body.onselectstart = cancelSelectionEvent;document.body.ondragstart = cancelEvent;window.onresize = repositionDragObjectArray;documentHeight = document.documentElement.clientHeight;}function editWidget(name,id){window.scrollTo(0,0);var width = document.documentElement.clientWidth + document.documentElement.scrollLeft;var height = document.documentElement.clientHeight + document.documentElement.scrollTop;var layer = document.createElement('div');layer.style.zIndex = 1002;layer.id = 'layer';layer.style.position = 'absolute';layer.style.top = '0px';layer.style.left = '0px';layer.style.height = document.documentElement.scrollHeight + 'px';layer.style.width = width + 'px';layer.style.backgroundColor = 'black';layer.style.opacity = '.6';layer.style.filter += ("progid:DXImageTransform.Microsoft.Alpha(opacity=60)");document.body.style.position = 'static';document.body.appendChild(layer);var size ={'height': 500,'width': 750};var iframe = document.createElement('iframe');iframe.name = 'Widget Editor';iframe.id = 'WidgetEditor';iframe.src = BlogEngine.webRoot + 'admin/WidgetEditor.aspx?widget=' + name + '&id=' + id;iframe.style.height = size.height + 'px';iframe.style.width = size.width + 'px';iframe.style.position = 'fixed';iframe.style.zIndex = 1003;iframe.style.backgroundColor = 'white';iframe.style.border = '4px solid silver';iframe.frameborder = '0';iframe.style.top = ((height + document.documentElement.scrollTop) / 2) - (size.height / 2) + 'px';iframe.style.left = (width / 2) - (size.width / 2) + 'px';document.body.appendChild(iframe);}function addWidget(type){BlogEngine.createCallback(BlogEngine.webRoot + "admin/WidgetEditor.aspx?add=" + type + "&rnd=" + Math.random(),appendWidget);}function appendWidget(response){if (response == "reload"){location.reload();}else{var zone = BlogEngine.$('widgetzone');zone.innerHTML += response;}}function removeWidget(id){if (confirm('Are you sure you want to remove the widget?')){BlogEngine.createCallback(BlogEngine.webRoot + "admin/WidgetEditor.aspx?remove=" + id + "&rnd=" + Math.random(),null);BlogEngine.$('widget' + id).style.display = 'none';}}function closeEditor(){document.body.removeChild(BlogEngine.$('WidgetEditor'));document.body.removeChild(BlogEngine.$('layer'));document.body.style.position = '';}BlogEngine.addLoadEvent(initdragableElements);
 
Dec 27, 2009 at 5:00 PM

Oke I have created two screen clippings.
One is on IIS 7 (Dutch) and is working oke when logged in as admin.
The second one is on IIS 6 (UK) and fails on the following points:
- The css styling from the widget zone is not correct as can be seen on the title bars.
- When trying to move a widget I get the java error as stated above

I have send you a link to the pictures in a PM.
Thanks for all your help so far.

Arno

Coordinator
Dec 28, 2009 at 5:04 PM

Hi Arno,

The JS looks fine.  It's the same JS I have.  I saw the two screen shots too.  It's odd that the Edit/Delete links are displaying differently on IIS6.

At this point, I'm not sure the reason why drag-and-drop isn't working.  If you haven't yet, you might want to try and see if the same problem exists with other browsers (Firefox, IE, Chrome).

One possible workaround would be to upgrade to the latest build (1.5.1.41) on the Source Code tab above.  Actually, back in April, shortly after 1.5 was released, drag-and-drop was removed from BE.  This was done when support for multiple widgetzones was added.  Instead of drag-and-drop, there's now a 'Move' link with a dropdown list that allows you to select the position you want to a move a widget to.  I blogged about this change here.  In order to use one of the builds from the Source Code tab, it does require you compile the BE core with Visual Studio.  BE 1.5.1.41 is very stable.  Not sure if you're up for the upgrade since you might be trying to keep the version the same among your various blogs.

If another possible solution for drag-and-drop comes to me, I'll post here again.