{% import "_includes/forms" as forms %}

{{ forms.textField({
    label: "Project ID"|t('google-cloud'),
    id: 'projectId',
    name: 'projectId',
    value: volume.projectId,
    errors: volume.getErrors('projectId'),
    class: 'google-project-id',
    instructions: 'Your Google project ID'|t('google-cloud'),
    required: true
}) }}

{{ forms.textareaField({
    label: "Contents of the access key file"|t('google-cloud'),
    id: 'keyFileContents',
    name: 'keyFileContents',
    value: volume.keyFileContents,
    errors: volume.getErrors('keyFileContents'),
    class: 'google-key-file-contents',
    instructions: 'You can leave this field empty if you are using <a href=\"{link}\" title=\"Application default credentials\" target=\"_blank\">Application default credentials</a>.'|t('google-cloud', {'link': 'https://github.com/google/google-auth-library-php#application-default-credentials'}),
    rows: 8,
    cols: 50
}) }}

{% set bucketInput %}
    <div class="flex">
        {{ forms.select({
            id: 'bucket',
            name: 'bucket',
            options: { (volume.bucket): volume.bucket },
            value: volume.bucket,
            readonly: true,
            class: 'google-bucket-select'
        }) }}
        <div class="btn google-refresh-buckets">{{ "Refresh"|t('google-cloud') }}</div>
        <div class="spinner hidden"></div>
    </div>
{% endset %}

{{ forms.field({
    label: "Bucket"|t('google-cloud'),
    id: 'bucket'
}, bucketInput) }}

{{ forms.textField({
    label: "Subfolder"|t('google-cloud'),
    instructions: "If you want to use a bucket’s subfolder as a Volume, specify the path to use here."|t('google-cloud'),
    id: 'subfolder',
    class: 'ltr',
    name: 'subfolder',
    value: volume.subfolder,
    errors: volume.getErrors('subfolder'),
    required: false,
    placeholder: "path/to/subfolder"|t('google-cloud')
}) }}

<hr>

{% set cacheInput %}
    {% set expires = (volume.expires|length > 0 ? volume.expires|split(' ') : ['', ''])%}

    <div class="flex">
        <div>
            {{ forms.textField({
                id: 'expiresAmount',
                value: expires[0],
                size: 2,
                class: 'google-expires-amount'
            }) }}
        </div>
        {{ forms.select({
            id: 'expiresPeriod',
            options: periods,
            value: expires[1],
            class: 'google-expires-period'
        }) }}
    </div>
    {{ forms.hidden({
        name: "expires",
        value: volume.expires,
        class: "expires-combined"
    }) }}
{% endset %}

{{ forms.field({
    label: "Cache Duration"|t('google-cloud'),
    instructions: "The Cache-Control duration that assets should be uploaded to the cloud with.",
    id: 'cacheDuration',
}, cacheInput) }}

{% do view.registerAssetBundle("craft\\googlecloud\\GoogleCloudBundle") %}