Add support of editing bookmarks.

1 files changed, 77 insertions, 24 deletions

diff --git a/apps/bookmarks/js/bookmarks.js b/apps/bookmarks/js/bookmarks.js
index fe8a266686f..e26a9a80fb1 100644
--- a/apps/bookmarks/js/bookmarks.js
+++ b/apps/bookmarks/js/bookmarks.js
@@ -8,7 +8,7 @@ $(document).ready(function() {
 		$('.bookmarks_add').slideToggle();
 	});
 	
-	$('#bookmark_add_submit').click(addBookmark);
+	$('#bookmark_add_submit').click(addOrEditBookmark);
 	$(window).scroll(updateOnBottom);
 	
 	$('#bookmark_add_url').focusout(getMetadata);
@@ -34,12 +34,15 @@ function getBookmarks() {
 			bookmarks_page += 1;
 			$('.bookmark_link').unbind('click', recordClick);
 			$('.bookmark_delete').unbind('click', delBookmark);
+			$('.bookmark_edit').unbind('click', showBookmark);
 	
 			for(var i in bookmarks.data) {
 				updateBookmarksList(bookmarks.data[i]);
 			}
 			$('.bookmark_link').click(recordClick);
 			$('.bookmark_delete').click(delBookmark);
+			$('.bookmark_edit').click(showBookmark);
+			
 			bookmarks_loading = false;
 		}
 	});	
@@ -73,7 +76,12 @@ function changeSorting(sortEl) {
 	getBookmarks();
 }
 
