tooltips, bookmark streams and clear browsing history

QvitterPlugin.php

@@ -147,6 +147,8 @@ class QvitterPlugin extends Plugin {
 		$m->connect('api/statuses/public_and_external_timeline.:format',
 					array('action' => 'ApiTimelinePublicAndExternal',
 						  'format' => '(xml|json|rss|atom|as)'));
+        $m->connect('api/qvitter/update_bookmarks.json',
+					array('action' => 'ApiQvitterUpdateBookmarks'));
         $m->connect('api/qvitter/update_link_color.json',
 					array('action' => 'apiqvitterupdatelinkcolor'));
 		$m->connect('api/qvitter/update_background_color.json',

actions/apiqvitterupdatebookmarks.php

@@ -0,0 +1,84 @@
+<?php
+
+  /* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
+   ·                                                                            ·
+   ·  Update the user's bookmarks                                               ·
+   ·                                                                            ·
+   - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
+  ·                                                                             ·
+  ·                                                                             ·
+  ·                             Q V I T T E R                                   ·
+  ·                                                                             ·
+  ·              http://github.com/hannesmannerheim/qvitter                     ·
+  ·                                                                             ·
+  ·                                                                             ·
+  ·                                 <o)                                         ·
+  ·                                  /_////                                     ·
+  ·                                 (____/                                      ·
+  ·                                          (o<                                ·
+  ·                                   o> \\\\_\                                 ·
+  ·                                 \\)   \____)                                ·
+  ·                                                                             ·
+  ·                                                                             ·
+  ·                                                                             ·
+  ·  Qvitter is free  software:  you can  redistribute it  and / or  modify it  ·
+  ·  under the  terms of the GNU Affero General Public License as published by  ·
+  ·  the Free Software Foundation,  either version three of the License or (at  ·
+  ·  your option) any later version.                                            ·
+  ·                                                                             ·
+  ·  Qvitter is distributed  in hope that  it will be  useful but  WITHOUT ANY  ·
+  ·  WARRANTY;  without even the implied warranty of MERCHANTABILTY or FITNESS  ·
+  ·  FOR A PARTICULAR PURPOSE.  See the  GNU Affero General Public License for  ·
+  ·  more details.                                                              ·
+  ·                                                                             ·
+  ·  You should have received a copy of the  GNU Affero General Public License  ·
+  ·  along with Qvitter. If not, see <http://www.gnu.org/licenses/>.            ·
+  ·                                                                             ·
+  ·  Contact h@nnesmannerhe.im if you have any questions.                       ·
+  ·                                                                             ·
+  · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · */
+
+
+if (!defined('GNUSOCIAL')) { exit(1); }
+
+class ApiQvitterUpdateBookmarksAction extends ApiAuthAction
+{
+    var $bookmarks = null;
+
+    protected $needPost = true;
+
+    /**
+     * Take arguments for running
+     *
+     * @param array $args $_REQUEST args
+     *
+     * @return boolean success flag
+     */
+    protected function prepare(array $args=array())
+    {
+        parent::prepare($args);
+
+        $this->bookmarks = $this->trimmed('bookmarks');
+
+        return true;
+    }
+
+    /**
+     * Handle the request
+     *
+     * @param array $args $_REQUEST data (unused)
+     *
+     * @return void
+     */
+    protected function handle()
+    {
+        parent::handle();
+
+        // save the new bookmarks
+		$saved = Profile_prefs::setData($this->scoped, 'qvitter', 'bookmarks', $this->bookmarks);
+
+        $this->initDocument('json');
+        $this->showJsonObjects($saved);
+        $this->endDocument('json');
+    }
+}

actions/qvitter.php

@@ -238,6 +238,19 @@ class QvitterAction extends ApiAction
 					window.siteLicenseURL = '<?php print common_config('license', 'url'); ?>';
 					window.customTermsOfUse = <?php print json_encode(QvitterPlugin::settings("customtermsofuse")); ?>;
                     window.siteLocalOnlyDefaultPath = <?php print (common_config('public', 'localonly') ? 'true' : 'false'); ?>;
+                    <?php
+
+                        // bookmarks
+                        if($logged_in_user) {
+                            $bookmarks = Profile_prefs::getConfigData(Profile::current(), 'qvitter', 'bookmarks');
+                            if($bookmarks) {
+                                print 'window.allBookmarks = '.$bookmarks.';';
+                                }
+                            else {
+                                print 'window.allBookmarks = false;';
+                                }
+                            }
+                    ?>
 
 					// available language files and their last update time
 					window.availableLanguages = {<?php
@@ -473,7 +486,9 @@ class QvitterAction extends ApiAction
 							<a href="<?php print $instanceurl ?>main/public" class="stream-selection public-timeline" data-stream-header="" data-stream-name="statuses/public_timeline.json"><i class="chev-right"></i></a>
 							<a href="<?php print $instanceurl ?>main/all" class="stream-selection public-and-external-timeline" data-stream-header="" data-stream-name="statuses/public_and_external_timeline.json"><i class="chev-right"></i></a>
 						</div>
+						<div class="menu-container" id="bookmark-container"></div>
                         <div class="menu-container" id="history-container"></div>
+                        <div id="clear-history"></div>
 						<div id="qvitter-notice"><?php print common_config('site', 'qvitternotice'); ?></div>
 					</div>
 					<div id="feed">

css/qvitter.css

@@ -1152,6 +1152,7 @@ body.rtl #footer-spinner-container {
     margin-bottom: 10px;
     overflow:hidden;
     opacity:0;
+	position: relative;
 	}
 .menu-container a:first-child {
 	border-top-left-radius: 6px;
@@ -1186,6 +1187,40 @@ body.rtl #footer-spinner-container {
     top: 9px;
     width: 12px;
     }
+#bookmark-container a:hover .chev-right {
+	background-position:-20px -508px;
+	}
+#bookmark-container a:hover .chev-right:hover {
+	background-position:-40px -508px;
+	}
+
+#history-container {
+	margin-bottom:0;
+	}
+
+#history-container.menu-container a .chev-right {
+	background: 0 none;
+    height: 32px;
+    position: absolute;
+    right: 0;
+    top: 0;
+    width: 32px;
+	}
+#history-container.menu-container a .chev-right::before {
+	content: '\f097';
+	color: #aaa;
+    display: block;
+    font-family: "fontAwesome";
+    font-size: 14px;
+    font-style: normal;
+	font-weight: normal;
+    line-height: 34px;
+    text-align: center;
+    width: 32px;
+	}
+#history-container.menu-container a .chev-right:hover::before {
+	color: #888;
+	}
 .menu-container a:hover {
 	background-color:#fff;
 	}
