var applicationCodeObj = SuperWidget.extend({
	    instanceId: null,
	    sociableId: null,
	
	    
    init: function() {
        //code
    },
    
	    bindings: {
		        local: {
			            'someFunc': ['click_someFunc']
		        }
	    },

    someFunc: function() {
    }
});

	type: "POST",
	url: "http://127.0.0.1:8080/seu_servico",
    dataType: 'json',
    data: {
        nome: 'Usuario', 
        start: 500000,
        end: 1361640526000 
    }
}).done(function(data) {
    showAlert("Olá usuário "+data.nome);
}).fail(function(data) {
    var obj = jQuery.parseJSON(data.responseText);
    showAlert(obj.message);
});

<!-- Header -->
<div id="wcm_header" class="wcm-header-background wcm-header">
    <!-- Grouper left -->
    <div class="header-grouper-left">
        <a href="home" class="wcm_logo" title="Fluig">WCM</a>
    </div>
    <!-- Grouper right -->
    <div class="header-grouper-right">
        <!-- Container login -->
        <div id="SlotLogin" slot="true" class="slot-header-actions">
            <#list (pageRender.getInstancesIds("SlotLogin"))! as id>
                ${pageRender.renderInstanceNoDecorator(id)}
            </#list>
        </div>
    </div>
</div>
<!-- WCM Wrapper content -->
<div class="wcm-wrapper-content">
    <!-- Menu esquerdo -->
    <nav class="wcm-navigation wcm-menu-background">
        <div id="SlotMenu" slot="true">
            <#list (pageRender.getInstancesIds("SlotMenu"))! as id>
                ${pageRender.renderInstanceNoDecorator(id)}
            </#list>
        </div>
    </nav>
    <!-- Wrapper -->
    <div class="wcm-all-content">
        <div id="wcm-content" class="clearfix wcm-background">
        <!--WIDGETS DO LAYOUT -->
        <link type="text/css" rel="stylesheet" href="${contextPath}/resources/css/wcm_layout.css"/>
            <!-- Onde deverá estar a barra de formatação -->
            <#if widgetRender.isEditMode()=true>
            <div name="formatBar" id="formatBar"></div>
            <!-- Div geral -->
            <!-- Há CSS distinto para Edição/Visualização -->
            <div id="edicaoPagina">
            <#else>
            <div id="visualizacaoPagina">
            </#if>
            <!-- Titulo da página -->
            <div class="slotfull layout-1-1">
                <span class="titleArea">${i18n.getTranslation('application.title')}</span>
                <h2 class="pageTitle">${pageTitle}</h2>
            </div>
            <!-- Slot 1 -->
            <div class="editable-slot slotfull layout-1-1" id="slotFull1">
                <textarea id="slot1_txtarea_top" class="ta_slot cke-ta"></textarea>
                <div id="SlotC" slot="true" class="slotint">
                    <#list (pageRender.getInstancesIds("SlotC"))! as id>
                        ${pageRender.renderInstanceNoDecorator(id)}
                    </#list>
                </div>
                <textarea id="slot1_txtarea_bottom" class="ta_slot cke-ta"></textarea>
            </div>
            <!-- Slot 2 -->
            <div class="editable-slot slotfull layout-1-1" id="slotFull2">
                <textarea id="slot2_txtarea_top" class="ta_slot cke-ta"></textarea>
                <div id="SlotB" slot="true" class="slotint">
                    <#list (pageRender.getInstancesIds("SlotB"))! as id>
                        ${pageRender.renderInstanceNoDecorator(id)}
                    </#list>
                </div>
                <textarea id="slot2_txtarea_bottom" class="ta_slot cke-ta"></textarea>
            </div>
            <!-- Slot 3 -->
            <div class="editable-slot slotfull layout-1-1" id="slotFull3">
                <textarea id="slot3_txtarea_top" class="ta_slot cke-ta"></textarea>
                <!-- Widget -->
                <div id="SlotA" slot="true" class="slotint">
                    <#list (pageRender.getInstancesIds("SlotA"))! as id>
                        ${pageRender.renderInstance(id)}
                    </#list>
                </div>
                <textarea id="slot3_txtarea_bottom" class="ta_slot cke-ta"></textarea>
            </div>
            </div>
            <!-- FIM DAS WIDGETS DO LAYOUT -->
            <div id="wcm_footer" class="wcm_footer"></div>
        </div>
    </div>
</div>

// JavaScript Document
$(document).ready(function() {
    /*$(".wcm_config_widgets").click(function() {
        $(this).parent('li').children('ul').toggle();
    });*/
    
    //Utilizado o 'live' para que o event handler não se perca na atualização de widgets. 
    $(".wcm_config_widgets").live("click", function(){
        $(this).parent('li').children('ul').toggle();
    });
                
    $(document).bind('click', function(e) {
        var $clicked = $(e.target);
        if (! $clicked.parents().hasClass("wcm_controles_widgets"))
            $(".wcm_controles_widgets ul li ul").hide();
    });
    
});