Skip to content

Add audio recording support for WPForms GoDAM Recorder #1446

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
KMchaudhary merged 6 commits into from
Feb 2, 2026
Merged

Add audio recording support for WPForms GoDAM Recorder #1446

Show file tree
Hide file tree
Changes from 3 commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
c483ba4
Add audio recording support for WPForms GoDAM Recorder
AhmarZaidi Jan 2, 2026
229c54b
Fix github bot suggestions
AhmarZaidi Jan 5, 2026
1677f18
Remove hardcoded mime type
AhmarZaidi Jan 5, 2026
ddd6445
PR Review
AhmarZaidi Jan 7, 2026
3994acf
Fixes
AhmarZaidi Jan 8, 2026
89828b0
Merge branch 'develop' into feat/1274-wp-forms-audio-recording
AhmarZaidi Feb 2, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
31 changes: 25 additions & 6 deletions assets/src/css/wpforms-uppy-video.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,12 +2,13 @@
@import "@uppy/dashboard/css/style.min.css";
@import "@uppy/webcam/css/style.min.css";
@import "@uppy/screen-capture/css/style.min.css";
@import "@uppy/audio/css/style.min.css";

/** Style the field in the field preview **/
.wpforms_page_wpforms-builder {

.wpforms-field-godam_record {

.uppy-video-upload-button {
display: flex;
align-items: center;
Expand All @@ -24,6 +25,13 @@
.uppy-video-upload-preview {
margin-top: 20px;
max-width: 100%;

audio {
max-width: 400px;
width: 100%;
height: 40px;
margin: 10px 0;
}
}

.upp-video-upload-filename {
Expand Down Expand Up @@ -66,6 +74,12 @@
figure {
margin: 0;
}

audio {
width: 100%;
max-width: 400px;
margin-top: 10px;
}
}

.godam-video-name {
Expand All @@ -87,17 +101,23 @@
}
}

.wpforms-edit-entry-container.wpforms-container {
.wpforms-edit-entry-container.wpforms-container {

.wpforms-field-godam_record {
display: flex;
flex-direction: column;

.godam-video-preview {

figure {
margin: 0;
}

audio {
width: 100%;
max-width: 400px;
margin-top: 10px;
}
}

.godam-video-media-controls {
Expand All @@ -120,4 +140,3 @@
}
}
}

11 changes: 8 additions & 3 deletions inc/classes/wpforms/class-wpforms-field-godam-video.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -139,7 +139,7 @@ public function field_preview( $field ) {
// Render upload button.
printf( '<button type="button" class="wpforms-btn uppy-video-upload-button">' );
printf( '<span class="dashicons dashicons-video-alt"></span>' );
printf( esc_html__( 'Record Video', 'godam' ) );
printf( esc_html__( 'Start Recording', 'godam' ) );
printf( '</button>' );

// Description.
Expand Down Expand Up @@ -193,6 +193,7 @@ protected function file_selection_field_element( $video_field ) {
'file_input' => esc_html__( 'Local Files', 'godam' ),
'webcam' => esc_html__( 'Webcam', 'godam' ),
'screen_capture' => esc_html__( 'Screencast', 'godam' ),
'audio' => esc_html__( 'Audio', 'godam' ),
);

$checkboxes = '';
Expand Down Expand Up @@ -388,8 +389,12 @@ public function save_video_file( $entry, $form_data ) {
continue;
}

// Check if the file is a video.
if ( ! isset( $file['type'] ) || ! str_starts_with( $file['type'], 'video/' ) ) {
// Check if the file is a video or audio.
$mime_type = ! empty( $file['type'] ) ? $file['type'] : '';
$is_video = ! empty( $mime_type ) && str_starts_with( $mime_type, 'video/' );
$is_audio = ! empty( $mime_type ) && str_starts_with( $mime_type, 'audio/' );

if ( ! $is_video && ! $is_audio ) {
continue;
}

Expand Down
21 changes: 20 additions & 1 deletion inc/classes/wpforms/class-wpforms-integration.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -161,7 +161,26 @@ public function send_saved_files_for_transcoding( $fields, $entry, $form_data, $
continue;
}

$response = rtgodam_send_video_to_godam_for_transcoding( 'wpforms', $form_title, $field['value'], $entry_id );
// Detect file type.
$file_type = wp_check_filetype( $field['value'] );
$mime_type = ! empty( $file_type['type'] ) ? $file_type['type'] : '';
$is_audio = ! empty( $mime_type ) && strpos( $mime_type, 'audio' ) !== false;

// Handle .webm files that might be audio.
if ( 'webm' === $file_type['ext'] && godam_is_audio_file_by_name( $field['value'] ) ) {
$is_audio = true;
}

// Set job_type based on file type.
$job_type = $is_audio ? 'audio' : 'stream';

$response = rtgodam_send_video_to_godam_for_transcoding(
'wpforms',
$form_title,
$field['value'],
$entry_id,
$job_type
);

if ( is_wp_error( $response ) ) {
return wp_send_json_error(
Expand Down
21 changes: 20 additions & 1 deletion inc/classes/wpforms/wpforms-field-godam-record-entry-edit.php
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,3 +1,3 @@
<?php
/**
* Template/View which is render on the WPForms Edit Entry page for the GoDAM Video Recorder field.
Expand Down Expand Up @@ -30,9 +30,28 @@
wpforms_html_attributes( $godam_primary['id'], $godam_primary['class'], $godam_primary['data'], $godam_primary['attr'] ), // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
$godam_primary['required'] // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
);

// Detect if this is an audio file.
$file_type = wp_check_filetype( $godam_value );

Check warning on line 35 in inc/classes/wpforms/wpforms-field-godam-record-entry-edit.php

View workflow job for this annotation

GitHub Actions / Run Plugin Check

WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound 

Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: &quot;$file_type&quot;.
$mime_type = ! empty( $file_type['type'] ) ? $file_type['type'] : '';

Check warning on line 36 in inc/classes/wpforms/wpforms-field-godam-record-entry-edit.php

View workflow job for this annotation

GitHub Actions / Run Plugin Check

WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound 

Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: &quot;$mime_type&quot;.
$is_audio = ! empty( $mime_type ) && strpos( $mime_type, 'audio' ) !== false;

Check warning on line 37 in inc/classes/wpforms/wpforms-field-godam-record-entry-edit.php

View workflow job for this annotation

GitHub Actions / Run Plugin Check

WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound 

Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: &quot;$is_audio&quot;.

if ( 'webm' === $file_type['ext'] && godam_is_audio_file_by_name( $godam_value ) ) {
Copy link
Member

@mi5t4n mi5t4n Jan 6, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

is there a reason we are explicitly checking for the webm extension? Can't there be other audio formats?

Copy link
Contributor Author

@AhmarZaidi AhmarZaidi Jan 7, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The filetype of screencapture, video or audio is mainly decided by browsers. REF REF

From the uppy docs:

If no preferred video mime type is given, the ScreenCapture plugin [audio & video] will prefer types listed in the allowedFileTypes restriction, if any.

We have not specified any mime type for audio/video instead we have added a allowedFileTypes list here, so the browser defaults are being taken.

For example in my testing:

  • Chromium browsers (Edge, Chrome) save both video and audio in .webm format
  • Firefox saves audio in .ogg and video in .webm

So we had added an additional check that if the extension is .webm then we can fallback on 'audio' string in the filename.

However on further testing I found that Safari saves both audio and video in .mp4 so I've updated the godam_is_audio_file to take care of both cases .webm and .mp4

$is_audio = true;

Check warning on line 40 in inc/classes/wpforms/wpforms-field-godam-record-entry-edit.php

View workflow job for this annotation

GitHub Actions / Run Plugin Check

WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound 

Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: &quot;$is_audio&quot;.
}
?>
<div class="godam-video-preview">
<?php echo do_shortcode( "[godam_video poster='{$godam_thumbnail_url}' src='{$godam_value}' transcoded_url='{$godam_transcoded_url}']" ); ?>
<?php if ( $is_audio ) : ?>
<audio controls>
<?php if ( $godam_transcoded_url ) : ?>
<source src="<?php echo esc_url( $godam_transcoded_url ); ?>" type="audio/mpeg">
<?php endif; ?>
<source src="<?php echo esc_url( $godam_value ); ?>" type="<?php echo esc_attr( $mime_type ); ?>">
<?php esc_html_e( 'Your browser does not support the audio element.', 'godam' ); ?>
</audio>
<?php else : ?>
<?php echo do_shortcode( "[godam_video poster='{$godam_thumbnail_url}' src='{$godam_value}' transcoded_url='{$godam_transcoded_url}']" ); ?>
<?php endif; ?>
</div>
<a
href="<?php echo esc_url( $godam_value ); ?>"
Expand Down
34 changes: 27 additions & 7 deletions inc/classes/wpforms/wpforms-field-godam-record-entry-view.php
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,3 +1,3 @@
<?php
/**
* Template/View which is render on the WPForms View Entry page for the GoDAM Video Recorder field.
Expand All @@ -18,6 +18,16 @@
$godam_transcoded_url = WPForms_Integration_Helper::get_transcoded_url( $godam_form_id, $godam_entry_id, $godam_field_id );
$godam_hls_transcoded_url = WPForms_Integration_Helper::get_hls_transcoded_url( $godam_form_id, $godam_entry_id, $godam_field_id );
$godam_transcoded_status = WPForms_Integration_Helper::get_transcoded_status( $godam_form_id, $godam_entry_id, $godam_field_id );

// Detect if this is an audio file.
$file_type = wp_check_filetype( $godam_attachment_url );

Check warning on line 23 in inc/classes/wpforms/wpforms-field-godam-record-entry-view.php

View workflow job for this annotation

GitHub Actions / Run Plugin Check

WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound 

Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: &quot;$file_type&quot;.
$mime_type = ! empty( $file_type['type'] ) ? $file_type['type'] : '';

Check warning on line 24 in inc/classes/wpforms/wpforms-field-godam-record-entry-view.php

View workflow job for this annotation

GitHub Actions / Run Plugin Check

WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound 

Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: &quot;$mime_type&quot;.
$is_audio = ! empty( $mime_type ) && strpos( $mime_type, 'audio' ) !== false;

Check warning on line 25 in inc/classes/wpforms/wpforms-field-godam-record-entry-view.php

View workflow job for this annotation

GitHub Actions / Run Plugin Check

WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound 

Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: &quot;$is_audio&quot;.

// Handle .webm audio files.
if ( 'webm' === $file_type['ext'] && godam_is_audio_file_by_name( $godam_attachment_url ) ) {
$is_audio = true;

Check warning on line 29 in inc/classes/wpforms/wpforms-field-godam-record-entry-view.php

View workflow job for this annotation

GitHub Actions / Run Plugin Check

WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound 

Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: &quot;$is_audio&quot;.
}
?>

<div class="godam-video-preview">
Expand All @@ -42,11 +52,21 @@
<?php endif; ?>
</div>

<?php
$godam_thumbnail_url = ''; // Default empty thumbnail.
// No need to escape here, the entire template will be returned as strings,
// which will be later on escaped using wp_kses_post() by WPForms before rendering the field.
// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
echo force_balance_tags( do_shortcode( "[godam_video poster='{$godam_thumbnail_url}' src='{$godam_attachment_url}' transcoded_url='{$godam_transcoded_url}']" ) );
?>
<?php if ( $is_audio ) : ?>
<audio controls>
<?php if ( $godam_transcoded_url ) : ?>
<source src="<?php echo esc_url( $godam_transcoded_url ); ?>" type="audio/mpeg">
<?php endif; ?>
<source src="<?php echo esc_url( $godam_attachment_url ); ?>" type="<?php echo esc_attr( $mime_type ); ?>">
<?php esc_html_e( 'Your browser does not support the audio element.', 'godam' ); ?>
</audio>
<?php else : ?>
<?php
$godam_thumbnail_url = ''; // Default empty thumbnail.
// No need to escape here, the entire template will be returned as strings,
// which will be later on escaped using wp_kses_post() by WPForms before rendering the field.
// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
echo force_balance_tags( do_shortcode( "[godam_video poster='{$godam_thumbnail_url}' src='{$godam_attachment_url}' transcoded_url='{$godam_transcoded_url}']" ) );
?>
<?php endif; ?>
</div>
2 changes: 1 addition & 1 deletion inc/classes/wpforms/wpforms-field-godam-record-frontend.php
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,3 +1,3 @@
<?php
/**
* Template which is rendered for the WPForms GoDAM Video Field on the frontend.
Expand Down Expand Up @@ -54,7 +54,7 @@
class="uppy-video-upload-button"
>
<span class="dashicons dashicons-video-alt"></span>
<?php esc_html_e( 'Record Video', 'godam' ); ?>
<?php esc_html_e( 'Start Recording', 'godam' ); ?>
</button>
<div id="<?php echo esc_attr( $godam_uppy_preview_id ); ?>" class="uppy-video-upload-preview"></div>
<div id="<?php echo esc_attr( $godam_uppy_file_name_id ); ?>" class="upp-video-upload-filename"></div>
Expand Down
Loading