Skip to content

Commit

Permalink
Give better error messages on mautic installation fail
Browse files Browse the repository at this point in the history 
fixes #47
Also: improve UI and form error checking
  • Loading branch information
@pjrobertson
pjrobertson authored and Patrick Robertson committed Jan 19, 2019
1 parent 2974e6d commit 7f304b8
Show file tree
Hide file tree
Showing 3 changed files with 166 additions and 132 deletions.
2 changes: 1 addition & 1 deletion index.php
100755 → 100644
View file
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@
$data->valid = boolval($whitelabeler->templateVersions($version));
$data->version = $version;
} else {
$data->version = false;
$data->valid = false;
}
echo json_encode($data);
exit();
Expand Down
294 changes: 164 additions & 130 deletions lib/whitelabeler.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -59,18 +59,7 @@ $("input.mautic_hover").on('move.spectrum change.spectrum', function(e, tinycolo
|--------------------------------------------------------------------------
*/
$('body').on('change', 'input#mautic-path', function() {
var element = $(this);
$('small.path-fail, small.path-success').hide();
$.get( window.location.href, { q: 'version', path: $('input#mautic-path').val() }, function(data) {
if ( data == 0 ) {
validPath = false;
$(element).parent('div').children('small.path-fail').fadeIn();
} else {
$('span.version').text(data);
validPath = true;
$(element).parent('div').children('small.path-success').fadeIn();
}
});
checkMauticVersion();
});

/*
Expand Down Expand Up @@ -103,17 +92,8 @@ $(document).ready(function(){
$('input#mautic-hover').val(mautic_hover);
$('#waiting-for-input span.dots').addClass('blink');
$('input#mautic-url').val(window.location.href);

$.get( window.location.href, { q: 'version', path: $('input#mautic-path').val() }, function(data) {
if (data == 0) {
$('input#mautic-path').parent('div').children('small.path-fail').fadeIn();
validPath = false;
} else {
$('span.version').text(data);
validPath = true;
$('input#mautic-path').parent('div').children('small.path-success').fadeIn();
}
});

checkMauticVersion();
$.get( window.location.href, { q: 'url', url: encodeURIComponent($('input#mautic-url').val()) }, function(data) {
if (data == 1) {
validDomain = true;
Expand Down Expand Up @@ -184,7 +164,11 @@ $("input#sidebar-logo-file, input#login-logo-file, input#favicon").change(functi
|--------------------------------------------------------------------------
*/
$('body').on('keyup change', 'input#logo-sidebar-width', function(){
$('img#mautic-logo').css('width', $(this).val()+'px');
if (this.checkValidity()) {
$('img#mautic-logo').css('width', $(this).val()+'px');
} else {
this.reportValidity();
}
});

/*
Expand Down Expand Up @@ -218,6 +202,48 @@ function clearConsole() {
$('div#console p').css('display', 'none');
}

/*
|--------------------------------------------------------------------------
| Checks mautic install version
|--------------------------------------------------------------------------
*/
function getMauticVersionIsValid(path, callback) {
if (!path) {
path = $('input#mautic-path').val();
}
$.get( window.location.href, { q: 'version', path: path }, function(data) {
data = JSON.parse(data);
callback(data);
});
}

/*
|--------------------------------------------------------------------------
| Checks mautic install version and updates UI
|--------------------------------------------------------------------------
*/
function checkMauticVersion() {
var $element = $('input#mautic-path');
$('small.path-fail, small.path-success').hide();
getMauticVersionIsValid(null, function(data) {
if (!data.valid) {
validPath = false;
var $errorElement = $element.parent('div').children('small.path-fail');
if (data.version) {
// a mautic installation was found, but the version is not compatible with mautic-whitelabeler
$errorElement.text("A Mautic installation was found, but its version (" + data.version + ") is incompatible with mautic whitelabeler.")
} else {
$errorElement.text("Mautic installation not found here.");
}
$errorElement.fadeIn();
} else {
$('span.version').text(data.version);
validPath = true;
$element.parent('div').children('small.path-success').fadeIn();
}
});
}

/*
|--------------------------------------------------------------------------
| Run whitelabel functions
Expand All @@ -233,9 +259,10 @@ function whiteLabel() {
$('#waiting-for-input-success').fadeIn();
// Find Mautic installation
$('#looking-for-installation').fadeIn();
$.get( window.location.href, { q: 'version', path: path }, function(versionData){
// version data success
if (versionData != 0) {
getMauticVersionIsValid(path, function(data) {
if (data.valid) {
var versionData = data.version;
// version data success
$("#console").animate({ scrollTop: $('#console').prop("scrollHeight")}, 500);
$('#looking-for-installation-success').fadeIn();
// css stuff
Expand All @@ -249,118 +276,118 @@ function whiteLabel() {
mautic_primary: mautic_primary,
mautic_hover: mautic_hover
}, function(cssData) {
if(cssData) {
// css data success
if(cssData=='CSS files updated with new colors.') {
console.log(cssData);
$("#console").animate({ scrollTop: $('#console').prop("scrollHeight")}, 500);
$('#updating-css span.dots').removeClass('blink');
$('#updating-css-success').fadeIn();
// update company name
$('#updating-companyname').fadeIn();
$('#updating-companyname span.dots').addClass('blink');
$.post(window.location.href+'?q=companyname', {
path: path,
version:versionData,
company_name: $('input#company-name').val()
}, function(companyNameData) {
// Success
if (companyNameData == 'Updated company name.') {
$("#console").animate({ scrollTop: $('#console').prop("scrollHeight")}, 500);
$('#updating-companyname span.dots').removeClass('blink');
$('#updating-companyname-success').fadeIn();
// Update logos
$('#updating-images').fadeIn();
$('#updating-images span.dots').addClass('blink');
data = new FormData();
data.append('mautic_path', path);
data.append('mautic_url', $('#mautic-url').val());
data.append('version', versionData);
data.append('sidebar_logo', $('#sidebar-logo-file')[0].files[0]);
data.append('sidebar_logo_width', $('#logo-sidebar-width').val());
data.append('sidebar_margin_top', $('#sidebar-margin-top').val());
data.append('sidebar_margin_right', $('#sidebar-margin-right').val());
data.append('sidebar_margin_left', $('#sidebar-margin-left').val());
data.append('login_logo', $('#login-logo-file')[0].files[0]);
data.append('login_logo_width', $('#logo-login-width').val());
data.append('login_margin_top', $('#login-margin-top').val());
data.append('login_margin_bottom', $('#login-margin-bottom').val());
data.append('favicon', $('input#favicon')[0].files[0]);
$.ajax({
url: window.location.href+'?q=logos',
type: 'POST',
data: data,
cache: false,
contentType: false,
processData: false,
xhr: function() {
var myXhr = $.ajaxSettings.xhr();
if (myXhr.upload) {
myXhr.upload.addEventListener('progress', function(e) {
if (e.lengthComputable) {
console.log(e.loaded / e.total);
}
}, false);
}
return myXhr;
},
success: function(imageData) {
$('#updating-images span.dots').removeClass('blink');
$('#updating-images-success').fadeIn();
$("#console").animate({ scrollTop: $('#console').prop("scrollHeight")}, 500);
console.log(imageData);
// Regenerate Muatic Assets
$('#regenerating').fadeIn();
$('#regenerating span.dots').addClass('blink');
$.get(window.location.href, { q: "assets", assets: "regenerate", path: path } )
.done(function(assetsData) {
$('#regenerating span.dots').removeClass('blink');
$('#regenerating-success').fadeIn();
$("#console").animate({ scrollTop: $('#console').prop("scrollHeight")}, 500);
console.log(assetsData);
// Clearing Cache
$('#clearing span.dots').addClass('blink');
$('#clearing').fadeIn();
$.get(window.location.href, { q: "assets", assets: "clear", path: path } )
if(cssData) {
// css data success
if(cssData=='CSS files updated with new colors.') {
console.log(cssData);
$("#console").animate({ scrollTop: $('#console').prop("scrollHeight")}, 500);
$('#updating-css span.dots').removeClass('blink');
$('#updating-css-success').fadeIn();
// update company name
$('#updating-companyname').fadeIn();
$('#updating-companyname span.dots').addClass('blink');
$.post(window.location.href+'?q=companyname', {
path: path,
version:versionData,
company_name: $('input#company-name').val()
}, function(companyNameData) {
// Success
if (companyNameData == 'Updated company name.') {
$("#console").animate({ scrollTop: $('#console').prop("scrollHeight")}, 500);
$('#updating-companyname span.dots').removeClass('blink');
$('#updating-companyname-success').fadeIn();
// Update logos
$('#updating-images').fadeIn();
$('#updating-images span.dots').addClass('blink');
data = new FormData();
data.append('mautic_path', path);
data.append('mautic_url', $('#mautic-url').val());
data.append('version', versionData);
data.append('sidebar_logo', $('#sidebar-logo-file')[0].files[0]);
data.append('sidebar_logo_width', $('#logo-sidebar-width').val());
data.append('sidebar_margin_top', $('#sidebar-margin-top').val());
data.append('sidebar_margin_right', $('#sidebar-margin-right').val());
data.append('sidebar_margin_left', $('#sidebar-margin-left').val());
data.append('login_logo', $('#login-logo-file')[0].files[0]);
data.append('login_logo_width', $('#logo-login-width').val());
data.append('login_margin_top', $('#login-margin-top').val());
data.append('login_margin_bottom', $('#login-margin-bottom').val());
data.append('favicon', $('input#favicon')[0].files[0]);
$.ajax({
url: window.location.href+'?q=logos',
type: 'POST',
data: data,
cache: false,
contentType: false,
processData: false,
xhr: function() {
var myXhr = $.ajaxSettings.xhr();
if (myXhr.upload) {
myXhr.upload.addEventListener('progress', function(e) {
if (e.lengthComputable) {
console.log(e.loaded / e.total);
}
}, false);
}
return myXhr;
},
success: function(imageData) {
$('#updating-images span.dots').removeClass('blink');
$('#updating-images-success').fadeIn();
$("#console").animate({ scrollTop: $('#console').prop("scrollHeight")}, 500);
console.log(imageData);
// Regenerate Muatic Assets
$('#regenerating').fadeIn();
$('#regenerating span.dots').addClass('blink');
$.get(window.location.href, { q: "assets", assets: "regenerate", path: path } )
.done(function(assetsData) {
$('#clearing span.dots').removeClass('blink');
$('#clearing-success').fadeIn();
$('#regenerating span.dots').removeClass('blink');
$('#regenerating-success').fadeIn();
$("#console").animate({ scrollTop: $('#console').prop("scrollHeight")}, 500);
console.log(assetsData);
// Complete!
$('#complete').fadeIn();
$("#console").animate({ scrollTop: $('#console').prop("scrollHeight")}, 500);
$('.spinner').fadeOut();
// Clearing Cache
$('#clearing span.dots').addClass('blink');
$('#clearing').fadeIn();
$.get(window.location.href, { q: "assets", assets: "clear", path: path } )
.done(function(assetsData) {
$('#clearing span.dots').removeClass('blink');
$('#clearing-success').fadeIn();
$("#console").animate({ scrollTop: $('#console').prop("scrollHeight")}, 500);
console.log(assetsData);
// Complete!
$('#complete').fadeIn();
$("#console").animate({ scrollTop: $('#console').prop("scrollHeight")}, 500);
$('.spinner').fadeOut();
});
});
});
}
});
// Error
} else {
$('#updating-companyname-error').append(': '+companyNameData).fadeIn();
$('.spinner').fadeOut();
}
}); // post company name data
}
});
// Error
} else {
$('#updating-companyname-error').append(': '+companyNameData).fadeIn();
$('.spinner').fadeOut();
}
}); // post company name data

// css data error
} else if ( cssData == 'Unable to find app.css in your Mautic installation.' ||
cssData == 'Unable to find libraries.css in your Mautic installation.' ) {
$('#updating-css-error').append(': '+cssData).fadeIn();
$('.spinner').fadeOut();
}
// css data error
} else if ( cssData == 'Unable to find app.css in your Mautic installation.' ||
cssData == 'Unable to find libraries.css in your Mautic installation.' ) {
$('#updating-css-error').append(': '+cssData).fadeIn();
} else {
$('#updating-css-error').fadeIn();
$('.spinner').fadeOut();
}
// css data error
} else {
$('#updating-css-error').fadeIn();
$('.spinner').fadeOut();
}
}); // post css data
}); // post css data

} else {
// Error finding Installation
$('#looking-for-installation-error').fadeIn();
$('.spinner').fadeOut();
}
}); // get version data
} else {
// Error finding Installation
$('#looking-for-installation-error').fadeIn();
$('.spinner').fadeOut();
} // check version data
});
}

// Event handler for "start whitelabeling" button
Expand All @@ -387,6 +414,13 @@ $('button').click(function(e){
alert('You have to choose a login logo image.');
return false;
}
if (!$("#options-form")[0].checkValidity()) {
$("#options-form input").each(function() {
this.reportValidity();
});
return false;
}
$('.spinner').fadeIn();
whiteLabel();
});

2 changes: 1 addition & 1 deletion view.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -37,7 +37,7 @@
</div><!--row-->
<div class="row">
<div class="col-md-12">
<form method="post" enctype="multipart/form-data">
<form id="options-form" method="post" enctype="multipart/form-data">
<div id="basic">
<div class="form-group">
<label for="mautic-path">Where is Mautic installed?</label><br/>
Expand Down

0 comments on commit 7f304b8

Please sign in to comment.