samples/TizenWebUI-sample-v1/tizen-ui-builder-tool/res/html/ground.html - cordova-tizen - Git at Google

 <!DOCTYPE html>
 <html>

 <head>
 <meta http-equiv="content-type" content="text/html; charset=UTF-8">
 %meta%

 <base href="%page_path%/">

 <style>
 body {
 	overflow: hidden;
 }

 .showborder {
 	border: 1px gray dashed
 }
 </style>
 <!--
 <script src="%root_path%/%jquery_js%"></script>
 <script src="%root_path%/%tizen_web_ui_fw_libs_js%"></script>
 <script src="%root_path%/%tizen_web_ui_fw_js%" data-framework-theme="%framwork_theme%"></script>
 -->
 %framework%

 %style%

 <!--
 <link rel="stylesheet" type="text/css" href="%root_path%/app.css">
 -->

 <link rel="stylesheet" type="text/css" href="%page_css_path%">

 <style type="text/css" id="page_style">
 </style>

 <script>
 	$(document).ready(function(){
 		ComingBridge.ready();
 	});

 	$.mobile.autoInitialize = false;

 	jQuery.fn.outerHtml = function() {
 		return jQuery('<div />').append(this.eq(0).clone()).html();
 	}

 	// setBasePath: (path:String) -> ()
 	function setBasePath(path) {
 		//$('base').attr("href", "file:///" + path + "/");
 	}

 	// setCssStyle: (style:String) -> ()
 	function setCssStyle(style) {
 		document.getElementById('page_style').innerHTML = style;
 	}

 	// scrollTo: (val:str) -> ()
 	function scrollTo(val) {
 	   //$(".ui-mobile").css("transform", "translateY(" + val + "px)");
 	   //$(".ui-mobile").css("-webkit-transform", "translateY(" + val + "px)");
 	   $(".ui-scrollview-view").css("transform", "translateY(" + val + "px)");
 	   $(".ui-scrollview-view").css("-webkit-transform", "translateY(" + val + "px)");
 	}

 	// getScrollPos: () -> int
 	function getScrollPos() {
 	   var pos = $(".ui-mobile").css("-webkit-transform");
 	   //var pos = $(".ui-scrollview-view").css("-webkit-transform");
        var values = pos.split('(')[1];
            values = values.split(')')[0];
            values = values.split(',');
 	   return values[5].trim();
 	}

 	function genPage(html) {
 		$('body').html(html);
 		//$('[data-role=page]').page().page('refresh').show();
 		$('[data-role=page]').page().page('setToolbar').show();
 	    tbPage  = $( ".ui-page" );
 	    $elHeader = $( ".ui-page .ui-header" );
 	    $elFooter = $( ".ui-page .ui-footer" );
 	    $elHeader.outerHeight() ? $( tbPage ).css( "padding-top", $elHeader.outerHeight() ) : $( tbPage ).css( "padding-top", 0 );
 	    $elFooter.outerHeight() ? $( tbPage ).css( "padding-bottom", $elFooter.outerHeight() ) : $( tbPage ).css( "padding-bottom", 0 );
         $(":jqmData(role='tokentextarea')" ).tokentextarea( "refresh" );
 	}

 	function genPage2(html) {
 	    //var newPage = $(html);
 	    //newPage.appendTo( $('body'));
 	    //$('[data-role=page]').page();
 	    //$.mobile.changePage( newPage );

         var newPage = $(html);
         $('[data-role=page]').attr('data-old-page', true);
         newPage.attr('data-old-page', false);
         newPage.appendTo( $('body'));
         $('[data-role=page]').page();
         $.mobile.changePage( newPage );
         $('[data-old-page=false]').one('pageshow', function(){
             console.log('pageshow:' + $(this).attr('id'));
             $('[data-old-page=true]').remove();
           });
 	}

 	// changeBody: (html:String) -> ()
 	function changeBody(html) {
 		$(':mobile-page').page("destroy");

 	    genPage(html);
 	    //genPage2(html);

 		//$.mobile.resizePageContentHeight($('[data-role=page]'));

 		$('[part-id]').each(
 				function(k, v) {
 					var vv = $(v);
 					if ((!vv.is(":visible"))
 							&& (vv.next().length > 0
 									&& vv.next().is(":visible") && (!(vv.next()
 									.attr("part-id"))))) {
 						vv.next().attr("part-id", vv.attr("part-id")).attr(
 								"data-role", vv.attr("data-role"));
 						vv.attr("part-id", "");
 					}
 				});

 		//var fixed = $('[data-position=fixed]');
 		//if ((typeof fixed.fixedtoolbar) === 'function') {
 		//	fixed.fixedtoolbar('destroy');
 		//}

 		$(window).unbind("scroll scrollstart scrollstop throttledresize popstate touchmove orientationchange hashchange load resize");
 		$(document).unbind("scroll scrollstart scrollview_start scrollviewcreate silentscroll");
 		$(".ui-multibuttonentry-input").css("display", "none");

 		//$('[data-role=header]').css('position', 'relative');
 		//$('[data-role=footer]').css('position', 'relative').css('top', '0');
 	}

 	// showBorder: (wid:String) -> ()
 	function showBorder(wid) {
 		var wgt = $("[part-id='" + wid + "']");
 		var w = wgt.width(), h = wgt.height();
 		wgt.addClass("showborder").width(w - 2).height(h - 2);
 	}

 	// getClientBound: ()
 	//		-> stringified WidgetPosition
 	function getClientBound() {
 		var wgt = $(".ui-scrollview-view");
 		var loc = wgt.offset();

 		//var head_height = $('[data-role=header]').outerHeight();
 		//var footer_height = $('[data-role=footer]').outerHeight();
   		var content_height = wgt.outerHeight();// + head_height + footer_height;
   		if (wgt.children().length > 0){
   			content_height += parseInt(wgt.children().first().css('margin-top'))
   			                + parseInt(wgt.children().last().css('margin-bottom'));
   		}

 		var bound = {
 			x : parseInt(loc.left),
 			y : parseInt(loc.top),
 			w : parseInt(wgt.outerWidth()),
 			h : parseInt(content_height),
 			l : parseInt(wgt.css("margin-left")),
 			r : parseInt(wgt.css("margin-right")),
 			t : parseInt(wgt.css("margin-top")),
 			b : parseInt(wgt.css("margin-bottom"))
 		};
 		if (bound.w < 1) bound.w = 1;
 		if (bound.h < 1) bound.h = 1;
 		return JSON.stringify(bound);
 	}

 	// getWindowBound: ()
 	//		-> stringified WidgetPosition
 	function getWindowBound() {
 		var wgt = $(".ui-scrollview-clip");
 		var loc = wgt.offset();

 		var head_height = $('[data-role=header]').outerHeight();
 		var footer_height = $('[data-role=footer]').outerHeight();
   		var content_height = $(window).height() - head_height - footer_height ;

 		var bound = {
 			x : parseInt(loc.left),
 			y : parseInt(loc.top),
 			w : parseInt(wgt.outerWidth()),
 			h : parseInt(content_height),
 			l : parseInt(wgt.css("margin-left")),
 			r : parseInt(wgt.css("margin-right")),
 			t : parseInt(wgt.css("margin-top")),
 			b : parseInt(wgt.css("margin-bottom"))
 		};
 		if (bound.w < 1) bound.w = 1;
 		if (bound.h < 1) bound.h = 1;
 		return JSON.stringify(bound);
 	}

 	function getPageBound() {
 		var wgt = $(".ui-scrollview-clip");
 		var loc = wgt.offset();

   		var content_width = $(window).width();
   		var content_height = $(window).height();

 		var bound = {
 			x : parseInt(0),
 			y : parseInt(0),
 			w : parseInt(content_width),
 			h : parseInt(content_height),
 			l : parseInt(wgt.css("margin-left")),
 			r : parseInt(wgt.css("margin-right")),
 			t : parseInt(wgt.css("margin-top")),
 			b : parseInt(wgt.css("margin-bottom"))
 		};
 		return bound;
 	}

 	function getOneWidgetBound(wgt) {
 		var loc = wgt.offset();
 		var bound = {
 			x : parseInt(loc.left),
 			y : parseInt(loc.top),
 			w : parseInt(wgt.outerWidth()),
 			h : parseInt(wgt.outerHeight()),
 			l : parseInt(wgt.css("margin-left")),
 			r : parseInt(wgt.css("margin-right")),
 			t : parseInt(wgt.css("margin-top")),
 			b : parseInt(wgt.css("margin-bottom"))
 		};
 		if (bound.w < 1) bound.w = 1;
 		if (bound.h < 1) bound.h = 1;
 		return bound;
 	}

 	function getContentBound() {
 		var bound = getOneWidgetBound($(".ui-scrollview-clip"))

 		var head_height = $('[data-role=header]').outerHeight();
 		var footer_height = $('[data-role=footer]').outerHeight();
   		var content_height = $(window).height() - head_height - footer_height ;

   		bound.h = content_height;

 		return bound;
 	}

 	function getWidgetRecursiveBound(wgt) {
 		var children = wgt.children();
 		var bound = getOneWidgetBound(wgt);
 		//bound.x -= bound.l; bound.w += (bound.l + bound.r);
 		//bound.y -= bound.t; bound.h += (bound.t + bound.b);

 		if(wgt.css("overflow") != "hidden"){
 			for ( var i = 0; i < children.length; i++) {
 				var ch = $(children[i]);
 				if (ch.is(":visible")) {
 					var cbound = getWidgetRecursiveBound(ch);

 					if (cbound != null) {
 						if (cbound.x < bound.x) {
 							bound.w += (bound.x - cbound.x);
 							bound.x = cbound.x;
 						}
 						if (cbound.y < bound.y) {
 							bound.h += (bound.y - cbound.y);
 							bound.y = cbound.y;
 						}
 						if ((cbound.x + cbound.w) > (bound.x + bound.w)) {
 							bound.w += (cbound.x + cbound.w) - (bound.x + bound.w);
 						}
 						if ((cbound.y + cbound.h) > (bound.y + bound.h)) {
 							bound.h += (cbound.y + cbound.h) - (bound.y + bound.h);
 						}
 					}
 				}
 			}
 		}
 		return bound;
 	}

 	function getWidgetBoundIncludeAbove(wgt, prev_wgt_style) {
 		var bound = getOneWidgetBound(wgt);

 		var ch = wgt.prev();
 		if (ch != null) {
 			if (prev_wgt_style != null && ch.is(prev_wgt_style)) {
 				var cbound = getOneWidgetBound(ch);
 				if (cbound != null) {
 					if (cbound.x < bound.x) {
 						bound.w += (bound.x - cbound.x);
 						bound.x = cbound.x;
 					}
 					if (cbound.y < bound.y) {
 						bound.h += (bound.y - cbound.y);
 						bound.y = cbound.y;
 					}
 				}
 			}
 		}
 		return bound;
 	}

 	// getWidgetBound: (widget:jQuery) -> {x:number, y:number, w:number, h:number, l: r: t: b:}
 	// 자기 자식의 bound를 모두 포함하고, 크기가 최소 1px * 1px 이상이 되도록 반환
 	function getWidgetBound(wgt) {
 		var role = wgt.attr("data-role");
 		if (role === "page") {
 			return getPageBound();
 		} else if (role === "content") {
 			return getContentBound();
 		} else if (role === "colorpicker") {
 			return getWidgetRecursiveBound(wgt);
 		} else if (role === "list") {
 			return getWidgetBoundIncludeAbove(wgt, "form[role=search]:visible");
 		} else {
 			return getWidgetRecursiveBound(wgt);
 			//return getOneWidgetBound(wgt);
 		}
 	}

 	// getWidgetPosition: (wid:String) -> stringified WidgetPosition
 	function getWidgetPosition(wid) {
 		var wgt = $("[part-id='" + wid + "']");

 		if (wgt !== null && wgt !== undefined && wgt.length > 0) {
 			if (wgt.attr("cg-bound") !== undefined) {
 				return wgt.attr("cg-bound");
 			}
 			return JSON.stringify(getWidgetBound(wgt));
 		}
 		return null;
 	}

 	// getAllWidgetPositions: ()
 	//		-> stringified [{wid:String, rectangle:WidgetPosition}]
 	function getAllWidgetPositions() {
 		var result = [];

 		$("*[part-id]").each(function() {
 			var t = $(this);

 			if (t.attr("cg-excluded")) {
 				result.push({
 					wid : t.attr("part-id"),
 					rectangle : JSON.parse(t.attr("cg-bound"))
 				});
 			} else {
 				result.push({
 					wid : t.attr("part-id"),
 					rectangle : getWidgetBound(t)
 				});
 			}
 		});
 		var h = $("[data-role=header]:not([part-id])");
 		var f = $("[data-role=footer]:not([part-id])");
 		if (h.length > 0) {
 			result.push({
 				wid : ":header",
 				rectangle : getWidgetBound(h)
 			});
 		}
 		if (f.length > 0) {
 			result.push({
 				wid : ":footer",
 				rectangle : getWidgetBound(f)
 			});
 		}
 		return JSON.stringify(result);
 	}

 	// getWidgetPositions: (wid:[String]) -> stringified [{wid:String, rectangle:WidgetPosition}]
 	function getWidgetPositions(wids) {
 		var result = [];

 		for ( var i = 0; i < wids.length; i++) {
 			result.push({
 				wid : wids[i],
 				rectangle : getWidgetBound($("[part-id='" + wids[i] + "']"))
 			});
 		}
 		return JSON.stringify(result);
 	}

 	// widgetId: (dom:jQuery) -> (wid:String)
 	function widgetId(dom) {
 		if (dom.length === 0) {
 			return null;
 		}
 		if (dom.attr("part-id") !== undefined) {
 			return dom.attr("part-id");
 		} else {
 			return widgetId(dom.parent());
 		}
 	}

 	// includeAllWidgets: () -> ()
 	function includeAllWidgets() {
 		$("[cg-excluded]").each(function(index, elem) {
 			//$(elem).css("display", "");
 			$(elem).css("opacity", "1.0");
 		});
 		$("[cg-excluded]").removeAttr("cg-excluded").removeAttr("cg-bound");
 	}

 	// excludeWidgets: (wids:[String]) -> ()
 	function excludeWidgets(wids) {
 		var i, widget;
 		for (i = 0; i < wids.length; i++) {
 			widget = $("[part-id='" + wids[i] + "']");

 			widget.attr("cg-bound", getWidgetPosition(wids[i]));
 		}
 		for (i = 0; i < wids.length; i++) {
 			widget = $("[part-id='" + wids[i] + "']");

 			widget.attr("cg-excluded", "true");
 			//widget.css("display", "none");
 			widget.css("opacity", "0.2");
 		}
 	}
 </script>
 </head>

 <body>
 </body>

 </html>
	<!DOCTYPE html>
	<html>

	<head>
	<meta http-equiv="content-type" content="text/html; charset=UTF-8">
	%meta%

	<base href="%page_path%/">

	<style>
	body {
	overflow: hidden;
	}

	.showborder {
	border: 1px gray dashed
	}
	</style>
	<!--
	<script src="%root_path%/%jquery_js%"></script>
	<script src="%root_path%/%tizen_web_ui_fw_libs_js%"></script>
	<script src="%root_path%/%tizen_web_ui_fw_js%" data-framework-theme="%framwork_theme%"></script>
	-->
	%framework%

	%style%

	<!--
	<link rel="stylesheet" type="text/css" href="%root_path%/app.css">
	-->

	<link rel="stylesheet" type="text/css" href="%page_css_path%">

	<style type="text/css" id="page_style">
	</style>

	<script>
	$(document).ready(function(){
	ComingBridge.ready();
	});

	$.mobile.autoInitialize = false;

	jQuery.fn.outerHtml = function() {
	return jQuery('<div />').append(this.eq(0).clone()).html();
	}

	// setBasePath: (path:String) -> ()
	function setBasePath(path) {
	//$('base').attr("href", "file:///" + path + "/");
	}

	// setCssStyle: (style:String) -> ()
	function setCssStyle(style) {
	document.getElementById('page_style').innerHTML = style;
	}

	// scrollTo: (val:str) -> ()
	function scrollTo(val) {
	//$(".ui-mobile").css("transform", "translateY(" + val + "px)");
	//$(".ui-mobile").css("-webkit-transform", "translateY(" + val + "px)");
	$(".ui-scrollview-view").css("transform", "translateY(" + val + "px)");
	$(".ui-scrollview-view").css("-webkit-transform", "translateY(" + val + "px)");
	}

	// getScrollPos: () -> int
	function getScrollPos() {
	var pos = $(".ui-mobile").css("-webkit-transform");
	//var pos = $(".ui-scrollview-view").css("-webkit-transform");
	var values = pos.split('(')[1];
	values = values.split(')')[0];
	values = values.split(',');
	return values[5].trim();
	}

	function genPage(html) {
	$('body').html(html);
	//$('[data-role=page]').page().page('refresh').show();
	$('[data-role=page]').page().page('setToolbar').show();
	tbPage = $( ".ui-page" );
	$elHeader = $( ".ui-page .ui-header" );
	$elFooter = $( ".ui-page .ui-footer" );
	$elHeader.outerHeight() ? $( tbPage ).css( "padding-top", $elHeader.outerHeight() ) : $( tbPage ).css( "padding-top", 0 );
	$elFooter.outerHeight() ? $( tbPage ).css( "padding-bottom", $elFooter.outerHeight() ) : $( tbPage ).css( "padding-bottom", 0 );
	$(":jqmData(role='tokentextarea')" ).tokentextarea( "refresh" );
	}

	function genPage2(html) {
	//var newPage = $(html);
	//newPage.appendTo( $('body'));
	//$('[data-role=page]').page();
	//$.mobile.changePage( newPage );

	var newPage = $(html);
	$('[data-role=page]').attr('data-old-page', true);
	newPage.attr('data-old-page', false);
	newPage.appendTo( $('body'));
	$('[data-role=page]').page();
	$.mobile.changePage( newPage );
	$('[data-old-page=false]').one('pageshow', function(){
	console.log('pageshow:' + $(this).attr('id'));
	$('[data-old-page=true]').remove();
	});
	}

	// changeBody: (html:String) -> ()
	function changeBody(html) {
	$(':mobile-page').page("destroy");

	genPage(html);
	//genPage2(html);

	//$.mobile.resizePageContentHeight($('[data-role=page]'));

	$('[part-id]').each(
	function(k, v) {
	var vv = $(v);
	if ((!vv.is(":visible"))
	&& (vv.next().length > 0
	&& vv.next().is(":visible") && (!(vv.next()
	.attr("part-id"))))) {
	vv.next().attr("part-id", vv.attr("part-id")).attr(
	"data-role", vv.attr("data-role"));
	vv.attr("part-id", "");
	}
	});

	//var fixed = $('[data-position=fixed]');
	//if ((typeof fixed.fixedtoolbar) === 'function') {
	// fixed.fixedtoolbar('destroy');
	//}

	$(window).unbind("scroll scrollstart scrollstop throttledresize popstate touchmove orientationchange hashchange load resize");
	$(document).unbind("scroll scrollstart scrollview_start scrollviewcreate silentscroll");
	$(".ui-multibuttonentry-input").css("display", "none");

	//$('[data-role=header]').css('position', 'relative');
	//$('[data-role=footer]').css('position', 'relative').css('top', '0');
	}

	// showBorder: (wid:String) -> ()
	function showBorder(wid) {
	var wgt = $("[part-id='" + wid + "']");
	var w = wgt.width(), h = wgt.height();
	wgt.addClass("showborder").width(w - 2).height(h - 2);
	}

	// getClientBound: ()
	// -> stringified WidgetPosition
	function getClientBound() {
	var wgt = $(".ui-scrollview-view");
	var loc = wgt.offset();

	//var head_height = $('[data-role=header]').outerHeight();
	//var footer_height = $('[data-role=footer]').outerHeight();
	var content_height = wgt.outerHeight();// + head_height + footer_height;
	if (wgt.children().length > 0){
	content_height += parseInt(wgt.children().first().css('margin-top'))
	+ parseInt(wgt.children().last().css('margin-bottom'));
	}

	var bound = {
	x : parseInt(loc.left),
	y : parseInt(loc.top),
	w : parseInt(wgt.outerWidth()),
	h : parseInt(content_height),
	l : parseInt(wgt.css("margin-left")),
	r : parseInt(wgt.css("margin-right")),
	t : parseInt(wgt.css("margin-top")),
	b : parseInt(wgt.css("margin-bottom"))
	};
	if (bound.w < 1) bound.w = 1;
	if (bound.h < 1) bound.h = 1;
	return JSON.stringify(bound);
	}

	// getWindowBound: ()
	// -> stringified WidgetPosition
	function getWindowBound() {
	var wgt = $(".ui-scrollview-clip");
	var loc = wgt.offset();

	var head_height = $('[data-role=header]').outerHeight();
	var footer_height = $('[data-role=footer]').outerHeight();
	var content_height = $(window).height() - head_height - footer_height ;

	var bound = {
	x : parseInt(loc.left),
	y : parseInt(loc.top),
	w : parseInt(wgt.outerWidth()),
	h : parseInt(content_height),
	l : parseInt(wgt.css("margin-left")),
	r : parseInt(wgt.css("margin-right")),
	t : parseInt(wgt.css("margin-top")),
	b : parseInt(wgt.css("margin-bottom"))
	};
	if (bound.w < 1) bound.w = 1;
	if (bound.h < 1) bound.h = 1;
	return JSON.stringify(bound);
	}

	function getPageBound() {
	var wgt = $(".ui-scrollview-clip");
	var loc = wgt.offset();

	var content_width = $(window).width();
	var content_height = $(window).height();

	var bound = {
	x : parseInt(0),
	y : parseInt(0),
	w : parseInt(content_width),
	h : parseInt(content_height),
	l : parseInt(wgt.css("margin-left")),
	r : parseInt(wgt.css("margin-right")),
	t : parseInt(wgt.css("margin-top")),
	b : parseInt(wgt.css("margin-bottom"))
	};
	return bound;
	}

	function getOneWidgetBound(wgt) {
	var loc = wgt.offset();
	var bound = {
	x : parseInt(loc.left),
	y : parseInt(loc.top),
	w : parseInt(wgt.outerWidth()),
	h : parseInt(wgt.outerHeight()),
	l : parseInt(wgt.css("margin-left")),
	r : parseInt(wgt.css("margin-right")),
	t : parseInt(wgt.css("margin-top")),
	b : parseInt(wgt.css("margin-bottom"))
	};
	if (bound.w < 1) bound.w = 1;
	if (bound.h < 1) bound.h = 1;
	return bound;
	}

	function getContentBound() {
	var bound = getOneWidgetBound($(".ui-scrollview-clip"))

	var head_height = $('[data-role=header]').outerHeight();
	var footer_height = $('[data-role=footer]').outerHeight();
	var content_height = $(window).height() - head_height - footer_height ;

	bound.h = content_height;

	return bound;
	}

	function getWidgetRecursiveBound(wgt) {
	var children = wgt.children();
	var bound = getOneWidgetBound(wgt);
	//bound.x -= bound.l; bound.w += (bound.l + bound.r);
	//bound.y -= bound.t; bound.h += (bound.t + bound.b);

	if(wgt.css("overflow") != "hidden"){
	for ( var i = 0; i < children.length; i++) {
	var ch = $(children[i]);
	if (ch.is(":visible")) {
	var cbound = getWidgetRecursiveBound(ch);

	if (cbound != null) {
	if (cbound.x < bound.x) {
	bound.w += (bound.x - cbound.x);
	bound.x = cbound.x;
	}
	if (cbound.y < bound.y) {
	bound.h += (bound.y - cbound.y);
	bound.y = cbound.y;
	}
	if ((cbound.x + cbound.w) > (bound.x + bound.w)) {
	bound.w += (cbound.x + cbound.w) - (bound.x + bound.w);
	}
	if ((cbound.y + cbound.h) > (bound.y + bound.h)) {
	bound.h += (cbound.y + cbound.h) - (bound.y + bound.h);
	}
	}
	}
	}
	}
	return bound;
	}

	function getWidgetBoundIncludeAbove(wgt, prev_wgt_style) {
	var bound = getOneWidgetBound(wgt);

	var ch = wgt.prev();
	if (ch != null) {
	if (prev_wgt_style != null && ch.is(prev_wgt_style)) {
	var cbound = getOneWidgetBound(ch);
	if (cbound != null) {
	if (cbound.x < bound.x) {
	bound.w += (bound.x - cbound.x);
	bound.x = cbound.x;
	}
	if (cbound.y < bound.y) {
	bound.h += (bound.y - cbound.y);
	bound.y = cbound.y;
	}
	}
	}
	}
	return bound;
	}

	// getWidgetBound: (widget:jQuery) -> {x:number, y:number, w:number, h:number, l: r: t: b:}
	// 자기 자식의 bound를 모두 포함하고, 크기가 최소 1px * 1px 이상이 되도록 반환
	function getWidgetBound(wgt) {
	var role = wgt.attr("data-role");
	if (role === "page") {
	return getPageBound();
	} else if (role === "content") {
	return getContentBound();
	} else if (role === "colorpicker") {
	return getWidgetRecursiveBound(wgt);
	} else if (role === "list") {
	return getWidgetBoundIncludeAbove(wgt, "form[role=search]:visible");
	} else {
	return getWidgetRecursiveBound(wgt);
	//return getOneWidgetBound(wgt);
	}
	}

	// getWidgetPosition: (wid:String) -> stringified WidgetPosition
	function getWidgetPosition(wid) {
	var wgt = $("[part-id='" + wid + "']");

	if (wgt !== null && wgt !== undefined && wgt.length > 0) {
	if (wgt.attr("cg-bound") !== undefined) {
	return wgt.attr("cg-bound");
	}
	return JSON.stringify(getWidgetBound(wgt));
	}
	return null;
	}

	// getAllWidgetPositions: ()
	// -> stringified [{wid:String, rectangle:WidgetPosition}]
	function getAllWidgetPositions() {
	var result = [];

	$("*[part-id]").each(function() {
	var t = $(this);

	if (t.attr("cg-excluded")) {
	result.push({
	wid : t.attr("part-id"),
	rectangle : JSON.parse(t.attr("cg-bound"))
	});
	} else {
	result.push({
	wid : t.attr("part-id"),
	rectangle : getWidgetBound(t)
	});
	}
	});
	var h = $("[data-role=header]:not([part-id])");
	var f = $("[data-role=footer]:not([part-id])");
	if (h.length > 0) {
	result.push({
	wid : ":header",
	rectangle : getWidgetBound(h)
	});
	}
	if (f.length > 0) {
	result.push({
	wid : ":footer",
	rectangle : getWidgetBound(f)
	});
	}
	return JSON.stringify(result);
	}

	// getWidgetPositions: (wid:[String]) -> stringified [{wid:String, rectangle:WidgetPosition}]
	function getWidgetPositions(wids) {
	var result = [];

	for ( var i = 0; i < wids.length; i++) {
	result.push({
	wid : wids[i],
	rectangle : getWidgetBound($("[part-id='" + wids[i] + "']"))
	});
	}
	return JSON.stringify(result);
	}

	// widgetId: (dom:jQuery) -> (wid:String)
	function widgetId(dom) {
	if (dom.length === 0) {
	return null;
	}
	if (dom.attr("part-id") !== undefined) {
	return dom.attr("part-id");
	} else {
	return widgetId(dom.parent());
	}
	}

	// includeAllWidgets: () -> ()
	function includeAllWidgets() {
	$("[cg-excluded]").each(function(index, elem) {
	//$(elem).css("display", "");
	$(elem).css("opacity", "1.0");
	});
	$("[cg-excluded]").removeAttr("cg-excluded").removeAttr("cg-bound");
	}

	// excludeWidgets: (wids:[String]) -> ()
	function excludeWidgets(wids) {
	var i, widget;
	for (i = 0; i < wids.length; i++) {
	widget = $("[part-id='" + wids[i] + "']");

	widget.attr("cg-bound", getWidgetPosition(wids[i]));
	}
	for (i = 0; i < wids.length; i++) {
	widget = $("[part-id='" + wids[i] + "']");

	widget.attr("cg-excluded", "true");
	//widget.css("display", "none");
	widget.css("opacity", "0.2");
	}
	}
	</script>
	</head>

	<body>
	</body>

	</html>