Skip to content

Commit 2b8f911

Browse files
committed
Initial bower commit
0 parents  commit 2b8f911

File tree

13 files changed

+4082
-0
lines changed

13 files changed

+4082
-0
lines changed

.gitignore

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
*.un~

CHANGELOG

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
==0.1.0==
2+
* Initial Release

LICENSE

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
Copyright (c) 2008 Net Perspective, http://net-perspective.com/
2+
3+
Permission is hereby granted, free of charge, to any person obtaining
4+
a copy of this software and associated documentation files (the
5+
"Software"), to deal in the Software without restriction, including
6+
without limitation the rights to use, copy, modify, merge, publish,
7+
distribute, sublicense, and/or sell copies of the Software, and to
8+
permit persons to whom the Software is furnished to do so, subject to
9+
the following conditions:
10+
11+
The above copyright notice and this permission notice shall be
12+
included in all copies or substantial portions of the Software.
13+
14+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
15+
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
16+
MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
17+
NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
18+
LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
19+
OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
20+
WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

README

Whitespace-only changes.

bower.json

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
{
2+
"name": "jquery-purr",
3+
"version": "0.1.0",
4+
"main": "jquery.purr.js",
5+
"ignore": [
6+
"purr-example.html",
7+
"purr-example"
8+
],
9+
"dependencies": {
10+
"jquery": "1.2.6"
11+
}
12+
}

jquery.purr.js

Lines changed: 180 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,180 @@
1+
/**
2+
* jquery.purr.js
3+
* Copyright (c) 2008 Net Perspective (net-perspective.com)
4+
* Licensed under the MIT License (http://www.opensource.org/licenses/mit-license.php)
5+
*
6+
* @author R.A. Ray
7+
* @projectDescription jQuery plugin for dynamically displaying unobtrusive messages in the browser. Mimics the behavior of the MacOS program "Growl."
8+
* @version 0.1.0
9+
*
10+
* @requires jquery.js (tested with 1.2.6)
11+
*
12+
* @param fadeInSpeed int - Duration of fade in animation in miliseconds
13+
* default: 500
14+
* @param fadeOutSpeed int - Duration of fade out animationin miliseconds
15+
default: 500
16+
* @param removeTimer int - Timeout, in miliseconds, before notice is removed once it is the top non-sticky notice in the list
17+
default: 4000
18+
* @param isSticky bool - Whether the notice should fade out on its own or wait to be manually closed
19+
default: false
20+
* @param usingTransparentPNG bool - Whether or not the notice is using transparent .png images in its styling
21+
default: false
22+
*/
23+
24+
( function( $ ) {
25+
26+
$.purr = function ( notice, options )
27+
{
28+
// Convert notice to a jQuery object
29+
notice = $( notice );
30+
31+
// Add a class to denote the notice as not sticky
32+
if ( !options.isSticky )
33+
{
34+
notice.addClass( 'not-sticky' );
35+
};
36+
37+
// Get the container element from the page
38+
var cont = document.getElementById( 'purr-container' );
39+
40+
// If the container doesn't yet exist, we need to create it
41+
if ( !cont )
42+
{
43+
cont = '<div id="purr-container"></div>';
44+
}
45+
46+
// Convert cont to a jQuery object
47+
cont = $( cont );
48+
49+
// Add the container to the page
50+
$( 'body' ).append( cont );
51+
52+
notify();
53+
54+
function notify ()
55+
{
56+
// Set up the close button
57+
var close = document.createElement( 'a' );
58+
$( close ).attr(
59+
{
60+
className: 'close',
61+
href: '#close',
62+
innerHTML: 'Close'
63+
}
64+
)
65+
.appendTo( notice )
66+
.click( function ()
67+
{
68+
removeNotice();
69+
70+
return false;
71+
}
72+
);
73+
74+
// Add the notice to the page and keep it hidden initially
75+
notice.appendTo( cont )
76+
.hide();
77+
78+
if ( jQuery.browser.msie && options.usingTransparentPNG )
79+
{
80+
// IE7 and earlier can't handle the combination of opacity and transparent pngs, so if we're using transparent pngs in our
81+
// notice style, we'll just skip the fading in.
82+
notice.show();
83+
}
84+
else
85+
{
86+
//Fade in the notice we just added
87+
notice.fadeIn( options.fadeInSpeed );
88+
}
89+
90+
// Set up the removal interval for the added notice if that notice is not a sticky
91+
if ( !options.isSticky )
92+
{
93+
var topSpotInt = setInterval( function ()
94+
{
95+
// Check to see if our notice is the first non-sticky notice in the list
96+
if ( notice.prevAll( '.not-sticky' ).length == 0 )
97+
{
98+
// Stop checking once the condition is met
99+
clearInterval( topSpotInt );
100+
101+
// Call the close action after the timeout set in options
102+
setTimeout( function ()
103+
{
104+
removeNotice();
105+
}, options.removeTimer
106+
);
107+
}
108+
}, 200 );
109+
}
110+
}
111+
112+
function removeNotice ()
113+
{
114+
// IE7 and earlier can't handle the combination of opacity and transparent pngs, so if we're using transparent pngs in our
115+
// notice style, we'll just skip the fading out.
116+
if ( jQuery.browser.msie && options.usingTransparentPNG )
117+
{
118+
notice.css( { opacity: 0 } )
119+
.animate(
120+
{
121+
height: '0px'
122+
},
123+
{
124+
duration: options.fadeOutSpeed,
125+
complete: function ()
126+
{
127+
notice.remove();
128+
}
129+
}
130+
);
131+
}
132+
else
133+
{
134+
// Fade the object out before reducing its height to produce the sliding effect
135+
notice.animate(
136+
{
137+
opacity: '0'
138+
},
139+
{
140+
duration: options.fadeOutSpeed,
141+
complete: function ()
142+
{
143+
notice.animate(
144+
{
145+
height: '0px'
146+
},
147+
{
148+
duration: options.fadeOutSpeed,
149+
complete: function ()
150+
{
151+
notice.remove();
152+
}
153+
}
154+
);
155+
}
156+
}
157+
);
158+
}
159+
};
160+
};
161+
162+
$.fn.purr = function ( options )
163+
{
164+
options = options || {};
165+
options.fadeInSpeed = options.fadeInSpeed || 500;
166+
options.fadeOutSpeed = options.fadeOutSpeed || 500;
167+
options.removeTimer = options.removeTimer || 4000;
168+
options.isSticky = options.isSticky || false;
169+
options.usingTransparentPNG = options.usingTransparentPNG || false;
170+
171+
this.each( function()
172+
{
173+
new $.purr( this, options );
174+
}
175+
);
176+
177+
return this;
178+
};
179+
})( jQuery );
180+

