Bindows using ASP .NET14
Johan Segerfeldt posted in Bindows Clients, Bindows Gauges, Developing in Bindows on March 23rd, 2009
Today a customer made me aware of the fact that we have no sample for
creating Bindows apps using ASP .Net. He wanted a sample on how to add a
gauge and setting dynamic properties in the XML definition.
Of course we need ASP .Net samples. The forum can be seen as a sample on
server communication, but it uses Perl for the backend. I decided to make
a small and simple, yet instructive sample. I hope I was successful.
An application generated from dynamic sources is not much different from one
made of static sources. You still need an ‘HTML file’ and an ‘XML file’.
The difference is that both these ‘files’ are generated on demand and their
content can be different from one request to another based on server logic.
This sample was made using the free gauges. You can download them
here.
It is not difficult to translate the lessons learned in this sample to a
full Bindows application (ADF). Just replace the script in the ‘HTML file’
with application.start(…) or biExec(…) just as you would with static
HTML and XML sources.
For this sample my ‘HTML file’ is Default.aspx, the file that is
automatically generated by the WebSite project template. I edited its
content with the following:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<html>
<head>
<title></title>
<!-- Load free Bindows Gauges package -->
<script type="text/javascript" src="bindows_gauges/bindows_gauges.js"></script>
</head>
<body>
<p>This is a very simple sample displaying a gauge.</p>
<div id="gaugeDiv" style="width: 250px; height: 250px;"></div>
<script type="text/javascript">
var gauge = bindows.loadGaugeIntoDiv("Gauge.aspx", "gaugeDiv");
function setNeedleValue(nValue) {
gauge.needle.setValue(nValue);
gauge.value.setText(nValue);
}
// setNeedleValue(25);
gauge.unit.setText("[kW]");
</script>
</body>
</html>
Then I added a new aspx file (Gauge.aspx) using a random template. 
This
also created a code-behind file (Gauge.aspx.cs) that I deleted. Because I
deleted that I also edited the file header of the aspx file to remove the
reference. All I kept was this bit:
<%@ Page Language="C#" %>
In the content I pasted the sample gauge from the free gauges package and
edited it up a bit to suit my purposes. I added a <% %>
section at the top, where I initialized some C# variables:
<%
// Two values setting the start locations for warning hints on the gauge scale.
// These could be configured from user preferences.
int warnLow = 25;
int warnHigh = 180;
int value = 125;
// Error handling / range assertions.
if (warnLow > warnHigh)
throw new ArgumentException("The low range must be less than the high range.");
else if (warnHigh < 0 || warnLow < 0 || value 300 || warnLow > 300 || value > 300)
throw new ArgumentException("Values must be between 0 - 300.");
%>
Further down in the gauge XML I referenced these variables. Here’s an example:
<Gauge2RadialScale startValue="0" endValue="300"> <!-- Needle --> <Gauge2RadialNeedle id="needle" value="<%=value%>" stroke="#000000" strokeWidth="3" innerRadius="0" innerWidth="40" outerRadius="360" outerWidth="5"> <Gauge2RadialNeedle.Filler> <Gauge2RadialGradientFiller color1="#808080" color2="#000000"/> </Gauge2RadialNeedle.Filler> </Gauge2RadialNeedle> </Gauge2RadialScale>
Download entire web site source code (ZIP).