Skip to content

Commit

Permalink
Task #27 Refactoring bookmarking to prevent duplication. Adding gette…
Browse files Browse the repository at this point in the history 
…rs and setters.
  • Loading branch information
@jesgs @ardathksheyna
jesgs authored and ardathksheyna committed Jul 23, 2017
1 parent 4c5d082 commit 228a57e
Show file tree
Hide file tree
Showing 5 changed files with 143 additions and 47 deletions.
120 changes: 76 additions & 44 deletions assets/js/bookmark.js
View file
@@ -1,3 +1,5 @@
var MANGAPRESS = MANGAPRESS || {};

(function ($) {
/**
* @todo Add l10n/i18n support
Expand Down Expand Up @@ -43,69 +45,49 @@
this.storage = localStorage;
this.checkItem();

var bookmarkHistory = JSON.parse(this.storage.getItem(this.BOOKMARK_HISTORY));
if (!bookmarkHistory) {
bookmarkHistory = [];
this.storage.setItem(this.BOOKMARK_HISTORY, JSON.stringify(bookmarkHistory));
if (!this.hasHistory()) {
this.setHistory([]); // set a blank array if no history exists.
}
},

checkItem : function() {
var bookmark = JSON.parse(this.storage.getItem(this.BOOKMARK)),
pageHref = window.location.href;
var bookmark = this.getBookmark();

this.$bookmark = $('#bookmark-comic');
this.$bookmarkNav = $('#comic-bookmark-navigation');
var id = this.$bookmark.data('id');

if (bookmark !== null && bookmark.url == pageHref) {
if (this.bookmarkExists(id)) {
this.$bookmark.text( this.$bookmark.data('bookmarkedLabel') );
}
},

bookmark : function() {
var href = (this.$bookmark.data('href') !== undefined) ? this.$bookmark.data('href') : window.location.href,
pageTitle = (this.$bookmark.data('title') !== undefined) ? this.$bookmark.data('title') : window.document.title,
data = {};

var existingBookmarkData = this.storage.getItem(this.BOOKMARK);

if (existingBookmarkData) {
var bookmarkHistory = JSON.parse(this.storage.getItem(this.BOOKMARK_HISTORY));
if (!bookmarkHistory) {
bookmarkHistory = [];
}

bookmarkHistory.push(existingBookmarkData);
this.storage.setItem(this.BOOKMARK_HISTORY, JSON.stringify(bookmarkHistory));

// change label state
this.$bookmark.text( this.$bookmark.data('bookmarkedLabel') );
data = {
id : this.$bookmark.data('id'),
url : href,
title : pageTitle,
date : Date.now()
};

// add the bookmark to history
console.log(this.bookmarkExists(data.id));
if (this.bookmarkExists(data.id) == 0) {
this.addToHistory( data );
}

data = {
url : href,
title : pageTitle,
date : Date.now()
};

this.storage.setItem(this.BOOKMARK, JSON.stringify(data));
// change label state
this.$bookmark.text( this.$bookmark.data('bookmarkedLabel') );
this.setBookmark(data);
},

history : function() {
var self = this,
revBookmarkHistory = JSON.parse(self.storage.getItem(self.BOOKMARK_HISTORY));

var $historyModal = $('<div id="bookmark-history-modal"><div id="bookmark-history-content"></div><p>[<a href="#" id="bookmark-history-close">close</a>]</p></div>')
.css({
'width': '300px',
'z-index' : 9999,
'border' : '1px solid black',
'background-color' : '#fff',
'position' : 'absolute',
'padding' : '5px',
'left' : '50%',
'margin-left' : '-150px'
});
revBookmarkHistory = self.getHistory(),
$historyModal = $('<div id="bookmark-history-modal"><div id="bookmark-history-content"></div><p style="text-align: center;">[<a href="#" id="bookmark-history-close">close</a>]</p></div>')
.css(MANGAPRESS.bookmarkStyles);

$historyModal.find('#bookmark-history-content').html(function(){
if (revBookmarkHistory.length == 0) {
Expand All @@ -115,11 +97,11 @@
var htmlString = "<table>",
bookmarkHistory = revBookmarkHistory.reverse();

htmlString = "<thead><tr><td>Title</td><td>Date</td></tr></thead>";
htmlString += "<thead><tr><td>Title</td><td>Date</td></tr></thead>";

for (var i = 0; i < bookmarkHistory.length; i++) {
var columns = [],
bookmark = JSON.parse(bookmarkHistory[i]),
bookmark = bookmarkHistory[i],
d = new Date(bookmark.date),
date = d.getMonth() + '/' + d.getDate() + '/' + d.getFullYear(),
link = "<a href=\"" + bookmark.url + "\">" + bookmark.title + "</a>";
Expand All @@ -140,6 +122,56 @@
e.preventDefault();
$historyModal.remove();
});
},

getBookmark : function() {
return JSON.parse(this.storage.getItem(this.BOOKMARK));
},

setBookmark : function(bookmark) {
this.storage.setItem(
this.BOOKMARK,
JSON.stringify(bookmark)
);
},

getHistory : function() {
var history = JSON.parse(this.storage.getItem(this.BOOKMARK_HISTORY));
if (history == null) {
return []; // return empty array
}

return history;
},

setHistory : function(history) {
this.storage.setItem(
this.BOOKMARK_HISTORY,
JSON.stringify(history)
);
},

addToHistory : function(bookmark) {
var history = this.getHistory();

history.push( bookmark );
this.setHistory(history);
},

hasHistory : function() {
return this.getHistory().length;
},

hasBookmark : function() {
return this.getBookmark();
},

bookmarkExists : function(id) {
var history = this.getHistory();

return $.grep(history, function(e){
return e.id == id;
}).length;
}
};
}(jQuery));
19 changes: 19 additions & 0 deletions includes/functions.php
View file
Expand Up @@ -20,6 +20,25 @@
define('MP_CATEGORY_CHILDREN', 2);
define('MP_CATEGORY_ALL', 3);

function mangapress_bookmark_styles($styles)
{
$styles = array(
'bookmarkStyles' => array(
'width' => '300px',
'z-index' => 9999,
'border' => '1px solid black',
'background-color' => '#fff',
'position' => 'absolute',
'padding' => '5px',
'left' => '50%',
'margin-left' => '-150px'
),
);

return $styles;
}
add_filter('mangapress_bookmark_styles', 'mangapress_bookmark_styles');

/**
* Checks queried object against settings to see if query is for either
* latest comic or comic archive.
Expand Down
41 changes: 40 additions & 1 deletion includes/template-functions.php
View file
Expand Up @@ -17,10 +17,49 @@
* @todo Add l10/i18n functionality
* @todo Define $attrs parameters
* @param array $attrs Attributes
* @return string
*/
function mangapress_bookmark_button($attrs)
{
echo "<a href=\"#\" id=\"bookmark-comic\" data-label=\"Bookmark\" data-bookmarked-label=\"Bookmarked\">Bookmark</a>";
global $post;

$a = wp_parse_args($attrs,
array(
'show_history' => false,
'echo' => true,
)
);

extract($a); // gross...

$nav = '<nav id="comic-bookmark-navigation">%1$s</nav>';

$links = array();
$data_attribs_array = array(
'id' => $post->ID,
'href' => get_permalink($post->ID),
'title' => get_post_field('post_title', $post->ID, 'attribute'),
);

$data_attribs_string = '';
foreach ($data_attribs_array as $attrib => $value) {
$data_attribs_string .= 'data-' . $attrib . '="' . $value . '" ';
}


$links[] ="<a href=\"#\" id=\"bookmark-comic\" {$data_attribs_string} data-label=\"Bookmark\" data-bookmarked-label=\"Bookmarked\">Bookmark</a>";
if ($show_history) {
$links[] = "<a href=\"#\" id=\"bookmark-comic-history\">Bookmark History</a>";
}

$html = '<ul><li>' . implode('</li><li>', $links) . '</li></ul>';

$html = vsprintf($nav, array($html));
if ($echo) {
echo $html;
} else {
return $html;
}
}

/**
Expand Down
2 changes: 1 addition & 1 deletion mangapress-posts.php
View file
Expand Up @@ -315,7 +315,7 @@ public function enqueue_scripts()

wp_localize_script(
'mangapress-media-popup',
MP_DOMAIN,
strtoupper(MP_DOMAIN),
array(
'title' => __('Upload or Choose Your Comic Image File', MP_DOMAIN),
'button' => __('Insert Comic into Post', MP_DOMAIN),
Expand Down
8 changes: 7 additions & 1 deletion mangapress.php
View file
Expand Up @@ -346,12 +346,18 @@ public function wp_enqueue_other_scripts()
wp_register_script(
'mangapress-bookmark',
plugins_url( '/assets/js/bookmark.js', __FILE__ ),
// MP_URLPATH . 'assets/js/bookmark.js',
array('jquery'),
MP_VERSION,
true
);

$bookmark_styles = apply_filters('mangapress_bookmark_styles', array());
wp_localize_script(
'mangapress-bookmark',
strtoupper(MP_DOMAIN),
$bookmark_styles
);

wp_enqueue_script('mangapress-bookmark');
}

Expand Down

0 comments on commit 228a57e

Please sign in to comment.