Skip to content

Commit 080ab9c

Browse files
kushvah-ajaysingh-nagarroroot
kushvah-ajaysingh-nagarro
and
root
authored
discription added for image title as alt text (#1742)
Co-authored-by: root <root@IN-CKN2GK3>
1 parent ac91204 commit 080ab9c

File tree

1 file changed

+125
-0
lines changed

1 file changed

+125
-0
lines changed

‎home/templates/wagtailimages/images/edit.html

+125
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,125 @@
1+
{% extends "wagtailadmin/base.html" %}
2+
{% load wagtailimages_tags wagtailadmin_tags i18n l10n %}
3+
{% block titletag %}{% blocktrans trimmed with title=image.title %}Editing image {{ title }}{% endblocktrans %}{% endblock %}
4+
{% block extra_css %}
5+
{{ block.super }}
6+
7+
{{ form.media.css }}
8+
9+
<!-- Focal point chooser -->
10+
<link rel="stylesheet" href="{% versioned_static 'wagtailimages/css/vendor/jquery.Jcrop.min.css' %}" type="text/css">
11+
<link rel="stylesheet" href="{% versioned_static 'wagtailimages/css/focal-point-chooser.css' %}" type="text/css">
12+
{% endblock %}
13+
14+
{% block extra_js %}
15+
{{ block.super }}
16+
17+
{{ form.media.js }}
18+
19+
{% url 'wagtailadmin_tag_autocomplete' as autocomplete_url %}
20+
<script>
21+
$(function() {
22+
$('#id_tags').tagit({
23+
autocomplete: {source: "{{ autocomplete_url|addslashes }}"}
24+
});
25+
});
26+
</script>
27+
28+
<!-- Focal point chooser -->
29+
<script src="{% versioned_static 'wagtailadmin/js/vendor/jquery.ba-throttle-debounce.min.js' %}"></script>
30+
<script src="{% versioned_static 'wagtailimages/js/vendor/jquery.Jcrop.min.js' %}"></script>
31+
<script src="{% versioned_static 'wagtailimages/js/focal-point-chooser.js' %}"></script>
32+
{% endblock %}
33+
34+
{% block content %}
35+
{% trans "Editing" as editing_str %}
36+
{% include "wagtailadmin/shared/header.html" with title=editing_str subtitle=image.title icon="image" %}
37+
{% include "wagtailadmin/shared/non_field_errors.html" %}
38+
39+
<form action="{% url 'wagtailimages:edit' image.id %}" method="POST" enctype="multipart/form-data" novalidate>
40+
{% csrf_token %}
41+
<input type="hidden" value="{{ next }}" name="next">
42+
<div class="row row-flush nice-padding">
43+
<div class="col6">
44+
<ul class="fields">
45+
{% for field in form %}
46+
{% if field.name == 'file' %}
47+
{% include "wagtailimages/images/_file_field_as_li.html" with li_classes="label-above" %}
48+
{% elif field.is_hidden %}
49+
{{ field }}
50+
{% else %}
51+
{% include "wagtailadmin/shared/field_as_li.html" with li_classes="label-above" %}
52+
{% if field.name == 'title' %}
53+
<p class='help' style="margin-top: -10px; margin-bottom: 15px;">
54+
Remember title also act as alt text, so include a brief description for screen readers.
55+
</p>
56+
{% endif %}
57+
{% endif %}
58+
{% endfor %}
59+
</ul>
60+
<div class="w-hidden sm:w-block">
61+
<input type="submit" value="{% trans 'Save' %}" class="button" />
62+
{% if user_can_delete %}
63+
<a href="{% url 'wagtailimages:delete' image.id %}{% if next %}?next={{ next|urlencode }}{% endif %}" class="button button-secondary no">{% trans "Delete image" %}</a>
64+
{% endif %}
65+
</div>
66+
</div>
67+
68+
<div class="col6">
69+
{% image image max-800x600 as rendition %}
70+
71+
<div class="focal-point-chooser"
72+
style="max-width: {{ rendition.width }}px; max-height: {{ rendition.height }}px;"
73+
data-focal-point-x="{{ image.focal_point_x|default_if_none:'' }}"
74+
data-focal-point-y="{{ image.focal_point_y|default_if_none:'' }}"
75+
data-focal-point-width="{{ image.focal_point_width|default_if_none:'' }}"
76+
data-focal-point-height="{{ image.focal_point_height|default_if_none:'' }}">
77+
78+
<img {{ rendition.attrs }} data-original-width="{{ image.width|unlocalize }}" data-original-height="{{ image.height|unlocalize }}" class="show-transparency">
79+
<div class="current-focal-point-indicator{% if not image.has_focal_point %} hidden{% endif %}"></div>
80+
</div>
81+
82+
{% if url_generator_enabled %}
83+
<a href="{% url 'wagtailimages:url_generator' image.id %}" class="button bicolor button--icon">{% icon name="link" wrapped=1 %}{% trans "URL Generator" %}</a>
84+
<hr />
85+
{% endif %}
86+
87+
<div class="row">
88+
<div class="col8 divider-after">
89+
<h2 class="label no-float">{% trans "Focal point" %} <span class="w-font-normal">{% trans "(optional)" %}</span></h2>
90+
<p>{% trans "To define this image's most important region, drag a box over the image above." %} {% if image.has_focal_point %}({% trans "Current focal point shown" %}){% endif %}</p>
91+
92+
<button class="button button-secondary no remove-focal-point" type="button">{% trans "Remove focal area" %}</button>
93+
</div>
94+
<div class="col4">
95+
{% image image original as original_image %}
96+
97+
<dl>
98+
<dt>{% trans "Max dimensions" %}</dt>
99+
<dd>{{ original_image.width }}x{{ original_image.height }}</dd>
100+
<dt>{% trans "Filesize" %}</dt>
101+
<dd>{% if filesize %}{{ filesize|filesizeformat }}{% else %}{% trans "File not found" %}{% endif %}</dd>
102+
103+
{% usage_count_enabled as uc_enabled %}
104+
{% if uc_enabled %}
105+
<dt>{% trans "Usage" %}</dt>
106+
<dd>
107+
<a href="{{ image.usage_url }}">{% blocktrans trimmed count usage_count=image.get_usage.count %}Used {{ usage_count }} time{% plural %}Used {{ usage_count }} times{% endblocktrans %}</a>
108+
</dd>
109+
{% endif %}
110+
</dl>
111+
</div>
112+
</div>
113+
</div>
114+
</div>
115+
116+
<div class="row row-flush nice-padding sm:!w-hidden">
117+
<div class="col5">
118+
<input type="submit" value="{% trans 'Save' %}" class="button" />
119+
{% if user_can_delete %}
120+
<a href="{% url 'wagtailimages:delete' image.id %}{% if next %}?next={{ next }}{% endif %}" class="button button-secondary no">{% trans "Delete image" %}</a>
121+
{% endif %}
122+
</div>
123+
</div>
124+
</form>
125+
{% endblock %}

0 commit comments

Comments
 (0)