forked from science-ation/science-ation
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:
parent
b3bfb560f9
commit
fca6ce64b0
@ -179,6 +179,63 @@ function reportReload()
|
|||||||
document.forms.report.reloadaction.value = 'reload';
|
document.forms.report.reloadaction.value = 'reload';
|
||||||
document.forms.report.submit();
|
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>
|
</script>
|
||||||
<?
|
<?
|
||||||
|
|
||||||
@ -316,6 +373,7 @@ function reportReload()
|
|||||||
field_selector("col[$o][field]", "col$o", $d['field']);
|
field_selector("col[$o][field]", "col$o", $d['field']);
|
||||||
echo "</td></tr>";
|
echo "</td></tr>";
|
||||||
$x++;
|
$x++;
|
||||||
|
$canvasLabels[]=$fields[$report['col'][$o]['field']]['name']; //['field'];
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
for(;$x<$n_columns;$x++) {
|
for(;$x<$n_columns;$x++) {
|
||||||
@ -333,6 +391,19 @@ function reportReload()
|
|||||||
echo "</table>\n";
|
echo "</table>\n";
|
||||||
|
|
||||||
echo "<h4>Label Data Locations</h4>";
|
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>";
|
echo "<table>";
|
||||||
$x=0;
|
$x=0;
|
||||||
|
|
||||||
@ -342,8 +413,10 @@ function reportReload()
|
|||||||
$f = $d['field'];
|
$f = $d['field'];
|
||||||
echo "<tr><td align=\"right\">Loc ".($o+1).": </td>";
|
echo "<tr><td align=\"right\">Loc ".($o+1).": </td>";
|
||||||
echo "<td>";
|
echo "<td>";
|
||||||
|
$script="";
|
||||||
foreach($locs as $k=>$v) {
|
foreach($locs as $k=>$v) {
|
||||||
echo "$k=<input type=\"text\" size=\"3\" name=\"col[$x][$v]\" value=\"{$d[$v]}\">";
|
echo "$k=<input type=\"text\" size=\"3\" name=\"col[$x][$v]\" value=\"{$d[$v]}\">";
|
||||||
|
$script.="{$d[$v]},";
|
||||||
}
|
}
|
||||||
echo 'Face=';
|
echo 'Face=';
|
||||||
selector("col[$x][face]", array('' => '', 'bold' => 'Bold'), $d['face']);
|
selector("col[$x][face]", array('' => '', 'bold' => 'Bold'), $d['face']);
|
||||||
@ -358,6 +431,8 @@ function reportReload()
|
|||||||
} else {
|
} else {
|
||||||
echo "<input type=\"hidden\" name=\"col[$x][value]\" value=\"\">";
|
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++;
|
$x++;
|
||||||
}
|
}
|
||||||
@ -380,9 +455,6 @@ function reportReload()
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
echo "</table>\n";
|
echo "</table>\n";
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
echo "<h4>Grouping</h4>";
|
echo "<h4>Grouping</h4>";
|
||||||
for($x=0;$x<2;$x++) {
|
for($x=0;$x<2;$x++) {
|
||||||
echo "Group By".($x + 1).": ";
|
echo "Group By".($x + 1).": ";
|
||||||
|
Loading…
x
Reference in New Issue
Block a user