Upload screenshot from clipboard

[StefanBrand]

Is your feature request related to a problem? If so, please describe.

I often find myself taking screenshots from our web app via the Firefox screenshot tool. By default I always copy to clipboard so that I can paste the screenshot into other tools later. Unfortunately Weblate does not allow this. I must go back to the webapp, take the screenshot again and save it to disk. Then I must upload it to Weblate via the "Browse" button (navigating to the screenshot folder on my disk).

Describe the solution you'd like

Allow pasting screenshots into the "Add new screenshot" dialogue.*

*Might have to be resized automatically to comply with 2000x2000 px limit.

Describe alternatives you've considered

Download & Upload screenshots.

Screenshots

Paste screenshot into this dialogue:

[github-actions]

This issue has been added to the backlog. It is not scheduled on the Weblate roadmap, but it eventually might be implemented.

In case you need this feature soon, please consider helping or push it by funding the development.

[luebbe]

+1

I was just going to write this feature request myself. It would be a great help indeed.

[ptse888]

@nijel i would like to work on this if possible! could you possibly direct me as to where i should be looking to make this modification?

[nijel]

The screenshot upload form is here:

weblate/weblate/screenshots/forms.py

Lines 40 to 59 in f785813

	class ScreenshotForm(forms.ModelForm):
	"""Screenshot upload."""
	class Meta:
	model = Screenshot
	fields = ("name", "image", "translation")
	widgets = {
	"translation": SortedSelect,
	}
	field_classes = {
	"translation": LanguageChoiceField,
	}
	def __init__(self, component, data=None, files=None, instance=None, initial=None):
	self.component = component
	super().__init__(data=data, files=files, instance=instance, initial=initial)
	self.fields[
	"translation"
	].queryset = component.translation_set.prefetch_related("language")
	self.fields["translation"].initial = component.source_translation

It is being rendered here:

weblate/weblate/templates/screenshots/screenshot_list.html

Lines 19 to 32 in f785813

	{% if add_form %}
	<form action="{% url 'screenshots' project=object.project.slug component=object.slug %}" method="POST" enctype="multipart/form-data">
	{% csrf_token %}
	<div class="panel panel-default">
	<div class="panel-heading"><h4 class="panel-title">{% trans "Add new screenshot" %}</h4></div>
	<div class="panel-body">
	{{ add_form|crispy }}
	</div>
	<div class="panel-footer">
	<input type="submit" class="btn btn-primary" value="{% trans "Upload" %}" />
	</div>
	</div>
	</form>
	{% endif %}

[ParthS007]

@nijel I have some questions:

1. Where we add javascript code for some actions on html, do we have any rules for that?

2. What the recommended way to test changes in html files, I am trying to see what data comes in add_form and implement the logic for pasting from clipboard for images ?

3. Do we want this for all file types or just for images?

4. Can you please add instructions to access different type of forms in UI?

[nijel]

No rules so far. Historically, there has been a single JS file, but recently, we've started to split out some logic - we now have also weblate/static/editor/.

We're using django-crispy-forms, it should allow customizing the form rendering, see https://django-crispy-forms.readthedocs.io/en/latest/layouts.html. The screenshot forms are here: https://github.com/WeblateOrg/weblate/blob/main/weblate/screenshots/forms.py, and for now, I'd make this change only to allow pasting screenshots, not anything else.

[github-actions]

Thank you for your report; the issue you have reported has just been fixed.

• In case you see a problem with the fix, please comment on this issue.
• In case you see a similar problem, please open a separate issue.
• If you are happy with the outcome, don’t hesitate to support Weblate by making a donation.