Show a sample of what the label is going to look like laid out using DIV's and HTML, this is the first start of implementing a full editor :)

This commit is contained in:
james 2008-10-16 19:13:59 +00:00
parent b3bfb560f9
commit fca6ce64b0

View File

@ -179,6 +179,63 @@ function reportReload()
document.forms.report.reloadaction.value = 'reload';
document.forms.report.submit();
}
var canvasWidth=0;
var canvasHeight=0;
var canvasObjectIndex=0;
function initCanvas(w,h) {
canvasWidth=w;
canvasHeight=h;
}
function createData(x,y,w,h,l,face,align,valign,value) {
var canvas=document.getElementById('layoutcanvas');
var newdiv=document.createElement('div');
if(valign=="vcenter") verticalAlign="middle";
else if(valign=="vtop") verticalAlign="top";
else if(valign=="vbottom") verticalAlign="bottom";
else verticalAlign="top";
// alert(verticalAlign);
//convert x,y,w,h from % to absolute
var dx=Math.round(x*canvasWidth/100);
var dy=Math.round(y*canvasHeight/100);
var dw=Math.round(w*canvasWidth/100);
var dh=Math.round(h*canvasHeight/100);
// alert(dx+','+dy+','+dw+','+dh);
var fontheight=Math.round(dh/l);
newdiv.setAttribute('id','o_'+canvasObjectIndex);
newdiv.style.display="table-cell";
newdiv.style.position="absolute";
newdiv.style.width=dw+"px";
newdiv.style.height=dh+"px";
newdiv.style.left=dx+"px";
newdiv.style.top=dy+"px";
newdiv.style.textAlign=align;
newdiv.style.verticalAlign=verticalAlign;
newdiv.style.padding="0 0 0 0";
newdiv.style.margin="0 0 0 0";
// newdiv.style.vertical-align=valign;
newdiv.style.border="1px solid blue";
newdiv.style.fontSize=fontheight+"px";
newdiv.style.lineHeight=fontheight+"px";
newdiv.style.fontFamily="Verdana";
newdiv.style.fontSizeAdjust=0.65;
var maxlength=Math.floor(dw/(fontheight*0.7))*l;
if(value.length>maxlength) value=value.substring(0,maxlength);
newdiv.innerHTML=value; //"Maple Test xxxx"; //value;
canvas.appendChild(newdiv);
canvasObjectIndex++;
}
</script>
<?
@ -316,6 +373,7 @@ function reportReload()
field_selector("col[$o][field]", "col$o", $d['field']);
echo "</td></tr>";
$x++;
$canvasLabels[]=$fields[$report['col'][$o]['field']]['name']; //['field'];
}
}
for(;$x<$n_columns;$x++) {
@ -333,6 +391,19 @@ function reportReload()
echo "</table>\n";
echo "<h4>Label Data Locations</h4>";
$l_w=$report_stock[$report['option']['stock']]['label_width'];
$l_h=$report_stock[$report['option']['stock']]['label_height'];
if($l_w && $l_h) {
$doCanvasSample=true;
$ratio=$l_h/$l_w;
$canvaswidth=600;
$canvasheight=round($canvaswidth*$ratio);
echo "<div id=\"layoutcanvas\" style=\"border: 1px solid red; position: relative; width: {$canvaswidth}px; height: {$canvasheight}px;\">";
echo "</div>\n";
echo "<script type=\"text/javascript\">initCanvas($canvaswidth,$canvasheight)</script>\n";
}
echo "<table>";
$x=0;
@ -342,8 +413,10 @@ function reportReload()
$f = $d['field'];
echo "<tr><td align=\"right\">Loc ".($o+1).": </td>";
echo "<td>";
$script="";
foreach($locs as $k=>$v) {
echo "$k=<input type=\"text\" size=\"3\" name=\"col[$x][$v]\" value=\"{$d[$v]}\">";
$script.="{$d[$v]},";
}
echo 'Face=';
selector("col[$x][face]", array('' => '', 'bold' => 'Bold'), $d['face']);
@ -358,6 +431,8 @@ function reportReload()
} else {
echo "<input type=\"hidden\" name=\"col[$x][value]\" value=\"\">";
}
if($doCanvasSample)
echo "<script type=\"text/javascript\">createData({$script}'{$d['face']}','{$d['align']}','{$d['valign']}','{$canvasLabels[$x]}')</script>\n";
$x++;
}
@ -380,9 +455,6 @@ function reportReload()
}
}
echo "</table>\n";
echo "<h4>Grouping</h4>";
for($x=0;$x<2;$x++) {
echo "Group By".($x + 1).": ";