@@ -1211,6 +1246,22 @@ body.rtl #footer-spinner-container {
 	background-position:-40px -508px;
 	}
 
+#clear-history {
+	color: rgba(255, 255, 255, 0.5);
+    font-size: 10px;
+    margin-bottom: 10px;
+    padding-right: 5px;
+    text-align: right;
+    text-shadow: none;
+	cursor:pointer;
+	}
+#clear-history:hover {
+	color: rgba(255, 255, 255, 0.8);
+	}
+#history-container:empty ~ #clear-history {
+	display:none;
+	}
+
 .menu-container a.notifications {
 	line-height:32px;
 	padding:0 12px;
@@ -1239,6 +1290,52 @@ body.rtl #footer-spinner-container {
 	display:none;
 	}
 
+#bookmark-container:empty {
+	display:none;
+	}
+
+.tooltip {
+	width: auto;
+	max-width: 300px;
+	line-height: 20px;
+	padding:5px 10px;
+	font-size:12px;
+	background-color: #333;
+	color: #eee;
+	z-index: 10000;
+	position:absolute;
+	display:block;
+	font-style: normal;
+	text-shadow: none;
+	border-radius: 3px;
+	opacity:0;
+	transition-property: opacity;
+    transition-duration: 0.1s;
+    transition-timing-function: ease-in;
+    transition-delay: 0.3s;
+	}
+.tooltip-caret {
+	z-index: 10000;
+	display:block;
+	content:' ';
+	position:absolute;
+	width:0;
+	height:0;
+	border:5px solid #333;
+	border-top:0 none;
+	border-left-color: transparent;
+	border-right-color: transparent;
+	opacity:0;
+	transition-property: opacity;
+    transition-duration: 0.1s;
+    transition-timing-function: ease-in;
+    transition-delay: 0.3s;
+	}
+.tooltip-caret.bottom {
+	border-top:5px solid #333;
+	border-bottom:0 none;
+	}
+
 #settings-container {
 	padding:10px 10px 150px 10px;
 	}

js/ajax-functions.js

@@ -182,6 +182,29 @@ function getFromAPI(stream, actionOnSuccess) {
 	}
 
 
