Lesson 06: Manipulating the Gadget Container

From VZ Developer Wiki
Jump to: navigation, search

General Guidelines | XML Specification | Features | Views | JavaScript API | REST API | Tutorials | OAuth


Lesson 05: Fetching content from VZ CDN Back to overview Lesson 07: Gadget Localization

The Gadget API offers several ways to interact with the Gadget Container and to manipulate the way how it embeds the gadget.

You can
  • Set the Gadget Title in the toolbar displayed above the rendered gadget
  • Get current gadget dimensions and adjust height of Gadget in container
  • Display a minimessage

The following gadget shows in a simple example how you can use these features:

<?xml version="1.0" encoding="UTF-8"?>
<Module>
    <ModulePrefs 
			title="my gadget"
			thumbnail="img/vzall_150x100.jpg"
			icon="img/vzall_85x85.jpg"
			>
        <Require feature="views" />
        <Require feature="settitle" />
        <Require feature="minimessage" />
    </ModulePrefs>
	 <Content type="html" view="canvas,popup,profile"><![CDATA[
		<h1 id="View"></h1>
		<script type="text/javascript">
			gadgets.util.registerOnLoadHandler(function() {
		          gadgets.window.setTitle('neuer titel');
			  document.getElementById('View').innerHTML = 'Test';
				
			  var msg = new gadgets.MiniMessage('__MODULE_ID__');
			  var statusMsg = msg.createDismissibleMessage("This is an error!");
			  statusMsg.style.backgroundColor = "red";
			  statusMsg.style.color = "white";
			  gadgets.window.adjustHeight();	
				
			});
		</script>
  ]]></Content>
</Module>


  • Lesson 06: Manipulating the Gadget Container