purr-example.html

Lines changed: 138 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,138 @@
1+
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
2+
3+
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
4+
5+
<head>
6+
7+
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
8+
<title>Scroll Follow Simple Example</title>
9+
10+
<script type="text/javascript" src="./purr-example/jquery.js"></script>
11+
<script type="text/javascript" src="./purr-example/jquery.purr.js"></script>
12+
13+
<script type="text/javascript">
14+
$( document ).ready( function ()
15+
{
16+
$( '.show-example' ).click( function ()
17+
{
18+
var notice = '<div class="notice">'
19+
+ '<div class="notice-body">'
20+
+ '<img src="./purr-example/info.png" alt="" />'
21+
+ '<h3>Purr Example</h3>'
22+
+ '<p>This a normal Purr. It will fade out on its own.</p>'
23+
+ '</div>'
24+
+ '<div class="notice-bottom">'
25+
+ '</div>'
26+
+ '</div>';
27+
28+
$( notice ).purr(
29+
{
30+
usingTransparentPNG: true
31+
}
32+
);
33+
34+
return false;
35+
}
36+
);
37+
38+
$( '.show-sticky' ).click( function ()
39+
{
40+
var notice = '<div class="notice">'
41+
+ '<div class="notice-body">'
42+
+ '<img src="./purr-example/info.png" alt="" />'
43+
+ '<h3>"Sticky" Purr Example</h3>'
44+
+ '<p>This a "sticky" Purr. It will not fade out on its own. You must close it manually.</p>'
45+
+ '</div>'
46+
+ '<div class="notice-bottom">'
47+
+ '</div>'
48+
+ '</div>';
49+
50+
$( notice ).purr(
51+
{
52+
usingTransparentPNG: true,
53+
isSticky: true
54+
}
55+
);
56+
57+
return false;
58+
}
59+
);
60+
}
61+
);
62+
</script>
63+
64+
<style type="text/css">
65+
body {
66+
margin: 0;
67+
padding: 0;
68+
font-family: Georgia;
69+
font-size: 0.9em;
70+
line-height: 1.4em;
71+
}
72+
73+
#example {
74+
position: relative;
75+
width: 500px;
76+
padding: 20px;
77+
}
78+
79+
p {
80+
margin: 7px 0 0 0;
81+
}
82+
83+
#purr-container {
84+
position: fixed;
85+
top: 0;
86+
right: 0;
87+
}
88+
89+
.notice {
90+
position: relative;
91+
width: 324px;
92+
}
93+
.notice .close {position: absolute; top: 12px; right: 12px; display: block; width: 18px; height: 17px; text-indent: -9999px; background: url(./purr-example/purrClose.png) no-repeat 0 10px;}
94+
95+
.notice-body {
96+
min-height: 50px;
97+
padding: 22px 22px 0 22px;
98+
background: url(./purr-example/purrTop.png) no-repeat left top;
99+
color: #f9f9f9;
100+
}
101+
.notice-body img {width: 50px; margin: 0 10px 0 0; float: left;}
102+
.notice-body h3 {margin: 0; font-size: 1.1em;}
103+
.notice-body p {margin: 5px 0 0 60px; font-size: 0.8em; line-height: 1.4em;}
104+
105+
.notice-bottom {
106+
height: 22px;
107+
background: url(./purr-example/purrBottom.png) no-repeat left top;
108+
}
109+
</style>
110+
</head>
111+
112+
<body>
113+
114+
<div id="example">
115+
116+
<p>
117+
This page features two examples: a regular Purr and a "sticky" Purr. Clicking the links
118+
below will present a new Purr each time. Notice the relationship between the sticky and
119+
regular Purrs. Only the top non-sticky Purr in the list is removed at a time.
120+
</p>
121+
122+
<p>
123+
These notices also feature the <em>usingTransparentPNG</em> parameter. If you are viewing
124+
this page in IE7, you aren't seeing the fading animations.
125+
</p>
126+
127+
<p>
128+
The information icon is courtesy of
129+
<a href="http://mouserunner.com/Spheres_ColoCons1_Free_Icons.html">MouseRunner.com</a>.
130+
</p>
131+
132+
<ul>
133+
<li><a class="show-example" href="#show">Regular</a></li>
134+
<li><a class="show-sticky" href="#show">Sticky</a></li>
135+
</ul>
136+
</div><!--end #example-->
137+
</body>
138+
</html>

purr-example/info.png

10 KB
Loading

0 commit comments

Comments
 (0)