+/* ·
+   ·
+   ·   Update the bookmarks
+   ·
+   ·   @param newBookmarks: the new bookmarks object to save
+   ·
+   · · · · · · · · · · · · · */
+
+function postUpdateBookmarks(newBookmarks) {
+	var bookmarksString = JSON.stringify(newBookmarks);
+	$.ajax({ url: window.apiRoot + 'qvitter/update_bookmarks.json?t=' + timeNow(),
+		type: "POST",
+		data: {
+			bookmarks: bookmarksString
+			},
+		dataType:"json",
+		error: function(data){ console.log('error updating bookmarks'); },
+		success: function(data) {
+			// console.log('bookmarks updated successfully');
+			}
+		});
+	}
+
 
 /* ·
    ·

js/dom-functions.js

@@ -700,8 +700,13 @@ function addStreamToHistoryMenuAndMarkAsCurrent(streamHeader, defaultStreamName)
 	if($('.stream-selection[data-stream-header="' + streamHeader + '"]').length==0
 	&& streamHeader != '@' + window.loggedIn.screen_name
 	&& typeof window.loggedIn.screen_name != 'undefined') {
-		$('#history-container').append('<a class="stream-selection" data-stream-header="' + streamHeader + '" href="' + window.siteInstanceURL + convertStreamToPath(defaultStreamName) + '">' + streamHeader + '<i class="chev-right"></i></a>');
+		$('#history-container').prepend('<a class="stream-selection" data-stream-header="' + streamHeader + '" href="' + window.siteInstanceURL + convertStreamToPath(defaultStreamName) + '">' + streamHeader + '<i class="chev-right" data-tooltip="' + window.sL.tooltipBookmarkStream + '"></i></a>');
 		updateHistoryLocalStorage();
+		// max 10 in history container
+		var historyNum = $('#history-container').children('.stream-selection').length;
+		if(historyNum > 10) {
+			$('#history-container').children('.stream-selection').slice(-(historyNum-10)).remove();
+			}
 		}
 
 
@@ -1284,7 +1289,7 @@ function cleanUpAfterCollapseQueet(q) {
 
 function queetBoxHtml() {
 	var startText = encodeURIComponent(window.sL.compose);
-	return '<div class="inline-reply-queetbox"><div class="queet-box queet-box-syntax" data-start-text="' + startText + '">' + decodeURIComponent(startText) + '</div><div class="syntax-middle"></div><div class="syntax-two" contenteditable="true"></div><div class="mentions-suggestions"></div><div class="queet-toolbar toolbar-reply"><div class="queet-box-extras"><button class="upload-image"></button><button class="shorten disabled">URL</button></div><div class="queet-button"><span class="queet-counter"></span><button>' + window.sL.queetVerb + '</button></div></div></div>';
+	return '<div class="inline-reply-queetbox"><div class="queet-box queet-box-syntax" data-start-text="' + startText + '">' + decodeURIComponent(startText) + '</div><div class="syntax-middle"></div><div class="syntax-two" contenteditable="true"></div><div class="mentions-suggestions"></div><div class="queet-toolbar toolbar-reply"><div class="queet-box-extras"><button data-tooltip="' + window.sL.tooltipAttachImage + '" class="upload-image"></button><button data-tooltip="' + window.sL.tooltipShortenUrls + '" class="shorten disabled">URL</button></div><div class="queet-button"><span class="queet-counter"></span><button>' + window.sL.queetVerb + '</button></div></div></div>';
 	}
 
 
@@ -1337,7 +1342,7 @@ function replyFormHtml(q,qid) {
 
 	startText = encodeURIComponent(startText);
 	repliesText = encodeURIComponent(repliesText);
-	return '<div class="inline-reply-queetbox"><span class="inline-reply-caret"><span class="caret-inner"></span></span><img class="reply-avatar" src="' + $('#user-avatar').attr('src') + '" /><div class="queet-box queet-box-syntax" id="queet-box-' + qid + '" data-start-text="' + startText + '" data-replies-text="' + repliesText + '" data-cached-text="' + cachedText + '">' + decodeURIComponent(startText) + '</div><div class="syntax-middle"></div><div class="syntax-two" contenteditable="true"></div><div class="mentions-suggestions"></div><div class="queet-toolbar toolbar-reply"><div class="queet-box-extras"><button class="upload-image"></button><button class="shorten disabled">URL</button></div><div class="queet-button"><span class="queet-counter"></span><button>' + window.sL.queetVerb + '</button></div></div></div>';
+	return '<div class="inline-reply-queetbox"><span class="inline-reply-caret"><span class="caret-inner"></span></span><img class="reply-avatar" src="' + $('#user-avatar').attr('src') + '" /><div class="queet-box queet-box-syntax" id="queet-box-' + qid + '" data-start-text="' + startText + '" data-replies-text="' + repliesText + '" data-cached-text="' + cachedText + '">' + decodeURIComponent(startText) + '</div><div class="syntax-middle"></div><div class="syntax-two" contenteditable="true"></div><div class="mentions-suggestions"></div><div class="queet-toolbar toolbar-reply"><div class="queet-box-extras"><button data-tooltip="' + window.sL.tooltipAttachImage + '" class="upload-image"></button><button data-tooltip="' + window.sL.tooltipShortenUrls + '" class="shorten disabled">URL</button></div><div class="queet-button"><span class="queet-counter"></span><button>' + window.sL.queetVerb + '</button></div></div></div>';
 	}
 
 
@@ -1622,7 +1627,7 @@ function addToFeed(feed, after, extraClasses, isReply) {
 				// external
 				var ostatusHtml = '';
 				if(obj.from_profile.is_local === false) {
-					ostatusHtml = '<a target="_blank" title="' + window.sL.goToOriginalNotice + '" class="ostatus-link" href="' + obj.from_profile.statusnet_profile_url + '"></a>';
+					ostatusHtml = '<a target="_blank" data-tooltip="' + window.sL.goToOriginalNotice + '" class="ostatus-link" href="' + obj.from_profile.statusnet_profile_url + '"></a>';
 					}
 
 
@@ -2045,7 +2050,7 @@ function buildQueetHtml(obj, idInStream, extraClassesThisRun, requeeted_by, isCo
 	// external
 	var ostatusHtml = '';
 	if(obj.is_local === false) {
-		ostatusHtml = '<a target="_blank" title="' + window.sL.goToOriginalNotice + '" class="ostatus-link" href="' + obj.external_url + '"></a>';
+		ostatusHtml = '<a target="_blank" data-tooltip="' + window.sL.goToOriginalNotice + '" class="ostatus-link" href="' + obj.external_url + '"></a>';
 		}
 
 	var queetTime = parseTwitterDate(obj.created_at);

js/misc-functions.js

@@ -1055,6 +1055,48 @@ function convertAttachmentMoreHref() {
 
 
 
+
+/* ·
+   ·
+   ·   Saves the user's bookmarks to the server
+   ·
+   · · · · · · · · · · · · · */
+
+function saveAllBookmarks() {
+	var i=0;
+	var bookmarkContainer = new Object();
+	$.each($('#bookmark-container .stream-selection'), function(key,obj) {
+		bookmarkContainer[i] = new Object();
+		bookmarkContainer[i].dataStreamHref = $(obj).attr('href');
+		bookmarkContainer[i].dataStreamHeader = $(obj).attr('data-stream-header');
+		i++;
+		});
+
+	postUpdateBookmarks(bookmarkContainer);
+
+	$('#bookmark-container').sortable({delay: 100});
+	$('#bookmark-container').disableSelection();
+	}
+
+
+/* ·
+   ·
+   ·   Append all bookmarks to the bookmark container
+   ·
+   · · · · · · · · · · · · · */
+
+function appendAllBookmarks(bookmarkContainer) {
+	if(bookmarkContainer) {
+		$('#bookmark-container').html('');
+		$.each(bookmarkContainer, function(key,obj) {
+			$('#bookmark-container').append('<a class="stream-selection" data-stream-header="' + obj.dataStreamHeader + '" href="' + obj.dataStreamHref + '">' + obj.dataStreamHeader + '</i><i class="chev-right" data-tooltip="' + window.sL.tooltipRemoveBookmark + '"></i></a>');
+			});
+		}
+	$('#bookmark-container').sortable({delay: 100});
+	$('#bookmark-container').disableSelection();
+	}
+
+
 /* ·
    ·
    ·   Updates the browsing history local storage
@@ -1078,8 +1120,6 @@ function updateHistoryLocalStorage() {
 		else {
 			$('#history-container').css('display','block');
 			}
-		$('#history-container').sortable({delay: 100});
-		$('#history-container').disableSelection();
 		}
 	}
 
@@ -1097,7 +1137,7 @@ function loadHistoryFromLocalStorage() {
 			$('#history-container').css('display','block');
 			$('#history-container').html('');
 			$.each(cacheData, function(key,obj) {
-				$('#history-container').append('<a class="stream-selection" data-stream-header="' + obj.dataStreamHeader + '" href="' + obj.dataStreamHref + '">' + obj.dataStreamHeader + '</i><i class="chev-right"></i></a>');
+				$('#history-container').append('<a class="stream-selection" data-stream-header="' + obj.dataStreamHeader + '" href="' + obj.dataStreamHref + '">' + obj.dataStreamHeader + '</i><i class="chev-right" data-tooltip="' + window.sL.tooltipBookmarkStream + '"></i></a>');
 				});
 			}
 		updateHistoryLocalStorage();

js/qvitter.js

@@ -65,6 +65,7 @@ window.onpopstate = function(event) {
    ·   welcome text expand and collapse
    ·
    · · · · · · · · · · · · · */
