bookmark widget finished

This commit is contained in:
John Bintz 2009-08-23 17:18:36 -04:00
parent 88c75878e4
commit 8fddd12ed4
3 changed files with 72 additions and 157 deletions

View File

@ -13,88 +13,15 @@ class ComicPressAddonBookmarkWidget extends ComicPressAddon {
wp_enqueue_script('prototype'); wp_enqueue_script('prototype');
wp_enqueue_script('cookiejar', get_template_directory_uri() . '/js/cookiejar.js', array('prototype')); wp_enqueue_script('cookiejar', get_template_directory_uri() . '/js/cookiejar.js', array('prototype'));
wp_enqueue_script('bookmark', get_template_directory_uri() . '/js/bookmark.js', array('prototype', 'cookiejar'));
} }
function wp_head() { function wp_head() { ?>
$last_comic = $this->comicpress->get_last_comic(); ?> <script type="text/javascript">
<script type="text/javascript"> var image_root = '<?php bloginfo('template_directory'); ?>/images/';
var image_root = '<?php bloginfo('template_directory'); ?>/images/'; var permalink = '<?php the_permalink() ?>';
</script>
var button_images = { <?php }
'clear-tag': {
'off': '3a.gif', 'on': '3.gif'
},
'goto-tag': {
'off': '2a.gif', 'on': '2.gif'
}
};
var permalink = '<?php echo get_permalink($last_comic->ID) ?>';
var BookmarkInfo = Class.create({
'default': {
'permalink': false
},
'initialize': function() {
this.jar = new CookieJar({
'expires': 60 * 60 * 24 * 31,
'path': '<?php bloginfo('template_directory') ?>'
});
},
'read': function() {
var bookmark_info = this.jar.get('bookmark-info');
return bookmark_info;
},
'write': function(bookmark_info) {
this.jar.put('bookmark-info', bookmark_info);
if (this.onWrite) { this.onWrite(bookmark_info); }
}
});
Event.observe(window, 'load', function() {
var bookmark_info = new BookmarkInfo();
var info = bookmark_info.read();
var hrefs = {};
$$('#comic-bookmark-holder a').each(function(a) {
var name = $w(a.className).shift();
hrefs[name] = a;
});
var set_goto_tag = function(i) {
top.console.log(i);
hrefs['goto-tag'].href = (i.permalink ? i.permalink : "#");
[ 'goto-tag','clear-tag' ].each(function(which) {
hrefs[which].select('img')[0].src = image_root + button_images[which][i.permalink ? "on" : "off"];
top.console.log(i.permalink ? "on" : "off");
});
};
bookmark_info.onWrite = function(i) { set_goto_tag(i); }
set_goto_tag(info);
Event.observe(hrefs['tag-page'], 'click', function(e) {
Event.stop(e);
info.permalink = permalink;
bookmark_info.write(info);
});
Event.observe(hrefs['clear-tag'], 'click', function(e) {
Event.stop(e);
info.permalink = false;
bookmark_info.write(info);
});
Event.observe(hrefs['goto-tag'], 'click', function(e) {
if (hrefs['goto-tag'].href == "#") { Event.stop(e); }
});
});
</script>
<?php
}
function render_widget() { function render_widget() {
?> ?>
@ -102,7 +29,6 @@ class ComicPressAddonBookmarkWidget extends ComicPressAddon {
<a href="#" class="tag-page"><img src="<?php bloginfo('template_directory'); ?>/images/1.gif" /></a> <a href="#" class="tag-page"><img src="<?php bloginfo('template_directory'); ?>/images/1.gif" /></a>
<a href="#" class="goto-tag"><img /></a> <a href="#" class="goto-tag"><img /></a>
<a href="#" class="clear-tag"><img /></a> <a href="#" class="clear-tag"><img /></a>
<a href="#" class="info-tag"><img src="<?php bloginfo('template_directory'); ?>/images/4.gif" </a>
</div> </div>
<?php <?php
} }

View File

@ -1,81 +1,70 @@
var cl = 31; var button_images = {
'clear-tag': {
/* Below are our functions for this little script */ 'off': '3a.gif', 'on': '3.gif'
},
function bmhome() { 'goto-tag': {
if(document.getElementById) { 'off': '2a.gif', 'on': '2.gif'
document.getElementById('gtc').src = imgGotoOn;
document.getElementById('rmc').src = imgClearOn;
} }
createCookie("bm", comicPermalink, cl); };
}
function bm() { var BookmarkInfo = Class.create({
if(document.getElementById) { 'default': {
document.getElementById('gtc').src = imgGotoOn; 'permalink': false
document.getElementById('rmc').src = imgClearOn; },
} 'initialize': function() {
createCookie("bm", window.location, cl); this.jar = new CookieJar({
} 'expires': 60 * 60 * 24 * 31,
'path': '/'
});
},
'read': function() {
var bookmark_info = this.jar.get('bookmark-info');
function bmc() { if ((typeof(bookmark_info) != 'object') || (bookmark_info == null)) {
if(document.getElementById) { bookmark_info = this.default;
document.getElementById('gtc').src = imgGotoOff; }
document.getElementById('rmc').src = imgClearOff;
return bookmark_info;
},
'write': function(bookmark_info) {
this.jar.put('bookmark-info', bookmark_info);
if (this.onWrite) { this.onWrite(bookmark_info); }
} }
createCookie("bm","",-1); });
}
Event.observe(window, 'load', function() {
var bookmark_info = new BookmarkInfo();
var info = bookmark_info.read();
function gto() { var hrefs = {};
var g = readCookie('bm'); $$('#comic-bookmark-holder a').each(function(a) {
if(g) { var name = $w(a.className).shift();
window.location = g; hrefs[name] = a;
} });
}
var set_goto_tag = function(i) {
hrefs['goto-tag'].href = (i.permalink ? i.permalink : "#");
[ 'goto-tag','clear-tag' ].each(function(which) {
hrefs[which].select('img')[0].src = image_root + button_images[which][i.permalink ? "on" : "off"];
});
};
bookmark_info.onWrite = function(i) { set_goto_tag(i); }
set_goto_tag(info);
/* The follow functions have been borrowed from Peter-Paul Koch. Please find them here: http://www.quirksmode.org */ Event.observe(hrefs['tag-page'], 'click', function(e) {
Event.stop(e);
function createCookie(name,value,days) { info.permalink = permalink;
if (days) { bookmark_info.write(info);
var date = new Date(); });
date.setTime(date.getTime()+(days*24*60*60*1000));
var expires = "; expires="+date.toGMTString(); Event.observe(hrefs['clear-tag'], 'click', function(e) {
} else var expires = ""; Event.stop(e);
document.cookie = name+"="+value+expires+"; path="+comicDir; info.permalink = false;
} bookmark_info.write(info);
function readCookie(name) { });
var nameEQ = name + "=";
var ca = document.cookie.split(';'); Event.observe(hrefs['goto-tag'], 'click', function(e) {
for(var i=0;i < ca.length;i++) { if (hrefs['goto-tag'].href == "#") { Event.stop(e); }
var c = ca[i]; });
while (c.charAt(0)==' ') c = c.substring(1,c.length); });
if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
}
return null;
}
function writeBookmarkWidget() {
createCookie('t', 1);
var c = readCookie('t');
if (c && document.getElementById) {
var l = readCookie('bm');
var gt = imgGotoOff;
var ct = imgClearOff;
if (l) {
gt = imgGotoOn;
ct = imgClearOn;
}
document.write('<div id="bmh" style="width: 173px; margin: 15px 0 0 0; padding: 5px; position: absolute; color: #eee; font-size: 11px; background-color:#222; border: 1px solid #ccc; visibility: hidden;"><b>COMIC BOOKMARK</b><br />Click "Tag Page" to bookmark a comic page. When you return to the site, click "Goto Tag" to continue where you left off.</div>');
if (isHome) {
document.write('<a href="#" onClick="bmhome();return false;"><img src="'+imgTag+'" alt="Tag This Page" border="0"></a>');
document.write('<a href="#" onClick="gto();return false;"><img src="'+gt+'" alt="Goto Tag" border="0" id="gtc"></a>');
document.write('<a href="#" onClick="bmc();return false;"><img src="'+ct+'" alt="Clear Tag" border="0" id="rmc"></a>');
document.write('<a href="#" onMouseOver="document.getElementById(\'bmh\').style.visibility=\'visible\';" onMouseOut="document.getElementById(\'bmh\').style.visibility=\'hidden\';" onClick="return false;"><img src="'+imgInfo+'" alt="" border="0"></a>');
} else if (isSingle) {
document.write('<a href="#" onClick="bm();return false;"><img src="'+imgTag+'" alt="Tag This Page" border="0"></a>');
document.write('<a href="#" onClick="gto();return false;"><img src="'+gt+'" alt="Goto Tag" border="0" id="gtc"></a>');
document.write('<a href="#" onClick="bmc();return false;"><img src="'+ct+'" alt="Clear Tag" border="0" id="rmc"></a>');
document.write('<a href="#" onMouseOver="document.getElementById(\'bmh\').style.visibility=\'visible\';" onMouseOut="document.getElementById(\'bmh\').style.visibility=\'hidden\';" onClick="return false;"><img src="'+imgInfo+'" alt="" border="0"></a>');
}
}
}

View File

@ -107,7 +107,7 @@ CookieJar.prototype = {
get: function(name) { get: function(name) {
name = this.appendString + name; name = this.appendString + name;
var cookies = document.cookie.match(name + '=(.*?)(;|$)'); var cookies = document.cookie.match(name + '=(.*?)(;|$)');
if (cookies) { if (cookies) {
return (unescape(cookies[1])).evalJSON(); return (unescape(cookies[1])).evalJSON();
} else { } else {
return null; return null;