This is the second Javascript quark in the series: it can be used to fade a widget out. You can find the first quark here.
Here's the code to copy & paste to your Home.js:
$scope.fadeOut = function(widget, time, interval) { let w = (widget.opacity !== undefined ? widget : $scope.view.wdg[widget]); if (time <= 0 || interval <= 0 || w.opacity === undefined) { throw "Cannot fade this widget"; } let steps = Math.floor(time / interval); let opDelta = w.opacity / steps; return $interval(() => w.opacity = (opDelta < w.opacity) ? (w.opacity - opDelta) : 0, interval, steps); }
This quark will make the widget fade out from its current opacity to 0 in time milliseconds, uniformly decrementing opacity at every interval .
Invoke the function like this:
fadeOut(widget, time, interval);
where widget is either the id of the widget (e.g. modelItem-1) or the widget itself (e.g. $scope.view.wdg['modelItem-1']), time represent the total time it takes to fade the widget out from its current opacity, and interval represents the amount of time between each opacity change.
Here's an example:
fadeOut('modelItem-1', 2000, 50);
This example fades the model item out by bringing its current opacity to zero after 2 seconds with an opacity change every 50 ms.
Comments and suggestions are welcome.
-Alessio