We Keep Coding

AngularJS $interval dont stop on .cancel();

I have SPA multi view application in AngularJS, I have defined $interval which is started from another view Controller. When i click a btn with function called and line $interval.cancel(); in it, it does not stop.
Here are examples of my code:
MainController:
$scope.$on("startInterval", function () {
$interval(function warningsControl() {
console.log("Timer stamp!");
$.ajax({
// some web api call which works fine
})
}, 10000);
});
$scope.stop = function () {
$interval.cancel();
}
$scope.logoutButton = {
text: "Logout",
type: "normal",
visible: false,
onClick: function () {
// some working code
$scope.stop();
var logoutBtn = $("#logout-btn").dxButton("instance");
logoutBtn.option({
visible: false
});
}
}
And SecondController:
$scope.authenticateButton = {
type: "default",
text: "Log In",
onClick: function () {
$.ajax({
// some web api calling
success: (data) => {
// some working code
$rootScope.$broadcast("startInterval");
}
})
}
}
This code start interval and everithing is running OK, until the point i click Logout btn - it made everithing except stoping the interval.
Any ideas how to fix it? I would be grateful for advice.

The $interval function should return some sort of ID which you can pass into $interval.cancel(). For example:
var int_id = $interval( func, time )
//...later...
$interval.cancel(int_id)

how to close sweet alert on ajax request completion

I am using Sweet-alert in my angular app.
function GetDataFromServer(url) {
SweetAlert.swal(
{
title: "",
text: "Please wait.",
imageUrl: "../../app/app-img/loading_spinner.gif",
showConfirmButton: false
});
return $http.get(url)
.then(success)
.catch(exception);
function success(response) {
//SweetAlert.swal(
// {
// title: "",
// text: "data loaded",
// });
return response.data;
}
function exception(ex) {
return (ex);
}
}
Req #1 (Main Objective of my this post)
What I am looking for is when the ajax request completes i.e.,
controls enters in the then(), Sweet alert should automatically hide.
Req #2
Also while request processing, I don't want to have the Close pop-up button (Ok button) in the sweet alert.
As per the documentation,showConfirmButton: false should hide it but it's not.
Any help/suggestion highly appreciated.
Thanks.

For automatically hiding the pop-over when it's done, you should set your initial pop-over to a variable so you can access it later. Maybe:
function GetDataFromServer(url) {
SweetAlert.swal({
title: "",
text: "Please wait.",
imageUrl: "../../app/app-img/loading_spinner.gif",
showConfirmButton: false
});
return $http.get(url)
.then(success)
.catch(exception);
function success(response) {
swal.close()
return response.data;
}
function exception(ex) {
return (ex);
}
}
It's right on: https://t4t5.github.io/sweetalert/ in the methods section near the bottom.
Since you don't have a specific 'way' you want to do hide the ok button and you're just looking for suggestions, you could always just use a little CSS to target it and give it the ol display: none; setup.

You can close current showing sweetalert by using below line of code anywhere you want.
swal.close();
That's it!

You can use the close method over the sweet object see the documentation in down part
https://t4t5.github.io/sweetalert/
swal.close(); --> Close the currently open SweetAlert programmatically.
self.showProgress = function(message) {
swal({ title: message });
swal.showLoading();
};
self.hideProgress = function() {
swal.close();
};

SweetAlert has close method if you check the docs at http://t4t5.github.io/sweetalert/
You can use SweetAlert.close() to close the sweetalert in angular.

If you use swal2 you can close it using Swal.close() from anywhere inside your code for closing it when ajax is complete I think the code below is an easy way:
$(document).ajaxComplete(function () {
Swal.close();
});

swal does not work with sync function (ex. get), you need make call get async
swal({
type: 'warning',
text: 'Please wait.',
showCancelButton: false,
confirmButtonText: "ok",
allowOutsideClick: false,
allowEscapeKey: false
}).then(function (result) {
if (result) {
setTimeout(function () {
$http.get(url)
}, 500);
}
});

