function generateHtmlBranch(targetEl, jsonBranch) {
		if (!def[jsonBranch]) {
			return;
		}
		
		var targetEl = $(targetEl);
		var branch = def[jsonBranch];
		var hor = (branch.direction == "horizontal");
		
		targetEl.empty();
		targetEl.append($('<span>').addClass("label").html(jsonBranch));
		
		if (!branch.children || !branch.children.length) {
			return;
		}
		
		_.each(branch.children, function(name) {
			var child = $("<div>").addClass("area").addClass(targetEl.hasClass("even") ? "odd" : "even");
			
			if (currentWidgets[name]) {
				child.addClass("widget");
				child.addClass(currentWidgets[name].type);
			}
			
			child.attr("id", "layout-" + name);
			
			if (hor) {
				var sizer = $("<div>").css({
					"float": "left",
					"width": (100 / branch.children.length) + "%"
				});
				sizer.append(child);
				targetEl.append(sizer);
			} else {
				targetEl.append(child);
			}
			generateHtmlBranch(child, name);
		});
	}
// This will need to match the generation code on PHP side.
This will need to match the generation code on PHP side.
This will need to match the generation code on PHP side .
function generateHtmlBranch(targetEl, jsonBranch) {
		if (!def[jsonBranch]) {
			return;
		}
		var targetEl = $(targetEl);
		var branch = def[jsonBranch];
		var hor = (branch.direction == "horizontal");
		targetEl.empty();
		targetEl.append($('<span>').addClass("label").html(jsonBranch));
		if (!branch.children || !branch.children.length) {
			return;
		}
		_.each(branch.children, function(name) {
			var child = $("<div>").addClass("area").addClass(targetEl.hasClass("even") ? "odd" : "even");
			if (currentWidgets[name]) {
				child.addClass("widget");
				child.addClass(currentWidgets[name].type);
			}
			child.attr("id", "layout-" + name);
			if (hor) {
				var sizer = $("<div>").css({
					"float": "left",
					"width": (100 / branch.children.length) + "%"
				});
				sizer.append(child);
				targetEl.append(sizer);
			} else {
				targetEl.append(child);
			}
			generateHtmlBranch(child, name);
		});
	}
function generateHtmlBranch ( targetEl , jsonBranch ) { if ( ! def [ jsonBranch ] ) { return ; } var targetEl = $ ( targetEl ) ; var branch = def [ jsonBranch ] ; var hor = ( branch . direction == "horizontal" ) ; targetEl . empty ( ) ; targetEl . append ( $ ( '<span>' ) . addClass ( "label" ) . html ( jsonBranch ) ) ; if ( ! branch . children || ! branch . children . length ) { return ; } _ . each ( branch . children , function ( name ) { var child = $ ( "<div>" ) . addClass ( "area" ) . addClass ( targetEl . hasClass ( "even" ) ? "odd" : "even" ) ; if ( currentWidgets [ name ] ) { child . addClass ( "widget" ) ; child . addClass ( currentWidgets [ name ] . type ) ; } child . attr ( "id" , "layout-" + name ) ; if ( hor ) { var sizer = $ ( "<div>" ) . css ( { "float" : "left" , "width" : ( 100 / branch . children . length ) + "%" } ) ; sizer . append ( child ) ; targetEl . append ( sizer ) ; } else { targetEl . append ( child ) ; } generateHtmlBranch ( child , name ) ; } ) ; }
This will need to match the generation code on PHP side.
This will need to match the generation code on PHP side .