mirror of
https://github.com/unraid/webgui.git
synced 2026-01-06 01:29:54 -06:00
Feedback form: place SUBMIT button next to CANCEL button
This commit is contained in:
bergware
@@ -31,66 +31,65 @@ $width = in_array($display['theme'], ['azure', 'gray']) ? '98.4%' : '100%';
|
||||
<meta charset="UTF-8">
|
||||
<title>Feedback Form</title>
|
||||
<style>
|
||||
div.spinner.fixed { z-index: 100000; }
|
||||
div#control_panel { position: absolute; left: 0; right: 0; top: 0; padding-top: 8px; line-height: 24px; white-space: nowrap; }
|
||||
div.divide { text-align: center; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; }
|
||||
div.divide label:first-child { margin-left: 0; }
|
||||
div.divide label { margin-left: 2%; cursor: pointer; }
|
||||
div.allpanels { display: none; position: absolute; left: 0; right: 0; top: 40px; bottom: 0; overflow: auto; }
|
||||
div#footer_panel { position: absolute; left: 0; right: 0; bottom: 0; height: 30px; line-height: 30px; text-align: center; }
|
||||
textarea.feedback { width: <?php echo $width; ?>; height: 530px; margin: 0; resize: none; }
|
||||
@media (max-width: 960px) { textarea.feedback { height: 330px; } }
|
||||
@media (max-height: 768px) { textarea.feedback { height: 330px; } }
|
||||
input.submit[type=button] { margin-right: 0; float: right; position: relative; z-index: 1; }
|
||||
input.submit[type=email] { margin-top: 10px; float: left; position: relative; z-index: 1; }
|
||||
p.note, label.note { font-size: 1.1rem !important; display: block; position: relative; z-index: 0; }
|
||||
p.success { text-align: center !important; margin-top: 20px; }
|
||||
span.spacer { margin: 0 4px; }
|
||||
div.spinner.fixed{z-index:100000}
|
||||
div#control_panel{position:absolute;left:0;right:0;top:0;padding-top:8px;line-height:24px;white-space:nowrap}
|
||||
div.divide{text-align:center;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box}
|
||||
div.divide label:first-child{margin-left:0}
|
||||
div.divide label{margin-left:2%;cursor:pointer}
|
||||
div.allpanels{display:none;position:absolute;left:0;right:0;top:40px;bottom:0;overflow:auto}
|
||||
div#footer_panel{position:absolute;left:0;right:0;bottom:0;height:30px;line-height:30px;text-align:center}
|
||||
textarea.feedback{width:<?=$width?>;height:530px;margin:0;resize:none}
|
||||
@media (max-width:960px){textarea.feedback{height:330px}}
|
||||
@media (max-height:768px){textarea.feedback{height:330px}}
|
||||
input.submit[type=email]{margin-top:10px;float:left;position:relative;z-index:1}
|
||||
p.note, label.note{font-size:1.1rem !important;display:block;position:relative;z-index:0}
|
||||
p.success{text-align:center!important;margin-top:20px}
|
||||
span.spacer{margin:0 4px}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div>
|
||||
<div id="control_panel" class="divide">
|
||||
<label for="optFeatureRequest"><input type="radio" name="mode" id="optFeatureRequest" value="featurerequest" checked="checked"/> <?php echo _('Product Suggestion'); ?></label>
|
||||
<label for="optBugReport"><input type="radio" name="mode" id="optBugReport" value="bugreport"/> <?php echo _('Bug Report'); ?></label>
|
||||
<label for="optTroubleshoot"><input type="radio" name="mode" id="optTroubleshoot" value="troubleshoot"/> <?php echo _('Troubleshoot'); ?></label>
|
||||
<label for="optComment"><input type="radio" name="mode" id="optComment" value="comment"/> <?php echo _('Other Comment'); ?></label>
|
||||
<label for="optFeatureRequest"><input type="radio" name="mode" id="optFeatureRequest" value="featurerequest" checked="checked"/><?=_('Product Suggestion')?></label>
|
||||
<label for="optBugReport"><input type="radio" name="mode" id="optBugReport" value="bugreport"/><?=_('Bug Report')?></label>
|
||||
<label for="optTroubleshoot"><input type="radio" name="mode" id="optTroubleshoot" value="troubleshoot"/><?=_('Troubleshoot')?></label>
|
||||
<label for="optComment"><input type="radio" name="mode" id="optComment" value="comment"/><?=_('Other Comment')?></label>
|
||||
<hr>
|
||||
</div>
|
||||
<div id="thanks_panel" class="allpanels"></div>
|
||||
<div id="featurerequest_panel" class="allpanels">
|
||||
<textarea id="featureDescription" class="feedback" placeholder="<?php echo _('Please summarize your suggestion here'); ?>."></textarea>
|
||||
<textarea id="featureDescription" class="feedback" placeholder="<?=_('Please summarize your suggestion here')?>."></textarea>
|
||||
<br>
|
||||
<input type="email" id="featureEmail" class="submit" autocomplete="off" spellcheck="false" placeholder="<?php echo _('Contact Email Address'); ?> (<?php echo _('optional'); ?>)"><input type="button" id="featureSubmit" class="submit" value="<?php echo _('Submit'); ?>"/>
|
||||
<input type="email" id="featureEmail" class="submit" autocomplete="off" spellcheck="false" placeholder="<?=_('Contact Email Address')?> (<?=_('optional')?>)">
|
||||
</div>
|
||||
<div id="bugreport_panel" class="allpanels">
|
||||
<textarea id="bugDescription" class="feedback"></textarea>
|
||||
<input type="email" id="bugEmail" class="submit" autocomplete="off" spellcheck="false" placeholder="<?php echo _('Contact Email Address'); ?>. (<?php echo _('optional'); ?>)"><input type="button" id="bugSubmit" class="submit" value="<?php echo _('Submit'); ?>"/>
|
||||
<label class="note" for="anonymize_bugReport"><input type="checkbox" id="anonymize_bugReport" class="anonymize" value="1" /> <?php echo _('Anonymize diagnostics (may make troubleshooting more difficult)'); ?></label>
|
||||
<p class="note"><b><?php echo _('NOTE'); ?>:</b> <i><?php echo _('Submission of this bug report will automatically send your system diagnostics to Lime Technology'); ?>.</i></p>
|
||||
<input type="email" id="bugEmail" class="submit" autocomplete="off" spellcheck="false" placeholder="<?=_('Contact Email Address')?>. (<?=_('optional')?>)">
|
||||
<label class="note" for="anonymize_bugReport"><input type="checkbox" id="anonymize_bugReport" class="anonymize" value="1" /> <?=_('Anonymize diagnostics (may make troubleshooting more difficult)')?></label>
|
||||
<p class="note"><b><?=_('NOTE')?>:</b> <i><?=_('Submission of this bug report will automatically send your system diagnostics to Lime Technology')?>.</i></p>
|
||||
</div>
|
||||
<div id="troubleshoot_panel" class="allpanels">
|
||||
<textarea id="troubleshootDescription" class="feedback"></textarea>
|
||||
<textarea id="troubleshootDetails" style="display: none;"></textarea>
|
||||
<input type="email" id="troubleshootEmail" class="submit" autocomplete="off" spellcheck="false" placeholder="<?php echo _('Contact Email Address'); ?>"><input type="button" id="troubleshootSubmit" class="submit" value="<?php echo _('Submit'); ?>"/>
|
||||
<label class="note" for="anonymize_troubleshoot"><input type="checkbox" id="anonymize_troubleshoot" class="anonymize" value="1" /> <?php echo _('Anonymize diagnostics (may make troubleshooting more difficult)'); ?></label>
|
||||
<p class="note"><b><?php echo _('NOTE'); ?>:</b> <i><?php echo _('Submission of this troubleshooting request will automatically send your system diagnostics to Lime Technology'); ?>.</i></p>
|
||||
<input type="email" id="troubleshootEmail" class="submit" autocomplete="off" spellcheck="false" placeholder="<?=_('Contact Email Address')?>">
|
||||
<label class="note" for="anonymize_troubleshoot"><input type="checkbox" id="anonymize_troubleshoot" class="anonymize" value="1" /> <?=_('Anonymize diagnostics (may make troubleshooting more difficult)')?></label>
|
||||
<p class="note"><b><?=_('NOTE')?>:</b> <i><?=_('Submission of this troubleshooting request will automatically send your system diagnostics to Lime Technology')?>.</i></p>
|
||||
</div>
|
||||
<div id="comment_panel" class="allpanels">
|
||||
<textarea id="commentDescription" class="feedback" placeholder="<?php echo _('Type your question or comment to Lime Technology here'); ?>."></textarea>
|
||||
<textarea id="commentDescription" class="feedback" placeholder="<?=_('Type your question or comment to Lime Technology here')?>."></textarea>
|
||||
<br>
|
||||
<input type="email" id="commentEmail" class="submit" autocomplete="off" spellcheck="false" placeholder="<?php echo _('Contact Email Address'); ?> (<?php echo _('optional'); ?>)"><input type="button" id="commentSubmit" class="submit" value="<?php echo _('Submit'); ?>"/>
|
||||
<input type="email" id="commentEmail" class="submit" autocomplete="off" spellcheck="false" placeholder="<?=_('Contact Email Address')?> (<?=_('optional')?>)">
|
||||
</div>
|
||||
<div id="footer_panel">
|
||||
<a href="https://unraid.net" target="_blank"><?php echo _('Website'); ?></a><span class="spacer blue-text">|</span>
|
||||
<a href="https://forums.unraid.net" target="_blank"><?php echo _('Forum'); ?></a><span class="spacer blue-text">|</span>
|
||||
<a href="https://docs.unraid.net/" target="_blank"><?php echo _('Docs'); ?></a>
|
||||
<a href="https://unraid.net" target="_blank"><?=_('Website')?></a><span class="spacer blue-text">|</span>
|
||||
<a href="https://forums.unraid.net" target="_blank"><?=_('Forum')?></a><span class="spacer blue-text">|</span>
|
||||
<a href="https://docs.unraid.net/" target="_blank"><?=_('Docs')?></a>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
var inkeyfile = '<?php echo $keyfile; ?>' ?? '';
|
||||
var unraid_osversion = '<?php echo $unraid['version']; ?>';
|
||||
var unraid_timestamp = <?php echo time(); ?>;
|
||||
var inkeyfile = '<?=$keyfile?>' ?? '';
|
||||
var unraid_osversion = '<?=$unraid['version']?>';
|
||||
var unraid_timestamp = <?=time()?>;
|
||||
var inpageurl = window.top.location.href;
|
||||
|
||||
function featurerequest_reset() {
|
||||
@@ -99,12 +98,12 @@ $width = in_array($display['theme'], ['azure', 'gray']) ? '98.4%' : '100%';
|
||||
}
|
||||
|
||||
function bugreport_reset() {
|
||||
$('#bugDescription').val("<?php echo _('Bug Description'); ?>: \n\n\n\n<?php echo _('How to reproduce'); ?>: \n\n\n\n<?php echo _('Expected results'); ?>: \n\n\n\n<?php echo _('Actual results'); ?>: \n\n\n\n<?php echo _('Other information'); ?>: \n");
|
||||
$('#bugDescription').val("<?=_('Bug Description')?>: \n\n\n\n<?=_('How to reproduce')?>: \n\n\n\n<?=_('Expected results')?>: \n\n\n\n<?=_('Actual results')?>: \n\n\n\n<?=_('Other information')?>: \n");
|
||||
$('#bugEmail').val('');
|
||||
}
|
||||
|
||||
function troubleshoot_reset() {
|
||||
$('#troubleshootDescription').val("<?php echo _('Description'); ?>: \n\n\n\n<?php echo _('How to reproduce'); ?>: \n\n\n\n<?php echo _('Expected results'); ?>: \n\n\n\n<?php echo _('Actual results'); ?>: \n\n\n\n<?php echo _('Other information'); ?>: \n");
|
||||
$('#troubleshootDescription').val("<?=_('Description')?>: \n\n\n\n<?=_('How to reproduce')?>: \n\n\n\n<?=_('Expected results')?>: \n\n\n\n<?=_('Actual results')?>: \n\n\n\n<?=_('Other information')?>: \n");
|
||||
$('#troubleshootEmail').val('');
|
||||
}
|
||||
|
||||
@@ -118,13 +117,13 @@ $width = in_array($display['theme'], ['azure', 'gray']) ? '98.4%' : '100%';
|
||||
$('div.spinner.fixed').show();
|
||||
if (diagnostics) {
|
||||
var anonymize = $('#anonymize').is(':checked') ? '1' : '';
|
||||
$.get('/webGui/include/Feedback.php', { getdiagnostics: 1, anonymize: anonymize }, function(data) {
|
||||
$.get('/webGui/include/Feedback.php',{getdiagnostics: 1, anonymize: anonymize}, function(data) {
|
||||
params.diagnostics = data;
|
||||
form_submit(url, params, panel);
|
||||
}).fail(function() {
|
||||
$('div.spinner.fixed').hide();
|
||||
panel.fadeOut('fast').find('textarea,input').prop('disabled', false);
|
||||
var failure_message = "<p class='red-text' style='text-align:center;'><?php echo _('Sorry, an error occurred'); ?> (<?php echo _('Unable to generate system diagnostics'); ?> <?php echo _('Please try again later'); ?>).</p>";
|
||||
var failure_message = "<p class='red-text' style='text-align:center;'><?=_('Sorry, an error occurred')?> (<?=_('Unable to generate system diagnostics')?> <?=_('Please try again later')?>).</p>";
|
||||
$('#thanks_panel').html(failure_message).fadeIn('fast');
|
||||
});
|
||||
return;
|
||||
@@ -136,12 +135,12 @@ $width = in_array($display['theme'], ['azure', 'gray']) ? '98.4%' : '100%';
|
||||
$.post(url, params, function(data) {
|
||||
$('div.spinner.fixed').hide();
|
||||
if (data.error) {
|
||||
var failure_message = "<p class='red-text' style='text-align:center;'><?php echo _('Sorry, an error occurred'); ?>. <?php echo _('Please try again later'); ?>.</p>";
|
||||
var failure_message = "<p class='red-text' style='text-align:center;'><?=_('Sorry, an error occurred')?>. <?=_('Please try again later')?>.</p>";
|
||||
$('#thanks_panel').html(failure_message).fadeIn('fast');
|
||||
} else {
|
||||
data.message = data.message || '';
|
||||
var url_parts = url.split('/');
|
||||
var success_message = '<div style="text-align:center"><h2 style="color:#4f8a10!important"><?php echo _("Thank You"); ?>!</h2><img src="/webGui/images/feedback_' + url_parts[4] + '.png"/><p class="success">' + data.message + '</p></div>';
|
||||
var success_message = '<div style="text-align:center"><h2 style="color:#4f8a10!important"><?=_("Thank You")?>!</h2><img src="/webGui/images/feedback_' + url_parts[4] + '.png"/><p class="success">' + data.message + '</p></div>';
|
||||
$('#thanks_panel').html(success_message).fadeIn('fast', function() {
|
||||
var resetfunction = window[url_parts[4] + '_reset'];
|
||||
if (typeof resetfunction !== 'undefined' && $.isFunction(resetfunction)) {
|
||||
@@ -153,12 +152,13 @@ $width = in_array($display['theme'], ['azure', 'gray']) ? '98.4%' : '100%';
|
||||
if (jqXHR.responseJSON && jqXHR.responseJSON.error) {
|
||||
errorThrown = jqXHR.responseJSON.error;
|
||||
}
|
||||
var failure_message = "<p class='red-text' style='text-align:center;'><?php echo _('Sorry, an error occurred'); ?>. <?php echo _('Please try again later'); ?>.</p>";
|
||||
var failure_message = "<p class='red-text' style='text-align:center;'><?=_('Sorry, an error occurred')?>. <?=_('Please try again later')?>.</p>";
|
||||
$('#thanks_panel').html(failure_message).fadeIn('fast');
|
||||
}).always(function() {
|
||||
$('#spinner_image').fadeOut('fast');
|
||||
panel.fadeOut('fast').find('textarea,input').prop('disabled', false);
|
||||
});
|
||||
$('#submit').prop('disabled',true);
|
||||
}
|
||||
|
||||
$(function() {
|
||||
@@ -173,34 +173,32 @@ $width = in_array($display['theme'], ['azure', 'gray']) ? '98.4%' : '100%';
|
||||
}
|
||||
});
|
||||
|
||||
$('#featureSubmit').click(function featureSubmitClick() {
|
||||
if ($('#featureDescription').val() === '') return;
|
||||
form_submit('https://keys.lime-technology.com/feedback/featurerequest', { description: $('#featureDescription').val(), email: $('#featureEmail').val() }, $('#featurerequest_panel'));
|
||||
});
|
||||
$('button.confirm').text("<?=_('Cancel')?>");
|
||||
if ($('#submit').length == 0) $('button.confirm').before('<input type="button" id="submit" value="<?=_('Submit')?>">');
|
||||
|
||||
$('#bugSubmit').click(function bugSubmitClick() {
|
||||
if ($('#bugDescription').val() === '') return;
|
||||
form_submit('https://keys.lime-technology.com/feedback/bugreport', { description: $('#bugDescription').val(), email: $('#bugEmail').val() }, $('#bugreport_panel'), true);
|
||||
});
|
||||
$('input[name=mode]').click(function(){$('#submit').prop('disabled',false);});
|
||||
|
||||
$('#troubleshootSubmit').click(function bugSubmitClick() {
|
||||
if ($('#troubleshootDescription').val() === '') return;
|
||||
if ($('#troubleshootEmail').val() === '') return alert('Email is required for troubleshooting requests');
|
||||
// @todo - update this to use a new troubleshoot endpoint
|
||||
form_submit(
|
||||
'https://keys.lime-technology.com/feedback/bugreport',
|
||||
{
|
||||
description: $('#troubleshootDescription').val() + '\n\n' + $('#troubleshootDetails').val(),
|
||||
email: $('#troubleshootEmail').val()
|
||||
},
|
||||
$('#troubleshoot_panel'),
|
||||
true
|
||||
);
|
||||
});
|
||||
|
||||
$('#commentSubmit').click(function commentSubmitClick() {
|
||||
if ($('#commentDescription').val() === '') return;
|
||||
form_submit('https://keys.lime-technology.com/feedback/comment', { description: $('#commentDescription').val(), email: $('#commentEmail').val() }, $('#comment_panel'));
|
||||
$('#submit').click(function() {
|
||||
switch ($('input[name=mode]:checked').val()) {
|
||||
case 'featurerequest':
|
||||
if ($('#featureDescription').val() === '') return;
|
||||
form_submit('https://keys.lime-technology.com/feedback/featurerequest',{description: $('#featureDescription').val(), email: $('#featureEmail').val()}, $('#featurerequest_panel'));
|
||||
break;
|
||||
case 'bugreport':
|
||||
if ($('#bugDescription').val() === '') return;
|
||||
form_submit('https://keys.lime-technology.com/feedback/bugreport',{description: $('#bugDescription').val(), email: $('#bugEmail').val()}, $('#bugreport_panel'), true);
|
||||
break;
|
||||
case 'troubleshoot':
|
||||
if ($('#troubleshootDescription').val() === '') return;
|
||||
if ($('#troubleshootEmail').val() === '') return alert('Email is required for troubleshooting requests');
|
||||
// @todo - update this to use a new troubleshoot endpoint
|
||||
form_submit('https://keys.lime-technology.com/feedback/bugreport',{description: $('#troubleshootDescription').val()+'\n\n'+$('#troubleshootDetails').val(), email: $('#troubleshootEmail').val()}, $('#troubleshoot_panel'), true);
|
||||
break;
|
||||
case 'comment':
|
||||
if ($('#commentDescription').val() === '') return;
|
||||
form_submit('https://keys.lime-technology.com/feedback/comment',{description: $('#commentDescription').val(), email: $('#commentEmail').val()}, $('#comment_panel'));
|
||||
break;
|
||||
}
|
||||
});
|
||||
|
||||
featurerequest_reset();
|
||||
@@ -208,7 +206,6 @@ $width = in_array($display['theme'], ['azure', 'gray']) ? '98.4%' : '100%';
|
||||
troubleshoot_reset();
|
||||
comment_reset();
|
||||
$('#optFeatureRequest').click();
|
||||
$('button.confirm').text("<?=_('Cancel')?>");
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
|
||||
Reference in New Issue
Block a user