Widget - How it works

Requires Widget plugin to be added to the toolbar.

XML Format description:

<SHOWWIDGET name="widgetwindow__GadgetRX0" template="template.htm" width="400" height="400">
<PROPERTY key="content"><?[CDATA[ Content goes here ...]]></PROPERTY>
<PROPERTY key="x" value="100"/>              
<PROPERTY key="y" value="100"/>              
<PROPERTY key="caption" value="No caption"/>              
<PROPERTY key="sizeable" value="false"/>              
<PROPERTY key="minwidth" value="200"/>              
<PROPERTY key="minheight" value="200"/>          
</SHOWWIDGET>

Attributes

Properties

Position

• top
• bottom
• left
• right
• right-top
• left-top
• right-bottom
• left-bottom

Javascript Api Interface

function GetProperty(name, value); // Returns the value of the property by name
function SetProperty(name, value); // Sets the value of the property by name
function SetWindowPos(...); // Changes the position/size of the Widget window on the screen
function ModifyStyle(...); // Changes the styles of the window
function MoveWindow(...); // Changes the position of the Widget windows on the screen
function ResizeWindow(...); // Changes the size of the window
function MakeWindowTransparent(...); // Makes the window semi-transparent
function Capturemouse(); // Moves the window with a mouse cursor
function GetWindowRect(...); // Returns the coordinates of the window

Example :

Widget Support Box

function alert(msg)
{
MainWindow.document.parentWindow.alert(msg);
}

function addWidget(widget)
{
try
{
if (widget==null)
return;
if(!MainWindow.document.parentWindow.confirm("Are you sure you want to add this widget on the toolbar?"))
return;
var context = MainWindow.document.parentWindow.document;

var widgetWindow = {width: 300, height: 300, name: "Widget", sourceId: widget.sourceId}

var blidgetWidthField = context.getElementById("appInstance.width");
if (blidgetWidthField)
widgetWindow.width = 40 + 1*blidgetWidthField.value;
var blidgetHeightField = context.getElementById("appInstance.height");
if (blidgetHeightField)
widgetWindow.height = 60 + 1*blidgetHeightField.value;

var blidgetNameField = context.getElementById("wdgt-name");
if (blidgetNameField)
widgetWindow.name = blidgetNameField.innerText;
var sWidgetList = gTool.LoadFile("toolbarWidgetList", "[]");
var widgetList = new Array();
if (sWidgetList != '')
widgetList = JSON.parse(sWidgetList);

widgetList.push(widgetWindow);

gTool.SaveFile("toolbarWidgetList", JSON.stringify(widgetList));

updateCustomXML(widgetList);
} catch(e){alert(e);}
}
function xmlEscape(text)
{
return text.replace(/&/, "&amp;").replace(/</, "<lt;").replace(/>/, "&gt;").replace(/"/, "&quote;");
}

function updateCustomXML(widgetList)
{
try
{
var commands = '';
var buttons = '';

for(i=0; i<widgetList.length; i++)
{

var widget = widgetList[i];
commands +=
" <SHOWWIDGET name=\"command_"+widget.sourceId+"\" template=\"template_widget.htm\" width=\""+widget.width+"\" height=\""+widget.height+"\" caption=\""+xmlEscape(widget.name)+"\">"+
" <PROPERTY key=\"sizeable\" value=\"true\"/>"+
" <PROPERTY key=\"minwidth\" value=\""+widget.width+"\"/>"+
" <PROPERTY key=\"minheight\" value=\""+widget.height+"\"/>"+
" <PROPERTY key=\"content\"><![CDATA[if (WIDGETBOX) WIDGETBOX.renderWidget('"+widget.sourceId+"');]]></PROPERTY>"+
" </SHOWWIDGET>";

buttons += "<BUTTON id=\"button_"+widget.sourceId+"\" command=\"command_"+widget.sourceId+"\" caption=\""+xmlEscape(widget.name)+"\" type=\"Split\" visibility=\"1\"/>";

}


var str = "<TOOLBAR><COMMANDS>"+commands+"</COMMANDS>"+buttons+"</TOOLBAR>";
SetXml("WidgetCustomXML", str);
} catch(e)
{
alert("updateCustomXML: " + e);
}

}

function SetXml(section, textXml)
{
try
{
if (gTool.CustomXML(section) != textXml)
{
gTool.CustomXML(section) = textXml;
gTool.Reload(); //-- reload it
}
} catch(e){alert(e)}
}

var gTool;

function DocumentComplete(tool, type)
{
gTool = tool;
if ((tool.url.indexOf("widgetbox.com")>0) && (type=="window"))
{
try
{
addWidgetButton();
} catch(e){alert(e)}
}
}

function addWidgetButton()
{
try
{
var context = MainWindow.document.parentWindow.document;
if (MainWindow.document.parentWindow.WbxGetWidget)
{
var box = context.getElementById("otherInstallTargets");
if (box)
{
var div = context.createElement("IMG");
//div.className = "install-tile";
div.style.width = "41px";
div.style.height = "41px";
div.style.background = "transparent url(http://softomate.net/ext/widget/tb.gif) no-repeat scroll 50% 50%;";
div.src = "http://pub.widgetbox.com/images/tile-overlay.png";


var anc = context.createElement("A");
anc.className = "install-tile";
anc.attachEvent("onmouseover", function(){MainWindow.document.parentWindow.status=''; return true;});
anc.href = "javascript: if(WbxGetWidget) ToolbarAddWidget(WbxGetWidget);";
anc.appendChild(div);
box.insertBefore(anc, box.firstChild);

MainWindow.document.parentWindow.ToolbarAddWidget = addWidget;
}
}
} catch(e){alert("addWidgetButton: "+e);}
}


//////////////////////////////////////////////////////////////////////////
// JSON Parser & Stringifier
// Here goes implmentation of JSON parser