mirror of
https://github.com/unraid/webgui.git
synced 2026-01-05 17:20:04 -06:00
refactor: feedback script dev maintainability
This commit is contained in:
Zack Spear
@@ -10,170 +10,177 @@
|
||||
* The above copyright notice and this permission notice shall be included in
|
||||
* all copies or substantial portions of the Software.
|
||||
*/
|
||||
?>
|
||||
<?
|
||||
|
||||
$docroot = $docroot ?? $_SERVER['DOCUMENT_ROOT'] ?: '/usr/local/emhttp';
|
||||
|
||||
require_once "$docroot/webGui/include/Helpers.php";
|
||||
extract(parse_plugin_cfg('dynamix',true));
|
||||
extract(parse_plugin_cfg('dynamix', true));
|
||||
|
||||
// add translations
|
||||
$_SERVER['REQUEST_URI'] = '';
|
||||
$login_locale = _var($display,'locale');
|
||||
$login_locale = _var($display, 'locale');
|
||||
require_once "$docroot/webGui/include/Translations.php";
|
||||
|
||||
$var = parse_ini_file('state/var.ini');
|
||||
$unraid = parse_ini_file('/etc/unraid-version');
|
||||
$keyfile = trim(base64_encode(@file_get_contents($var['regFILE'])));
|
||||
$width = in_array($display['theme'],['azure','gray']) ? '98.4%' : '100%';
|
||||
|
||||
$style = ["<style>"];
|
||||
$style[] = "div.spinner.fixed{z-index:100000}";
|
||||
$style[] = "div#control_panel{position:absolute;left:0;right:0;top:0;padding-top:8px;line-height:24px;white-space:nowrap}";
|
||||
$style[] = "div.divide{text-align:center;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box}";
|
||||
$style[] = "div.divide label:first-child{margin-left:0}";
|
||||
$style[] = "div.divide label{margin-left:2%;cursor:pointer}";
|
||||
$style[] = "div.allpanels{display:none;position:absolute;left:0;right:0;top:40px;bottom:0;overflow:auto}";
|
||||
$style[] = "div#footer_panel{position:absolute;left:0;right:0;bottom:0;height:30px;line-height:30px;text-align:center}";
|
||||
$style[] = "textarea.feedback{width:$width;height:530px;margin:0;resize:none}";
|
||||
$style[] = "@media (max-width:960px){textarea.feedback{height:330px}}";
|
||||
$style[] = "@media (max-height:768px){textarea.feedback{height:330px}}";
|
||||
$style[] = "input.submit[type=button]{margin-right:0;float:right}";
|
||||
$style[] = "input.submit[type=email]{margin-top:10px;float:left}";
|
||||
$style[] = "p.note,label.note{font-size:1.1rem!important;display:block}";
|
||||
$style[] = "p.success{text-align:center!important;margin-top:20px}";
|
||||
$style[] = "span.spacer{margin:0 4px}";
|
||||
$style[] = "</style>";
|
||||
|
||||
$html = ["<div>"];
|
||||
$html[] = "<div id='control_panel' class='divide'>";
|
||||
$html[] = "<label for='optFeatureRequest'><input type='radio' name='mode' id='optFeatureRequest' value='featurerequest' checked='checked'/> "._('Product Suggestion')."</label>";
|
||||
$html[] = "<label for='optBugReport'><input type='radio' name='mode' id='optBugReport' value='bugreport'/> "._('Bug Report')."</label>";
|
||||
$html[] = "<label for='optComment'><input type='radio' name='mode' id='optComment' value='comment'/> "._('Other Comment')."</label>";
|
||||
$html[] = "<hr>";
|
||||
$html[] = "</div>";
|
||||
$html[] = "<div id='thanks_panel' class='allpanels'></div>";
|
||||
$html[] = "<div id='featurerequest_panel' class='allpanels'>";
|
||||
$html[] = "<textarea id='featureDescription' class='feedback' placeholder=\""._('Please summarize your suggestion here').".\"></textarea>";
|
||||
$html[] = "<br>";
|
||||
$html[] = "<input type='email' id='featureEmail' class='submit' autocomplete='off' spellcheck='false' placeholder=\""._('Contact Email Address').' ('._('optional').")\"><input type='button' id='featureSubmit' class='submit' value=\""._('Submit')."\"/>";
|
||||
$html[] = "</div>";
|
||||
$html[] = "<div id='bugreport_panel' class='allpanels'>";
|
||||
$html[] = "<textarea id='bugDescription' class='feedback'></textarea>";
|
||||
$html[] = "<input type='email' id='bugEmail' class='submit' autocomplete='off' spellcheck='false' placeholder=\""._('Contact Email Address').". ("._('optional').")\"><input type='button' id='bugSubmit' class='submit' value=\""._('Submit')."\"/>";
|
||||
$html[] = "<label class='note' for='anonymize'><input type='checkbox' id='anonymize' value='1' />"._('Anonymize diagnostics (may make troubleshooting more difficult)')."</label>";
|
||||
$html[] = "<p class='note'><b>"._('NOTE').":</b> <i>"._('Submission of this bug report will automatically send your system diagnostics to Lime Technology').".</i></p>";
|
||||
$html[] = "</div>";
|
||||
$html[] = "<div id='comment_panel' class='allpanels'>";
|
||||
$html[] = "<textarea id='commentDescription' class='feedback' placeholder=\""._('Type your question or comment to Lime Technology here').".\"></textarea>";
|
||||
$html[] = "<br>";
|
||||
$html[] = "<input type='email' id='commentEmail' class='submit' autocomplete='off' spellcheck='false' placeholder=\""._('Contact Email Address')." ("._('optional').")\"><input type='button' id='commentSubmit' class='submit' value=\""._('Submit')."\"/>";
|
||||
$html[] = "</div>";
|
||||
$html[] = "<div id='footer_panel'>";
|
||||
$html[] = "<a href='https://unraid.net' target='_blank'>"._('Website')."</a><span class='spacer blue-text'>|</span>";
|
||||
$html[] = "<a href='https://forums.unraid.net' target='_blank'>"._('Forum')."</a><span class='spacer blue-text'>|</span>";
|
||||
$html[] = "<a href='https://docs.unraid.net/' target='_blank'>"._('Docs')."</a>";
|
||||
$html[] = "</div>";
|
||||
$html[] = "</div>";
|
||||
|
||||
$script = ["<script>"];
|
||||
$script[] = "var inkeyfile = '$keyfile';";
|
||||
$script[] = "var unraid_osversion = '{$unraid['version']}';";
|
||||
$script[] = "var unraid_timestamp = ".time().";";
|
||||
$script[] = "var inpageurl = window.top.location.href;";
|
||||
|
||||
$script[] = "function featurerequest_reset() {";
|
||||
$script[] = " \$('#featureDescription').val('');";
|
||||
$script[] = " \$('#featureEmail').val('');";
|
||||
$script[] = "}";
|
||||
|
||||
$script[] = "function bugreport_reset() {";
|
||||
$script[] = " \$('#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\");";
|
||||
$script[] = " \$('#bugEmail').val('');";
|
||||
$script[] = "}";
|
||||
|
||||
$script[] = "function comment_reset() {";
|
||||
$script[] = " \$('#commentDescription').val('');";
|
||||
$script[] = " \$('#commentEmail').val('');";
|
||||
$script[] = "}";
|
||||
|
||||
$script[] = "function form_submit(url, params, panel, diagnostics) {";
|
||||
$script[] = " panel.find('textarea,input').prop('disabled',true);";
|
||||
$script[] = " \$('div.spinner.fixed').show();";
|
||||
$script[] = " if (diagnostics) {";
|
||||
$script[] = " var anonymize = \$('#anonymize').is(':checked') ? '1' : '';";
|
||||
$script[] = " \$.get('/webGui/include/Feedback.php',{getdiagnostics:1,anonymize:anonymize},function(data) {";
|
||||
$script[] = " params.diagnostics = data;";
|
||||
$script[] = " form_submit(url, params, panel);";
|
||||
$script[] = " }).fail(function() {";
|
||||
$script[] = " \$('div.spinner.fixed').hide();";
|
||||
$script[] = " panel.fadeOut('fast').find('textarea,input').prop('disabled', false);";
|
||||
$script[] = " 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>\";";
|
||||
$script[] = " \$('#thanks_panel').html(failure_message).fadeIn('fast');";
|
||||
$script[] = " });";
|
||||
$script[] = " return;";
|
||||
$script[] = " }";
|
||||
$script[] = " params.timestamp = unraid_timestamp;";
|
||||
$script[] = " params.osversion = unraid_osversion;";
|
||||
$script[] = " params.keyfile = inkeyfile;";
|
||||
$script[] = " params.pageurl = inpageurl;";
|
||||
$script[] = " \$.post(url,params,function(data) {";
|
||||
$script[] = " \$('div.spinner.fixed').hide();";
|
||||
$script[] = " if (data.error) {";
|
||||
$script[] = " var failure_message = \"<p class='red-text' style='text-align:center;'>"._('Sorry, an error occurred').". "._('Please try again later').".</p>\";";
|
||||
$script[] = " \$('#thanks_panel').html(failure_message).fadeIn('fast');";
|
||||
$script[] = " } else {";
|
||||
$script[] = " data.message = data.message || '';";
|
||||
$script[] = " var url_parts = url.split('/');";
|
||||
$script[] = " 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>';";
|
||||
$script[] = " \$('#thanks_panel').html(success_message).fadeIn('fast', function() {";
|
||||
$script[] = " var resetfunction = window[url_parts[4]+'_reset'];";
|
||||
$script[] = " if (typeof resetfunction !== 'undefined' && \$.isFunction(resetfunction)) {";
|
||||
$script[] = " resetfunction();";
|
||||
$script[] = " }";
|
||||
$script[] = " });";
|
||||
$script[] = " }";
|
||||
$script[] = " }).fail(function(jqXHR, textStatus, errorThrown) {";
|
||||
$script[] = " if (jqXHR.responseJSON && jqXHR.responseJSON.error) {";
|
||||
$script[] = " errorThrown = jqXHR.responseJSON.error;";
|
||||
$script[] = " }";
|
||||
$script[] = " var failure_message = \"<p class='red-text' style='text-align:center;'>"._('Sorry, an error occurred').". "._('Please try again later').".</p>\";";
|
||||
$script[] = " \$('#thanks_panel').html(failure_message).fadeIn('fast');";
|
||||
$script[] = " }).always(function() {";
|
||||
$script[] = " \$('#spinner_image').fadeOut('fast');";
|
||||
$script[] = " panel.fadeOut('fast').find('textarea,input').prop('disabled', false);";
|
||||
$script[] = " });";
|
||||
$script[] = "}";
|
||||
|
||||
$script[] = "\$(function() {";
|
||||
$script[] = " \$('#control_panel input[type=radio]').click(function() {";
|
||||
$script[] = " var showPanel = '#'+\$('#control_panel input[type=radio]:checked').val()+'_panel';";
|
||||
$script[] = " $('.allpanels').not(showPanel).fadeOut('fast');";
|
||||
$script[] = " var loadfunction = window[\$('#control_panel input[type=radio]:checked').val()+'_load'];";
|
||||
$script[] = " if (typeof loadfunction !== 'undefined' && \$.isFunction(loadfunction)) {";
|
||||
$script[] = " loadfunction();";
|
||||
$script[] = " } else {";
|
||||
$script[] = " \$(showPanel).fadeIn('fast');";
|
||||
$script[] = " }";
|
||||
$script[] = " });";
|
||||
$script[] = " \$('#featureSubmit').click(function featureSubmitClick(){";
|
||||
$script[] = " if (\$('#featureDescription').val() === '') return;";
|
||||
$script[] = " form_submit('https://keys.lime-technology.com/feedback/featurerequest',{description:\$('#featureDescription').val(),email:\$('#featureEmail').val()},\$('#featurerequest_panel'));";
|
||||
$script[] = " });";
|
||||
$script[] = " \$('#bugSubmit').click(function bugSubmitClick(){";
|
||||
$script[] = " if (\$('#bugDescription').val() === '') return;";
|
||||
$script[] = " form_submit('https://keys.lime-technology.com/feedback/bugreport',{description:\$('#bugDescription').val(),email:\$('#bugEmail').val()},\$('#bugreport_panel'),true);";
|
||||
$script[] = " });";
|
||||
$script[] = " \$('#commentSubmit').click(function commentSubmitClick(){";
|
||||
$script[] = " if (\$('#commentDescription').val() === '') return;";
|
||||
$script[] = " form_submit('https://keys.lime-technology.com/feedback/comment',{description:\$('#commentDescription').val(),email:\$('#commentEmail').val()},\$('#comment_panel'));";
|
||||
$script[] = " });";
|
||||
$script[] = " featurerequest_reset();";
|
||||
$script[] = " bugreport_reset();";
|
||||
$script[] = " comment_reset();";
|
||||
$script[] = " \$('#optFeatureRequest').click();";
|
||||
$script[] = "});";
|
||||
$script[] = "</script>";
|
||||
|
||||
echo implode($style),implode($html),implode($script);
|
||||
$var = parse_ini_file('state/var.ini');
|
||||
$unraid = parse_ini_file('/etc/unraid-version');
|
||||
$keyfile = !empty(_var($var, 'regFILE')) ? trim(base64_encode(@file_get_contents($var['regFILE']))) : '';
|
||||
$width = in_array($display['theme'], ['azure', 'gray']) ? '98.4%' : '100%';
|
||||
?>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<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; }
|
||||
input.submit[type=email] { margin-top: 10px; float: left; }
|
||||
p.note, label.note { font-size: 1.1rem !important; display: block; }
|
||||
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="optComment"><input type="radio" name="mode" id="optComment" value="comment"/> <?php echo _('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>
|
||||
<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'); ?>"/>
|
||||
</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"><input type="checkbox" id="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>
|
||||
</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>
|
||||
<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'); ?>"/>
|
||||
</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>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
var inkeyfile = '<?php echo $keyfile; ?>' ?? '';
|
||||
var unraid_osversion = '<?php echo $unraid['version']; ?>';
|
||||
var unraid_timestamp = <?php echo time(); ?>;
|
||||
var inpageurl = window.top.location.href;
|
||||
|
||||
function featurerequest_reset() {
|
||||
$('#featureDescription').val('');
|
||||
$('#featureEmail').val('');
|
||||
}
|
||||
|
||||
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");
|
||||
$('#bugEmail').val('');
|
||||
}
|
||||
|
||||
function comment_reset() {
|
||||
$('#commentDescription').val('');
|
||||
$('#commentEmail').val('');
|
||||
}
|
||||
|
||||
function form_submit(url, params, panel, diagnostics) {
|
||||
panel.find('textarea,input').prop('disabled', true);
|
||||
$('div.spinner.fixed').show();
|
||||
if (diagnostics) {
|
||||
var anonymize = $('#anonymize').is(':checked') ? '1' : '';
|
||||
$.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>";
|
||||
$('#thanks_panel').html(failure_message).fadeIn('fast');
|
||||
});
|
||||
return;
|
||||
}
|
||||
params.timestamp = unraid_timestamp;
|
||||
params.osversion = unraid_osversion;
|
||||
params.keyfile = inkeyfile;
|
||||
params.pageurl = inpageurl;
|
||||
$.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>";
|
||||
$('#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>';
|
||||
$('#thanks_panel').html(success_message).fadeIn('fast', function() {
|
||||
var resetfunction = window[url_parts[4] + '_reset'];
|
||||
if (typeof resetfunction !== 'undefined' && $.isFunction(resetfunction)) {
|
||||
resetfunction();
|
||||
}
|
||||
});
|
||||
}
|
||||
}).fail(function(jqXHR, textStatus, errorThrown) {
|
||||
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>";
|
||||
$('#thanks_panel').html(failure_message).fadeIn('fast');
|
||||
}).always(function() {
|
||||
$('#spinner_image').fadeOut('fast');
|
||||
panel.fadeOut('fast').find('textarea,input').prop('disabled', false);
|
||||
});
|
||||
}
|
||||
|
||||
$(function() {
|
||||
$('#control_panel input[type=radio]').click(function() {
|
||||
var showPanel = '#' + $('#control_panel input[type=radio]:checked').val() + '_panel';
|
||||
$('.allpanels').not(showPanel).fadeOut('fast');
|
||||
var loadfunction = window[$('#control_panel input[type=radio]:checked').val() + '_load'];
|
||||
if (typeof loadfunction !== 'undefined' && $.isFunction(loadfunction)) {
|
||||
loadfunction();
|
||||
} else {
|
||||
$(showPanel).fadeIn('fast');
|
||||
}
|
||||
});
|
||||
|
||||
$('#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'));
|
||||
});
|
||||
|
||||
$('#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);
|
||||
});
|
||||
|
||||
$('#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'));
|
||||
});
|
||||
|
||||
featurerequest_reset();
|
||||
bugreport_reset();
|
||||
comment_reset();
|
||||
$('#optFeatureRequest').click();
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user