These are some example server side scripts you can use to create more dynamic graphic views.


Server Side Script Basic text with decimal place control - change (0) for # of decimals

 

return '<span style="font-size:16px;">'+ value.toFixed(1) +'</span>';

 

Server Side Script Basic text with size and color options

 

return '<span style="color: Black; font-size:20px;">Your Text Here: '+ '<font color="green">'+ value.toFixed(0) +' Ending Text</span>';

 

Server Side Script increase value and image on click

 

var s = "";
if (value == 0)
s += "<img style='cursor:pointer;' src='graphics/GreenThermo/thermometer0.jpg' onclick='mango.view.setPoint("+ point.id +", \""+ pointComponent.id +"\", \"1\");return 1;'/>";
else if (value == 1)
s += "<img style='cursor:pointer;' src='graphics/GreenThermo/thermometer1.jpg' onclick='mango.view.setPoint("+ point.id +", \""+ pointComponent.id +"\", \"2\");return 2;'/>";
else if (value == 2)
s += "<img style='cursor:pointer;' src='graphics/GreenThermo/thermometer2.jpg' onclick='mango.view.setPoint("+ point.id +", \""+ pointComponent.id +"\", \"3\");return 3;'/>";
else if (value == 3)
s += "<img style='cursor:pointer;' src='graphics/GreenThermo/thermometer3.jpg' onclick='mango.view.setPoint("+ point.id +", \""+ pointComponent.id +"\", \"0\");return 0;'/>";
return s;

 

Server Side Script Decrease the value on click with image:

 

var result = "";
result += "<span onclick='mango.view.setPoint("+ point.id+", "+ pointComponent.id +", \""+ (value - 1) +"\")'>";
result += "<img src='/modules/sstGraphics/web/graphics/drink_empty.png'/>";
return result;

 

Server Side Script Increase the value on Click with image:

 

var result = "";
result += "<span onclick='mango.view.setPoint("+ point.id+", "+ pointComponent.id +", \""+ (value + 1) +"\")'>";
result += "<img src='/modules/sstGraphics/web/graphics/Drinks/drink_empty.png'/>";
return result;

 

Server Side Script Toggle on image click

 

var s = "";
if (!value)
s += "<img style='cursor:pointer;' src='/modules/sstGraphics/web/graphics/Drinks/drink_empty.png' onclick='mango.view.setPoint("+ point.id +", \""+ pointComponent.id +"\", \"true\");return true;'/>";
else if (value)
s += "<img style='cursor:pointer;' src='/modules/sstGraphics/web/graphics/Drinks/drink.png' onclick='mango.view.setPoint("+ point.id +", \""+ pointComponent.id +"\", \"false\");return false;'/>";
return s;

 

Server Side Script Turn on with click but can't turn off

 

var s = "";
if (!value)
s += "<img style='cursor:pointer;' src='/modules/sstGraphics/web/graphics/GreenThermo/thermometer0.jpg' onclick='mango.view.setPoint("+ point.id +", \""+ pointComponent.id +"\", \"true\");return true;'/>";
else if (value)
var s = "";
if (value)
s += "<img src='/modules/sstGraphics/web/graphics/​GreenThermo/thermometer5.jpg'/>";
return s;

 

Server Side Script Toggle with text and Image:

 

var s = "";
s += "<a href='#' onclick='mango.view.setPoint("+ point.id +", \""+ pointComponent.id +"\", \""+ !value +"\");return false;'>Toggle</a>";
s += " its state.";
if (value)
s += "<img style='cursor:pointer;' src='/modules/sstGraphics/web/graphics/Drinks/drink.png' onclick='mango.view.setPoint("+ point.id +", \""+ pointComponent.id +"\", \"false\");return false;'/>";
else
s += "<img src='/modules/sstGraphics/web/graphics/Drinks/drink_empty.png'/>";
return s;

 
Server Side Script On / Off / Toggle text no image:

 

var s = "";
s += "Or, use these scripted controls to turn the light ";
s += "<a href='#' onclick='mango.view.setPoint("+ point.id +", \""+ pointComponent.id +"\", \"false\");return false;'>";
s += value ? "Off" : "<b>Off</b>";
s += "</a>, ";
s += "<a href='#' onclick='mango.view.setPoint("+ point.id +", \""+ pointComponent.id +"\", \"true\");return false;'>";
s += value ? "<b>On</b>" : "On";
s += "</a>, or to ";
s += "<a href='#' onclick='mango.view.setPoint("+ point.id +", \""+ pointComponent.id +"\", \""+ !value +"\");return false;'>Toggle</a>";
s += " its state.";
return s;

 

Server Side Script Change from On to off with font format

 

if (!value)
return "<span style="font-size:40px;"><font color="gray">Off</span>";
else if (value)
return "<span style="font-size:40px;">'+ '<font color="blue">'+' On</span>";
if (!value)
return "<span style="font-size:40px;">'+ '<font color="gray">'+ Off</span>";
else if (value)
return "<span style="font-size:40px;">'+ '<font color="blue">'+ On</span>";
return s;