Problems with CE Image, MX Jumper and parse order (I believe)

Question

I'm experiencing two possible issues in the code below:

1. The if/else I have always sets standard_image_width and retina_image_width to the value in the last {if:else}, regardless of whether or not it's correct; and
2. Whatever that value turns out to be set to, it doesn't make it through to the width="{exp:mx_jumper:out name='standard_image_width'}" attribute on the {exp:ce_img:pair} tag.

What I'm trying to do: Determine the size the image should be resized to, then create a standard and 2x retina versions using CE Image. {blog_images} is a Matrix field.

Anyone see what might be causing these issues? Appreciate any help I can get…

{blog_images}
    {!-- Get Image Size --}
    {if '{placement}' == 'sidebar'}
        {exp:mx_jumper:put name="standard_image_width"}226{/exp:mx_jumper:put}
        {exp:mx_jumper:put name="retina_image_width"}452{/exp:mx_jumper:put}
    {if:elseif '{size}' == 'full-width'}
        {exp:mx_jumper:put name="standard_image_width"}750{/exp:mx_jumper:put}
        {exp:mx_jumper:put name="retina_image_width"}1500{/exp:mx_jumper:put}
    {if:elseif '{size}' == 'text-width'}
        {exp:mx_jumper:put name="standard_image_width"}500{/exp:mx_jumper:put}
        {exp:mx_jumper:put name="retina_image_width"}1000{/exp:mx_jumper:put}
    {if:else}
        {exp:mx_jumper:put name="standard_image_width"}500{/exp:mx_jumper:put}
        {exp:mx_jumper:put name="retina_image_width"}1000{/exp:mx_jumper:put}
    {/if}
    {exp:mx_jumper:put name="image_{row_count}"}
        <figure class="{placement} {size}">
            {!-- Retina --}
            {exp:stash:set name="retina_content_image"}{exp:ce_img:pair src="{image}" hide_relative_path="yes" cache_dir="images/blog/retina" filename_suffix="@2x" width="{exp:mx_jumper:out name='retina_image_width'}"}{aws_url}{/exp:ce_img:pair}{/exp:stash:set}
            {!-- Regula --}
            Size: {size}<br>
            Standard Image Width: {exp:mx_jumper:out name='standard_image_width'}
            {exp:ce_img:pair src="{image}" width="{exp:mx_jumper:out name='standard_image_width'}" allow_scale_larger="yes" cache_dir="images/blog" hide_relative_path="yes" parse="inward"}
                <img src="/assets/images/css/holder.png" width="{width}" height="{height}" data-src="{made}" data-src-retina="{exp:stash:get name='retina_content_image'}" alt="{alt_text}">
            {/exp:ce_img:pair}
            {if caption}
                <figcaption>
                    {caption}
                </figcaption>
            {/if}
        </figure>
    {/exp:mx_jumper:put}
{/blog_images}

Answer 1

You didn't say which version of EECMS you're using. Some versions have parsing issues on conditionals with single quotation marks. Or, maybe, your version of Matrix have one of this issues.

So, first of all, try to replace them.

{if "{placement}" == "sidebar"}
    {exp:mx_jumper:put name="standard_image_width"}226{/exp:mx_jumper:put}
    {exp:mx_jumper:put name="retina_image_width"}452{/exp:mx_jumper:put}
{if:elseif "{size}" == "full-width"}
    {exp:mx_jumper:put name="standard_image_width"}750{/exp:mx_jumper:put}
    {exp:mx_jumper:put name="retina_image_width"}1500{/exp:mx_jumper:put}
{if:elseif "{size}" == "text-width"}
    {exp:mx_jumper:put name="standard_image_width"}500{/exp:mx_jumper:put}
    {exp:mx_jumper:put name="retina_image_width"}1000{/exp:mx_jumper:put}
{if:else}
    {exp:mx_jumper:put name="standard_image_width"}500{/exp:mx_jumper:put}
    {exp:mx_jumper:put name="retina_image_width"}1000{/exp:mx_jumper:put}
{/if}

On the first exp:ce_img:pair you forgot about the parse parameter. You put it on the second one, but forgot on this.

{!-- Retina --}
{exp:stash:set name="retina_content_image"}{exp:ce_img:pair src="{image}" hide_relative_path="yes" cache_dir="images/blog/retina" filename_suffix="@2x" width="{exp:mx_jumper:out name='retina_image_width'}" parse="inward"}{aws_url}{/exp:ce_img:pair}{/exp:stash:set}

I hope it helps.