{% extends "_layouts/cp" %} {% set docsUrl = 'http://craftcms.com/docs/image-transforms' %} {% includecssresource 'css/transforms.css' %} {% import "_includes/forms" as forms %} {% set crumbs = [ { label: "Settings"|t, url: url('settings') }, { label: "Assets"|t, url: url('settings/assets') }, { label: "Image Transforms"|t, url: url('settings/assets/transforms') } ] %} {% set fullPageForm = true %} {% set isNewTransform = (transform is not defined or not transform.id) %} {% if isNewTransform %} {% set title = "Create a new image transform"|t %} {% else %} {% set title = transform.name|t %} {% endif %} {% block content %} {% if not isNewTransform %}{% endif %} {{ forms.textField({ first: true, label: "Name"|t, id: 'name', name: 'name', value: (transform is defined ? transform.name : null), errors: (transform is defined ? transform.getErrors('name') : null), autofocus: true, required: true, translatable: true }) }} {{ forms.textField({ label: "Handle"|t, id: "handle", name: "handle", value: (transform is defined ? transform.handle : null), errors: (transform is defined ? transform.getErrors('handle') : null), required: true, translatable: true }) }} {% set modeInput %}
{% endset %} {{ forms.field({ label: "Mode"|t }, modeInput) }} {{ forms.textField({ label: "Width"|t, id: "width", name: "width", size: 5, value: (transform is defined ? transform.width : null), errors: (transform is defined ? transform.getErrors('width') : null), translatable: true }) }} {{ forms.textField({ label: "Height"|t, id: "height", name: "height", size: 5, value: (transform is defined ? transform.height : null), errors: (transform is defined ? transform.getErrors('height') : null), translatable: true }) }} {{ forms.selectField({ label: "Quality"|t, id: "quality", name: "quality", options: { '0': "Auto"|t, '10': "Low"|t, '30': "Medium"|t, '60': "High"|t, '82': "Very High (Recommended)"|t, '100': "Maximum"|t }, value: (transform is defined ? transform.quality : 82), errors: (transform is defined ? transform.getErrors('quality') : null), translatable: true }) }} {% set formatOptions = [ {label: 'Auto', value: null}, {label: 'jpg', value: 'jpg'}, {label: 'png', value: 'png'}, {label: 'gif', value: 'gif'}, ] %} {{ forms.selectField({ label: "Image Format"|t, id: "format", name: "format", instructions: "The image format that transformed images should use."|t, value: (transform is defined ? transform.format : null), errors: (transform is defined ? transform.getErrors('format') : null), options: formatOptions, translatable: true }) }} {% endblock %} {% includejs %} {% if transform is not defined or not transform.handle %}new Craft.HandleGenerator('#name', '#handle');{% endif %} $('#mode input').change(function() { if ($(this).val() == 'crop') { $('#position-container').removeClass('hidden'); } else { $('#position-container').addClass('hidden'); } }) {% endincludejs %}