Difference between revisions of "BobscreenTest"

From Sega Retro

(half the maths - if this confuses me in few hours time, that's a sign I've done it wrong)
 
Line 1: Line 1:
 
<includeonly><div style="display:none">
 
<includeonly><div style="display:none">
 +
{{#vardefine:imagewidth|{{#mediawidth:{{{1}}}}}}}
 +
{{#vardefine:imageheight|{{#mediaheight:{{{1}}}}}}}
 
{{#vardefine:xratio|{{#if:{{{forcewidescreen|}}}|16|4}}}}
 
{{#vardefine:xratio|{{#if:{{{forcewidescreen|}}}|16|4}}}}
 
{{#vardefine:yratio|{{#if:{{{forcewidescreen|}}}|9|3}}}}
 
{{#vardefine:yratio|{{#if:{{{forcewidescreen|}}}|9|3}}}}
{{#vardefine:defaultwidth|320}}
+
{{#vardefine:defaultwidth|{{#ifexpr:{{#var:imagewidth}} < 320|{{#var:imagewidth}}|320}}}}
 
{{#vardefine:defaultheight|{{#expr:({{#var:defaultwidth}}/{{#var:xratio}})*{{#var:yratio}}}}}}
 
{{#vardefine:defaultheight|{{#expr:({{#var:defaultwidth}}/{{#var:xratio}})*{{#var:yratio}}}}}}
  
{{#vardefine:imagewidth|{{#mediawidth:{{{1}}}}}}}
+
{{#vardefine:desiredwidth|{{{width|{{#ifexpr:{{#var:imagewidth}} > {{#var:defaultwidth}}|{{#var:defaultwidth}}|{{#var:imagewidth}}}}}}}}}
{{#vardefine:imageheight|{{#mediaheight:{{{1}}}}}}}
+
{{#vardefine:desiredheight|{{{height|{{#ifexpr:{{#var:imageheight}} > {{#var:defaultheight}}|{{#var:defaultheight}}|{{#var:imageheight}}}}}}}}}
{{#vardefine:desiredwidth|{{{width|{{#ifexpr:{{#var:imagewidth}} > {{#var:defaultwidth}}|{{#var:defaultwidth}}|{{#var:imagewidth}}}}}}}
 
{{#vardefine:desiredheight|{{{height|{{#ifexpr:{{#var:imageheight}} > {{#var:defaultheight}}|{{#var:defaultheight}}|{{#var:imageheight}}}}}}}
 
  
  
Line 42: Line 42:
  
 
</div>
 
</div>
*{{#var:defaultwidth}}:{{#var:defaultheight}}
+
*{{#var:desiredwidth}}:{{#var:desiredheight}}
  
 
<div class="bobscreen" style="width:{{#var:visiblewidth}}px; display:inline-block; text-align:center;"><div style="transform:scalex({{#var:scale}}); {{#ifeq:{{#var:yscale}}|1||transform:scaley({{#var:yscale}}); margin-top:{{#var:vmargin}}px; margin-bottom:{{#var:vmargin}}px;}} transform-origin:50%">[[File:{{{1}}}|{{#var:screenwidth}}x384px]]</div></div></includeonly><noinclude>
 
<div class="bobscreen" style="width:{{#var:visiblewidth}}px; display:inline-block; text-align:center;"><div style="transform:scalex({{#var:scale}}); {{#ifeq:{{#var:yscale}}|1||transform:scaley({{#var:yscale}}); margin-top:{{#var:vmargin}}px; margin-bottom:{{#var:vmargin}}px;}} transform-origin:50%">[[File:{{{1}}}|{{#var:screenwidth}}x384px]]</div></div></includeonly><noinclude>
Line 87: Line 87:
 
[[File:VirtuaFighter 32X Widescreen2 PAL.png]] -> {{bobscreenTest|VirtuaFighter 32X Widescreen2 PAL.png|forcewidescreen=yes}}
 
[[File:VirtuaFighter 32X Widescreen2 PAL.png]] -> {{bobscreenTest|VirtuaFighter 32X Widescreen2 PAL.png|forcewidescreen=yes}}
  
 +
 +
[[File:VirtuaFighter 32X Widescreen2 PAL.png]] -> {{bobscreenTest|VirtuaFighter 32X Widescreen2 PAL.png|forcewidescreen=yes|width=200}}
 +
 +
 +
[[File:VirtuaFighter 32X Widescreen2 PAL.png]] -> {{bobscreenTest|VirtuaFighter 32X Widescreen2 PAL.png|forcewidescreen=yes|height=200}}
 
TODO: Get width parameter to work properly here.
 
TODO: Get width parameter to work properly here.
  
 
[[Category:Breakout box templates]]
 
[[Category:Breakout box templates]]
 
</noinclude>
 
</noinclude>

Revision as of 15:06, 3 July 2018



This template sets the maximum width of a screenshot to 320 pixels, and corrects its aspect ratio.

Usage

{{bobscreen|MagicalPuzzlePopils title.png}}

returns


















  • 160:120

<div class="bobscreen" style="width:Expression error: Unexpected * operator.px; display:inline-block; text-align:center;">

MagicalPuzzlePopils title.png

This is how the game appears on an actual Sega Game Gear. The original image taken from an emulator is below:

MagicalPuzzlePopils title.png

Options

{{bobscreenTest|MagicalPuzzlePopils title.png|width=120}}

returns


















  • 120:120

<div class="bobscreen" style="width:Expression error: Unexpected < operator.px; display:inline-block; text-align:center;">

Expression error: Missing operand for /.x384px

"width" also takes into account the adjusted aspect ratio, so the image appears 120 pixels wide even if the source image is not.

Height

In addition, this template corrects heights:

WinterHeat title.png ->


















  • 320:240

<div class="bobscreen" style="width:Expression error: Unexpected < operator.px; display:inline-block; text-align:center;"><div style="transform:scalex(); transform:scaley(1.1); margin-top:Expression error: Unexpected * operator.px; margin-bottom:Expression error: Unexpected * operator.px; transform-origin:50%">Expression error: Missing operand for /.x384px


ClockworkKnightUSPAL Title.png ->


















  • 320:224

<div class="bobscreen" style="width:Expression error: Unexpected < operator.px; display:inline-block; text-align:center;"><div style="transform:scalex(); transform:scaley(1.176); margin-top:Expression error: Unexpected * operator.px; margin-bottom:Expression error: Unexpected * operator.px; transform-origin:50%">Expression error: Missing operand for /.x384px


NiGHTS title.png ->

NiGHTS title.png

Anamorphic widescreen

VirtuaFighter 32X Widescreen2.png ->


















  • 320:180

<div class="bobscreen" style="width:Expression error: Unexpected < operator.px; display:inline-block; text-align:center;"><div style="transform:scalex(1); transform:scaley(0.804); margin-top:Expression error: Unexpected * operator.px; margin-bottom:Expression error: Unexpected * operator.px; transform-origin:50%">Expression error: Missing operand for /.x384px


VirtuaFighter 32X Widescreen2 PAL.png ->


















  • 320:180

<div class="bobscreen" style="width:Expression error: Unexpected < operator.px; display:inline-block; text-align:center;"><div style="transform:scalex(1); transform:scaley(0.75); margin-top:Expression error: Unexpected * operator.px; margin-bottom:Expression error: Unexpected * operator.px; transform-origin:50%">Expression error: Missing operand for /.x384px


VirtuaFighter 32X Widescreen2 PAL.png ->


















  • 200:180
<div style="transform:scalex(1); transform:scaley(0.75); margin-top:Expression error: Unexpected * operator.px; margin-bottom:Expression error: Unexpected * operator.px; transform-origin:50%">VirtuaFighter 32X Widescreen2 PAL.png


VirtuaFighter 32X Widescreen2 PAL.png ->


















  • 320:200
<div style="transform:scalex(1); transform:scaley(0.75); margin-top:Expression error: Unexpected * operator.px; margin-bottom:Expression error: Unexpected * operator.px; transform-origin:50%">VirtuaFighter 32X Widescreen2 PAL.png

TODO: Get width parameter to work properly here.