diff --git a/ui/App/components/Mods/ModLoadSave.jsx b/ui/App/components/Mods/ModLoadSave.jsx
index 3893ae4..5eac8e8 100644
--- a/ui/App/components/Mods/ModLoadSave.jsx
+++ b/ui/App/components/Mods/ModLoadSave.jsx
@@ -81,7 +81,6 @@ class ModLoadSave extends React.Component {
html: table,
type: 'question',
showCancelButton: true,
- closeOnConfirm: false,
confirmButtonText: "Download Mods!",
showLoaderOnConfirm: true,
preConfirm: this.loadModsSwalHandler
diff --git a/ui/App/components/Mods/packs/ModPackOverview.jsx b/ui/App/components/Mods/packs/ModPackOverview.jsx
index 2af4be9..1f6c652 100644
--- a/ui/App/components/Mods/packs/ModPackOverview.jsx
+++ b/ui/App/components/Mods/packs/ModPackOverview.jsx
@@ -4,6 +4,7 @@ import NativeListener from 'react-native-listener';
import {instanceOfModsContent} from "../ModsPropTypes.js";
import locks from "locks";
import PropTypes from "prop-types";
+import {ReactSwalNormal, ReactSwalDanger} from './../../../../js/customSwal';
class ModPackOverview extends React.Component {
constructor(props) {
@@ -45,62 +46,69 @@ class ModPackOverview extends React.Component {
}
createModPack() {
- swal({
+ ReactSwalNormal.fire({
title: "Create modpack",
- text: "Please enter an unique modpack name:",
- type: "input",
+ html: "Please enter an unique modpack name:",
+ input: "text",
showCancelButton: true,
- closeOnConfirm: false,
inputPlaceholder: "Modpack name",
- showLoaderOnConfirm: true
- },
- (inputValue) => {
- if (inputValue === false) return false;
+ inputAttributes: {
+ required: "required"
+ },
+ inputValidator: (value) => {
+ return new Promise(resolve => {
+ if(value) {
+ resolve();
+ } else {
+ resolve("You need to enter a name");
+ }
+ });
+ },
+ showLoaderOnConfirm: true,
+ preConfirm: (inputValue) => {
+ // console.log(this);
- if (inputValue === "") {
- swal.showInputError("A modpack needs a name!");
- return false
+ $.ajax({
+ url: "/api/mods/packs/create",
+ method: "POST",
+ data: {name: inputValue},
+ dataType: "JSON",
+ success: (data) => {
+ this.mutex.lock(() => {
+ let packList = this.state.listPacks;
+
+ data.data.mod_packs.forEach((v, k) => {
+ if(v.name == inputValue) {
+ packList.push(data.data.mod_packs[k]);
+ return false;
+ }
+ });
+
+ this.setState({
+ listPacks: packList
+ });
+
+ ReactSwalNormal.fire({
+ title: "modpack created successfully",
+ type: "success"
+ });
+
+ this.mutex.unlock();
+ });
+ },
+ error: (jqXHR, status, err) => {
+ console.log('api/mods/packs/create', status, err.toString());
+
+ let jsonResponse = jqXHR.responseJSON;
+
+ ReactSwalNormal.fire({
+ title: "Error on creating modpack",
+ text: jsonResponse.data,
+ type: "error"
+ });
+ }
+ });
}
-
- $.ajax({
- url: "/api/mods/packs/create",
- method: "POST",
- data: {name: inputValue},
- dataType: "JSON",
- success: (data) => {
- this.mutex.lock(() => {
- let packList = this.state.listPacks;
-
- data.data.mod_packs.forEach((v, k) => {
- if(v.name == inputValue) {
- packList.push(data.data.mod_packs[k]);
- return false;
- }
- });
-
- this.setState({
- listPacks: packList
- });
-
- swal({
- title: "modpack created successfully",
- type: "success"
- });
-
- this.mutex.unlock();
- });
- },
- error: (jqXHR, status, err) => {
- console.log('api/mods/packs/create', status, err.toString());
-
- let jsonResponse = jqXHR.responseJSON;
- swal({
- title: "Error on creating modpack",
- text: jsonResponse.data,
- type: "error"
- });
- }
- });
});
}
@@ -109,57 +117,56 @@ class ModPackOverview extends React.Component {
let name = $(e.target).parent().prev().html();
- swal({
+ ReactSwalDanger.fire({
title: "Are you sure?",
- text: "You really want to delete this modpack?\nThere is no turning back, the modpack will be deleted forever (a very long time)!",
- type: "info",
+ html: You really want to delete this modpack?
There is no turning back, the modpack will be deleted forever (a very long time)!
,
+ type: "question",
showCancelButton: true,
- closeOnConfirm: false,
- showLoaderOnConfirm: true
- },
- () => {
- $.ajax({
- url: "/api/mods/packs/delete",
- method: "POST",
- data: {name: name},
- dataType: "JSON",
- success: (data) => {
- if(data.success) {
- this.mutex.lock(() => {
- let modPacks = this.state.listPacks;
+ showLoaderOnConfirm: true,
+ preConfirm: () => {
+ $.ajax({
+ url: "/api/mods/packs/delete",
+ method: "POST",
+ data: {name: name},
+ dataType: "JSON",
+ success: (data) => {
+ if(data.success) {
+ this.mutex.lock(() => {
+ let modPacks = this.state.listPacks;
- modPacks.forEach((v, k) => {
- if(v.name == name) {
- delete modPacks[k];
- }
+ modPacks.forEach((v, k) => {
+ if(v.name == name) {
+ delete modPacks[k];
+ }
+ });
+
+ this.setState({
+ listPacks: modPacks
+ });
+
+ ReactSwalNormal.fire({
+ title: "Modpack deleted successfully",
+ type: "success"
+ });
+
+ this.mutex.unlock();
});
+ }
+ },
+ error: (jqXHR, status, err) => {
+ console.log('api/mods/packs/delete', status, err.toString());
- this.setState({
- listPacks: modPacks
- });
+ let jsonResponse = jqXHR.responseJSON || err.toString();
+ jsonResponse = jsonResponse.data || err.toString();
- swal({
- title: "Modpack deleted successfully",
- type: "success"
- });
-
- this.mutex.unlock();
+ ReactSwalNormal.fire({
+ title: "Error on creating modpack",
+ text: jsonResponse,
+ type: "error"
});
}
- },
- error: (jqXHR, status, err) => {
- console.log('api/mods/packs/delete', status, err.toString());
-
- let jsonResponse = jqXHR.responseJSON || err.toString();
- jsonResponse = jsonResponse.data || err.toString();
-
- swal({
- title: "Error on creating modpack",
- text: jsonResponse,
- type: "error"
- });
- }
- })
+ })
+ }
});
}
@@ -168,44 +175,42 @@ class ModPackOverview extends React.Component {
let name = $(e.target).parent().prev().html();
- swal({
+ ReactSwalDanger.fire({
title: "Are you sure?",
text: "This operation will replace the current installed mods with the mods out of the selected ModPack!",
- type: "info",
+ type: "question",
showCancelButton: true,
- closeOnConfirm: false,
- showLoaderOnConfirm: true
- },
- () => {
- console.log("inside swal:", this);
- $.ajax({
- url: "/api/mods/packs/load",
- method: "POST",
- data: {name: name},
- dataType: "JSON",
- success: (data) => {
- swal({
- title: "ModPack loaded!",
- type: "success"
- });
+ showLoaderOnConfirm: true,
+ preConfirm: () => {
+ $.ajax({
+ url: "/api/mods/packs/load",
+ method: "POST",
+ data: {name: name},
+ dataType: "JSON",
+ success: (data) => {
+ ReactSwalNormal.fire({
+ title: "ModPack loaded!",
+ type: "success"
+ });
- this.props.modContentClass.setState({
- installedMods: data.data.mods
- });
- },
- error: (jqXHR, status, err) => {
- console.log('api/mods/packs/load', status, err.toString());
+ this.props.modContentClass.setState({
+ installedMods: data.data.mods
+ });
+ },
+ error: (jqXHR, status, err) => {
+ console.log('api/mods/packs/load', status, err.toString());
- let jsonResponse = jqXHR.responseJSON || err.toString();
- jsonResponse = jsonResponse.data || err.toString();
+ let jsonResponse = jqXHR.responseJSON || err.toString();
+ jsonResponse = jsonResponse.data || err.toString();
- swal({
- title: "Error on loading ModPack",
- text: jsonResponse,
- type: "error"
- });
- }
- })
+ ReactSwalNormal.fire({
+ title: "Error on loading ModPack",
+ text: jsonResponse,
+ type: "error"
+ });
+ }
+ })
+ }
});
}
@@ -218,7 +223,11 @@ class ModPackOverview extends React.Component {
if(updatesInProgress) {
- swal("Toggle mod failed", "Can't toggle the mod, when an update is still in progress", "error");
+ ReactSwalNormal.fir({
+ title: "Toggle mod failed",
+ text: "Can't toggle the mod, when an update is still in progress",
+ type: "error"
+ });
return false;
}
@@ -239,7 +248,6 @@ class ModPackOverview extends React.Component {
if(data.success) {
this.mutex.lock(() => {
let packList = this.state.listPacks;
- console.log(this);
packList.forEach((modPack, modPackKey) => {
if(modPack.name == modPackName) {
@@ -262,7 +270,7 @@ class ModPackOverview extends React.Component {
},
error: (jqXHR, status, err) => {
console.log('api/mods/packs/mod/toggle', status, err.toString());
- swal({
+ ReactSwalNormal.fire({
title: "Toggle Mod went wrong",
text: err.toString(),
type: "error"
@@ -275,7 +283,11 @@ class ModPackOverview extends React.Component {
e.preventDefault();
if(updatesInProgress) {
- swal("Delete failed", "Can't delete the mod, when an update is still in progress", "error");
+ ReactSwalNormal.fire({
+ title: "Delete failed",
+ text: "Can't delete the mod, when an update is still in progress",
+ type: "error"
+ });
return false;
}
@@ -284,60 +296,62 @@ class ModPackOverview extends React.Component {
let modName = $row.data("mod-name");
let modPackName = $row.parents(".single-modpack").find("h3").html();
- swal({
+ ReactSwalDanger.fire({
title: "Delete Mod?",
text: "This will delete the mod forever",
- type: "info",
+ type: "question",
showCancelButton: true,
- closeOnConfirm: false,
confirmButtonText: "Delete it!",
cancelButtonText: "Close",
showLoaderOnConfirm: true,
- confirmButtonColor: "#DD6B55",
- }, () => {
- $.ajax({
- url: "/api/mods/packs/mod/delete",
- method: "POST",
- data: {
- modName: modName,
- modPackName: modPackName
- },
- dataType: "JSON",
- success: (data) => {
- if(data.success) {
- this.mutex.lock(() => {
- swal("Delete of mod " + modName + " inside modPack " + modPackName + " successful", "", "success");
+ preConfirm: () => {
+ $.ajax({
+ url: "/api/mods/packs/mod/delete",
+ method: "POST",
+ data: {
+ modName: modName,
+ modPackName: modPackName
+ },
+ dataType: "JSON",
+ success: (data) => {
+ if(data.success) {
+ this.mutex.lock(() => {
+ ReactSwalNormal.fire({
+ title: Delete of mod {modName} inside modPack {modPackName} successful
,
+ type: "success"
+ })
- let packList = this.state.listPacks;
+ let packList = this.state.listPacks;
- packList.forEach((modPack, modPackKey) => {
- if(modPack.name == modPackName) {
- packList[modPackKey].mods.mods.forEach((mod, modKey) => {
- if(mod.name == modName) {
- delete packList[modPackKey].mods.mods[modKey];
- return false;
- }
- });
- }
+ packList.forEach((modPack, modPackKey) => {
+ if(modPack.name == modPackName) {
+ packList[modPackKey].mods.mods.forEach((mod, modKey) => {
+ if(mod.name == modName) {
+ delete packList[modPackKey].mods.mods[modKey];
+ return false;
+ }
+ });
+ }
+ });
+
+ this.setState({
+ listPacks: packList
+ });
+
+ this.mutex.unlock();
});
-
- this.setState({
- listPacks: packList
- });
-
- this.mutex.unlock();
+ }
+ },
+ error: (jqXHR, status, err) => {
+ console.log('api/mods/packs/mod/delete', status, err.toString());
+ ReactSwalNormal.fire({
+ title: "Delete Mod went wrong",
+ text: jqXHR.responseJSON.data,
+ type: "error"
});
}
- },
- error: (jqXHR, status, err) => {
- console.log('api/mods/packs/mod/delete', status, err.toString());
- swal({
- title: "Delete Mod went wrong",
- text: jqXHR.responseJSON.data,
- type: "error"
- });
- }
- });
+ });
+ }
});
}
@@ -345,10 +359,10 @@ class ModPackOverview extends React.Component {
e.preventDefault();
if(!this.props.modContentClass.state.loggedIn) {
- swal({
- type: "error",
+ ReactSwalNormal.fire({
title: "Update failed",
- text: "please login into Factorio to update mod"
+ text: "please login into Factorio to update mod",
+ type: "error",
});
let $addModBox = $('#add-mod-box');
@@ -405,7 +419,7 @@ class ModPackOverview extends React.Component {
error: (jqXHR, status, err) => {
console.log('api/mods/packs/mod/update', status, err.toString());
toggleUpdateStatus();
- swal({
+ ReactSwalNormal.fire({
title: "Update Mod went wrong",
text: jqXHR.responseJSON.data,
type: "error"
@@ -415,10 +429,6 @@ class ModPackOverview extends React.Component {
}
}
- test() {
- console.log("test called");
- }
-
render() {
let classes = "box-body" + " " + this.props.className;
let ids = this.props.id;
diff --git a/ui/App/components/ModsContent.jsx b/ui/App/components/ModsContent.jsx
index 75ae8f2..4f8e3f9 100644
--- a/ui/App/components/ModsContent.jsx
+++ b/ui/App/components/ModsContent.jsx
@@ -340,7 +340,6 @@ class ModsContent extends React.Component {
text: "This will delete the mod and can break the save file",
type: "question",
showCancelButton: true,
- closeOnConfirm: false,
confirmButtonText: "Delete it!",
showLoaderOnConfirm: true,
preConfirm: () => {
@@ -396,7 +395,6 @@ class ModsContent extends React.Component {
html: This will delete ALL mods and can't be redone!
Are you sure?
,
type: "question",
showCancelButton: true,
- closeOnConfirm: false,
confirmButtonText: "Yes, Delete ALL!",
showLoaderOnConfirm: true,
preConfirm: () => {
diff --git a/ui/index.js b/ui/index.js
index ea9f278..0919cca 100644
--- a/ui/index.js
+++ b/ui/index.js
@@ -10,8 +10,8 @@ require('bootstrap-fileinput/themes/fas/theme');
*/
$('body').on("show.bs.collapse hide.bs.collapse", (e) => {
let $target = $(e.target);
- let $box = $target.parents(".box");
- let $fontAwesome = $box.find(".box-header").find("i");
+ let $box = $target.parent(".box");
+ let $fontAwesome = $box.children(".box-header").children("i");
if(e.type == "show") {
$fontAwesome.removeClass("fa-plus").addClass("fa-minus");
diff --git a/ui/index.scss b/ui/index.scss
index 2d157a3..39ed15e 100644
--- a/ui/index.scss
+++ b/ui/index.scss
@@ -15,6 +15,7 @@
* Customizations
*/
@import "scss/customizations/buttons";
+@import "scss/customizations/form";
@import "scss/customizations/badges";
@import "scss/customizations/adminLTE3-box";
@import "scss/customizations/sidebar";
diff --git a/ui/scss/customizations/form.scss b/ui/scss/customizations/form.scss
new file mode 100644
index 0000000..3f48d4f
--- /dev/null
+++ b/ui/scss/customizations/form.scss
@@ -0,0 +1,3 @@
+input.form-control {
+ border-radius: 0;
+}
\ No newline at end of file
diff --git a/ui/scss/customizations/sweetalert.scss b/ui/scss/customizations/sweetalert.scss
index 8a58cc4..d4479ec 100644
--- a/ui/scss/customizations/sweetalert.scss
+++ b/ui/scss/customizations/sweetalert.scss
@@ -14,6 +14,13 @@
text-align: center;
display: flex;
justify-content: center;
+ flex-direction: column;
+
+ .swal2-input {
+ @extend .form-control;
+ height: 2.625em;
+ padding: 0.75em;
+ }
}
.swal2-actions.swal2-loading {