if you are using the AngularJS library known as angular-sweetalert then use swal.close(); to close the alert window.
angular-sweetalert is a wrapper on the core sweetalert library package.

Cache the swal() to trigger it later.
function GetDataFromServer(url) {
let swalAlert = SweetAlert.swal; // cache your swal
swalAlert({
title: "",
text: "Please wait.",
imageUrl: "../../app/app-img/loading_spinner.gif",
showConfirmButton: false
});
return $http.get(url)
.then(success)
.catch(exception);
function success(response) {
swalAlert.close(); // this is what actually allows the close() to work
return response.data;
}
function exception(ex) {
return (ex);
}
}

How to wait for page to load befor Reveal.js starts

I have a short reveal.js presentation hosted here on GitHub pages.
I want to wait for the page to fully load before auto-starting the presentation. If the connection is slow, awesomefonts don't get rendered in time, and the user can only see an empty block.
Is it possibile to wait some time before start?

Okay, so after a minute of browsing your code, I noticed that you probably need an onload block in your script before initializing Reveal.js. Try putting the
Reveal.initialize({
controls: false,
progress: true,
history: true,
center: true,
autoSlide: 2200,
transition: 'slide', // none/fade/slide/convex/concave/zoom
// Optional reveal.js plugins
dependencies: [
{ src: 'lib/js/classList.js', condition: function() { return !document.body.classList; } },
{ src: 'plugin/markdown/marked.js', condition: function() { return !!document.querySelector( '[data-markdown]' ); } },
{ src: 'plugin/markdown/markdown.js', condition: function() { return !!document.querySelector( '[data-markdown]' ); } },
{ src: 'plugin/highlight/highlight.js', async: true, callback: function() { hljs.initHighlightingOnLoad(); } },
{ src: 'plugin/zoom-js/zoom.js', async: true }
]
});
Inside of:
object.onload=function(){myScript};
Hope this helps. The presentation looks great btw.

put your init code inside window.onload() function
if you need multiple things to be loaded asyncronously, just create a myLoad() function and a objToBeLoaded counter, then each time an obj has loaded, make it call somethingHasLoad() function that will check for that counter and eventually call myLoad()

jquery mobile popup message disappear after few seconds

On master page I have
$(document).bind("pageinit", function () {
$.mobile.loading('hide');
});
and I'm rendering popup message like this
$.mobile.loading('show', { theme: "a", text: "My Text...", textonly: true, textVisible: true });
I just need to make this message disappear after 2seconds, right now it stays on top forever.

Just use a timeout to execute the code after whateveer interval you want,
for example
//display loading message
$.mobile.loading('show',
{ theme: "a", text: "My Text..."
, textonly: true, textVisible: true });
//execute code after 2 seconds
setTimeout(function () {
$.mobile.loading('hide');
},2000);
And here's a link to a jsbin

Sencha Touch - Calling function within view does not get called

Ive just started to explore sencha. Stuck up with this. Help Appreciated :)
This is my java script code, in the below line handler function i am calling the following the method, which in under items and parent xtype form-panel.
{
xtype:'panel',
defaults:{
xtype:'button',
style:'margin: 0.1em',
flex:1
},
layout:{
type:'hbox',
align:'center'
},
items:[
{
text:'Submit',
handler:this.makeReq,
scope:this
},
{
text:'Terms & Conditions',
}
]
}
This is the method that am calling in the above function, but it seems does not happen anyting.
makeReq: function() {
alert("Hey There");
}

I really suggest you follow the Sencha Touch 2 MVC model in this case. You can give your button an action like this:
{
text:'Submit',
action: 'submit'
}
Then you can refer this button and set the function for it inside your app's controller:
config: {
refs: {
submitButton: 'button[action=submit]',
},
control: {
submitButton: {
tap: 'makeReq'
},
},
makeReq: function() {
alert("Hey There");
}
}