Skip to content

Commit

Permalink
finished linking interface with pub/sub; starting unit tests
Browse files Browse the repository at this point in the history
  • Loading branch information
draeton committed Dec 8, 2011
1 parent 28b7ce4 commit f555b23
Show file tree
Hide file tree
Showing 8 changed files with 146 additions and 54 deletions.
10 changes: 5 additions & 5 deletions src/file.js
Expand Up @@ -63,15 +63,15 @@
//
// Removes an icon from the queue
//
// @param {Icon} removeIcon
unqueueIcon: function (removeIcon) {
// @param {Icon} icon
unqueueIcon: function (icon) {
/* remove the icon from the queue */
Stitches.iconQueue = $.grep(Stitches.iconQueue, function (icon) {
return icon !== removeIcon;
Stitches.iconQueue = $.grep(Stitches.iconQueue, function (item) {
return item !== icon;
});

/* notify */
Stitches.pub("file.remove.done", removeIcon);
Stitches.pub("file.remove.done", icon);
},

// ### unqueueAllIcons
Expand Down
73 changes: 65 additions & 8 deletions src/page.js
Expand Up @@ -70,6 +70,42 @@
}
throw e;
},

// ## subscribe
//
// Handles all subscriptions
subscribe: function () {
var buttons = Stitches.Page.buttons,
$droplabel = Stitches.Page.$droplabel;

/* handle drop label and buttons on queue length changes */
Stitches.sub("file.icon.done", function (icon) {
if (Stitches.iconQueue.length === 1) {
$droplabel.fadeOut("fast");
buttons.$generate.removeClass("disabled");
buttons.$clear.removeClass("disabled");
}
buttons.$sprite.addClass("disabled");
buttons.$stylesheet.addClass("disabled");
});
Stitches.sub("file.remove.done", function (icon) {
if (Stitches.iconQueue.length < 1) {
$droplabel.fadeIn("fast");
buttons.$generate.addClass("disabled");
buttons.$clear.addClass("disabled");
}
buttons.$sprite.addClass("disabled");
buttons.$stylesheet.addClass("disabled");
});

/* handle sprite and stylesheet generation */
Stitches.sub("sprite.image.done", function (data) {
buttons.$sprite.attr("href", data).removeClass("disabled");
});
Stitches.sub("sprite.stylesheet.done", function (data) {
buttons.$stylesheet.attr("href", data).removeClass("disabled");
});
},

// #### *Private no operation method*
_noop: function (e) {
Expand Down Expand Up @@ -125,20 +161,41 @@

// #### *Private button methods*
_generate: function (e) {
var icons = [];
Stitches.Page.$filelist.find("li").each(function () {
var icon = $(this).data("icon");
icons.push(icon);
});
Stitches.pub("sprite.generate", icons);
/* [].concat to copy array */
Stitches.pub("sprite.generate", [].concat(Stitches.iconQueue));
},

_removeFile: function (e) {
// find the corresponding file and remove from queue
var icon = $(this).parent("li").data("icon");
Stitches.pub("file.unqueue", icon);
},

_removeAllFiles: function (e) {
// a lot happens here
Stitches.pub("file.unqueue.all");
},

// ### addIcon
//
// Add an icon to the file list
// @param {Icon} icon
addIcon: function (icon) {
$(Stitches.Page.templates.icon(icon))
.data("icon", icon)
.appendTo(Stitches.Page.$filelist)
.fadeIn("fast");
},

// ### removeIcon
//
// Remove an icon from the file list
// @param {Icon} icon
removeIcon: function (icon) {
Stitches.Page.$filelist.find("li")
.filter(function () {
return $(this).data("icon") === icon;
})
.fadeOut("fast")
.remove();
}
};
})();
Expand Down
8 changes: 4 additions & 4 deletions src/stitches.html
Expand Up @@ -6,10 +6,10 @@
<ul class="filelist"></ul>
</div>
<div class="buttons">
<a href="javascript:void(0)" class="generate">Generate</a>
<a href="javascript:void(0)" class="dlsprite" target=_blank>Sprite &raquo;</a>
<a href="javascript:void(0)" class="dlstylesheet" target=_blank>Stylesheet &raquo;</a>
<a href="javascript:void(0)" class="clear">Clear Images</a>
<a href="javascript:void(0)" class="disabled generate">Generate</a>
<a href="javascript:void(0)" class="disabled dlsprite" target=_blank>Sprite &raquo;</a>
<a href="javascript:void(0)" class="disabled dlstylesheet" target=_blank>Stylesheet &raquo;</a>
<a href="javascript:void(0)" class="disabled clear">Clear Images</a>
</div>
</div>
</script>
Expand Down
54 changes: 34 additions & 20 deletions src/stitches.js
Expand Up @@ -19,10 +19,10 @@
"jsdir": "js"
};

// **Pub/sub subscription manager**
var topics = {};