-function addBookmark(event) {
+// function addBookmark() {
+// Instead of creating editBookmark() function, Converted the one above to
+// addOrEditBookmark() to make .js file more compact.
+
+function addOrEditBookmark(event) {
+	var id = $('#bookmark_add_id').val();
 	var url = encodeEntities($('#bookmark_add_url').val())
 	var title = encodeEntities($('#bookmark_add_title').val())
 	var description = encodeEntities($('#bookmark_add_description').val())
@@ -81,25 +89,49 @@ function addBookmark(event) {
 	var taglist = tags.split(' ')
 	var tagshtml = '';
 	for ( var i=0, len=taglist.length; i<len; ++i ){
-		tagshtml += '<a class="bookmark_tags" href="?tag=' + encodeURI(taglist[i]) + '">' + taglist[i] + '</a> ';
+		tagshtml += '<a class="bookmark_tag" href="?tag=' + encodeURI(taglist[i]) + '">' + taglist[i] + '</a> ';
 	}
-	$.ajax({
-		url: 'ajax/addBookmark.php',
-		data: 'url=' + encodeURI(url) + '&title=' + encodeURI(title) + '&description=' + encodeURI(description) + '&tags=' + encodeURI(tags),
-		success: function(data){ 
-			$('.bookmarks_add').slideToggle(); 
-			$('.bookmarks_add').children('p').children('.bookmarks_input').val(''); 
-			$('.bookmarks_list').prepend(
-			'<div class="bookmark_single">' +
-				'<p class="bookmark_title"><a href="' + url + '" target="_new" class="bookmark_link">' + title + '</a></p>' +
-				'<p class="bookmark_url">' + url + '</p>' +
-				'<p class="bookmark_description">' + description + '</p>' +
-				'<p>' + tagshtml + '</p>' +
-				'<p class="bookmark_actions"><span class="bookmark_delete">Delete</span></p>' +
-			'</div>'
-			);
-		}
-	});
+	
+	if (id == 0) {
+		$.ajax({
+			url: 'ajax/addBookmark.php',
+			data: 'url=' + encodeURI(url) + '&title=' + encodeURI(title) + '&description=' + encodeURI(description) + '&tags=' + encodeURI(tags),
+			success: function(data){ 
+				$('.bookmarks_add').slideToggle(); 
+				$('.bookmarks_add').children('p').children('.bookmarks_input').val(''); 
+				$('.bookmarks_list').prepend(
+				'<div class="bookmark_single">' +
+					'<p class="bookmark_title"><a href="' + url + '" target="_new" class="bookmark_link">' + title + '</a></p>' +
+					'<p class="bookmark_url">' + url + '</p>' +
+					'<p class="bookmark_description">' + description + '</p>' +
+					'<p class="bookmark_tags">' + tagshtml + '</p>' +
+					'<p class="bookmark_actions"><span class="bookmark_delete">Delete</span></p>' +
+				'</div>'
+				);
+			}
+		});
+	}
+	else {
+		$.ajax({
+			url: 'ajax/editBookmark.php',
+			data: 'id=' + id + '&url=' + encodeURI(url) + '&title=' + encodeURI(title) + '&description=' + 
+				encodeURI(description) + '&tags=' + encodeURI(tags),
+			success: function(){ 
+				$('.bookmarks_add').slideToggle(); 
+				$('.bookmarks_add').children('p').children('.bookmarks_input').val(''); 
+				var record = $('.bookmark_single[data-id = "' + id + '"]');
+				record.children('.bookmark_url:first').text(url);
+				record.children('.bookmark_description:first').text(description);
+				
+				var record_title = record.children('.bookmark_title:first').children('a:first');
+				record_title.attr('href', url);
+				record_title.text(title);
+				
+				record.children('.bookmark_tags:first').html(tagshtml);
+			}
+		});
+	}
+	
 }
 
 function delBookmark(event) {
@@ -111,22 +143,43 @@ function delBookmark(event) {
 	});
 }
 
+function showBookmark(event) {
+	var record = $(this).parent().parent();
+	$('#bookmark_add_id').val(record.attr('data-id'));
+	$('#bookmark_add_url').val(record.children('.bookmark_url:first').text());
+	$('#bookmark_add_title').val(record.children('.bookmark_title:first').text());
+	$('#bookmark_add_description').val(record.children('.bookmark_description:first').text());
+	$('#bookmark_add_tags').val(record.children('.bookmark_tags:first').text());
+	
+	if ($('.bookmarks_add').css('display') == 'none') {
+		$('.bookmarks_add').slideToggle();
+	}
+	$('html, body').animate({
+			scrollTop: $('.bookmarks_menu').offset().top
+		}, 500);
+
+}
+
+function editBookmark(event) {
+	
+}
+
 function updateBookmarksList(bookmark) {
 	var tags = encodeEntities(bookmark.tags).split(' ');
 	var taglist = '';
 	for ( var i=0, len=tags.length; i<len; ++i ){
-		taglist = taglist + '<a class="bookmark_tags" href="?tag=' + encodeURI(tags[i]) + '">' + tags[i] + '</a> ';
+		taglist = taglist + '<a class="bookmark_tag" href="?tag=' + encodeURI(tags[i]) + '">' + tags[i] + '</a> ';
 	}
 	if(!hasProtocol(bookmark.url)) {
 		bookmark.url = 'http://' + bookmark.url;
 	}
 	$('.bookmarks_list').append(
-		'<div class="bookmark_single">' +
+		'<div class="bookmark_single" data-id="' + bookmark.id +'" >' +
 			'<p class="bookmark_title"><a href="' + encodeEntities(bookmark.url) + '" target="_new" class="bookmark_link">' + encodeEntities(bookmark.title) + '</a></p>' +
 			'<p class="bookmark_url">' + encodeEntities(bookmark.url) + '</p>' +
 			'<p class="bookmark_description">' + encodeEntities(bookmark.description) + '</p>' +
-			'<p>' + taglist + '</p>' +
-			'<p class="bookmark_actions"><span class="bookmark_delete">Delete</span></p>' +
+			'<p class="bookmark_tags">' + taglist + '</p>' +
+			'<p class="bookmark_actions"><span class="bookmark_delete">Delete</span>&nbsp;<span class="bookmark_edit">Edit</span></p>' +
 		'</div>'
 	);
 }