scalePix: Bild-Ausmaße für die Druckausgabe optimieren

Der vorgestellte Code errechnet einen Skalen-Faktor für Bilder. Ausgehend von der Problematik, dass im Druck andere Auflösungen eingesetzt werden als im Web bzw. Bilder kleiner skaliert bzw. passend werden müssen, ermittelt der DTML-Code diejenige Bildgröße, die auf ein bestimmtes Zielformat (hier 155mm) am besten passt: bei einer üblichen 72-Bildauflösung (Pixelkonstante 1px = 0,353mm (bei 72dpi) = 1pt) würde ab einer Bildbreite von 440px bereits der volle Satzspiegel überschritten sein. Sehr breite Bilder müssen also auf 155mm herunterskaliert werden, während kleine Bilder, sofern sie eine bestimmte Größe nicht unterschreiten idealerweise um einen Standardfaktor im Sinne einer angemessenen Auflösungsdarstellung verkleinert werden sollten.

Für den Druck werden grundsätzlich die hochauflösenden Bilder (imghires) eingesetzt und damit bezieht sich der Skalierungsfaktor also immer auf die Dimension der hires-Variante – natürlich nur dann, wenn diese auch in das Bildobjekt mit hochgeladen wurde.

Rechenbeispiel für den Einsatz eines Bildes in einer 2-spaltigen Layouttabelle (s. Bild); ein Bild von 420px muss auf einen Spalten-Satzspiegel von 72,5mm unter der Berücksichtigung eines in jeder Spalte vorhandenen Abstandes (padding) von 2,5 mm passend skaliert werden. Eine nur grob geschätzte Skalierung von z.B. 30% würde das Bild deutlich zu klein erscheinen lassen. Der errechnete optimale Wert beträgt faktisch 49%:

[1] Ermittlung der Druckbreite in [mm]

(155-(2*2*2,5))/2 = 72,5

[2] Ermittlung des Skalen-Faktors in [%] der Originalbreite

(72,5/(420*0,353))*100 = 49

Der Skalenfaktor wird mithilfe der DTML-Methode in ein zusätzlich konfiguriertes Metaelement attr_dc_format_extend geschrieben.

Hinweis: Im Codebeispiel wird davon ausgegangen, dass nur die Bildbreite eine kritische Größe darstellt.

Rekursive DTML-Methode scalePix:

<dtml-call "REQUEST.set('preview','preview')">
<ul>
<dtml-call "REQUEST.set('lang','eng')">
<dtml-call "REQUEST.set('widthmode','img')">
<dtml-call "REQUEST.set('bodywidth',_.int(155))">
<dtml-call "REQUEST.set('pixel',_.float(0.353))">
<dtml-call "REQUEST.set('padding',_.float(2.5))">
<dtml-call "REQUEST.set('paddingsum',0)">
<dtml-call "REQUEST.set('columns',0)">
<dtml-call "REQUEST.set('Wimage',0)">
<dtml-call "REQUEST.set('WprintCell',0)">
<dtml-call "REQUEST.set('Scale',0)">
<dtml-call "REQUEST.set('Scalebase',100)">

<dtml-in "objectValues(['ZMSFolder','ZMSDocument','ZMSCustom','ZMSGraphic'])">
<dtml-if "meta_type=='ZMSGraphic'">
<dtml-if "getObjProperty( 'imghires' ,REQUEST)">
<dtml-call "REQUEST.set('widthmode','imghires')">
<dtml-else>
<dtml-call "REQUEST.set('widthmode','img')">
</dtml-if>

<dtml-try>
<dtml-if "(getParentNode().meta_type=='ZMSCustom'
          and _.int(getObjProperty(_['widthmode'],REQUEST).getWidth())>=200)">
<dtml-let columns="_.int(getParentNode().getParentNode().getObjProperty('columns',REQUEST))"
          paddingsum="2*padding*columns"
          Wimage="_.int(getObjProperty(_['widthmode'],REQUEST).getWidth())"
          WprintCell="(bodywidth - (paddingsum*columns))/columns"
          Scale="_.int((WprintCell/(Wimage*pixel))*100)" >

<dtml-call "REQUEST.set('Scale',Scale*Scalebase/100)">
</dtml-let>

<dtml-elif "getParentNode().meta_type in ['ZMSDocument','ZMSFolder']
and getObjProperty( _['widthmode'] ,REQUEST).getWidth()>=_.int(bodywidth/pixel)">

<dtml-let Wimage="_.int(getObjProperty(_['widthmode'],REQUEST).getWidth())"
          Scale="_.int((100*bodywidth/pixel)/getObjProperty( _['widthmode'] ,REQUEST).getWidth())">
<dtml-call "REQUEST.set('Scale',Scale*Scalebase/100)">
</dtml-let>
<dtml-else>
<dtml-call "REQUEST.set('Scale',Scalebase)">
</dtml-if>

<dtml-if "Scale>=100">
<dtml-call "REQUEST.set('Scale',Scalebase)">
</dtml-if>

<dtml-call "setObjStateModified(REQUEST)">
<dtml-call "setObjProperty('attr_dc_format_extend',Scale*Scalebase/100)">
<dtml-call "onChangeObj(REQUEST)">


<li><a href="<dtml-var url>/manage" target="_blank"><dtml-var id></a> set: <dtml-var "Scale*Scalebase/100">% 
<span style="color:silver">// 
Too big: <dtml-var "bool(getObjProperty( _['widthmode'] ,REQUEST).getWidth()>=_.int(bodywidth/pixel))">, 
Standard image: <dtml-var "bool(getParentNode().meta_type in ['ZMSDocument','ZMSRubrik'])"></span>
</li>
<dtml-except>
<li style="color:red;font-weight:bold">ERROR: <a href="<dtml-var url>/manage" target="_blank"><dtml-var id></a></li>
</dtml-try>
</dtml-if>

<dtml-var scalePix>
</dtml-in>
</ul>