return {
// **Pub/sub subscription manager**
_topics: {},

// ### init
//
// Readies everything for user interaction.
Expand All @@ -41,8 +41,13 @@
Stitches.sub("page.render.done", Stitches.checkAPIs);
Stitches.sub("page.apis.done", Stitches.Page.bindDragAndDrop);
Stitches.sub("page.apis.done", Stitches.Page.bindButtons);
Stitches.sub("page.apis.done", Stitches.Page.subscribe);
Stitches.sub("page.drop.done", Stitches.File.queueFiles);
Stitches.sub("file.queue.done", Stitches.File.queueIcons);
Stitches.sub("file.icon.done", Stitches.Page.addIcon);
Stitches.sub("file.remove.done", Stitches.Page.removeIcon);
Stitches.sub("file.unqueue", Stitches.File.unqueueIcon);
Stitches.sub("file.unqueue.all", Stitches.File.unqueueAllIcons);
Stitches.sub("sprite.generate", Stitches.generateStitches);

/* notify */
Expand All @@ -56,11 +61,24 @@
// @param {String} topic The subscription topic name
// @param {Function} fn A callback to fire
sub: function (topic, fn) {
var callbacks = topics[topic] || $.Callbacks("stopOnFalse");
var callbacks = Stitches._topics[topic] || $.Callbacks("stopOnFalse");
if (fn) {
callbacks.add(fn);
}
topics[topic] = callbacks;
Stitches._topics[topic] = callbacks;
},

// ### unsub
//
// Unsubscribe from a topic
//
// @param {String} topic The subscription topic name
// @param {Function} fn A callback to remove
unsub: function (topic, fn) {
var callbacks = Stitches._topics[topic];
if (callbacks) {
callbacks.remove(fn);
}
},

// ### pub
Expand All @@ -69,9 +87,8 @@
//
// @param {String} topic The subscription topic name
pub: function (topic) {
var callbacks = topics[topic],
var callbacks = Stitches._topics[topic],
args = Array.prototype.slice.call(arguments, 1);
console.log('publishing: ', topic, callbacks, args)
if (callbacks) {
callbacks.fire.apply(callbacks, args);
}
Expand Down Expand Up @@ -114,9 +131,6 @@
var sprite = Stitches.makeStitches(placedIcons);
var stylesheet = Stitches.makeStylesheet(placedIcons);

Stitches.Page.buttons.$sprite.attr("href", sprite);
Stitches.Page.buttons.$stylesheet.attr("href", stylesheet);

/* notify */
Stitches.pub("sprite.generate.done");
},
Expand Down Expand Up @@ -197,23 +211,23 @@
});

var css = [
".sprite {\n",
" background: url(sprite.png) no-repeat;\n",
"}\n\n"
".sprite {",
" background: url(sprite.png) no-repeat;",
"}\n"
];

$(placedIcons).each(function (idx, icon) {
css.concat([
".sprite-" + icon.name + " {\n",
" width: " + icon.width + "px;\n",
" height: " + icon.height + "px;\n",
" background-position: -" + icon.x + "px -" + icon.y + "px;\n",
"}\n\n"
css = css.concat([
".sprite-" + icon.name + " {",
" width: " + icon.width + "px;",
" height: " + icon.height + "px;",
" background-position: -" + icon.x + "px -" + icon.y + "px;",
"}\n"
]);
});

/* create stylesheet link */
var data = "data:," + encodeURIComponent(css.join(""));
var data = "data:," + encodeURIComponent(css.join("\n"));

/* notify and return */
Stitches.pub("sprite.stylesheet.done", data);
Expand Down
5 changes: 3 additions & 2 deletions tests/index.html
Expand Up @@ -19,8 +19,9 @@
<script src="../src/file.js"></script>

<!-- test runner files -->
<script src="testinit.js"></script>
<script src="qunit/qunit.js"></script>
<script src="tests.js"></script>
<script src="unit/main.js"></script>
</head>
<body class="flora">
<h1 id="qunit-header">QUnit Test Suite</h1>
Expand All @@ -32,6 +33,6 @@ <h2 id="qunit-userAgent"></h2>

</div>

<div id="stitches"></div>
<div id="stitches"></div>
</body>
</html>
13 changes: 13 additions & 0 deletions tests/testinit.js
@@ -0,0 +1,13 @@
(function () {
/**
* Ensures that tests have cleaned up properly after themselves. Should be passed as the
* teardown function on all modules' lifecycle object.
*/
this.moduleTeardown = function () {
// Allow QUnit.reset to clean up any attached elements before checking for leaks
QUnit.reset();

// clear out subscriptions
//Stitches._topics = {};
}
}());
15 changes: 0 additions & 15 deletions tests/tests.js

This file was deleted.

22 changes: 22 additions & 0 deletions tests/unit/main.js
@@ -0,0 +1,22 @@
module("main", {teardown: moduleTeardown});

test("Basic requirements", function() {
expect(4);
ok( window, "window" );
ok( Stitches, "Stitches" );
ok( jQuery, "jQuery" );
ok( $, "$" );
});

test("Stitches.init()", function () {
expect(2);

equal( typeof Stitches.init, "function" );
equal( Stitches.init.length, 2 );
});

// for now, do the init method here
$(function ($) {
var $elem = $("#stitches");
Stitches.init($elem, {jsdir: "../src"});
});

0 comments on commit f555b23

Please sign in to comment.