rework bookmark widget
This commit is contained in:
John Bintz
parent
3b0c3cea0d
commit
64c94a292f
136
js/bookmark.js
136
js/bookmark.js
|
|
@ -1,72 +1,94 @@
|
|||
var button_images = {
|
||||
'clear-tag': {
|
||||
'off': '3a.gif', 'on': '3.gif'
|
||||
},
|
||||
'goto-tag': {
|
||||
'off': '2a.gif', 'on': '2.gif'
|
||||
}
|
||||
};
|
||||
|
||||
var BookmarkInfo = Class.create({
|
||||
'def': {
|
||||
'permalink': false
|
||||
},
|
||||
'initialize': function() {
|
||||
this.jar = new CookieJar({
|
||||
'expires': 60 * 60 * 24 * 31,
|
||||
'path': '/'
|
||||
});
|
||||
},
|
||||
'read': function() {
|
||||
var bookmark_info = this.jar.get('bookmark-info');
|
||||
'permalink': false
|
||||
},
|
||||
'initialize': function() {
|
||||
this.jar = new CookieJar({
|
||||
'expires': 60 * 60 * 24 * 31,
|
||||
'path': '/'
|
||||
});
|
||||
},
|
||||
'read': function() {
|
||||
var bookmark_info = this.jar.get('bookmark-info');
|
||||
|
||||
if ((typeof(bookmark_info) != 'object') || (bookmark_info == null)) {
|
||||
bookmark_info = this.def;
|
||||
}
|
||||
if ((typeof(bookmark_info) != 'object') || (bookmark_info == null)) {
|
||||
bookmark_info = this.def;
|
||||
}
|
||||
|
||||
return bookmark_info;
|
||||
},
|
||||
'write': function(bookmark_info) {
|
||||
this.jar.put('bookmark-info', bookmark_info);
|
||||
if (this.onWrite) { this.onWrite(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 ComicBookmark = {};
|
||||
ComicBookmark.setup = function(id, mode, url, elements) {
|
||||
var bookmark_info = new BookmarkInfo();
|
||||
var info = bookmark_info.read();
|
||||
|
||||
if ($('comic-bookmark-holder')) {
|
||||
var hrefs = {};
|
||||
$$('#comic-bookmark-holder a').each(function(a) {
|
||||
if ($(id)) {
|
||||
var hrefs = {};
|
||||
$$('#' + id + ' a').each(function(a) {
|
||||
var name = $w(a.className).shift();
|
||||
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"];
|
||||
});
|
||||
};
|
||||
switch (mode) {
|
||||
case 'three-button':
|
||||
var set_goto_tag = function(i) {
|
||||
hrefs['goto-tag'].href = (i.permalink ? i.permalink : "#");
|
||||
['goto-tag','clear-tag'].each(function(which) {
|
||||
hrefs[which].innerHTML = elements[which + '-' + (i.permalink ? "on" : "off")];
|
||||
});
|
||||
};
|
||||
|
||||
bookmark_info.onWrite = function(i) { set_goto_tag(i); }
|
||||
set_goto_tag(info);
|
||||
hrefs['tag-page'].innerHTML = elements['tag-page'];
|
||||
|
||||
Event.observe(hrefs['tag-page'], 'click', function(e) {
|
||||
Event.stop(e);
|
||||
info.permalink = permalink;
|
||||
bookmark_info.write(info);
|
||||
});
|
||||
bookmark_info.onWrite = function(i) { set_goto_tag(i); }
|
||||
set_goto_tag(info);
|
||||
|
||||
Event.observe(hrefs['clear-tag'], 'click', function(e) {
|
||||
Event.stop(e);
|
||||
info.permalink = false;
|
||||
bookmark_info.write(info);
|
||||
});
|
||||
hrefs['tag-page'].observe('click', function(e) {
|
||||
Event.stop(e);
|
||||
info.permalink = url;
|
||||
bookmark_info.write(info);
|
||||
});
|
||||
|
||||
Event.observe(hrefs['goto-tag'], 'click', function(e) {
|
||||
if (hrefs['goto-tag'].href == "#") { Event.stop(e); }
|
||||
});
|
||||
}
|
||||
});
|
||||
hrefs['goto-tag'].observe('click', function(e) {
|
||||
if (hrefs['goto-tag'].href == "#") { Event.stop(e); }
|
||||
});
|
||||
|
||||
hrefs['clear-tag'].observe('click', function(e) {
|
||||
Event.stop(e);
|
||||
info.permalink = false;
|
||||
bookmark_info.write(info);
|
||||
});
|
||||
|
||||
break;
|
||||
case 'one-button':
|
||||
var set_goto_tag = function(i) {
|
||||
hrefs['bookmark-clicker'].href = (i.permalink ? i.permalink : "#");
|
||||
hrefs['bookmark-clicker'].innerHTML = elements['bookmark-clicker-' + (i.permalink ? "on" : "off")];
|
||||
};
|
||||
bookmark_info.onWrite = function(i) { set_goto_tag(i); }
|
||||
set_goto_tag(info);
|
||||
|
||||
hrefs['bookmark-clicker'].observe('click', function(e) {
|
||||
var current_link = info.permalink;
|
||||
info.permalink = (hrefs['bookmark-clicker'].href.match(/#$/)) ? url : false;
|
||||
bookmark_info.write(info);
|
||||
|
||||
if (hrefs['bookmark-clicker'].href.match(/#$/) == null) {
|
||||
hrefs['bookmark-clicker'].href = url;
|
||||
Event.stop(e);
|
||||
} else {
|
||||
document.location.href = current_link;
|
||||
Event.stop(e);
|
||||
}
|
||||
});
|
||||
|
||||
break;
|
||||
}
|
||||
}
|
||||
};
|
||||
|
|
|
|||
|
|
@ -33,11 +33,11 @@ class BookmarkWidget extends WP_Widget {
|
|||
)
|
||||
),
|
||||
'one-button' => array(
|
||||
'set-bookmark' => array(
|
||||
'bookmark-clicker-off' => array(
|
||||
'label' => __('Set bookmark', 'comicpress'),
|
||||
'default' => __('+Bookmark', 'comicpress')
|
||||
),
|
||||
'use-bookmark' => array(
|
||||
'bookmark-clicker-on' => array(
|
||||
'label' => __('Use bookmark', 'comicpress'),
|
||||
'default' => __('>>Bookmark', 'comicpress')
|
||||
)
|
||||
|
|
@ -145,11 +145,43 @@ class BookmarkWidget extends WP_Widget {
|
|||
return $instance;
|
||||
}
|
||||
|
||||
function widget($instance) {
|
||||
?>
|
||||
<div id="comic-bookmark-holder">
|
||||
<a href="#" class="tag-page"><img src="<?php echo get_template_directory_uri() ?>/images/1.gif" /></a><a href="#" class="goto-tag"><img /></a><a href="#" class="clear-tag"><img /></a>
|
||||
</div>
|
||||
<?php
|
||||
function widget($args, $instance) {
|
||||
global $post;
|
||||
extract($args, EXTR_SKIP);
|
||||
|
||||
echo $before_widget;
|
||||
|
||||
$title = empty($instance['title']) ? '' : apply_filters('widget_title', $instance['title']);
|
||||
if (!empty($title)) { echo $before_title . $title . $after_title; };
|
||||
|
||||
$id = 'comic-bookmark-' . md5(rand());
|
||||
switch ($instance['mode']) {
|
||||
case 'three-button': ?>
|
||||
<div class="bookmark-widget" id="<?php echo $id ?>">
|
||||
<a href="#" class="tag-page"></a>
|
||||
<a href="#" class="goto-tag"></a>
|
||||
<a href="#" class="clear-tag"></a>
|
||||
</div>
|
||||
<?php break;
|
||||
case 'one-button': ?>
|
||||
<div class="bookmark-widget" id="<?php echo $id ?>">
|
||||
<a href="#" class="bookmark-clicker"></a>
|
||||
</div>
|
||||
<?php break;
|
||||
} ?>
|
||||
<script type="text/javascript">
|
||||
(function() {
|
||||
ComicBookmark.setup('<?php echo $id ?>', '<?php echo $instance['mode'] ?>', '<?php echo get_permalink($post) ?>', {
|
||||
<?php
|
||||
$elements = array();
|
||||
foreach (array_keys($this->text_fields[$instance['mode']]) as $field) {
|
||||
$elements[] = "'{$field}': '{$instance[$field]}'";
|
||||
}
|
||||
echo implode(',', $elements);
|
||||
?>
|
||||
});
|
||||
}());
|
||||
</script><?php
|
||||
echo $after_widget;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue