Body Text
19 | *
8 | // @include transition(all 1s linear);
9 | // @include transition((color 1s linear, opacity 1s linear));
10 | //
11 | //
12 | // @param $list [default: all 1s linear] List of transitions
13 | //
14 | @mixin transition ($list: all 1s linear) {
15 | // which prefix to append to the property
16 | $webkit : true;
17 | $moz : true;
18 | $ms : true;
19 | $o : true;
20 | $spec : true;
21 |
22 | // set prefix
23 | @include prefix(transition, $list, $webkit, $moz, $ms, $o, $spec);
24 | }
--------------------------------------------------------------------------------
/example/assets/sass/mixins/_animate.scss:
--------------------------------------------------------------------------------
1 | /**
2 | * Transition
3 | * Multiple transition must be wrapped in braces
4 | *
5 | *
6 | * @include transition(all 1s linear);
7 | * @include transition((color 1s linear, opacity 1s linear));
8 | *
9 | *
10 | * @param $list [default: all 1s linear] List of transitions
11 | */
12 | @mixin transition ($list: all 1s linear) {
13 | // which prefix to append to the property
14 | $webkit : true;
15 | $moz : true;
16 | $ms : true;
17 | $o : true;
18 | $spec : true;
19 |
20 | // set prefix
21 | @include prefix(transition, $list, $webkit, $moz, $ms, $o, $spec);
22 | }
--------------------------------------------------------------------------------
/example/assets/sass/modules/_base.scss:
--------------------------------------------------------------------------------
1 | /**
2 | * Contents:
3 | *
4 | * 1. Media Object
5 | * 2. Clearfix
6 | */
7 |
8 | /**
9 | * 1. Media Object
10 | *
11 | * Extremely flexible media object. Can reduce countless lines of code.
12 | *
13 | * HTML ::
14 | *
15 | * Body Text
19 | *
6 | // @include prefix(transition, all 1s linear, $webkit, $moz, $ms, $o, $spec);
7 | //
8 | //
9 | // Multiple properties
10 | //
11 | // @include prefix(transition, (color 1s linear, opacity 1s linear), $webkit, $moz, $ms, $o, $spec);
12 | //
13 | //
14 | // @param $property Property to prepend prefix
15 | // @param $value value of the property
16 | // @param $webkit Whether to add -wekbit prefix
17 | // @param $moz Whether to add -moz prefix
18 | // @param $ms Whether to add -ms prefix
19 | // @param $o Whether to add -o prefix
20 | // @param $spec Whether to add spec property
21 | //
22 | @mixin prefix ($property, $value, $webkit: true, $moz: true, $ms: false, $o: false, $spec: true) {
23 | @if $webkit { -webkit-#{$property}: $value; }
24 | @if $moz { -moz-#{$property}: $value; }
25 | @if $ms { -ms-#{$property}: $value; }
26 | @if $o { -o-#{$property}: $value; }
27 | @if $spec { #{$property}: $value; }
28 | }
29 |
30 | //
31 | // Add browser prefix to property
32 | //
33 | // Single property
34 | //
35 | // @include prop-prefix(background-image, linear-gradient, (top, #FFF, #CCC), $webkit, $moz, $ms, $o, $spec);
36 | //
37 | //
38 | // @param $selector Selector
39 | // @param $property Property to prepend prefix
40 | // @param $value value of the property
41 | // @param $webkit Whether to add -wekbit prefix
42 | // @param $moz Whether to add -moz prefix
43 | // @param $ms Whether to add -ms prefix
44 | // @param $o Whether to add -o prefix
45 | // @param $spec Whether to add spec property
46 | //
47 | @mixin prop-prefix ($selector, $property, $value, $webkit: true, $moz: true, $ms: false, $o: false, $spec: true) {
48 | @if $webkit { #{$selector}: unquote("-webkit-#{$property}(#{$value})"); }
49 | @if $moz { #{$selector}: unquote(" -moz-#{$property}(#{$value})"); }
50 | @if $ms { #{$selector}: unquote(" -ms-#{$property}(#{$value})"); }
51 | @if $o { #{$selector}: unquote(" -o-#{$property}(#{$value})"); }
52 | @if $spec { #{$selector}: unquote(" #{$property}(#{$value})"); }
53 | }
--------------------------------------------------------------------------------
/example/assets/sass/mixins/_prefix.scss:
--------------------------------------------------------------------------------
1 | /**
2 | * Add browser prefix to selector
3 | *
4 | * Single property
5 | *
6 | * @include prefix(transition, all 1s linear, $webkit, $moz, $ms, $o, $spec);
7 | *
8 | *
9 | * Multiple properties
10 | *
11 | * @include prefix(transition, (color 1s linear, opacity 1s linear), $webkit, $moz, $ms, $o, $spec);
12 | *
13 | *
14 | * @param $property Property to prepend prefix
15 | * @param $value value of the property
16 | * @param $webkit Whether to add -wekbit prefix
17 | * @param $moz Whether to add -moz prefix
18 | * @param $ms Whether to add -ms prefix
19 | * @param $o Whether to add -o prefix
20 | * @param $spec Whether to add spec property
21 | */
22 | @mixin prefix ($property, $value, $webkit: true, $moz: true, $ms: false, $o: false, $spec: true) {
23 | @if $webkit { -webkit-#{$property}: $value; }
24 | @if $moz { -moz-#{$property}: $value; }
25 | @if $ms { -ms-#{$property}: $value; }
26 | @if $o { -o-#{$property}: $value; }
27 | @if $spec { #{$property}: $value; }
28 | }
29 |
30 | /**
31 | * Add browser prefix to property
32 | *
33 | * Single property
34 | *
35 | * @include prop-prefix(background-image, linear-gradient, (top, #FFF, #CCC), $webkit, $moz, $ms, $o, $spec);
36 | *
37 | *
38 | * @param $selector Selector
39 | * @param $property Property to prepend prefix
40 | * @param $value value of the property
41 | * @param $webkit Whether to add -wekbit prefix
42 | * @param $moz Whether to add -moz prefix
43 | * @param $ms Whether to add -ms prefix
44 | * @param $o Whether to add -o prefix
45 | * @param $spec Whether to add spec property
46 | */
47 | @mixin prop-prefix ($selector, $property, $value, $webkit: true, $moz: true, $ms: false, $o: false, $spec: true) {
48 | @if $webkit { #{$selector}: unquote("-webkit-#{$property}(#{$value})"); }
49 | @if $moz { #{$selector}: unquote(" -moz-#{$property}(#{$value})"); }
50 | @if $ms { #{$selector}: unquote(" -ms-#{$property}(#{$value})"); }
51 | @if $o { #{$selector}: unquote(" -o-#{$property}(#{$value})"); }
52 | @if $spec { #{$selector}: unquote(" #{$property}(#{$value})"); }
53 | }
--------------------------------------------------------------------------------
/src/logs.js:
--------------------------------------------------------------------------------
1 | define(["alertify", "proto", "element", "validate", "log"], function (Alertify, AlertifyProto, element, validate, Log) {
2 | "use strict";
3 |
4 | var init,
5 | createLog,
6 | validateParams,
7 | logs;
8 |
9 | /**
10 | * Init Method
11 | * Create the log holder element
12 | *
13 | * @return {Object} Log holder element
14 | */
15 | init = function () {
16 | var el = element.create("section", { classes: Alertify._prefix + "-logs" });
17 | document.body.appendChild(el);
18 | element.ready(el);
19 | return el;
20 | };
21 |
22 | /**
23 | * Create Log
24 | *
25 | * @param {String} type Log type
26 | * @param {String} msg Log message
27 | * @param {Number} delay [Optional] Delay in ms
28 | * @return {Object}
29 | */
30 | createLog = function (type, msg, delay) {
31 | validateParams(type, msg, delay);
32 | this.el = document.body.contains(this.el) ? this.el : init();
33 | return new Log(this.el, type, msg, delay);
34 | };
35 |
36 | /**
37 | * Validate Parameters
38 | *
39 | * @param {String} type Log type
40 | * @param {String} msg Log message
41 | * @param {Number} delay [Optional] Delay in ms
42 | * @return {undefined}
43 | */
44 | validateParams = function (type, msg, delay) {
45 | if (!validate.isString(type) ||
46 | !validate.isString(msg) ||
47 | !validate.isNumber(delay, true)) {
48 | throw new Error(validate.messages.invalidArguments);
49 | }
50 | };
51 |
52 | /**
53 | * Logs API
54 | *
55 | * @type {Object}
56 | */
57 | logs = {
58 | delay : 5000,
59 | el : undefined,
60 | create: function (type, msg, delay) {
61 | return createLog.call(this, type, msg, delay);
62 | },
63 | error: function (msg, delay) {
64 | return createLog.call(this, "error", msg, delay);
65 | },
66 | info: function (msg, delay) {
67 | return createLog.call(this, "info", msg, delay);
68 | },
69 | success: function (msg, delay) {
70 | return createLog.call(this, "success", msg, delay);
71 | }
72 | };
73 |
74 | AlertifyProto.log = logs;
75 |
76 | return logs;
77 | });
78 |
--------------------------------------------------------------------------------
/test/specs/element.test.js:
--------------------------------------------------------------------------------
1 | define(["../../src/element"], function (element) {
2 | module("Element");
3 |
4 | test("Element object API", function () {
5 | expect(2);
6 | deepEqual(typeof element.create, "function", "element.create is a function");
7 | deepEqual(typeof element.ready, "function", "element.ready is a function");
8 | });
9 |
10 | test("Create element parameters", function () {
11 | expect(4);
12 | try {
13 | element.create({});
14 | } catch (error) {
15 | deepEqual(error.message, "Invalid arguments", "First argument error caught");
16 | }
17 | try {
18 | element.create("article");
19 | deepEqual(1, 1, "Optional argument not provided");
20 | } catch (error) {
21 | }
22 | try {
23 | element.create("article", []);
24 | } catch (error) {
25 | deepEqual(error.message, "Invalid arguments", "Second argument error caught");
26 | }
27 | try {
28 | element.create("article", {});
29 | deepEqual(1, 1, "Optional argument provided and valid");
30 | } catch (error) {
31 | }
32 | });
33 |
34 | test("Creating the element", function () {
35 | expect(4);
36 | var el = element.create("article", {
37 | classes: "alertify-log",
38 | attributes: {
39 | id: "id-test",
40 | "data-prop": "data-test"
41 | }
42 | });
43 | deepEqual(typeof el, "object", "element.create returns an object");
44 | deepEqual(el.className, "alertify-log", "class names appended properly");
45 | deepEqual(el.id, "id-test", "id appended properly");
46 | deepEqual(el.getAttribute("data-prop"), "data-test", "data attribute appended properly");
47 | });
48 |
49 | test("Ready method parameter", function () {
50 | expect(1);
51 | try {
52 | element.ready();
53 | } catch (error) {
54 | deepEqual(error.message, "Invalid arguments", "First argument error caught");
55 | }
56 | });
57 |
58 | test("Element ready method", function () {
59 | expect(1);
60 | var el = element.create("fake");
61 | element.ready(el);
62 | deepEqual(true, true, "element is ready and execution continued");
63 | });
64 | });
65 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | [](http://travis-ci.org/fabien-d/alertify.js)
2 |
3 | # alertify.js - browser dialogs never looked so good
4 |
5 | Checkout the [getting started guide](https://github.com/fabien-d/alertify.js/wiki/Getting-Started) to get up and running with alertify.js. If you're a developer looking to contribute or hack on the source, see [installing alertify.js](https://github.com/fabien-d/alertify.js/wiki/Installing-alertify.js).
6 |
7 | ## Note
8 | **The `master` branch is always the latest development point and will not reflect the latest stable version.** The latest stable version is currently on branch `0.3` and can also be downloaded from the example site below.
9 |
10 | ## Examples
11 |
12 | Deprecated: ~~[alertify.js 0.4.0rc1](http://fabien-d.github.com/alertify.js/0.4.0rc1/) - Release candidate~~
13 | * [alertify.js 0.3.9](http://fabien-d.github.com/alertify.js/) - Latest stable version
14 |
15 | ## Documentation
16 |
17 | Head on over to the [alertify.js wiki](https://github.com/fabien-d/alertify.js/wiki).
18 |
19 | ## Contributing
20 |
21 | Read information on how to [properly log issues](https://github.com/fabien-d/alertify.js/wiki/Opening-Issues) and guidelines to [contribute to alertify.js](https://github.com/fabien-d/alertify.js/wiki/Contributing).
22 |
23 | ## Where is it being tested?
24 |
25 | * Microsoft Internet Explorer 8+ (Standards Mode)
26 | * Google Chrome
27 | * Mozilla FireFox
28 | * Apple Safari
29 | * Opera
30 | * iOS
31 | * Android
32 |
33 | ## Credit where credit is due
34 |
35 | See all list of [contributors](https://github.com/fabien-d/alertify.js/contributors)
36 |
37 | ## Release History
38 |
39 | For full details, see the [alertify.js changesets](https://github.com/fabien-d/alertify.js/wiki/Changeset)
40 |
41 | * 2013/07/06 - 0.3.10
42 | * 2013/04/20 - 0.3.9
43 | * 2013/02/17 - 0.4.0 Release Candidate 1
44 | * 2013/02/04 - 0.3.8
45 | * 2013/01/20 - 0.3.7
46 | * 2013/01/15 - 0.3.6
47 | * 2013/01/12 - 0.3.5
48 | * 2013/01/12 - 0.3.4
49 | * 2013/01/12 - 0.3.3
50 | * 2012/12/24 - 0.3.2
51 | * 2012/12/21 - 0.3.1
52 | * 2012/12/16 - 0.3.0
53 | * 2012/12/09 - 0.2.12
54 |
55 | *wasn't keeping track of changeset before... my bad
56 |
57 | ## License
58 |
59 | Alertify is licensed under MIT http://www.opensource.org/licenses/MIT
60 |
61 | ### Copyright
62 |
63 | Copyright (c) 2012, Fabien Doiron
64 |