Merge pull request #147 from simple-login/replace-notie

Replace notie by bootbox
This commit is contained in:
Son Nguyen Kim 2020-04-30 23:08:58 +02:00 committed by GitHub
commit 061e5aec4e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
13 changed files with 192 additions and 121 deletions

View File

@ -84,7 +84,7 @@
<form method="post">
<input type="hidden" name="form-name" value="delete">
<input type="hidden" name="contact-id" value="{{ contact.id }}">
<span class="card-link btn btn-link float-right delete-forward-email">
<span class="card-link btn btn-link float-right delete-forward-email text-danger">
Delete
</span>
</form>
@ -101,16 +101,28 @@
{% block script %}
<script>
$(".delete-forward-email").on("click", function (e) {
notie.confirm({
text: "Activity history associated with this reverse-alias will be deleted, " +
" please confirm.",
cancelCallback: () => {
// nothing to do
let that = $(this);
bootbox.confirm({
message: "All activities associated with this reverse-alias will also be deleted, please confirm.",
buttons: {
confirm: {
label: 'Yes, delete it',
className: 'btn-danger'
},
cancel: {
label: 'Cancel',
className: 'btn-outline-primary'
}
},
submitCallback: () => {
$(this).closest("form").submit();
callback: function (result) {
if (result) {
that.closest("form").submit();
}
}
});
})
});
</script>
{% endblock %}

View File

@ -104,16 +104,28 @@
{% block script %}
<script>
$(".delete-api-key").on("click", function (e) {
notie.confirm({
text: "If this api key is currently in use, you need to replace it with another api key, " +
" please confirm.",
cancelCallback: () => {
// nothing to do
let that = $(this);
bootbox.confirm({
message: "If this api key is currently in use, you need to replace it with another api key, please confirm.",
buttons: {
confirm: {
label: 'Yes, delete it',
className: 'btn-danger'
},
cancel: {
label: 'Cancel',
className: 'btn-outline-primary'
}
},
submitCallback: () => {
$(this).closest("form").submit();
callback: function (result) {
if (result) {
that.closest("form").submit();
}
}
});
})
});
$(".toggle-api-key").on('click', function (event) {

View File

@ -87,15 +87,26 @@
<script>
$(".cancel").on("click", function (e) {
notie.confirm({
text: `This operation is irreversible, please confirm`,
cancelCallback: () => {
// nothing to do
let that = $(this);
bootbox.confirm({
message: "This operation is irreversible, please confirm.",
buttons: {
confirm: {
label: 'Cancel subscription',
className: 'btn-danger'
},
cancel: {
label: 'Close',
className: 'btn-outline-primary'
}
},
submitCallback: () => {
$(this).closest("form").submit();
callback: function (result) {
if (result) {
that.closest("form").submit();
}
}
});
})
});
</script>

View File

@ -20,7 +20,8 @@
{% endif %}
<div class="alert alert-primary" role="alert">
If you own a domain, let's say <b>example.com</b>, you will be able to create aliases with this domain, for example
If you own a domain, let's say <b>example.com</b>, you will be able to create aliases with this domain, for
example
contact@example.com, help@example.com, etc with SimpleLogin. <br>
You could also enable <b>catch-all</b> feature that allows you to create aliases on-the-fly.
</div>
@ -69,20 +70,3 @@
</div>
{% endblock %}
{% block script %}
<script>
$(".delete-custom-domain").on("click", function (e) {
notie.confirm({
text: "All aliases associated with this domain will be also deleted, " +
" please confirm.",
cancelCallback: () => {
// nothing to do
},
submitCallback: () => {
$(this).closest("form").submit();
}
});
});
</script>
{% endblock %}

View File

@ -107,16 +107,30 @@
<script>
$(".delete-dir").on("click", function (e) {
let directory = $(this).parent().find(".dir-name").val();
notie.confirm({
text: `All aliases associated with <b>${directory}</b> directory will be also deleted, ` +
" please confirm.",
cancelCallback: () => {
// nothing to do
let that = $(this);
let message = `All aliases associated with <b>${directory}</b> directory will also be deleted, ` +
" please confirm.";
bootbox.confirm({
message: message,
buttons: {
confirm: {
label: 'Yes, delete it',
className: 'btn-danger'
},
cancel: {
label: 'Cancel',
className: 'btn-outline-primary'
}
},
submitCallback: () => {
$(this).closest("form").submit();
callback: function (result) {
if (result) {
that.closest("form").submit();
}
}
});
})
});
</script>
{% endblock %}

View File

@ -54,7 +54,7 @@
<hr>
<h3 class="mb-0">Delete Domain</h3>
<div class="small-text mb-3">Please note that this operation is irreversible.
All aliases associated with this domain will be also deleted
All aliases associated with this domain will be also deleted.
</div>
<form method="post">
@ -71,16 +71,27 @@
});
$(".delete-custom-domain").on("click", function (e) {
notie.confirm({
text: "All aliases associated with <b>{{ custom_domain.domain }}</b> will be also deleted, " +
let that = $(this);
bootbox.confirm({
message: "All aliases associated with <b>{{ custom_domain.domain }}</b> will be also deleted, " +
" please confirm.",
cancelCallback: () => {
// nothing to do
buttons: {
confirm: {
label: 'Yes, delete it',
className: 'btn-danger'
},
cancel: {
label: 'Cancel',
className: 'btn-outline-primary'
}
},
submitCallback: () => {
$(this).closest("form").submit();
callback: function (result) {
if (result) {
that.closest("form").submit();
}
}
});
})
});
</script>
{% endblock %}

View File

@ -483,7 +483,6 @@
{% block script %}
<script>
var clipboard = new ClipboardJS('.clipboard');
{% if show_intro %}
// only show intro when screen is big enough to show "developer" tab
@ -494,17 +493,31 @@
$(".delete-email").on("click", function (e) {
let alias = $(this).parent().find(".alias").val();
notie.confirm({
text: `Once <b>${alias}</b> is deleted, people/apps ` +
"who used to contact you via this alias cannot reach you any more," +
" please confirm.",
cancelCallback: () => {
// nothing to do
let message = `Once <b>${alias}</b> is deleted, people/apps ` +
"who used to contact you via this alias cannot reach you any more," +
" please confirm.";
let that = $(this);
bootbox.confirm({
message: message,
buttons: {
confirm: {
label: 'Yes, delete it',
className: 'btn-danger'
},
cancel: {
label: 'Cancel',
className: 'btn-outline-primary'
}
},
submitCallback: () => {
$(this).closest("form").submit();
callback: function (result) {
if (result) {
that.closest("form").submit();
}
}
});
})
});
$(".custom-switch-input").change(async function (e) {

View File

@ -123,16 +123,29 @@
<script>
$(".delete-mailbox").on("click", function (e) {
let mailbox = $(this).parent().find(".mailbox").val();
notie.confirm({
text: `All aliases owned by this mailbox <b>${mailbox}</b> will be also deleted, ` +
" please confirm.",
cancelCallback: () => {
// nothing to do
let that = $(this);
let message = `All aliases owned by this mailbox <b>${mailbox}</b> will be also deleted, ` +
" please confirm.";
bootbox.confirm({
message: message,
buttons: {
confirm: {
label: 'Yes, delete it',
className: 'btn-danger'
},
cancel: {
label: 'Cancel',
className: 'btn-outline-primary'
}
},
submitCallback: () => {
$(this).closest("form").submit();
callback: function (result) {
if (result) {
that.closest("form").submit();
}
}
});
})
});
</script>
{% endblock %}

View File

@ -306,17 +306,29 @@
{% block script %}
<script>
$(".delete-account").on("click", function (e) {
notie.confirm({
text: "All your data including your aliases will be deleted, " +
let that = $(this);
bootbox.confirm({
message: "All your data including your aliases will be deleted, " +
"other people might not be able to reach you after, " +
" please confirm.",
cancelCallback: () => {
// nothing to do
buttons: {
confirm: {
label: 'Yes, delete my account',
className: 'btn-danger'
},
cancel: {
label: 'Cancel',
className: 'btn-outline-primary'
}
},
submitCallback: () => {
$(this).closest("form").submit();
callback: function (result) {
if (result) {
that.closest("form").submit();
}
}
});
})
});
</script>
{% endblock %}

View File

@ -65,28 +65,5 @@
{% endblock %}
{% block script %}
<script>
$(".custom-switch-input").change(function (e) {
// Only ask for confirmation when publishing, not when un-publishing
if (e.target.checked) {
var message = `After this, your app/website will made available in "Discover", please confirm.`;
notie.confirm({
text: message,
cancelCallback: () => {
// reset to the original value
var oldValue = !$(this).prop("checked");
$(this).prop("checked", oldValue);
},
submitCallback: () => {
$(this).closest("form").submit();
}
});
} else {
$(this).closest("form").submit();
}
})
</script>
{% endblock %}

View File

@ -61,6 +61,21 @@
"tslib": "^1.9.3"
}
},
"bootbox": {
"version": "5.4.0",
"resolved": "https://registry.npmjs.org/bootbox/-/bootbox-5.4.0.tgz",
"integrity": "sha512-GCPrDwZpJsUnqzrto3ZURVafypl13+DAyE3YZx5jR5EIoTDSyREPhr77hlCuPKvM6VvXR5Mh/34W3DYMC7JE9g==",
"requires": {
"bootstrap": "^4.4.0",
"jquery": "^3.4.1",
"popper.js": "^1.16.0"
}
},
"bootstrap": {
"version": "4.4.1",
"resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-4.4.1.tgz",
"integrity": "sha512-tbx5cHubwE6e2ZG7nqM3g/FZ5PQEDMWmMGNrCUBVRPHXTJaH7CBDdsLeu3eCh3B1tzAxTnAbtmrzvWEvT2NNEA=="
},
"font-awesome": {
"version": "4.7.0",
"resolved": "https://registry.npmjs.org/font-awesome/-/font-awesome-4.7.0.tgz",
@ -76,10 +91,10 @@
"resolved": "https://registry.npmjs.org/jquery/-/jquery-3.4.1.tgz",
"integrity": "sha512-36+AdBzCL+y6qjw5Tx7HgzeGCzC81MDDgaUP8ld2zhx58HdqXGoBd+tHdrBMiyjGQs0Hxs/MLZTu/eHNJJuWPw=="
},
"notie": {
"version": "4.3.1",
"resolved": "https://registry.npmjs.org/notie/-/notie-4.3.1.tgz",
"integrity": "sha1-DRmd4VEwJC4hZ1UHq6Y8aSngrdo="
"popper.js": {
"version": "1.16.1",
"resolved": "https://registry.npmjs.org/popper.js/-/popper.js-1.16.1.tgz",
"integrity": "sha512-Wb4p1J4zyFTbM+u6WuO4XstYx4Ky9Cewe4DWrel7B0w6VVICvPwdOpotjzcf6eD8TsckVnIMNONQyPIUFOUbCQ=="
},
"qrious": {
"version": "4.0.2",

View File

@ -17,9 +17,9 @@
"homepage": "https://github.com/simple-login/app#readme",
"dependencies": {
"@sentry/browser": "^5.12.0",
"bootbox": "^5.4.0",
"font-awesome": "^4.7.0",
"intro.js": "^2.9.3",
"notie": "^4.3.1",
"qrious": "^4.0.2",
"toastr": "^2.1.4",
"vue": "^2.6.11"

View File

@ -42,11 +42,6 @@
<!-- ClipboardJS -->
<script src="/static/vendor/clipboard.min.js"></script>
<!-- Notie -->
<link rel="stylesheet" type="text/css"
href="{{ url_for('static', filename='node_modules/notie/dist/notie.min.css') }}">
<script src="{{ url_for('static', filename='node_modules/notie/dist/notie.min.js') }}"></script>
<!-- IntroJS -->
<link rel="stylesheet" type="text/css"
href="{{ url_for('static', filename='node_modules/intro.js/minified/introjs.min.css') }}">
@ -62,6 +57,8 @@
<link rel="stylesheet" href="{{ url_for('static', filename='node_modules/toastr/build/toastr.min.css') }}">
<script src="{{ url_for('static', filename='node_modules/toastr/build/toastr.min.js') }}"></script>
<script src="{{ url_for('static', filename='node_modules/bootbox/dist/bootbox.min.js') }}"></script>
<link rel="stylesheet" type="text/css" href="/static/style.css?v={{ VERSION }}">
<script>
@ -145,11 +142,11 @@
}
{% endif %}
// the modal does not get close when user clicks outside of modal
// necessary for obligatory modal such as the one displayed when user enable/display email forwarding
notie.setOptions({
overlayClickDismiss: false,
});
// default options for bootbox
bootbox.setDefaults({
closeButton: false,
backdrop: true
})
var clipboard = new ClipboardJS('.clipboard');