+
 $('body').on('click','.show-full-welcome-text, .front-welcome-text:not(.expanded) sup',function(){
 	$('.front-welcome-text').toggleClass('expanded');
 	if($('.front-welcome-text').hasClass('expanded')) {
@@ -86,6 +87,98 @@ $('body').on('click','.welcome-text-register-link',function(){
 
 
 
+/* ·
+   ·
+   ·   Check for tooltips to display
+   ·
+   · · · · · · · · · · · · · */
+
+$('body').on({
+    mouseover: function (e) {
+		removeAllTooltips();
+
+		// convert title to tooltip
+		if($(e.target).is('[title]')) {
+			$(e.target).attr('data-tooltip',$(e.target).attr('title'));
+			$(e.target).removeAttr('title');
+			}
+
+		// show tooltips
+		if($(e.target).is('[data-tooltip]')) {
+			var tooltip = $(e.target).attr('data-tooltip');
+			$('body').prepend('<div class="tooltip-caret"></div><div class="tooltip">' + tooltip + '</div>');
+			var tooltipWidth = $('.tooltip').outerWidth();
+			var tooltipHeight = $('.tooltip').outerHeight();
+			var windowWidth = $(window).width();
+			var windowScrollPosY = $(window).scrollTop();
+			var targetPosX = $(e.target).offset().left;
+			var targetPosY = $(e.target).offset().top;
+			var targetHeight = $(e.target).outerHeight();
+			var targetWidth = $(e.target).outerWidth();
+
+			// too little space on top of element, show tooltip at bottom
+			if((targetPosY-windowScrollPosY-tooltipHeight-10) < 0) {
+				var tooltipCaretPosX = targetPosX+targetWidth/2-5;
+				var tooltipCaretPosY = targetPosY+targetHeight+2;
+
+				// caret always directly under element
+				$('.tooltip-caret').css('left',tooltipCaretPosX + 'px');
+				$('.tooltip-caret').css('top',tooltipCaretPosY + 'px');
+				$('.tooltip-caret').addClass('top');
+
+				// tooltip itself might bleed over the window edges, and need moving
+				var tooltipPosX = targetPosX+targetWidth/2-tooltipWidth/2;
+				var tooltipPosY = targetPosY+targetHeight+7;
+				if((tooltipPosX+tooltipWidth)>windowWidth) {
+					tooltipPosX = windowWidth-tooltipWidth-5;
+					}
+				if(tooltipPosX < 5) {
+					tooltipPosX = 5;
+					}
+				$('.tooltip').css('left',tooltipPosX + 'px');
+				$('.tooltip').css('top',tooltipPosY + 'px');
+				}
+			// tooltip at top
+			else {
+				var tooltipCaretPosX = targetPosX+targetWidth/2-5;
+				var tooltipCaretPosY = targetPosY-7;
+
+				// caret always directly on top of element
+				$('.tooltip-caret').css('left',tooltipCaretPosX + 'px');
+				$('.tooltip-caret').css('top',tooltipCaretPosY + 'px');
+				$('.tooltip-caret').addClass('bottom');
+
+				// tooltip itself might bleed over the window edges, and need moving
+				var tooltipPosX = targetPosX+targetWidth/2-tooltipWidth/2;
+				var tooltipPosY = targetPosY-7-tooltipHeight;
+				if((tooltipPosX+tooltipWidth)>windowWidth) {
+					tooltipPosX = windowWidth-tooltipWidth-5;
+					}
+				if(tooltipPosX < 5) {
+					tooltipPosX = 5;
+					}
+				$('.tooltip').css('left',tooltipPosX + 'px');
+				$('.tooltip').css('top',tooltipPosY + 'px');
+
+				}
+
+			// fade in
+			$('.tooltip').css('opacity','1');
+			$('.tooltip-caret').css('opacity','1');
+			}
+    },
+    mouseleave: function (e) {
+		removeAllTooltips();
+    }
+});
+
+// removes all tooltips
+function removeAllTooltips() {
+	$('.tooltip,.tooltip-caret').remove();
+	}
+
+
+
 /* ·
    ·
    ·   fix login and register box to top when they reach top
@@ -466,8 +559,14 @@ function proceedToSetLanguageAndLogin(data){
 	$('#invite-link').html(window.sL.inviteAFriend);
 	$('#classic-link').html(window.sL.classicInterface);
 	$('#edit-profile-header-link').html(window.sL.editMyProfile);
-	$('#mini-edit-profile-button').attr('title',window.sL.editMyProfile);
+	$('#mini-edit-profile-button').attr('data-tooltip',window.sL.editMyProfile);
 	$('#accessibility-toggle-link').html(window.sL.accessibilityToggleLink);
+	$('#settingslink .nav-session').attr('data-tooltip',window.sL.tooltipTopMenu);
+	$('#top-compose').attr('data-tooltip',window.sL.compose);
+	$('button.upload-image').attr('data-tooltip',window.sL.tooltipAttachImage);
+	$('button.shorten').attr('data-tooltip',window.sL.tooltipShortenUrls);
+	$('.reload-stream').attr('data-tooltip',window.sL.tooltipReloadStream);
+	$('#clear-history').html(window.sL.clearHistory);
 
 	// show site body now
 	$('#user-container').css('display','block');
@@ -514,7 +613,7 @@ function doLogin(streamToSet) {
 		$('#qvitter-notice').show();
 		$('#user-avatar').attr('src', window.loggedIn.profile_image_url_profile_size);
 		$('#settingslink .nav-session').css('background-image', 'url(\'' + window.loggedIn.profile_image_url_profile_size + '\')');
-		$('#user-header').attr('title', window.sL.viewMyProfilePage);
+		$('#user-screen-name, #user-avatar, #user-name').attr('data-tooltip', window.sL.viewMyProfilePage);
 		$('#user-name').append(window.loggedIn.name);
 		$('#user-screen-name').append(window.loggedIn.screen_name);
 		$('#user-queets strong').html(window.loggedIn.statuses_count);
@@ -590,6 +689,9 @@ function doLogin(streamToSet) {
 		// load history
 		loadHistoryFromLocalStorage();
 
+		// show bookmarks
+		appendAllBookmarks(window.allBookmarks);
+
 		// set stream
 		window.currentStream = ''; // always reload stream on login
 		setNewCurrentStream(streamToSet,function(){
@@ -737,6 +839,7 @@ $('.language-link').click(function(){
    · · · · · · · · · · · · · */
 
 $('#settingslink').click(function(){
+	removeAllTooltips();
 	if(!$('.quitter-settings').hasClass('dropped')) { $('.quitter-settings').addClass('dropped'); }
 	else { $('.quitter-settings').removeClass('dropped'); }
 	});
@@ -1015,7 +1118,7 @@ $('body').on('click','a', function(e) {
 		return;
 		}
 
-	// don't hijack and don't follow link if this is the x remove users from history, prevent link but don't set a new currentstream
+	// don't hijack and don't follow link if this is the bookmark stream icon, prevent link but don't set a new currentstream
 	if($(e.target).is('i.chev-right')) {
 		e.preventDefault();
 		return;
@@ -1320,28 +1423,61 @@ $('body').on('click','.sm-ellipsis',function(){
 
 /* ·
    ·
-   ·   When user clicks the x to remove a menu history item
+   ·   When user clicks the bookmark icon to bookmark
    ·
    · · · · · · · · · · · · · */
 
 $('body').on('click','#history-container .chev-right',function(event){
-	$(this).parent('.stream-selection').remove();
+	var thisStreamLink = $(this).parent('.stream-selection');
+	thisStreamLink.slideUp(300,function(){
+		$('#bookmark-container').append(thisStreamLink.outerHTML());
+		$('#bookmark-container').children().last().children('.chev-right').attr('data-tooltip',window.sL.tooltipRemoveBookmark);
+		$('#bookmark-container').children().last().fadeIn(300,function(){
+			thisStreamLink.remove();
 			updateHistoryLocalStorage();
+			saveAllBookmarks();
+			});
+		});
 	});
 
 
 /* ·
    ·
-   ·   When sorting the history menu
+   ·   When user clicks the x to remove a bookmark
    ·
    · · · · · · · · · · · · · */
 
-$('#history-container').on("sortupdate", function() {
+$('body').on('click','#bookmark-container .chev-right',function(event){
+	$(this).parent('.stream-selection').remove();
+	saveAllBookmarks();
+	});
+
+
+/* ·
+   ·
+   ·   When sorting the bookmark menu
+   ·
+   · · · · · · · · · · · · · */
+
+$('#bookmark-container').on("sortupdate", function() {
+	saveAllBookmarks();
+	});
+
+
+/* ·
+   ·
+   ·   When clearing the browsing history
+   ·
+   · · · · · · · · · · · · · */
+
+$('#clear-history').on('click', function() {
+	$('#history-container').empty();
 	updateHistoryLocalStorage();
 	});
 
 
 
+
 /* ·
    ·
    ·   Load more from the current stream when scroll is 1000px from bottom

locale/ar.json

@@ -124,5 +124,12 @@
 	"clickToDrag":"Click to drag",
 	"keyboardShortcuts":"Keyboard shortcuts",
 	"classicInterface":"Classic {site-title}",
-	"accessibilityToggleLink":"For better accessibility, click this link to switch to the classic interface"
+	"accessibilityToggleLink":"For better accessibility, click this link to switch to the classic interface",
+	"tooltipBookmarkStream":"Add this stream to your bookmarks",
+	"tooltipTopMenu":"Menu and settings",
+	"tooltipAttachImage":"Attach an image",
+	"tooltipShortenUrls":"Shorten all URLs in the Queet",
+	"tooltipReloadStream":"Refresh this stream",
+	"tooltipRemoveBookmark":"Remove this bookmark",
+	"clearHistory":"Clear browsing history"
 }

locale/ast.json

@@ -124,5 +124,12 @@
 	"clickToDrag":"Click to drag",
 	"keyboardShortcuts":"Keyboard shortcuts",
 	"classicInterface":"Classic {site-title}",
-	"accessibilityToggleLink":"For better accessibility, click this link to switch to the classic interface"
+	"accessibilityToggleLink":"For better accessibility, click this link to switch to the classic interface",
+	"tooltipBookmarkStream":"Add this stream to your bookmarks",
+	"tooltipTopMenu":"Menu and settings",
+	"tooltipAttachImage":"Attach an image",
+	"tooltipShortenUrls":"Shorten all URLs in the Queet",
+	"tooltipReloadStream":"Refresh this stream",
+	"tooltipRemoveBookmark":"Remove this bookmark",
+	"clearHistory":"Clear browsing history"
 }

locale/ca.json

@@ -124,5 +124,12 @@
 	"clickToDrag":"Click to drag",
 	"keyboardShortcuts":"Keyboard shortcuts",
 	"classicInterface":"Classic {site-title}",
-	"accessibilityToggleLink":"For better accessibility, click this link to switch to the classic interface"
+	"accessibilityToggleLink":"For better accessibility, click this link to switch to the classic interface",
+	"tooltipBookmarkStream":"Add this stream to your bookmarks",
+	"tooltipTopMenu":"Menu and settings",
+	"tooltipAttachImage":"Attach an image",
+	"tooltipShortenUrls":"Shorten all URLs in the Queet",
+	"tooltipReloadStream":"Refresh this stream",
+	"tooltipRemoveBookmark":"Remove this bookmark",
+	"clearHistory":"Clear browsing history"
 }

locale/de.json

@@ -124,5 +124,12 @@
 	"clickToDrag":"Click to drag",
 	"keyboardShortcuts":"Keyboard shortcuts",
 	"classicInterface":"Classic {site-title}",
-	"accessibilityToggleLink":"Nutzer von Screenreadern klicken bitte hier, um zur klassischen Version von {site-title} zu gelangen."
+	"accessibilityToggleLink":"Nutzer von Screenreadern klicken bitte hier, um zur klassischen Version von {site-title} zu gelangen.",
+	"tooltipBookmarkStream":"Add this stream to your bookmarks",
+	"tooltipTopMenu":"Menu and settings",
+	"tooltipAttachImage":"Attach an image",
+	"tooltipShortenUrls":"Shorten all URLs in the Queet",
+	"tooltipReloadStream":"Refresh this stream",
+	"tooltipRemoveBookmark":"Remove this bookmark",
+	"clearHistory":"Clear browsing history"
 }

locale/en.json

@@ -124,5 +124,12 @@
 	"clickToDrag":"Click to drag",
 	"keyboardShortcuts":"Keyboard shortcuts",
 	"classicInterface":"Classic {site-title}",
-	"accessibilityToggleLink":"For better accessibility, click this link to switch to the classic interface"
+	"accessibilityToggleLink":"For better accessibility, click this link to switch to the classic interface",
+	"tooltipBookmarkStream":"Add this stream to your bookmarks",
+	"tooltipTopMenu":"Menu and settings",
+	"tooltipAttachImage":"Attach an image",
+	"tooltipShortenUrls":"Shorten all URLs in the Queet",
+	"tooltipReloadStream":"Refresh this stream",
+	"tooltipRemoveBookmark":"Remove this bookmark",
+	"clearHistory":"Clear browsing history"
 }

locale/eo.json

@@ -124,5 +124,12 @@
 	"clickToDrag":"Click to drag",
 	"keyboardShortcuts":"Keyboard shortcuts",
 	"classicInterface":"Classic {site-title}",
-	"accessibilityToggleLink":"For better accessibility, click this link to switch to the classic interface"
+	"accessibilityToggleLink":"For better accessibility, click this link to switch to the classic interface",
+	"tooltipBookmarkStream":"Add this stream to your bookmarks",
+	"tooltipTopMenu":"Menu and settings",
+	"tooltipAttachImage":"Attach an image",
+	"tooltipShortenUrls":"Shorten all URLs in the Queet",
+	"tooltipReloadStream":"Refresh this stream",
+	"tooltipRemoveBookmark":"Remove this bookmark",
+	"clearHistory":"Clear browsing history"
 }

locale/es.json

@@ -124,5 +124,12 @@
 	"clickToDrag":"Click para arrastrar",
 	"keyboardShortcuts":"Atajos de teclado",
 	"classicInterface":"Classic {site-title}",
-	"accessibilityToggleLink":"For better accessibility, click this link to switch to the classic interface"
+	"accessibilityToggleLink":"For better accessibility, click this link to switch to the classic interface",
+	"tooltipBookmarkStream":"Add this stream to your bookmarks",
+	"tooltipTopMenu":"Menu and settings",
+	"tooltipAttachImage":"Attach an image",
+	"tooltipShortenUrls":"Shorten all URLs in the Queet",
+	"tooltipReloadStream":"Refresh this stream",
+	"tooltipRemoveBookmark":"Remove this bookmark",
+	"clearHistory":"Clear browsing history"
 }

locale/es_ahorita.json

@@ -124,5 +124,12 @@
 	"clickToDrag":"Click to drag",
 	"keyboardShortcuts":"Keyboard shortcuts",
 	"classicInterface":"Classic {site-title}",
-	"accessibilityToggleLink":"For better accessibility, click this link to switch to the classic interface"
+	"accessibilityToggleLink":"For better accessibility, click this link to switch to the classic interface",
+	"tooltipBookmarkStream":"Add this stream to your bookmarks",
+	"tooltipTopMenu":"Menu and settings",
+	"tooltipAttachImage":"Attach an image",
+	"tooltipShortenUrls":"Shorten all URLs in the Queet",
+	"tooltipReloadStream":"Refresh this stream",
+	"tooltipRemoveBookmark":"Remove this bookmark",
+	"clearHistory":"Clear browsing history"
 }

locale/eu.json

@@ -124,5 +124,12 @@
 	"clickToDrag":"Click to drag",
 	"keyboardShortcuts":"Keyboard shortcuts",
 	"classicInterface":"Classic {site-title}",
-	"accessibilityToggleLink":"For better accessibility, click this link to switch to the classic interface"
+	"accessibilityToggleLink":"For better accessibility, click this link to switch to the classic interface",
+	"tooltipBookmarkStream":"Add this stream to your bookmarks",
+	"tooltipTopMenu":"Menu and settings",
+	"tooltipAttachImage":"Attach an image",
+	"tooltipShortenUrls":"Shorten all URLs in the Queet",
+	"tooltipReloadStream":"Refresh this stream",
+	"tooltipRemoveBookmark":"Remove this bookmark",
+	"clearHistory":"Clear browsing history"
 }

locale/fa.json

@@ -124,5 +124,12 @@
 	"clickToDrag":"Click to drag",
 	"keyboardShortcuts":"Keyboard shortcuts",
 	"classicInterface":"Classic {site-title}",
-	"accessibilityToggleLink":"For better accessibility, click this link to switch to the classic interface"
+	"accessibilityToggleLink":"For better accessibility, click this link to switch to the classic interface",
+	"tooltipBookmarkStream":"Add this stream to your bookmarks",
+	"tooltipTopMenu":"Menu and settings",
+	"tooltipAttachImage":"Attach an image",
+	"tooltipShortenUrls":"Shorten all URLs in the Queet",
+	"tooltipReloadStream":"Refresh this stream",
+	"tooltipRemoveBookmark":"Remove this bookmark",
+	"clearHistory":"Clear browsing history"
 }

locale/fi.json

@@ -124,5 +124,12 @@
 	"clickToDrag":"Click to drag",
 	"keyboardShortcuts":"Keyboard shortcuts",
 	"classicInterface":"Classic {site-title}",
-	"accessibilityToggleLink":"For better accessibility, click this link to switch to the classic interface"
+	"accessibilityToggleLink":"For better accessibility, click this link to switch to the classic interface",
+	"tooltipBookmarkStream":"Add this stream to your bookmarks",
+	"tooltipTopMenu":"Menu and settings",
+	"tooltipAttachImage":"Attach an image",
+	"tooltipShortenUrls":"Shorten all URLs in the Queet",
+	"tooltipReloadStream":"Refresh this stream",
+	"tooltipRemoveBookmark":"Remove this bookmark",
+	"clearHistory":"Clear browsing history"
 }

locale/fr.json

@@ -124,5 +124,12 @@
 	"clickToDrag":"Click to drag",
 	"keyboardShortcuts":"Keyboard shortcuts",
 	"classicInterface":"{site-title} Classique",
-	"accessibilityToggleLink":"For better accessibility, click this link to switch to the classic interface"
+	"accessibilityToggleLink":"For better accessibility, click this link to switch to the classic interface",
+	"tooltipBookmarkStream":"Add this stream to your bookmarks",
+	"tooltipTopMenu":"Menu and settings",
+	"tooltipAttachImage":"Attach an image",
+	"tooltipShortenUrls":"Shorten all URLs in the Queet",
+	"tooltipReloadStream":"Refresh this stream",
+	"tooltipRemoveBookmark":"Remove this bookmark",
+	"clearHistory":"Clear browsing history"
 }

locale/gl.json

@@ -124,5 +124,12 @@
 	"clickToDrag":"Click to drag",
 	"keyboardShortcuts":"Keyboard shortcuts",
 	"classicInterface":"Classic {site-title}",
-	"accessibilityToggleLink":"For better accessibility, click this link to switch to the classic interface"
+	"accessibilityToggleLink":"For better accessibility, click this link to switch to the classic interface",
+	"tooltipBookmarkStream":"Add this stream to your bookmarks",
+	"tooltipTopMenu":"Menu and settings",
+	"tooltipAttachImage":"Attach an image",
+	"tooltipShortenUrls":"Shorten all URLs in the Queet",
+	"tooltipReloadStream":"Refresh this stream",
+	"tooltipRemoveBookmark":"Remove this bookmark",
+	"clearHistory":"Clear browsing history"
 }

locale/he.json

@@ -124,5 +124,12 @@
 	"clickToDrag":"לחץ כדי לגרור",
 	"keyboardShortcuts":"קיצורי מקלדת",
 	"classicInterface":"קלאסי {site-title}",
-	"accessibilityToggleLink":"לצורך נגישות טובה יותר, לחץ על קישור זה כדי להחליף לממשק הקלאסי"
+	"accessibilityToggleLink":"לצורך נגישות טובה יותר, לחץ על קישור זה כדי להחליף לממשק הקלאסי",
+	"tooltipBookmarkStream":"Add this stream to your bookmarks",
+	"tooltipTopMenu":"Menu and settings",
+	"tooltipAttachImage":"Attach an image",
+	"tooltipShortenUrls":"Shorten all URLs in the Queet",
+	"tooltipReloadStream":"Refresh this stream",
+	"tooltipRemoveBookmark":"Remove this bookmark",
+	"clearHistory":"Clear browsing history"
 }

locale/io.json

@@ -124,5 +124,12 @@
 	"clickToDrag":"Klikez por tranar",
 	"keyboardShortcuts":"Agi per klavaro",
 	"classicInterface":"Klasika {site-title}",
-	"accessibilityToggleLink":"For better accessibility, click this link to switch to the classic interface"
+	"accessibilityToggleLink":"For better accessibility, click this link to switch to the classic interface",
+	"tooltipBookmarkStream":"Add this stream to your bookmarks",
+	"tooltipTopMenu":"Menu and settings",
+	"tooltipAttachImage":"Attach an image",
+	"tooltipShortenUrls":"Shorten all URLs in the Queet",
+	"tooltipReloadStream":"Refresh this stream",
+	"tooltipRemoveBookmark":"Remove this bookmark",
+	"clearHistory":"Clear browsing history"
 }

locale/it.json

@@ -124,5 +124,12 @@
 	"clickToDrag":"Click to drag",
 	"keyboardShortcuts":"Keyboard shortcuts",
 	"classicInterface":"Classic {site-title}",
-	"accessibilityToggleLink":"For better accessibility, click this link to switch to the classic interface"
+	"accessibilityToggleLink":"For better accessibility, click this link to switch to the classic interface",
+	"tooltipBookmarkStream":"Add this stream to your bookmarks",
+	"tooltipTopMenu":"Menu and settings",
+	"tooltipAttachImage":"Attach an image",
+	"tooltipShortenUrls":"Shorten all URLs in the Queet",
+	"tooltipReloadStream":"Refresh this stream",
+	"tooltipRemoveBookmark":"Remove this bookmark",
+	"clearHistory":"Clear browsing history"
 }

locale/no.json

@@ -124,5 +124,12 @@
 	"clickToDrag":"Click to drag",
 	"keyboardShortcuts":"Keyboard shortcuts",
 	"classicInterface":"Classic {site-title}",
-	"accessibilityToggleLink":"For better accessibility, click this link to switch to the classic interface"
+	"accessibilityToggleLink":"For better accessibility, click this link to switch to the classic interface",
+	"tooltipBookmarkStream":"Add this stream to your bookmarks",
+	"tooltipTopMenu":"Menu and settings",
+	"tooltipAttachImage":"Attach an image",
+	"tooltipShortenUrls":"Shorten all URLs in the Queet",
+	"tooltipReloadStream":"Refresh this stream",
+	"tooltipRemoveBookmark":"Remove this bookmark",
+	"clearHistory":"Clear browsing history"
 }

locale/pt_br.json

@@ -124,5 +124,12 @@
 	"clickToDrag":"Click to drag",
 	"keyboardShortcuts":"Keyboard shortcuts",
 	"classicInterface":"Classic {site-title}",
-	"accessibilityToggleLink":"For better accessibility, click this link to switch to the classic interface"
+	"accessibilityToggleLink":"For better accessibility, click this link to switch to the classic interface",
+	"tooltipBookmarkStream":"Add this stream to your bookmarks",
+	"tooltipTopMenu":"Menu and settings",
+	"tooltipAttachImage":"Attach an image",
+	"tooltipShortenUrls":"Shorten all URLs in the Queet",
+	"tooltipReloadStream":"Refresh this stream",
+	"tooltipRemoveBookmark":"Remove this bookmark",
+	"clearHistory":"Clear browsing history"
 }

locale/sv.json

@@ -124,5 +124,12 @@
 	"clickToDrag":"Klicka och dra för att flytta",
 	"keyboardShortcuts":"Kortkommandon",
 	"classicInterface":"Byt till GNU socials standardgränssnitt",
-	"accessibilityToggleLink":"För bättre tillgänglighet, följ den här länken för att byta till GNU socials standardgränssnitt"
+	"accessibilityToggleLink":"För bättre tillgänglighet, följ den här länken för att byta till GNU socials standardgränssnitt",
+	"tooltipBookmarkStream":"Bokmärk det här flödet",
+	"tooltipTopMenu":"Meny och inställningar",
+	"tooltipAttachImage":"Bifoga en bild",
+	"tooltipShortenUrls":"Förkorta alla URL:er",
+	"tooltipReloadStream":"Ladda om flödet",
+	"tooltipRemoveBookmark":"Ta bort det här bokmärket",
+	"clearHistory":"Rensa surfhistoriken"
 }

locale/zh_cn.json

@@ -124,5 +124,12 @@
 	"clickToDrag":"Click to drag",
 	"keyboardShortcuts":"Keyboard shortcuts",
 	"classicInterface":"Classic {site-title}",
-	"accessibilityToggleLink":"For better accessibility, click this link to switch to the classic interface"
+	"accessibilityToggleLink":"For better accessibility, click this link to switch to the classic interface",
+	"tooltipBookmarkStream":"Add this stream to your bookmarks",
+	"tooltipTopMenu":"Menu and settings",
+	"tooltipAttachImage":"Attach an image",
+	"tooltipShortenUrls":"Shorten all URLs in the Queet",
+	"tooltipReloadStream":"Refresh this stream",
+	"tooltipRemoveBookmark":"Remove this bookmark",
+	"clearHistory":"Clear browsing history"
 }

locale/zh_tw.json

@@ -124,5 +124,12 @@
 	"clickToDrag":"Click to drag",
 	"keyboardShortcuts":"Keyboard shortcuts",
 	"classicInterface":"Classic {site-title}",
-	"accessibilityToggleLink":"For better accessibility, click this link to switch to the classic interface"
+	"accessibilityToggleLink":"For better accessibility, click this link to switch to the classic interface",
+	"tooltipBookmarkStream":"Add this stream to your bookmarks",
+	"tooltipTopMenu":"Menu and settings",
+	"tooltipAttachImage":"Attach an image",
+	"tooltipShortenUrls":"Shorten all URLs in the Queet",
+	"tooltipReloadStream":"Refresh this stream",
+	"tooltipRemoveBookmark":"Remove this bookmark",
+	"clearHistory":"Clear browsing history"
 }