effects.js
scriptaculous.js
@@ -38,12 +38,12 @@ Growl.Base = Class.create({
},
show: function(block_elem, options) {
- block_elem.show();
+ Effect.Appear(block_elem.identify());
this.hide.bind(this).delay(options.duration);
},
hide: function(elem) {
- elem.hide();
+ Effect.Fade(elem);
}
});
@@ -64,7 +64,7 @@ Growl.Smoke = Class.create(Growl.Base, {
block_elem = this.create();
var delta = document.viewport.getScrollOffsets()[1]+10+((this.queue.length)*83);
- block_elem.setStyle({ 'top':delta+'px', 'right':'10px', 'display':'block'});
+ block_elem.setStyle({ 'top':delta+'px', 'right':'10px'});
block_elem.down('img').setAttribute('src', options.image);
block_elem.down('h3').update(options.title);
@@ -77,6 +77,6 @@ Growl.Smoke = Class.create(Growl.Base, {
hide: function($super) {
var elem = this.queue.shift();
$super(elem);
- elem.remove();
+ //elem.remove();
}
});
growl.js
@@ -5,13 +5,15 @@
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" charset="utf-8" src="prototype-1.6.0.2.js"></script>
<script type="text/javascript" charset="utf-8" src="growl.js"></script>
+<script type="text/javascript" charset="utf-8" src="scriptaculous.js"></script>
+<script type="text/javascript" charset="utf-8" src="effects.js"></script>
<link rel="stylesheet" href="http://icebeat.bitacoras.com/mootools/growl/css.css" type="text/css" />
</head>
<body>
<h3><img src="http://icebeat.bitacoras.com/mootools/growl/logo.jpg" alt="Window.Growl 2.0" title="Window.Growl 2.0"></h3>
<ul>
<li><a href="#" id="smoke" title="Show msg Smoke">Show Growl Smoke.</a></li>
- <li><a href="#" id="bezel" title="Show msg Bezel">Show Growl Bezel.</a></li>
+ <li><a href="#" id="bezel" title="Show msg Bezel">Show Growl Bezel.</a> <b>(NOT WORKING YET)</b></li>
<li><a href="growl.js" title="Download">Download js.</a></li>
</ul>
<pre><code>Growl.Smoke({
@@ -23,6 +25,7 @@
<p>
By <a href="http://icebeat.bitacoras.com" title="Blog">Daniel Mota</a>.
</p>
+
<script type="text/javascript" charset="utf-8">
var growl = new Growl.Smoke;
$('smoke').observe('click', function(event) {
test.html
78a639474384ccb4c42c2c8544063da69eec36ae
Craig P Jolicoeur
cpjolicoeur@gmail.com
http://github.com/tdreyno/prototypegrowl/commit/1384aec747dbf94076c8fdf7a73222bce8b6ea76
1384aec747dbf94076c8fdf7a73222bce8b6ea76
2008-04-04T18:51:11-07:00
2008-04-04T18:51:11-07:00
add scriptaculous and use Appear/Fade effect for growl
43186039ff1a273290bb70ce4efea4ca2bdb3411
Craig P Jolicoeur
cpjolicoeur@gmail.com