Skip to content

Commit 219db14

Browse files
abaicusabaicus
committed
feat: adds attachment replace
1 parent 2f64e59 commit 219db14

File tree

6 files changed

+302
-51
lines changed

6 files changed

+302
-51
lines changed

‎assets/css/single-attachment.css

Lines changed: 10 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -229,4 +229,13 @@ table.compat-attachment-fields {
229229

230230
.optml-btn.destructive:hover {
231231
background: #c2291e;
232-
}
232+
}
233+
234+
.optml-svg-loader {
235+
animation: spin 1s linear infinite;
236+
}
237+
238+
@keyframes spin {
239+
0% { transform: rotate(0deg); }
240+
100% { transform: rotate(360deg); }
241+
}

‎assets/js/single-attachment.js

Lines changed: 34 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -10,13 +10,12 @@ jQuery(document).ready(function($) {
1010
});
1111

1212
$("#optml_rename_file").on("input", function(e) {
13-
console.log("change");
1413
const newFileName = $(this).val();
1514
if (newFileName === existingFileName) {
1615
return;
1716
}
1817

19-
if(newFileName.trim().length === 0 || newFileName.trim().length > 100) {
18+
if(newFileName.trim().length === 0 || newFileName.trim() .length > 100) {
2019
renameBtn.prop("disabled", true);
2120
return;
2221
}
@@ -35,7 +34,7 @@ jQuery(document).ready(function($) {
3534

3635
$("#optml-replace-clear-btn").on("click", function(e) {
3736
e.preventDefault();
38-
clearFile();
37+
resetFileReplacer();
3938
});
4039

4140
const dropArea = document.getElementById("optml-file-drop-area");
@@ -72,18 +71,35 @@ jQuery(document).ready(function($) {
7271
const file = dt.files[0];
7372
handleFileSelect(file);
7473
}
74+
75+
function resetFileReplacer(error = null) {
76+
if( error ) {
77+
$(".optml-replace-file-error").removeClass("hidden");
78+
$(".optml-replace-file-error").text(error);
79+
} else {
80+
$(".optml-replace-file-error").addClass("hidden");
81+
}
82+
83+
$("#optml-replace-file-btn").prop("disabled", true);
84+
$("#optml-replace-file-field").val("");
85+
$(".optml-replace-file-preview").html("");
86+
$(".label-text").show();
87+
}
7588

7689
function handleFileSelect(file) {
7790
$(".optml-replace-file-error").addClass("hidden");
7891

7992
if(!file) return;
8093

94+
if(OMAttachmentEdit.mimeType !== file.type) {
95+
resetFileReplacer(OMAttachmentEdit.i18n.mimeTypeError);
96+
return;
97+
}
98+
8199
// Check file size
82100
if(file.size > OMAttachmentEdit.maxFileSize) {
83-
$(".optml-replace-file-error").removeClass("hidden");
84-
$(".optml-replace-file-error").text(OMAttachmentEdit.i18n.maxFileSizeError);
85-
$("#optml-replace-file-btn").prop("disabled", true);
86-
$("#optml-replace-file-field").val("");
101+
resetFileReplacer(OMAttachmentEdit.i18n.maxFileSizeError);
102+
87103
return;
88104
}
89105

@@ -113,13 +129,7 @@ jQuery(document).ready(function($) {
113129
formData.append("attachment_id", OMAttachmentEdit.attachmentId);
114130
formData.append("file", $("#optml-replace-file-field")[0].files[0]);
115131

116-
console.log({
117-
action: "optml_replace_file",
118-
attachment_id: OMAttachmentEdit.attachmentId,
119-
file: $("#optml-replace-file-field")[0].files[0]
120-
})
121-
122-
console.log(formData);
132+
$(".optml-svg-loader").show();
123133

124134
jQuery.ajax({
125135
url: OMAttachmentEdit.ajaxURL,
@@ -128,28 +138,27 @@ jQuery(document).ready(function($) {
128138
processData: false,
129139
contentType: false,
130140
success: function(response) {
131-
console.log(response);
141+
$(".optml-svg-loader").hide();
132142
if(response.success) {
133-
// window.location.reload();
134-
console.log(response);
143+
window.location.reload();
135144
} else {
136145
$(".optml-replace-file-error").removeClass("hidden");
137146
$(".optml-replace-file-error").text(response.message);
138147
}
139148
},
140149
error: function(response) {
141-
console.log(response);
142-
$(".optml-replace-file-error").removeClass("hidden");
143-
$(".optml-replace-file-error").text(OMAttachmentEdit.i18n.replaceFileError);
150+
$(".optml-svg-loader").hide();
151+
resetFileReplacer(response.message || OMAttachmentEdit.i18n.replaceFileError);
144152
}
145153
});
146154
}
147155

148156
function clearFile() {
149-
$(".optml-replace-file-preview").html("");
150-
$(".label-text").show();
151-
$("#optml-replace-file-btn").prop("disabled", true);
152-
$("#optml-replace-clear-btn").prop("disabled", true);
153-
$("#optml-replace-file-field").val("");
157+
resetFileReplacer();
158+
// $(".optml-replace-file-preview").html("");
159+
// $(".label-text").show();
160+
// $("#optml-replace-file-btn").prop("disabled", true);
161+
// $("#optml-replace-clear-btn").prop("disabled", true);
162+
// $("#optml-replace-file-field").val("");
154163
}
155164
});

‎inc/media_rename/attachment_edit.php

Lines changed: 20 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -49,6 +49,8 @@ public function enqueue_scripts( $hook ) {
4949
return;
5050
}
5151

52+
$mime_type = get_post_mime_type( $id );
53+
5254
$max_file_size = wp_max_upload_size();
5355
// translators: %s is the max file size in MB.
5456
$max_file_size_error = sprintf( __( 'File size is too large. Max file size is %sMB', 'optimole' ), $max_file_size / 1024 / 1024 );
@@ -63,6 +65,7 @@ public function enqueue_scripts( $hook ) {
6365
'ajaxURL' => admin_url( 'admin-ajax.php' ),
6466
'maxFileSize' => $max_file_size,
6567
'attachmentId' => $id,
68+
'mimeType' => $mime_type,
6669
'i18n' => [
6770
'maxFileSizeError' => $max_file_size_error,
6871
'replaceFileError' => __( 'Error replacing file', 'optimole' ),
@@ -84,6 +87,10 @@ public function add_attachment_fields( $form_fields, $post ) {
8487

8588
$attachment = new Optml_Attachment_Model( $post->ID );
8689

90+
if ( ! $attachment->can_be_renamed_or_replaced() ) {
91+
return $form_fields;
92+
}
93+
8794
if ( ! isset( $screen ) ) {
8895
return $form_fields;
8996
}
@@ -158,12 +165,9 @@ private function get_rename_field( \Optml_Attachment_Model $attachment ) {
158165
*/
159166
private function get_replace_field( \Optml_Attachment_Model $attachment ) {
160167
$file_ext = $attachment->get_extension();
161-
$file_ext = in_array( $file_ext, ['jpg', 'jpeg'] ) ? ['.jpg','.jpeg'] : ['.'. $file_ext];
162-
168+
$file_ext = in_array( $file_ext, [ 'jpg', 'jpeg' ], true ) ? [ '.jpg', '.jpeg' ] : [ '.' . $file_ext ];
163169
$html = '<div class="optml-replace-section">';
164-
165170
$html .= '<div class="optml-replace-input">';
166-
167171
$html .= '<label for="optml-replace-file-field" id="optml-file-drop-area">';
168172
$html .= '<span class="label-text">' . __( 'Click to select a file or drag & drop here', 'optimole' ) . ' (' . implode( ',', $file_ext ) . ')</span>';
169173
$html .= '<div class="optml-replace-file-preview"></div>';
@@ -172,8 +176,9 @@ private function get_replace_field( \Optml_Attachment_Model $attachment ) {
172176
$html .= '<input type="file" class="hidden" id="optml-replace-file-field" name="optml-replace-file-field" accept="' . implode( ',', $file_ext ) . '">';
173177

174178
$html .= '<div class="optml-replace-file-actions">';
175-
$html .= '<button disabled type="button" class="button optml-btn primary" id="optml-replace-file-btn">' . __( 'Replace file', 'optimole' ) . '</button>';
176-
$html .= '<button disabled type="button" class="button optml-btn destructive" id="optml-replace-clear-btn">' . __( 'Clear', 'optimole' ) . '</button>';
179+
$html .= '<button type="button" class="button optml-btn primary" id="optml-replace-file-btn">' . __( 'Replace file', 'optimole' ) . '</button>';
180+
$html .= '<button type="button" class="button optml-btn destructive" id="optml-replace-clear-btn">' . __( 'Clear', 'optimole' ) . '</button>';
181+
$html .= $this->get_svg_loader();
177182
$html .= '<p class="optml-description">' . __( 'This will replace the current file with the new one. This action cannot be undone.', 'optimole' ) . '</p>';
178183
$html .= '</div>';
179184

@@ -213,7 +218,6 @@ public function prepare_attachment_filename( array $post_data, array $attachment
213218
return $post_data;
214219
}
215220

216-
217221
if ( ! isset( $post_data['optml_rename_nonce'] ) || ! wp_verify_nonce( sanitize_text_field( $post_data['optml_rename_nonce'] ), 'optml_rename_media_nonce' ) ) {
218222
return $post_data;
219223
}
@@ -310,4 +314,13 @@ class_exists( '\ThemeIsle\GutenbergBlocks\Server\Dashboard_Server' ) &&
310314
}
311315
}
312316
}
317+
318+
/**
319+
* Get the SVG loader.
320+
*
321+
* @return string The SVG loader.
322+
*/
323+
private function get_svg_loader() {
324+
return '<svg style="display: none;" class="optml-svg-loader" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 12a9 9 0 1 1-6.219-8.56"/></svg>';
325+
}
313326
}

‎inc/media_rename/attachment_model.php

Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -150,6 +150,21 @@ public function get_filename_no_ext() {
150150
return $this->filename_no_ext;
151151
}
152152

153+
/**
154+
* Get filename with extension.
155+
*
156+
* @param bool $scaled Whether the filename is scaled.
157+
*
158+
* @return string
159+
*/
160+
public function get_filename_with_ext( $scaled = false ) {
161+
if ( $scaled ) {
162+
return sprintf( '%s-scaled.%s', $this->filename_no_ext, $this->extension );
163+
}
164+
165+
return sprintf( '%s.%s', $this->filename_no_ext, $this->extension );
166+
}
167+
153168
/**
154169
* Get extension.
155170
*
@@ -205,6 +220,10 @@ public function get_attachment_metadata() {
205220
public function get_all_image_sizes_paths() {
206221
$paths = [];
207222

223+
if ( ! isset( $this->attachment_metadata['sizes'] ) ) {
224+
return [];
225+
}
226+
208227
foreach ( $this->attachment_metadata['sizes'] as $size => $size_data ) {
209228
$paths[ $size ] = $this->dir_path . '/' . $size_data['file'];
210229
}
@@ -222,6 +241,10 @@ public function get_all_image_sizes_urls() {
222241

223242
$links = [];
224243

244+
if ( ! isset( $attachment_metadata['sizes'] ) ) {
245+
return [];
246+
}
247+
225248
foreach ( $attachment_metadata['sizes'] as $size => $size_data ) {
226249
$links[ $size ] = str_replace( $this->original_attached_file_name, $size_data['file'], $this->get_guid() );
227250
}
@@ -252,8 +275,23 @@ private function setup_original_attached_file() {
252275
* @return string
253276
*/
254277
public function get_metadata_prefix_path() {
278+
if ( ! isset( $this->attachment_metadata['file'] ) ) {
279+
$attached_file = get_post_meta( $this->attachment_id, '_wp_attached_file', true );
280+
281+
return dirname( $attached_file );
282+
}
283+
255284
$file_path = $this->attachment_metadata['file'];
256285

257286
return dirname( $file_path );
258287
}
288+
289+
/**
290+
* Check if can be renamed/replaced.
291+
*
292+
* @return bool
293+
*/
294+
public function can_be_renamed_or_replaced() {
295+
return ! $this->is_remote_attachment;
296+
}
259297
}

‎inc/media_rename/attachment_rename.php

Lines changed: 9 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -136,15 +136,16 @@ private function update_attachment_metadata( $old_path, $new_path ) {
136136

137137
// Update file path in metadata
138138
$original_image = sprintf( '%s.%s', $new_file_name_no_ext, $extension );
139-
$meta_file = $original_image;
140-
141-
if( $this->attachment->is_scaled() ) {
142-
$meta_file = sprintf( '%s-scaled.%s', $new_file_name_no_ext, $extension );
143-
$metadata['original_image'] = $original_image;
144-
}
139+
$meta_file = $original_image;
145140

146-
$metadata['file'] = sprintf( '%s/%s', $this->attachment->get_metadata_prefix_path(), $meta_file );
147-
141+
if ( $this->attachment->is_scaled() ) {
142+
$meta_file = sprintf( '%s-scaled.%s', $new_file_name_no_ext, $extension );
143+
$metadata['original_image'] = $original_image;
144+
}
145+
146+
if ( isset( $metadata['file'] ) ) {
147+
$metadata['file'] = sprintf( '%s/%s', $this->attachment->get_metadata_prefix_path(), $meta_file );
148+
}
148149

149150
// Update image sizes if they exist
150151
if ( isset( $metadata['sizes'] ) && is_array( $metadata['sizes'] ) ) {
@@ -194,16 +195,6 @@ private function init_filesystem() {
194195
WP_Filesystem();
195196
}
196197

197-
/**
198-
* Get attachment guid.
199-
*
200-
* @return string
201-
*/
202-
private function get_attachment_guid() {
203-
$post = get_post( $this->attachment_id );
204-
return $post->guid;
205-
}
206-
207198
/**
208199
* Get the new guid (main image URL).
209200
*

0 commit comments

Comments
 (0)