agusmakmun / agusmakmun/django-markdown-editor
Copy/Paste clipboard images
- Ngôn ngữ chính
- JavaScript
- Star
- 901
- Fork
- 1.3k
- Chỉ số merge pull request
- Không có pull request nào được merge trong 30 ngày
Mô tả
Having a hook for the paste event would be really helpful in order to upload images directly from clipboard. I created a view in my project and added the below function for the paste event
```javascript
function uploadClipboardImage(event, martorUploadUrl) {
if (event.clipboardData.files.length >= 1) {
let targetField = event.target.parentElement;
if (targetField.id.startsWith('martor-')
&& targetField.classList.contains('martor-field')
&& targetField.classList.contains('ace_editor')
) {
let aceEditor = ace.edit(targetField.id);
for (const f of event.clipboardData.files) {
const formData = new FormData();
formData.append('martor-image-upload', f);
fetch(martorUploadUrl, {
method: 'POST',
headers: {
'X-CSRFToken': '{{ csrf_token }}',
},
body: formData
}).then(response => {
if (response.ok) {
response.json().then(
data => aceEditor.insert(`\n${data.link}\n`)
)
} else {
console.log(response.status)
}
})
}
}
}
}
```
data-upload-url attribute can also be used for getting the url from the event's target element. Official implementation would be highly appreciated.
Hướng dẫn đóng góp
Hướng nghiên cứu
Use the supplied uploadClipboardImage function as the behavior reference and inspect where the editor handles paste events. Check how the martor upload URL and CSRF token are exposed, then verify that pasted clipboard images are uploaded and their links are inserted into the Ace editor without disrupting normal paste behavior.
Do mô hình lập chỉ mục viết ra từ nội dung của issue.
Đánh giá
- Công nghệ
- django, javascript
- Lĩnh vực
- frontend
- Loại issue
- Tính năng
- Độ khó
- 3/5
- Thời gian dự kiến
- 1-2 ngày
- Mức độ hoạt động
- Đình trệ
- Độ rõ ràng
- Khá rõ ràng
- Mức phù hợp với người mới
- 42/100