mirror of
https://github.com/amiaopensource/ffmprovisr.git
synced 2024-12-27 20:18:22 +01:00
sample example
This commit is contained in:
Ashley Blewer
parent
d56bea5176
commit
6a6aa7fd44
348
index.html
348
index.html
@ -40,20 +40,6 @@
|
|||||||
<h3>What do you want to do?</h3>
|
<h3>What do you want to do?</h3>
|
||||||
<h5>Select from the following.</h5>
|
<h5>Select from the following.</h5>
|
||||||
<span id="show_display_info"><button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="bottom" title="Displays information about a media file">Display Info</button></span>
|
<span id="show_display_info"><button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="bottom" title="Displays information about a media file">Display Info</button></span>
|
||||||
|
|
||||||
<span id="show_add_subtitles"><button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="bottom" title="Attaches a subtitle track to a media file">Add subtitles</button></span>
|
|
||||||
|
|
||||||
<span id="show_remove_audio_track"><button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="bottom" title="Removes the audio track from a media file">Remove audio</button></span>
|
|
||||||
|
|
||||||
<span id="show_add_audio_track"><button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="bottom" title="Adds (replaces) a video file's audio track">Add audio track</button></span>
|
|
||||||
|
|
||||||
<span id="show_webm_for_web"><button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="bottom" title="Export to compressed webm file for web use">Export to webm for web</button></span>
|
|
||||||
|
|
||||||
<span id="show_h264_for_web"><button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="bottom" title="Export to compressed h264 file for web use">Export to h264 for web</button></span>
|
|
||||||
|
|
||||||
<span id="show_img_to_vid"><button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="bottom" title="This command will transform all the images from the current directory (named image1.jpg, image2.jpg, etc) to a video file named video.mpg">Convert images to video</button></span>
|
|
||||||
|
|
||||||
<span id="show_vid_to_img"><button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="bottom" title="Export to compressed h264 file for web use">Convert video to images</button></span>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
@ -61,339 +47,27 @@
|
|||||||
|
|
||||||
<!-- FORMS!-->
|
<!-- FORMS!-->
|
||||||
<div id="formloader">
|
<div id="formloader">
|
||||||
|
|
||||||
|
<!-- sample example -->
|
||||||
<div class="display_info" style="display:none;">
|
<div class="display_info" style="display:none;">
|
||||||
<div id="file_names">
|
|
||||||
<div class="well">
|
<div class="well">
|
||||||
<fieldset>
|
<h2>ffmpeg -i [sample file path]</h2>
|
||||||
<legend>Input</legend>
|
|
||||||
<div class="form-group">
|
|
||||||
<label class="control-label" for="input_name">Input</label>
|
|
||||||
<div class="controls">
|
|
||||||
<input type="text" name="input_name" id="input_name" placeholder="input" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<br/>
|
|
||||||
<input type="button" class="btn btn-large btn-primary" name="display_generate" id="display_generate" value="Generate" />
|
|
||||||
</fieldset>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="well">
|
<div class="well">
|
||||||
<fieldset>
|
<ul>
|
||||||
<legend>Your command line:</legend>
|
<li>ffmpeg : starts the command</li>
|
||||||
<textarea name="display_command_line" id="display_command_line" rows="1" cols="100"></textarea>
|
<li>-i : i for info dudes!</li>
|
||||||
</fieldset>
|
<li>[sample file path] : path to sample file</li>
|
||||||
</div>
|
</ul>
|
||||||
</div>
|
|
||||||
<div class="web" style="display:none;">
|
|
||||||
<div id="file_names">
|
|
||||||
|
|
||||||
<div class="well">
|
|
||||||
<fieldset>
|
|
||||||
<legend>Input and Output</legend>
|
|
||||||
<div class="form-group">
|
|
||||||
<label class="control-label" for="input_name">Input</label>
|
|
||||||
<div class="controls">
|
|
||||||
<input type="text" name="input_name" id="input_name" placeholder="input" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="form-group">
|
|
||||||
<label class="control-label" for="output_name">Output</label>
|
|
||||||
<div class="controls">
|
|
||||||
<input type="text" name="output_name" id="output_name" placeholder="output" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<br/>
|
|
||||||
<input type="button" class="btn btn-large btn-primary" name="generate" id="web_generate" value="Generate" />
|
|
||||||
</fieldset>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="well">
|
<div class="well">
|
||||||
<fieldset>
|
<p>This is all about info! This is all about info! This is all about info! This is all about info! This is all about info! This is all about info! This is all about info! This is all about info! This is all about info! This is all about info! This is all about info! This is all about info! This is all about info! This is all about info! </p>
|
||||||
<legend>Your command line:</legend>
|
|
||||||
<textarea name="command_line" id="command_line" rows="3" cols="100"></textarea>
|
|
||||||
</fieldset>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="add_subtitles" style="display:none;">
|
|
||||||
<div id="file_names">
|
|
||||||
<div class="well">
|
|
||||||
<fieldset>
|
|
||||||
<legend>Input</legend>
|
|
||||||
<div class="form-group">
|
|
||||||
<label class="control-label" for="subtitles_input_name">Input</label>
|
|
||||||
<div class="controls">
|
|
||||||
<input type="text" name="subtitles_input_name" id="subtitles_input_name" placeholder="input" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<br/>
|
|
||||||
</fieldset>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="well">
|
|
||||||
<fieldset>
|
|
||||||
<legend>Subtitles file (.srt)</legend>
|
|
||||||
<div class="form-group">
|
|
||||||
<label class="control-label" for="subtitles_name">Subtitles</label>
|
|
||||||
<div class="controls">
|
|
||||||
<input type="text" name="subtitles_name" id="subtitles_name" placeholder="subtitles" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</fieldset>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="well">
|
|
||||||
<fieldset>
|
|
||||||
<legend>Output</legend>
|
|
||||||
<div class="form-group">
|
|
||||||
<label class="control-label" for="subtitles_output_name">Output</label>
|
|
||||||
<div class="controls">
|
|
||||||
<input type="text" name="subtitles_output_name" id="subtitles_output_name" placeholder="output" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</fieldset>
|
|
||||||
<br/>
|
|
||||||
<fieldset>
|
|
||||||
<input type="button" class="btn btn-large btn-primary" name="add_subtitles_generate" id="add_subtitles_generate" value="Generate" />
|
|
||||||
</fieldset>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="well">
|
|
||||||
<fieldset>
|
|
||||||
<legend>Your command line:</legend>
|
|
||||||
<textarea name="subtitles_command_line" id="subtitles_command_line" rows="3" cols="100"></textarea>
|
|
||||||
</fieldset>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="remove_audio_track" style="display:none;">
|
|
||||||
<div id="file_names">
|
|
||||||
<div class="well">
|
|
||||||
<fieldset>
|
|
||||||
<legend>Input</legend>
|
|
||||||
<div class="form-group">
|
|
||||||
<label class="control-label" for="r_audio_input_name">Input</label>
|
|
||||||
<div class="controls">
|
|
||||||
<input type="text" name="r_audio_input_name" id="r_audio_input_name" placeholder="input" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<br/>
|
|
||||||
</fieldset>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="well">
|
|
||||||
<fieldset>
|
|
||||||
<legend>Audio track</legend>
|
|
||||||
<div class="form-group">
|
|
||||||
<label class="control-label" for="r_audio_track_name">Audio track</label>
|
|
||||||
<div class="controls">
|
|
||||||
<input type="text" name="r_audio_track_name" id="r_audio_track_name" placeholder="subtitles" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</fieldset>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="well">
|
|
||||||
<fieldset>
|
|
||||||
<legend>Output</legend>
|
|
||||||
<div class="form-group">
|
|
||||||
<label class="control-label" for="r_audio_output_name">Output</label>
|
|
||||||
<div class="controls">
|
|
||||||
<input type="text" name="r_audio_output_name" id="r_audio_output_name" placeholder="output" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</fieldset>
|
|
||||||
<br/>
|
|
||||||
<fieldset>
|
|
||||||
<input type="button" class="btn btn-large btn-primary" name="remove_subtitles_generate" id="remove_audio_track_generate" value="Generate" />
|
|
||||||
</fieldset>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="well">
|
|
||||||
<fieldset>
|
|
||||||
<legend>Your command line:</legend>
|
|
||||||
<textarea name="remove_audio_track_command_line" id="remove_audio_track_command_line" rows="3" cols="100"></textarea>
|
|
||||||
</fieldset>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="webm_for_web" style="display:none;">
|
|
||||||
<div id="file_names">
|
|
||||||
<div class="well">
|
|
||||||
<fieldset>
|
|
||||||
<legend>Input and Output</legend>
|
|
||||||
<div class="form-group">
|
|
||||||
<label class="control-label" for="webm_input_name">Input</label>
|
|
||||||
<div class="controls">
|
|
||||||
<input type="text" name="webm_input_name" id="webm_input_name" placeholder="input" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="form-group">
|
|
||||||
<label class="control-label" for="webm_output_name">Output</label>
|
|
||||||
<div class="controls">
|
|
||||||
<input type="text" name="webm_output_name" id="webm_output_name" placeholder="output" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<br/>
|
|
||||||
<input type="button" class="btn btn-large btn-primary" name="generate" id="webm_for_web_generate" value="Generate" />
|
|
||||||
</fieldset>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="well">
|
|
||||||
<fieldset>
|
|
||||||
<legend>Your command line:</legend>
|
|
||||||
<textarea name="webm_for_web_command_line" id="webm_for_web_command_line" rows="3" cols="100"></textarea>
|
|
||||||
</fieldset>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- h264 for web -->
|
|
||||||
<div class="h264_for_web" style="display:none;">
|
|
||||||
<div id="file_names">
|
|
||||||
<div class="well">
|
|
||||||
<fieldset>
|
|
||||||
<legend>Input and Output</legend>
|
|
||||||
<div class="form-group">
|
|
||||||
<label class="control-label" for="h264_input_name">Input</label>
|
|
||||||
<div class="controls">
|
|
||||||
<input type="text" name="h264_input_name" id="h264_input_name" placeholder="input" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="form-group">
|
|
||||||
<label class="control-label" for="h264_output_name">Output</label>
|
|
||||||
<div class="controls">
|
|
||||||
<input type="text" name="h264_output_name" id="h264_output_name" placeholder="output" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<br/>
|
|
||||||
<input type="button" class="btn btn-large btn-primary" name="generate" id="h264_for_web_generate" value="Generate" />
|
|
||||||
</fieldset>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="well">
|
|
||||||
<fieldset>
|
|
||||||
<legend>Your command line:</legend>
|
|
||||||
<textarea name="h264_for_web_command_line" id="h264_for_web_command_line" rows="3" cols="100"></textarea>
|
|
||||||
</fieldset>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Add audio track -->
|
|
||||||
<div class="add_audio_track" style="display:none;">
|
|
||||||
<div id="file_names">
|
|
||||||
<div class="well">
|
|
||||||
<fieldset>
|
|
||||||
<legend>Input</legend>
|
|
||||||
<div class="form-group">
|
|
||||||
<label class="control-label" for="audio_input_name">Input</label>
|
|
||||||
<div class="controls">
|
|
||||||
<input type="text" name="audio_input_name" id="audio_input_name" placeholder="input" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<br/>
|
|
||||||
</fieldset>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="well">
|
|
||||||
<fieldset>
|
|
||||||
<legend>Audio track</legend>
|
|
||||||
<div class="form-group">
|
|
||||||
<label class="control-label" for="audio_track_name">Audio track</label>
|
|
||||||
<div class="controls">
|
|
||||||
<input type="text" name="audio_track_name" id="audio_track_name" placeholder="audio.mp3" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</fieldset>
|
|
||||||
</div>
|
|
||||||
<div class="well">
|
|
||||||
<fieldset>
|
|
||||||
<legend>Output</legend>
|
|
||||||
<div class="form-group">
|
|
||||||
<label class="control-label" for="audio_output_name">Output</label>
|
|
||||||
<div class="controls">
|
|
||||||
<input type="text" name="audio_output_name" id="audio_output_name" placeholder="output" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</fieldset>
|
|
||||||
<br/>
|
|
||||||
<fieldset>
|
|
||||||
<input type="button" class="btn btn-large btn-primary" name="add_subtitles_generate" id="add_audio_track_generate" value="Generate" />
|
|
||||||
</fieldset>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="well">
|
|
||||||
<fieldset>
|
|
||||||
<legend>Your command line:</legend>
|
|
||||||
<textarea name="add_audio_track_command_line" id="add_audio_track_command_line" rows="3" cols="100"></textarea>
|
|
||||||
</fieldset>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- img to vid -->
|
|
||||||
<div class="img_to_vid" style="display:none;">
|
|
||||||
<div id="file_names">
|
|
||||||
<div class="well">
|
|
||||||
<fieldset>
|
|
||||||
<legend>Input and Output</legend>
|
|
||||||
<div class="form-group">
|
|
||||||
<label class="control-label" for="img_output_name">Output</label>
|
|
||||||
<div class="controls">
|
|
||||||
<input type="text" name="img_output_name" id="img_output_name" placeholder="video.mpg" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<br/>
|
|
||||||
<input type="button" class="btn btn-large btn-primary" name="generate" id="img_to_vid_generate" value="Generate" />
|
|
||||||
</fieldset>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="well">
|
|
||||||
<fieldset>
|
|
||||||
<legend>Your command line:</legend>
|
|
||||||
<textarea name="img_to_vid_command_line" id="img_to_vid_command_line" rows="3" cols="100"></textarea>
|
|
||||||
</fieldset>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
<!-- vid to img -->
|
|
||||||
<div class="vid_to_img" style="display:none;">
|
|
||||||
<div id="file_names">
|
|
||||||
<div class="well">
|
|
||||||
<fieldset>
|
|
||||||
<legend>Output</legend>
|
|
||||||
<div class="form-group">
|
|
||||||
<label class="control-label" for="vid_output_name">Output</label>
|
|
||||||
<div class="controls">
|
|
||||||
<input type="text" name="vid_output_name" id="vid_output_name" placeholder="video.mpg" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<br/>
|
|
||||||
<input type="button" class="btn btn-large btn-primary" name="generate" id="vid_to_img_generate" value="Generate" />
|
|
||||||
</fieldset>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="well">
|
|
||||||
<fieldset>
|
|
||||||
<legend>Your command line:</legend>
|
|
||||||
<textarea name="vid_to_img_command_line" id="vid_to_img_command_line" rows="3" cols="100"></textarea>
|
|
||||||
</fieldset>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
</div> <!-- container -->
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="text-center">
|
|
||||||
<div class="reload">
|
|
||||||
<p><button type="button" class="btn btn-default">Start over!</button></p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div> <!-- container -->
|
</div> <!-- container -->
|
||||||
|
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user