Skip to content

Commit

Permalink
Added noty. Updated demo
Browse files Browse the repository at this point in the history
  • Loading branch information
Thomas Fritz committed Mar 30, 2012
1 parent 12f2842 commit e38a4d6
Show file tree
Hide file tree
Showing 6 changed files with 532 additions and 14 deletions.
2 changes: 1 addition & 1 deletion README.md
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
About
=====

Browser-only AMD version of Backbone, Underscore, Bootstrap and Handlebars.
Browser-only AMD version of Backbone, Underscore, Bootstrap, noty and Handlebars.
I deleted checks for 'exports', 'module', objects etc.
Modules getting returned only - no global (window) namespace pollution.

Expand Down
21 changes: 13 additions & 8 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -3,17 +3,22 @@
<head>
<title>requirejs+jquery test</title>
<script data-main="main" src="requirejs/1.0.7/require-jquery.js"></script>
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css" />
<link rel="stylesheet" type="text/css" href="css/jquery.noty.css" />
<link rel="stylesheet" type="text/css" href="css/noty_theme_twitter.css" />
</head>
<body>
<script data-template="path-list" type="text/x-handlebars-template">
<div class="configured-paths">
<h1>Added with Handlebars</h1>
<ul>
{{#paths}}
<li>{{> path-item}}</li>
{{/paths}}
</ul>
<div class="container-fluid" id="container">
</div>
<script data-template="path-list" type="text/x-handlebars-template">
<div class="configured-paths">
<h1>Added with Handlebars</h1>
<ul>
{{#paths}}
<li>{{> path-item}}</li>
{{/paths}}
</ul>
</div>
</script>
<script data-template="path-list-item" data-partial="path-item" type="text/x-handlebars-template">
<span class="path">{{.}}</span>
Expand Down
21 changes: 16 additions & 5 deletions main.js
Original file line number Diff line number Diff line change
Expand Up @@ -4,14 +4,15 @@
"Handlebars":"handlebars/1.0.0.beta.6/handlebars",
"underscore":"underscorejs/1.3.1/underscore",
"Backbone":"backbonejs/0.9.2/backbone",
"Bootstrap":"bootstrap/2.0.2/bootstrap"
"Bootstrap":"bootstrap/2.0.2/bootstrap",
"noty":"noty/0.1/jquery.noty"
};

require.config({
paths:paths
});

require(['$', 'Handlebars', 'underscore', 'Backbone', 'Bootstrap'], function ($, Handlebars, _, Backbone, Bootstrap) {
require(['$', 'Handlebars', 'underscore', 'Backbone', 'Bootstrap', 'noty'], function ($, Handlebars, _, Backbone, Bootstrap, noty) {
console.log("jQuery", $);
console.log('Handlebars', Handlebars);
console.log('Underscore', _);
Expand All @@ -23,17 +24,27 @@
var pathsArray = [];
var pathString = '<div class="configured-paths"><h1>Added with jQuery</h1>';
_.each(paths, function (path) {
pathString += '<div>' + path + '</div>';
pathString += '<div class="path">' + path + '</div>';
pathsArray.push(path);
});
$('body').append(pathString + '</div>');
$('#container').append(pathString + '</div>');

var pathItemPartialSource = $('script[data-partial=path-item]').first().html();
Handlebars.registerPartial('path-item', pathItemPartialSource);

var pathListTemplateSource = $('script[data-template=path-list]').first().html();
var pathListTemplate = Handlebars.compile(pathListTemplateSource);
$('body').append(pathListTemplate({paths:pathsArray}));
$('#container').append(pathListTemplate({paths:pathsArray}));

$('.path').on('click', function () {
noty({
text:'You clicked "' + $(this).html()+'"',
theme:'noty_theme_twitter',
closable:true,
closeOnSelfClick:true,
timeout: 2000
});
});
});

}());
22 changes: 22 additions & 0 deletions noty/0.1/LICENSE
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
MIT License
-----------

Copyright (c) 2012, Nedim Arabacı , Muhittin Özer

Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in
all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
THE SOFTWARE.
242 changes: 242 additions & 0 deletions noty/0.1/jquery.noty.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,242 @@
/**
* jQuery Noty Plugin v0.1
* Authors: Nedim Arabacı (http://ned.im), Muhittin Özer (http://muhittinozer.com)
*
* http://needim.github.com/noty/
*
* Licensed under the MIT licenses:
* http://www.opensource.org/licenses/mit-license.php
*
**/
define(['jquery'], function($) {
var jQuery = $;
$.noty = function(options) {

var base = this;

base.init = function() {

base.options = $.extend({}, $.noty.defaultOptions, options);
base.options.id = 'noty_'+new Date().getTime();

base.options.layout = 'noty_layout_'+base.options.layout;
base.options.type = 'noty_'+base.options.type;

// Push notification to queue
if (jQuery.inArray(base.options.layout, $.noty.growls) == -1) {
if (base.options.force) {
$.noty.queue.unshift({options: base.options});
} else {
$.noty.queue.push({options: base.options});
}
base.render();
} else {
base.render({options: base.options});
}

};

// Render the queue
base.render = function(noty) {

if ($.noty.available || (jQuery.type(noty) === 'object')) {

$.noty.available = (jQuery.type(noty) === 'object') ? $.noty.available : false;

// Get noty from queue
var notification = (jQuery.type(noty) === 'object') ? noty : $.noty.queue.shift();

if (jQuery.type(notification) === 'object') {

// Layout spesific container settings
if (jQuery.inArray(base.options.layout, $.noty.growls) > -1) {
if ($("ul.noty_container."+notification.options.layout).length > 0) {
base.$noty_container = $("ul.noty_container."+notification.options.layout);
} else {
base.$noty_container = $('<ul/>').addClass('noty_container').addClass(notification.options.layout);
$("body").prepend(base.$noty_container);
}
base.$notyContainer = $('<li/>');
base.$noty_container.prepend(base.$notyContainer);

} else {
base.$notyContainer = $("body");
}
base.$bar = $('<div/>').addClass('noty_bar');
base.$message = $('<div/>').addClass('noty_message');
base.$text = $('<div/>').addClass('noty_text');
base.$close = $('<div/>').addClass('noty_close');

base.$message.append(base.$text).append(base.$close);
base.$bar.append(base.$message);

var $noty = base.$bar;
$noty.data('noty_options', notification.options);

// Basic layout settings
$noty.addClass(notification.options.layout).addClass(notification.options.type).addClass(notification.options.theme);

// Message and style settings
$noty.find('.noty_text').html(notification.options.text).css({textAlign: notification.options.textAlign});

// Closable option
(notification.options.closable) ? $noty.addClass('noty_closable').find('.noty_close').show() : $noty.find('.noty_close').remove();

// Bind close event to button
$noty.find('.noty_close').bind('click', function() { $noty.triggerHandler('noty.close'); });

// If we have a button we must disable closeOnSelfClick option
if (notification.options.buttons) {
notification.options.closeOnSelfClick = false;
}

// Close on self click
if (notification.options.closeOnSelfClick) {
$noty.find('.noty_message').bind('click', function() { $noty.triggerHandler('noty.close'); }).css('cursor', 'pointer');
}

// Close on self click
if (notification.options.closeOnSelfOver) {
$noty.find('.noty_message').bind('mouseover', function() { $noty.triggerHandler('noty.close'); }).css('cursor', 'pointer');
}

// is Modal?
if (notification.options.modal) {
$('<div />').addClass('noty_modal').addClass(notification.options.theme).prependTo($('body')).fadeIn('fast');
}

// Prepend noty to container
base.$notyContainer.prepend($noty);

$noty.close = function() {
this.trigger('noty.close');
};

// Bind close event
$noty.one('noty.close', function(event) {
var options = $noty.data('noty_options');

// Modal Cleaning
if (options.modal) {
$('.noty_modal').fadeOut('fast', function() { $(this).remove(); });
}

$noty.stop().animate(
$noty.data('noty_options').animateClose,
$noty.data('noty_options').speed,
$noty.data('noty_options').easing,
$noty.data('noty_options').onClose)
.promise().done(function() {

// Layout spesific cleaning
if (jQuery.inArray(base.options.layout, $.noty.growls) > -1) {
$noty.parent().remove();
} else {
$noty.remove();

// queue render
$.noty.available = true;
base.render();
}

});
});

// Set buttons if available
if (notification.options.buttons) {
$buttons = $('<div/>').addClass('noty_buttons');
$noty.find('.noty_text').append($buttons);

$.each(notification.options.buttons, function(i, button) {
bclass = (button.type) ? button.type : 'gray';
$button = $('<button/>').addClass(bclass).html(button.text).appendTo($noty.find('.noty_buttons'))
.bind("click", function() {
if ($.isFunction(button.click)) {
button.click.call($button, $noty);
}
});
});
}

// topCenter and center specific options
if (notification.options.layout == 'noty_layout_topCenter' || notification.options.layout == 'noty_layout_center') {
$noty.css({
'left': ($(window).width() - $noty.outerWidth()) / 2 + 'px'
});
}

// Start the show
$noty.animate(
notification.options.animateOpen,
notification.options.speed,
notification.options.easing,
notification.options.onShow);

// If noty is have a timeout option
if (notification.options.timeout) {
$noty.delay(notification.options.timeout).promise().done(function() { $noty.triggerHandler('noty.close'); });
}

} else {
// Queue is over
$.noty.available = true;
}

}
};

// Run initializer
base.init();
};

$.noty.queue = [];
$.noty.growls = ['noty_layout_topLeft', 'noty_layout_topRight', 'noty_layout_bottomLeft', 'noty_layout_bottomRight'];

$.noty.clearQueue = function () {
$.noty.queue = [];
};

$.noty.close = function () {
$('.noty_bar:first').trigger('noty.close');
};

$.noty.closeAll = function () {
$.noty.clearQueue();
$('.noty_bar').trigger('noty.close');
};

$.noty.available = true;
$.noty.defaultOptions = {
layout : "top",
theme : "noty_theme_default",
animateOpen : {height: 'toggle'},
animateClose : {height: 'toggle'},
easing : 'swing',
text : "null",
textAlign : "center",
type : "alert",
speed : 500,
timeout : false,
closable : false,
closeOnSelfClick : true,
closeOnSelfOver : false,
force : false,
onShow : false,
onClose : false,
buttons : false,
modal : false
};

$.fn.noty = function(options) {
return new $.noty(options);
};

// Helper
function noty(options) {
jQuery.fn.noty(options);
}

return noty;

});

Loading

0 comments on commit e38a4d6

Please sign in to comment.