Adding initial pass at alert js.

This commit is contained in:
connors 2013-10-19 21:34:39 -07:00
Родитель 2b005473dc
Коммит dcafb2a209
8 изменённых файлов: 100 добавлений и 11 удалений

Просмотреть файл

@ -31,7 +31,8 @@ module.exports = function(grunt) {
'<%= meta.srcPath %>js/push.js',
'<%= meta.srcPath %>js/segmented-controllers.js',
'<%= meta.srcPath %>js/sliders.js',
'<%= meta.srcPath %>js/toggles.js'
'<%= meta.srcPath %>js/toggles.js',
'<%= meta.srcPath %>js/alerts.js'
],
dest: '<%= meta.distPath %><%= pkg.name %>.js'
}

9
dist/ratchet.css поставляемый
Просмотреть файл

@ -1002,6 +1002,12 @@ input[type="button"] {
color: #fff;
border-radius: 3px;
z-index: 10;
-webkit-transition: opacity;
transition: opacity;
-webkit-transition-duration: 0.5s;
transition-duration: 0.5s;
-webkit-transition-timing-function: linear;
transition-timing-function: linear;
}
.alert .close {
position: relative;
@ -1018,6 +1024,9 @@ input[type="button"] {
.alert .close:active {
opacity: .6;
}
.alert.dismiss {
opacity: 0;
}
.alert-positive {
background-color: rgba(76, 217, 100, 0.97);

42
dist/ratchet.js поставляемый
Просмотреть файл

@ -15,8 +15,7 @@
!function () {
var findModals = function (target) {
var i;
var modals = document.querySelectorAll('a');
var i, modals = document.querySelectorAll('a');
for (; target && target !== document; target = target.parentNode) {
for (i = modals.length; i--;) { if (modals[i] === target) return target; }
}
@ -776,4 +775,41 @@
toggle = false;
});
}();
}();
/* ----------------------------------
* ALERT v0.0.1
* Licensed under The MIT License
* http://opensource.org/licenses/MIT
* ---------------------------------- */
!function () {
var findAlerts = function (target) {
var i, alerts = document.querySelectorAll('a');
for (; target && target !== document; target = target.parentNode) {
for (i = alerts.length; i--;) { if (alerts[i] === target) return target; }
}
};
var onAlertHidden = function () {
var alert = getAlert(event);
alert.style.display = 'none';
alert.removeEventListener('webkitTransitionEnd', onAlertHidden);
}
var getAlert = function (event) {
var alertDismiss = findAlerts(event.target);
if (alertDismiss && alertDismiss.hash) return document.querySelector(alertDismiss.hash);
console.log('get alert');
};
window.addEventListener('click', function (event) {
var alert = getAlert(event);
if (alert) {
if (alert && alert.classList.contains('alert')) alert.classList.add('dismiss');
alert.addEventListener('webkitTransitionEnd', onAlertHidden);
event.preventDefault();
}
});
}();

Просмотреть файл

@ -19,8 +19,8 @@
<body>
<!-- Alert -->
<div class="alert alert-negative">
<span class="icon icon-share close"></span>
<div id="myAlert" class="alert alert-negative">
<a href="#myAlert" class="icon icon-share close"></a>
<strong>This</strong> is an alert.
</div>
@ -71,8 +71,8 @@
</ul>
</div>
<div class="alert alert-positive alert-inline">
<span class="icon icon-share close"></span>
<div id="myAlert2" class="alert alert-positive alert-inline">
<a href="#myAlert2" class="icon icon-share close"></a>
<strong>This</strong> is an inline alert.
</div>

Просмотреть файл

@ -869,7 +869,7 @@ document
<h3 class="component-title">Popovers</h3>
<div class="component-example">
<div id="popover" class="popover">
<div id="myPopover" class="popover">
<header class="bar-nav">
<a class="button">
Left

37
lib/js/alerts.js Normal file
Просмотреть файл

@ -0,0 +1,37 @@
/* ----------------------------------
* ALERT v0.0.1
* Licensed under The MIT License
* http://opensource.org/licenses/MIT
* ---------------------------------- */
!function () {
var findAlerts = function (target) {
var i, alerts = document.querySelectorAll('a');
for (; target && target !== document; target = target.parentNode) {
for (i = alerts.length; i--;) { if (alerts[i] === target) return target; }
}
};
var onAlertHidden = function () {
var alert = getAlert(event);
alert.style.display = 'none';
alert.removeEventListener('webkitTransitionEnd', onAlertHidden);
}
var getAlert = function (event) {
var alertDismiss = findAlerts(event.target);
if (alertDismiss && alertDismiss.hash) return document.querySelector(alertDismiss.hash);
console.log('get alert');
};
window.addEventListener('click', function (event) {
var alert = getAlert(event);
if (alert) {
if (alert && alert.classList.contains('alert')) alert.classList.add('dismiss');
alert.addEventListener('webkitTransitionEnd', onAlertHidden);
event.preventDefault();
}
});
}();

Просмотреть файл

@ -6,8 +6,7 @@
!function () {
var findModals = function (target) {
var i;
var modals = document.querySelectorAll('a');
var i, modals = document.querySelectorAll('a');
for (; target && target !== document; target = target.parentNode) {
for (i = modals.length; i--;) { if (modals[i] === target) return target; }
}

Просмотреть файл

@ -11,6 +11,9 @@
color: #fff;
border-radius: 3px;
z-index: 10;
@include transition(opacity);
@include transition-duration(.5s);
@include transition-timing-function(linear);
.close {
position: relative;
@ -25,6 +28,10 @@
opacity: .6;
}
}
&.dismiss {
opacity: 0;
}
}
// Positive alert (Default color is green)