Improving shape tracing display

--HG--
branch : dev
This commit is contained in:
Sebastien Ros
2011-02-14 17:19:44 -08:00
parent 7957701d99
commit 949726c9d9
4 changed files with 66 additions and 22 deletions

View File

@@ -1,23 +1,42 @@
(function($) {
$(function() {
$("<div id='debug-control'><ul><li id='debug-shape-templates'>shape templates</li><li id='debug-shape-zones'>Zones</li></ul><div id='debug-control-toggle'>&raquo;</div></div>")
(function ($) {
$(function () {
$("<div id='debug-control'><ul><li id='debug-shapes'>Shapes</li><li id='debug-zones'>Zones</li></ul><div id='debug-control-toggle'>&raquo;</div></div>")
.appendTo("body");
$("#debug-shape-templates").click(function () {
$("#debug-shapes").click(function () {
var _this = $(this);
$("html").toggleClass(_this.attr("id"));
$(this).toggleClass("debug-active");
});
$("#debug-shape-zones").click(function () {
$("#debug-zones").click(function () {
var _this = $(this);
$("html").toggleClass(_this.attr("id"));
$(this).toggleClass("debug-active");
if ($(this).hasClass("debug-active")) {
// renders the zone name in each zone
$(".zone").each(function () {
var classes = $(this).attr("class").split(' ');
for (i = 0; i < classes.length; i++) {
if (classes[i].indexOf("zone-") === 0) {
$(this).append('<div class="zone-name">' + classes[i].substr(classes[i].indexOf("-")+1) + '</div>');
}
}
});
}
else {
$(".zone-name").remove();
}
});
$("#debug-control-toggle").click(function () {
var _this = $(this), open = "debug-open";
if (_this.is("."+open)) {
_this.prev().hide("fast", function() {_this.removeClass(open).html("&raquo;");});
if (_this.is("." + open)) {
_this.prev().hide("fast", function () { _this.removeClass(open).html("&raquo;"); });
} else {
_this.prev().show("fast", function() {_this.addClass(open).html("&laquo;");});
_this.prev().show("fast", function () { _this.addClass(open).html("&laquo;"); });
}
});
});

View File

@@ -8,9 +8,12 @@ namespace Orchard.DesignerTools.Services {
}
public void Created(ShapeCreatedContext context) {
if (context.ShapeType != "Layout"
&& context.ShapeType != "DocumentZone"
) {
if (context.ShapeType != "Layout"
&& context.ShapeType != "DocumentZone"
&& context.ShapeType != "PlaceChildContent"
&& context.ShapeType != "ContentZone"
)
{
context.Shape.Metadata.Wrappers.Add("ShapeTracing_Wrapper");
}
}

View File

@@ -37,13 +37,23 @@
border-right:1px solid #999;
}
.debug-shape-templates .shape-tracing .wrapper {
.debug-shapes .shape-tracing .wrapper {
background:#FFF;
border:1px dotted #CA7230;
padding:2px;
margin:5px;
padding:0px;
display:inline-block;
/* when there is nothing inside the shape, force to the size of the smart tag */
min-width:20px;
min-height:20px;
}
.debug-shapes body
{
margin-top:25px;
}
.debug-shape-templates .shape-tracing .wrapper :hover {
.debug-shapes .shape-tracing .wrapper :hover {
background:#E0E9EE;
}
@@ -51,7 +61,7 @@
display:none;
}
.debug-shape-templates .shape-tracing .meta {
.debug-shapes .shape-tracing .meta {
clear:both;
display:block;
background:#cfc;
@@ -61,10 +71,21 @@
margin-top:5px;
}
.debug-shape-zones .shape-tracing .wrapper .zone {
border:1px dotted red;
.debug-zones .Zone {
border:1px dashed grey;
margin:5px;
padding:2px;
position: relative;
}
.debug-zones .zone-name {
position:absolute; top: 0px; left: 0px;
display: block; background-color: #ddd; color: #434343; padding: 3px 6px;
filter:alpha(opacity=70);
opacity: 0.7;
}
.debug-shapes .Zone :hover {
background:#E0E9EE;
}
.meta .shape {

View File

@@ -14,7 +14,7 @@
var descriptor = shapeTable.Descriptors[Model.Metadata.Type];
}
@functions {
string FormatShape(string type, string themeId) {
string FormatShapeFilename(string type, string themeId) {
return "~/Themes/" + themeId + "/Views/" + type.Replace("__", "-").Replace("_", ".") + ".cshtml";
}
@@ -41,18 +41,19 @@
<div class="alternates">
@foreach(var alternate in Model.Metadata.Alternates) {
var formatted = @FormatShape(alternate, workContext.CurrentTheme.Id);
var formatted = @FormatShapeFilename(alternate, workContext.CurrentTheme.Id);
<div>@formatted</div>
}
</div>
<div class="wrappers">
@foreach(var wrapper in Model.Metadata.Wrappers) {
if(wrapper != "ShapeTracing_Wrapper") {
<div>@wrapper</div>
var formatted = @FormatShapeFilename(wrapper, workContext.CurrentTheme.Id);
<div>@formatted</div>
}
}
</div>
<div class="dump">
<div class="dump" style="display:none">
<pre>@DumpObject((object)Model)</pre>
</div>
</div>