hovercacrds: added new tooltips and hovercards to expose certain information for objects shown in UI

rhodecode/apps/hovercards/__init__.py

@@ -0,0 +1,38 b''
+# -*- coding: utf-8 -*-
+
+# Copyright (C) 2018-2019 RhodeCode GmbH
+#
+# This program is free software: you can redistribute it and/or modify
+# it under the terms of the GNU Affero General Public License, version 3
+# (only), as published by the Free Software Foundation.
+#
+# This program is distributed in the hope that it will be useful,
+# but WITHOUT ANY WARRANTY; without even the implied warranty of
+# MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+# GNU General Public License for more details.
+#
+# You should have received a copy of the GNU Affero General Public License
+# along with this program.  If not, see <http://www.gnu.org/licenses/>.
+#
+# This program is dual-licensed. If you wish to learn more about the
+# RhodeCode Enterprise Edition, including its added features, Support services,
+# and proprietary license terms, please see https://rhodecode.com/licenses/
+from rhodecode.config import routing_links
+
+
+def includeme(config):
+
+    config.add_route(
+        name='hovercard_user',
+        pattern='/_hovercard/user/{user_id}')
+
+    config.add_route(
+        name='hovercard_user_group',
+        pattern='/_hovercard/user_group/{user_group_id}')
+
+    config.add_route(
+        name='hovercard_commit',
+        pattern='/_hovercard/commit/{repo_name}/{user_id}')
+
+    # Scan module for configuration decorators.
+    config.scan('.views', ignore='.tests')

rhodecode/apps/hovercards/views.py

@@ -0,0 +1,71 b''
+# -*- coding: utf-8 -*-
+
+# Copyright (C) 2016-2019 RhodeCode GmbH
+#
+# This program is free software: you can redistribute it and/or modify
+# it under the terms of the GNU Affero General Public License, version 3
+# (only), as published by the Free Software Foundation.
+#
+# This program is distributed in the hope that it will be useful,
+# but WITHOUT ANY WARRANTY; without even the implied warranty of
+# MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+# GNU General Public License for more details.
+#
+# You should have received a copy of the GNU Affero General Public License
+# along with this program.  If not, see <http://www.gnu.org/licenses/>.
+#
+# This program is dual-licensed. If you wish to learn more about the
+# RhodeCode Enterprise Edition, including its added features, Support services,
+# and proprietary license terms, please see https://rhodecode.com/licenses/
+
+import re
+import logging
+import collections
+
+from pyramid.view import view_config
+
+from rhodecode.apps._base import BaseAppView
+from rhodecode.lib import helpers as h
+from rhodecode.lib.auth import (
+    LoginRequired, NotAnonymous, HasRepoGroupPermissionAnyDecorator, CSRFRequired)
+from rhodecode.lib.codeblocks import filenode_as_lines_tokens
+from rhodecode.lib.index import searcher_from_config
+from rhodecode.lib.utils2 import safe_unicode, str2bool, safe_int
+from rhodecode.lib.ext_json import json
+from rhodecode.lib.vcs.nodes import FileNode
+from rhodecode.model.db import (
+    func, true, or_, case, in_filter_generator, Repository, RepoGroup, User, UserGroup)
+from rhodecode.model.repo import RepoModel
+from rhodecode.model.repo_group import RepoGroupModel
+from rhodecode.model.scm import RepoGroupList, RepoList
+from rhodecode.model.user import UserModel
+from rhodecode.model.user_group import UserGroupModel
+
+log = logging.getLogger(__name__)
+
+
+class HoverCardsView(BaseAppView):
+
+    def load_default_context(self):
+        c = self._get_local_tmpl_context()
+        return c
+
+    @LoginRequired()
+    @view_config(
+        route_name='hovercard_user', request_method='GET', xhr=True,
+        renderer='rhodecode:templates/hovercards/hovercard_user.mako')
+    def hovercard_user(self):
+        c = self.load_default_context()
+        user_id = self.request.matchdict['user_id']
+        c.user = User.get_or_404(user_id)
+        return self._get_template_context(c)
+
+    @LoginRequired()
+    @view_config(
+        route_name='hovercard_user_group', request_method='GET', xhr=True,
+        renderer='rhodecode:templates/hovercards/hovercard_user_group.mako')
+    def hovercard_user_group(self):
+        c = self.load_default_context()
+        user_group_id = self.request.matchdict['user_group_id']
+        c.user_group = UserGroup.get_or_404(user_group_id)
+        return self._get_template_context(c)

rhodecode/public/css/tooltips.less

@@ -0,0 +1,460 b''
+/* This is the core CSS of Tooltipster */
+
+/* GENERAL STRUCTURE RULES (do not edit this section) */
+
+.tooltipster-base {
+	/* this ensures that a constrained height set by functionPosition,
+	if greater that the natural height of the tooltip, will be enforced
+	in browsers that support display:flex */
+	display: flex;
+	pointer-events: none;
+	/* this may be overriden in JS for fixed position origins */
+	position: absolute;
+}
+
+.tooltipster-box {
+	/* see .tooltipster-base. flex-shrink 1 is only necessary for IE10-
+	and flex-basis auto for IE11- (at least) */
+	flex: 1 1 auto;
+}
+
+.tooltipster-content {
+	/* prevents an overflow if the user adds padding to the div */
+	box-sizing: border-box;
+	/* these make sure we'll be able to detect any overflow */
+	max-height: 100%;
+	max-width: 100%;
+	overflow: auto;
+}
+
+.tooltipster-ruler {
+	/* these let us test the size of the tooltip without overflowing the window */
+	bottom: 0;
+	left: 0;
+	overflow: hidden;
+	position: fixed;
+	right: 0;
+	top: 0;
+	visibility: hidden;
+}
+
+/* ANIMATIONS */
+
+/* Open/close animations */
+
+/* fade */
+
+.tooltipster-fade {
+	opacity: 0;
+	-webkit-transition-property: opacity;
+	-moz-transition-property: opacity;
+	-o-transition-property: opacity;
+	-ms-transition-property: opacity;
+	transition-property: opacity;
+}
+.tooltipster-fade.tooltipster-show {
+	opacity: 1;
+}
+
+/* grow */
+
+.tooltipster-grow {
+	-webkit-transform: scale(0,0);
+	-moz-transform: scale(0,0);
+	-o-transform: scale(0,0);
+	-ms-transform: scale(0,0);
+	transform: scale(0,0);
+	-webkit-transition-property: -webkit-transform;
+	-moz-transition-property: -moz-transform;
+	-o-transition-property: -o-transform;
+	-ms-transition-property: -ms-transform;
+	transition-property: transform;
+	-webkit-backface-visibility: hidden;
+}
+.tooltipster-grow.tooltipster-show {
+	-webkit-transform: scale(1,1);
+	-moz-transform: scale(1,1);
+	-o-transform: scale(1,1);
+	-ms-transform: scale(1,1);
+	transform: scale(1,1);
+	-webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
+	-webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
+	-moz-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
+	-ms-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
+	-o-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
+	transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
+}
+
+/* swing */
+
+.tooltipster-swing {
+	opacity: 0;
+	-webkit-transform: rotateZ(4deg);
+	-moz-transform: rotateZ(4deg);
+	-o-transform: rotateZ(4deg);
+	-ms-transform: rotateZ(4deg);
+	transform: rotateZ(4deg);
+	-webkit-transition-property: -webkit-transform, opacity;
+	-moz-transition-property: -moz-transform;
+	-o-transition-property: -o-transform;
+	-ms-transition-property: -ms-transform;
+	transition-property: transform;
+}
+.tooltipster-swing.tooltipster-show {
+	opacity: 1;
+	-webkit-transform: rotateZ(0deg);
+	-moz-transform: rotateZ(0deg);
+	-o-transform: rotateZ(0deg);
+	-ms-transform: rotateZ(0deg);
+	transform: rotateZ(0deg);
+	-webkit-transition-timing-function: cubic-bezier(0.230, 0.635, 0.495, 1);
+	-webkit-transition-timing-function: cubic-bezier(0.230, 0.635, 0.495, 2.4);
+	-moz-transition-timing-function: cubic-bezier(0.230, 0.635, 0.495, 2.4);
+	-ms-transition-timing-function: cubic-bezier(0.230, 0.635, 0.495, 2.4);
+	-o-transition-timing-function: cubic-bezier(0.230, 0.635, 0.495, 2.4);
+	transition-timing-function: cubic-bezier(0.230, 0.635, 0.495, 2.4);
+}
+
+/* fall */
+
+.tooltipster-fall {
+	-webkit-transition-property: top;
+	-moz-transition-property: top;
+	-o-transition-property: top;
+	-ms-transition-property: top;
+	transition-property: top;
+	-webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
+	-webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
+	-moz-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
+	-ms-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
+	-o-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
+	transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
+}
+.tooltipster-fall.tooltipster-initial {
+	top: 0 !important;
+}
+.tooltipster-fall.tooltipster-show {
+}
+.tooltipster-fall.tooltipster-dying {
+	-webkit-transition-property: all;
+	-moz-transition-property: all;
+	-o-transition-property: all;
+	-ms-transition-property: all;
+	transition-property: all;
+	top: 0 !important;
+	opacity: 0;
+}
+
+/* slide */
+
+.tooltipster-slide {
+	-webkit-transition-property: left;
+	-moz-transition-property: left;
+	-o-transition-property: left;
+	-ms-transition-property: left;
+	transition-property: left;
+	-webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
+	-webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
+	-moz-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
+	-ms-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
+	-o-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
+	transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
+}
+.tooltipster-slide.tooltipster-initial {
+	left: -40px !important;
+}
+.tooltipster-slide.tooltipster-show {
+}
+.tooltipster-slide.tooltipster-dying {
+	-webkit-transition-property: all;
+	-moz-transition-property: all;
+	-o-transition-property: all;
+	-ms-transition-property: all;
+	transition-property: all;
+	left: 0 !important;
+	opacity: 0;
+}
+
+/* Update animations */
+
+/* We use animations rather than transitions here because
+ transition durations may be specified in the style tag due to
+ animationDuration, and we try to avoid collisions and the use
+ of !important */
+
+/* fade */
+
+@keyframes tooltipster-fading {
+	0% {
+		opacity: 0;
+	}
+	100% {
+		opacity: 1;
+	}
+}
+
+.tooltipster-update-fade {
+	animation: tooltipster-fading 400ms;
+}
+
+/* rotate */
+
+@keyframes tooltipster-rotating {
+	25% {
+		transform: rotate(-2deg);
+	}
+	75% {
+		transform: rotate(2deg);
+	}
+	100% {
+		transform: rotate(0);
+	}
+}
+
+.tooltipster-update-rotate {
+	animation: tooltipster-rotating 600ms;
+}
+
+/* scale */
+
+@keyframes tooltipster-scaling {
+	50% {
+		transform: scale(1.1);
+	}
+	100% {
+		transform: scale(1);
+	}
+}
+
+.tooltipster-update-scale {
+	animation: tooltipster-scaling 600ms;
+}
+
+/**
+ * DEFAULT STYLE OF THE SIDETIP PLUGIN
+ *
+ * All styles are "namespaced" with .tooltipster-sidetip to prevent
+ * conflicts between plugins.
+ */
+
+/* .tooltipster-box */
+
+.tooltipster-sidetip .tooltipster-box {
+	background: #565656;
+	border: 2px solid black;
+	border-radius: 4px;
+}
+
+.tooltipster-sidetip.tooltipster-bottom .tooltipster-box {
+	margin-top: 8px;
+}
+
+.tooltipster-sidetip.tooltipster-left .tooltipster-box {
+	margin-right: 8px;
+}
+
+.tooltipster-sidetip.tooltipster-right .tooltipster-box {
+	margin-left: 8px;
+}
+
+.tooltipster-sidetip.tooltipster-top .tooltipster-box {
+	margin-bottom: 8px;
+}
+
+/* .tooltipster-content */
+
+.tooltipster-sidetip .tooltipster-content {
+	color: white;
+	line-height: 18px;
+	padding: 6px 14px;
+}
+
+/* .tooltipster-arrow : will keep only the zone of .tooltipster-arrow-uncropped that
+corresponds to the arrow we want to display */
+
+.tooltipster-sidetip .tooltipster-arrow {
+	overflow: hidden;
+	position: absolute;
+}
+
+.tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow {
+	height: 10px;
+	/* half the width, for centering */
+	margin-left: -10px;
+	top: 0;
+	width: 20px;
+}
+
+.tooltipster-sidetip.tooltipster-left .tooltipster-arrow {
+	height: 20px;
+	margin-top: -10px;
+	right: 0;
+	/* top 0 to keep the arrow from overflowing .tooltipster-base when it has not
+	been positioned yet */
+	top: 0;
+	width: 10px;
+}
+
+.tooltipster-sidetip.tooltipster-right .tooltipster-arrow {
+	height: 20px;
+	margin-top: -10px;
+	left: 0;
+	/* same as .tooltipster-left .tooltipster-arrow */
+	top: 0;
+	width: 10px;
+}
+
+.tooltipster-sidetip.tooltipster-top .tooltipster-arrow {
+	bottom: 0;
+	height: 10px;
+	margin-left: -10px;
+	width: 20px;
+}
+
+/* common rules between .tooltipster-arrow-background and .tooltipster-arrow-border */
+
+.tooltipster-sidetip .tooltipster-arrow-background, .tooltipster-sidetip .tooltipster-arrow-border {
+	height: 0;
+	position: absolute;
+	width: 0;
+}
+
+/* .tooltipster-arrow-background */
+
+.tooltipster-sidetip .tooltipster-arrow-background {
+	border: 10px solid transparent;
+}
+
+.tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow-background {
+	border-bottom-color: #565656;
+	left: 0;
+	top: 3px;
+}
+
+.tooltipster-sidetip.tooltipster-left .tooltipster-arrow-background {
+	border-left-color: #565656;
+	left: -3px;
+	top: 0;
+}
+
+.tooltipster-sidetip.tooltipster-right .tooltipster-arrow-background {
+	border-right-color: #565656;
+	left: 3px;
+	top: 0;
+}
+
+.tooltipster-sidetip.tooltipster-top .tooltipster-arrow-background {
+	border-top-color: #565656;
+	left: 0;
+	top: -3px;
+}
+
+/* .tooltipster-arrow-border */
+
+.tooltipster-sidetip .tooltipster-arrow-border {
+	border: 10px solid transparent;
+	left: 0;
+	top: 0;
+}
+
+.tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow-border {
+	border-bottom-color: black;
+}
+
+.tooltipster-sidetip.tooltipster-left .tooltipster-arrow-border {
+	border-left-color: black;
+}
+
+.tooltipster-sidetip.tooltipster-right .tooltipster-arrow-border {
+	border-right-color: black;
+}
+
+.tooltipster-sidetip.tooltipster-top .tooltipster-arrow-border {
+	border-top-color: black;
+}
+
+/* tooltipster-arrow-uncropped */
+
+.tooltipster-sidetip .tooltipster-arrow-uncropped {
+	position: relative;
+}
+
+.tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow-uncropped {
+	top: -10px;
+}
+
+.tooltipster-sidetip.tooltipster-right .tooltipster-arrow-uncropped {
+	left: -10px;
+}
+
+.tooltipster-sidetip.tooltipster-shadow .tooltipster-box {
+	border: none;
+	border-radius: 5px;
+	background: #fff;
+	box-shadow: 0 0 5px 3px rgba(0, 0, 0, .1)
+}
+
+.tooltipster-sidetip.tooltipster-shadow.tooltipster-bottom .tooltipster-box {
+	margin-top: 6px
+}
+
+.tooltipster-sidetip.tooltipster-shadow.tooltipster-left .tooltipster-box {
+	margin-right: 6px
+}
+
+.tooltipster-sidetip.tooltipster-shadow.tooltipster-right .tooltipster-box {
+	margin-left: 6px
+}
+
+.tooltipster-sidetip.tooltipster-shadow.tooltipster-top .tooltipster-box {
+	margin-bottom: 6px
+}
+
+.tooltipster-sidetip.tooltipster-shadow .tooltipster-content {
+	color: #8d8d8d
+}
+
+.tooltipster-sidetip.tooltipster-shadow .tooltipster-arrow {
+	height: 6px;
+	margin-left: -6px;
+	width: 12px
+}
+
+.tooltipster-sidetip.tooltipster-shadow.tooltipster-left .tooltipster-arrow, .tooltipster-sidetip.tooltipster-shadow.tooltipster-right .tooltipster-arrow {
+	height: 12px;
+	margin-left: 0;
+	margin-top: -6px;
+	width: 6px
+}
+
+.tooltipster-sidetip.tooltipster-shadow .tooltipster-arrow-background {
+	display: none
+}
+
+.tooltipster-sidetip.tooltipster-shadow .tooltipster-arrow-border {
+	border: 6px solid transparent
+}
+
+.tooltipster-sidetip.tooltipster-shadow.tooltipster-bottom .tooltipster-arrow-border {
+	border-bottom-color: #fff
+}
+
+.tooltipster-sidetip.tooltipster-shadow.tooltipster-left .tooltipster-arrow-border {
+	border-left-color: #fff
+}
+
+.tooltipster-sidetip.tooltipster-shadow.tooltipster-right .tooltipster-arrow-border {
+	border-right-color: #fff
+}
+
+.tooltipster-sidetip.tooltipster-shadow.tooltipster-top .tooltipster-arrow-border {
+	border-top-color: #fff
+}
+
+.tooltipster-sidetip.tooltipster-shadow.tooltipster-bottom .tooltipster-arrow-uncropped {
+	top: -6px
+}
+
+.tooltipster-sidetip.tooltipster-shadow.tooltipster-right .tooltipster-arrow-uncropped {
+	left: -6px
+}
  No newline at end of file

rhodecode/config/middleware.py

@@ -1,754 +1,755 b''
 # -*- coding: utf-8 -*-
 
 # Copyright (C) 2010-2019 RhodeCode GmbH
 #
 # This program is free software: you can redistribute it and/or modify
 # it under the terms of the GNU Affero General Public License, version 3
 # (only), as published by the Free Software Foundation.
 #
 # This program is distributed in the hope that it will be useful,
 # but WITHOUT ANY WARRANTY; without even the implied warranty of
 # MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 # GNU General Public License for more details.
 #
 # You should have received a copy of the GNU Affero General Public License
 # along with this program.  If not, see <http://www.gnu.org/licenses/>.
 #
 # This program is dual-licensed. If you wish to learn more about the
 # RhodeCode Enterprise Edition, including its added features, Support services,
 # and proprietary license terms, please see https://rhodecode.com/licenses/
 
 import os
 import sys
 import logging
 import collections
 import tempfile
 import time
 
 from paste.gzipper import make_gzip_middleware
 import pyramid.events
 from pyramid.wsgi import wsgiapp
 from pyramid.authorization import ACLAuthorizationPolicy
 from pyramid.config import Configurator
 from pyramid.settings import asbool, aslist
 from pyramid.httpexceptions import (
     HTTPException, HTTPError, HTTPInternalServerError, HTTPFound, HTTPNotFound)
 from pyramid.renderers import render_to_response
 
 from rhodecode.model import meta
 from rhodecode.config import patches
 from rhodecode.config import utils as config_utils
 from rhodecode.config.environment import load_pyramid_environment
 
 import rhodecode.events
 from rhodecode.lib.middleware.vcs import VCSMiddleware
 from rhodecode.lib.request import Request
 from rhodecode.lib.vcs import VCSCommunicationError
 from rhodecode.lib.exceptions import VCSServerUnavailable
 from rhodecode.lib.middleware.appenlight import wrap_in_appenlight_if_enabled
 from rhodecode.lib.middleware.https_fixup import HttpsFixup
 from rhodecode.lib.celerylib.loader import configure_celery
 from rhodecode.lib.plugins.utils import register_rhodecode_plugin
 from rhodecode.lib.utils2 import aslist as rhodecode_aslist, AttributeDict
 from rhodecode.lib.exc_tracking import store_exception
 from rhodecode.subscribers import (
     scan_repositories_if_enabled, write_js_routes_if_enabled,
     write_metadata_if_needed, inject_app_settings)
 
 
 log = logging.getLogger(__name__)
 
 
 def is_http_error(response):
     # error which should have traceback
     return response.status_code > 499
 
 
 def should_load_all():
     """
     Returns if all application components should be loaded. In some cases it's
     desired to skip apps loading for faster shell script execution
     """
     ssh_cmd = os.environ.get('RC_CMD_SSH_WRAPPER')
     if ssh_cmd:
         return False
 
     return True
 
 
 def make_pyramid_app(global_config, **settings):
     """
     Constructs the WSGI application based on Pyramid.
 
     Specials:
 
     * The application can also be integrated like a plugin via the call to
       `includeme`. This is accompanied with the other utility functions which
       are called. Changing this should be done with great care to not break
       cases when these fragments are assembled from another place.
 
     """
 
     # Allows to use format style "{ENV_NAME}" placeholders in the configuration. It
     # will be replaced by the value of the environment variable "NAME" in this case.
     start_time = time.time()
 
     debug = asbool(global_config.get('debug'))
     if debug:
         enable_debug()
 
     environ = {'ENV_{}'.format(key): value for key, value in os.environ.items()}
 
     global_config = _substitute_values(global_config, environ)
     settings = _substitute_values(settings, environ)
 
     sanitize_settings_and_apply_defaults(global_config, settings)
 
     config = Configurator(settings=settings)
 
     # Apply compatibility patches
     patches.inspect_getargspec()
 
     load_pyramid_environment(global_config, settings)
 
     # Static file view comes first
     includeme_first(config)
 
     includeme(config)
 
     pyramid_app = config.make_wsgi_app()
     pyramid_app = wrap_app_in_wsgi_middlewares(pyramid_app, config)
     pyramid_app.config = config
 
     config.configure_celery(global_config['__file__'])
     # creating the app uses a connection - return it after we are done
     meta.Session.remove()
     total_time = time.time() - start_time
     log.info('Pyramid app `%s` created and configured in %.2fs',
              pyramid_app.func_name, total_time)
 
     return pyramid_app
 
 
 def not_found_view(request):
     """
     This creates the view which should be registered as not-found-view to
     pyramid.
     """
 
     if not getattr(request, 'vcs_call', None):
         # handle like regular case with our error_handler
         return error_handler(HTTPNotFound(), request)
 
     # handle not found view as a vcs call
     settings = request.registry.settings
     ae_client = getattr(request, 'ae_client', None)
     vcs_app = VCSMiddleware(
         HTTPNotFound(), request.registry, settings,
         appenlight_client=ae_client)
 
     return wsgiapp(vcs_app)(None, request)
 
 
 def error_handler(exception, request):
     import rhodecode
     from rhodecode.lib import helpers
 
     rhodecode_title = rhodecode.CONFIG.get('rhodecode_title') or 'RhodeCode'
 
     base_response = HTTPInternalServerError()
     # prefer original exception for the response since it may have headers set
     if isinstance(exception, HTTPException):
         base_response = exception
     elif isinstance(exception, VCSCommunicationError):
         base_response = VCSServerUnavailable()
 
     if is_http_error(base_response):
         log.exception(
             'error occurred handling this request for path: %s', request.path)
 
     error_explanation = base_response.explanation or str(base_response)
     if base_response.status_code == 404:
         error_explanation += " Optionally you don't have permission to access this page."
     c = AttributeDict()
     c.error_message = base_response.status
     c.error_explanation = error_explanation
     c.visual = AttributeDict()
 
     c.visual.rhodecode_support_url = (
         request.registry.settings.get('rhodecode_support_url') or
         request.route_url('rhodecode_support')
     )
     c.redirect_time = 0
     c.rhodecode_name = rhodecode_title
     if not c.rhodecode_name:
         c.rhodecode_name = 'Rhodecode'
 
     c.causes = []
     if is_http_error(base_response):
         c.causes.append('Server is overloaded.')
         c.causes.append('Server database connection is lost.')
         c.causes.append('Server expected unhandled error.')
 
     if hasattr(base_response, 'causes'):
         c.causes = base_response.causes
 
     c.messages = helpers.flash.pop_messages(request=request)
 
     exc_info = sys.exc_info()
     c.exception_id = id(exc_info)
     c.show_exception_id = isinstance(base_response, VCSServerUnavailable) \
                           or base_response.status_code > 499
     c.exception_id_url = request.route_url(
         'admin_settings_exception_tracker_show', exception_id=c.exception_id)
 
     if c.show_exception_id:
         store_exception(c.exception_id, exc_info)
 
     response = render_to_response(
         '/errors/error_document.mako', {'c': c, 'h': helpers}, request=request,
         response=base_response)
 
     return response
 
 
 def includeme_first(config):
     # redirect automatic browser favicon.ico requests to correct place
     def favicon_redirect(context, request):
         return HTTPFound(
             request.static_path('rhodecode:public/images/favicon.ico'))
 
     config.add_view(favicon_redirect, route_name='favicon')
     config.add_route('favicon', '/favicon.ico')
 
     def robots_redirect(context, request):
         return HTTPFound(
             request.static_path('rhodecode:public/robots.txt'))
 
     config.add_view(robots_redirect, route_name='robots')
     config.add_route('robots', '/robots.txt')
 
     config.add_static_view(
         '_static/deform', 'deform:static')
     config.add_static_view(
         '_static/rhodecode', path='rhodecode:public', cache_max_age=3600 * 24)
 
 
 def includeme(config):
     log.debug('Initializing main includeme from %s', os.path.basename(__file__))
     settings = config.registry.settings
     config.set_request_factory(Request)
 
     # plugin information
     config.registry.rhodecode_plugins = collections.OrderedDict()
 
     config.add_directive(
         'register_rhodecode_plugin', register_rhodecode_plugin)
 
     config.add_directive('configure_celery', configure_celery)
 
     if asbool(settings.get('appenlight', 'false')):
         config.include('appenlight_client.ext.pyramid_tween')
 
     load_all = should_load_all()
 
     # Includes which are required. The application would fail without them.
     config.include('pyramid_mako')
     config.include('rhodecode.lib.rc_beaker')
     config.include('rhodecode.lib.rc_cache')
 
     config.include('rhodecode.apps._base.navigation')
     config.include('rhodecode.apps._base.subscribers')
     config.include('rhodecode.tweens')
     config.include('rhodecode.authentication')
 
     if load_all:
         config.include('rhodecode.integrations')
 
     if load_all:
         from rhodecode.authentication import discover_legacy_plugins
         # load CE authentication plugins
         config.include('rhodecode.authentication.plugins.auth_crowd')
         config.include('rhodecode.authentication.plugins.auth_headers')
         config.include('rhodecode.authentication.plugins.auth_jasig_cas')
         config.include('rhodecode.authentication.plugins.auth_ldap')
         config.include('rhodecode.authentication.plugins.auth_pam')
         config.include('rhodecode.authentication.plugins.auth_rhodecode')
         config.include('rhodecode.authentication.plugins.auth_token')
 
         # Auto discover authentication plugins and include their configuration.
         discover_legacy_plugins(config)
 
     # apps
     if load_all:
         config.include('rhodecode.apps._base')
+        config.include('rhodecode.apps.hovercards')
         config.include('rhodecode.apps.ops')
         config.include('rhodecode.apps.admin')
         config.include('rhodecode.apps.channelstream')
         config.include('rhodecode.apps.file_store')
         config.include('rhodecode.apps.login')
         config.include('rhodecode.apps.home')
         config.include('rhodecode.apps.journal')
         config.include('rhodecode.apps.repository')
         config.include('rhodecode.apps.repo_group')
         config.include('rhodecode.apps.user_group')
         config.include('rhodecode.apps.search')
         config.include('rhodecode.apps.user_profile')
         config.include('rhodecode.apps.user_group_profile')
         config.include('rhodecode.apps.my_account')
         config.include('rhodecode.apps.svn_support')
         config.include('rhodecode.apps.ssh_support')
         config.include('rhodecode.apps.gist')
         config.include('rhodecode.apps.debug_style')
         config.include('rhodecode.api')
 
     config.add_route('rhodecode_support', 'https://rhodecode.com/help/', static=True)
     config.add_translation_dirs('rhodecode:i18n/')
     settings['default_locale_name'] = settings.get('lang', 'en')
 
     # Add subscribers.
     if load_all:
         config.add_subscriber(inject_app_settings,
                               pyramid.events.ApplicationCreated)
         config.add_subscriber(scan_repositories_if_enabled,
                               pyramid.events.ApplicationCreated)
         config.add_subscriber(write_metadata_if_needed,
                               pyramid.events.ApplicationCreated)
         config.add_subscriber(write_js_routes_if_enabled,
                               pyramid.events.ApplicationCreated)
 
     # request custom methods
     config.add_request_method(
         'rhodecode.lib.partial_renderer.get_partial_renderer',
         'get_partial_renderer')
 
     config.add_request_method(
         'rhodecode.lib.request_counter.get_request_counter',
         'request_count')
 
     # Set the authorization policy.
     authz_policy = ACLAuthorizationPolicy()
     config.set_authorization_policy(authz_policy)
 
     # Set the default renderer for HTML templates to mako.
     config.add_mako_renderer('.html')
 
     config.add_renderer(
         name='json_ext',
         factory='rhodecode.lib.ext_json_renderer.pyramid_ext_json')
 
     # include RhodeCode plugins
     includes = aslist(settings.get('rhodecode.includes', []))
     for inc in includes:
         config.include(inc)
 
     # custom not found view, if our pyramid app doesn't know how to handle
     # the request pass it to potential VCS handling ap
     config.add_notfound_view(not_found_view)
     if not settings.get('debugtoolbar.enabled', False):
         # disabled debugtoolbar handle all exceptions via the error_handlers
         config.add_view(error_handler, context=Exception)
 
     # all errors including 403/404/50X
     config.add_view(error_handler, context=HTTPError)
 
 
 def wrap_app_in_wsgi_middlewares(pyramid_app, config):
     """
     Apply outer WSGI middlewares around the application.
     """
     registry = config.registry
     settings = registry.settings
 
     # enable https redirects based on HTTP_X_URL_SCHEME set by proxy
     pyramid_app = HttpsFixup(pyramid_app, settings)
 
     pyramid_app, _ae_client = wrap_in_appenlight_if_enabled(
         pyramid_app, settings)
     registry.ae_client = _ae_client
 
     if settings['gzip_responses']:
         pyramid_app = make_gzip_middleware(
             pyramid_app, settings, compress_level=1)
 
     # this should be the outer most middleware in the wsgi stack since
     # middleware like Routes make database calls
     def pyramid_app_with_cleanup(environ, start_response):
         try:
             return pyramid_app(environ, start_response)
         finally:
             # Dispose current database session and rollback uncommitted
             # transactions.
             meta.Session.remove()
 
             # In a single threaded mode server, on non sqlite db we should have
             # '0 Current Checked out connections' at the end of a request,
             # if not, then something, somewhere is leaving a connection open
             pool = meta.Base.metadata.bind.engine.pool
             log.debug('sa pool status: %s', pool.status())
             log.debug('Request processing finalized')
 
     return pyramid_app_with_cleanup
 
 
 def sanitize_settings_and_apply_defaults(global_config, settings):
     """
     Applies settings defaults and does all type conversion.
 
     We would move all settings parsing and preparation into this place, so that
     we have only one place left which deals with this part. The remaining parts
     of the application would start to rely fully on well prepared settings.
 
     This piece would later be split up per topic to avoid a big fat monster
     function.
     """
 
     settings.setdefault('rhodecode.edition', 'Community Edition')
 
     if 'mako.default_filters' not in settings:
         # set custom default filters if we don't have it defined
         settings['mako.imports'] = 'from rhodecode.lib.base import h_filter'
         settings['mako.default_filters'] = 'h_filter'
 
     if 'mako.directories' not in settings:
         mako_directories = settings.setdefault('mako.directories', [
             # Base templates of the original application
             'rhodecode:templates',
         ])
         log.debug(
             "Using the following Mako template directories: %s",
             mako_directories)
 
     # NOTE(marcink): fix redis requirement for schema of connection since 3.X
     if 'beaker.session.type' in settings and settings['beaker.session.type'] == 'ext:redis':
         raw_url = settings['beaker.session.url']
         if not raw_url.startswith(('redis://', 'rediss://', 'unix://')):
             settings['beaker.session.url'] = 'redis://' + raw_url
 
     # Default includes, possible to change as a user
     pyramid_includes = settings.setdefault('pyramid.includes', [
         'rhodecode.lib.middleware.request_wrapper',
     ])
     log.debug(
         "Using the following pyramid.includes: %s",
         pyramid_includes)
 
     # TODO: johbo: Re-think this, usually the call to config.include
     # should allow to pass in a prefix.
     settings.setdefault('rhodecode.api.url', '/_admin/api')
     settings.setdefault('__file__', global_config.get('__file__'))
 
     # Sanitize generic settings.
     _list_setting(settings, 'default_encoding', 'UTF-8')
     _bool_setting(settings, 'is_test', 'false')
     _bool_setting(settings, 'gzip_responses', 'false')
 
     # Call split out functions that sanitize settings for each topic.
     _sanitize_appenlight_settings(settings)
     _sanitize_vcs_settings(settings)
     _sanitize_cache_settings(settings)
 
     # configure instance id
     config_utils.set_instance_id(settings)
 
     return settings
 
 
 def enable_debug():
     """
     Helper to enable debug on running instance
     :return:
     """
     import tempfile
     import textwrap
     import logging.config
 
     ini_template = textwrap.dedent("""
     #####################################
     ### DEBUG LOGGING CONFIGURATION  ####
     #####################################
     [loggers]
     keys = root, sqlalchemy, beaker, celery, rhodecode, ssh_wrapper
 
     [handlers]
     keys = console, console_sql
 
     [formatters]
     keys = generic, color_formatter, color_formatter_sql
 
     #############
     ## LOGGERS ##
     #############
     [logger_root]
     level = NOTSET
     handlers = console
 
     [logger_sqlalchemy]
     level = INFO
     handlers = console_sql
     qualname = sqlalchemy.engine
     propagate = 0
 
     [logger_beaker]
     level = DEBUG
     handlers =
     qualname = beaker.container
     propagate = 1
 
     [logger_rhodecode]
     level = DEBUG
     handlers =
     qualname = rhodecode
     propagate = 1
 
     [logger_ssh_wrapper]
     level = DEBUG
     handlers =
     qualname = ssh_wrapper
     propagate = 1
 
     [logger_celery]
     level = DEBUG
     handlers =
     qualname = celery
 
 
     ##############
     ## HANDLERS ##
     ##############
 
     [handler_console]
     class = StreamHandler
     args = (sys.stderr, )
     level = DEBUG
     formatter = color_formatter
 
     [handler_console_sql]
     # "level = DEBUG" logs SQL queries and results.
     # "level = INFO" logs SQL queries.
     # "level = WARN" logs neither.  (Recommended for production systems.)
     class = StreamHandler
     args = (sys.stderr, )
     level = WARN
     formatter = color_formatter_sql
 
     ################
     ## FORMATTERS ##
     ################
 
     [formatter_generic]
     class = rhodecode.lib.logging_formatter.ExceptionAwareFormatter
     format = %(asctime)s.%(msecs)03d [%(process)d] %(levelname)-5.5s [%(name)s] %(message)s | %(req_id)s
     datefmt = %Y-%m-%d %H:%M:%S
 
     [formatter_color_formatter]
     class = rhodecode.lib.logging_formatter.ColorRequestTrackingFormatter
     format = %(asctime)s.%(msecs)03d [%(process)d] %(levelname)-5.5s [%(name)s] %(message)s | %(req_id)s
     datefmt = %Y-%m-%d %H:%M:%S
 
     [formatter_color_formatter_sql]
     class = rhodecode.lib.logging_formatter.ColorFormatterSql
     format = %(asctime)s.%(msecs)03d [%(process)d] %(levelname)-5.5s [%(name)s] %(message)s
     datefmt = %Y-%m-%d %H:%M:%S    
     """)
 
     with tempfile.NamedTemporaryFile(prefix='rc_debug_logging_', suffix='.ini',
                                      delete=False) as f:
         log.info('Saved Temporary DEBUG config at %s', f.name)
         f.write(ini_template)
 
     logging.config.fileConfig(f.name)
     log.debug('DEBUG MODE ON')
     os.remove(f.name)
 
 
 def _sanitize_appenlight_settings(settings):
     _bool_setting(settings, 'appenlight', 'false')
 
 
 def _sanitize_vcs_settings(settings):
     """
     Applies settings defaults and does type conversion for all VCS related
     settings.
     """
     _string_setting(settings, 'vcs.svn.compatible_version', '')
     _string_setting(settings, 'vcs.hooks.protocol', 'http')
     _string_setting(settings, 'vcs.hooks.host', '127.0.0.1')
     _string_setting(settings, 'vcs.scm_app_implementation', 'http')
     _string_setting(settings, 'vcs.server', '')
     _string_setting(settings, 'vcs.server.log_level', 'debug')
     _string_setting(settings, 'vcs.server.protocol', 'http')
     _bool_setting(settings, 'startup.import_repos', 'false')
     _bool_setting(settings, 'vcs.hooks.direct_calls', 'false')
     _bool_setting(settings, 'vcs.server.enable', 'true')
     _bool_setting(settings, 'vcs.start_server', 'false')
     _list_setting(settings, 'vcs.backends', 'hg, git, svn')
     _int_setting(settings, 'vcs.connection_timeout', 3600)
 
     # Support legacy values of vcs.scm_app_implementation. Legacy
     # configurations may use 'rhodecode.lib.middleware.utils.scm_app_http', or
     # disabled since 4.13 'vcsserver.scm_app' which is now mapped to 'http'.
     scm_app_impl = settings['vcs.scm_app_implementation']
     if scm_app_impl in ['rhodecode.lib.middleware.utils.scm_app_http', 'vcsserver.scm_app']:
         settings['vcs.scm_app_implementation'] = 'http'
 
 
 def _sanitize_cache_settings(settings):
     temp_store = tempfile.gettempdir()
     default_cache_dir = os.path.join(temp_store, 'rc_cache')
 
     # save default, cache dir, and use it for all backends later.
     default_cache_dir = _string_setting(
         settings,
         'cache_dir',
         default_cache_dir, lower=False, default_when_empty=True)
 
     # ensure we have our dir created
     if not os.path.isdir(default_cache_dir):
         os.makedirs(default_cache_dir, mode=0o755)
 
     # exception store cache
     _string_setting(
         settings,
         'exception_tracker.store_path',
         temp_store, lower=False, default_when_empty=True)
 
     # cache_perms
     _string_setting(
         settings,
         'rc_cache.cache_perms.backend',
         'dogpile.cache.rc.file_namespace', lower=False)
     _int_setting(
         settings,
         'rc_cache.cache_perms.expiration_time',
         60)
     _string_setting(
         settings,
         'rc_cache.cache_perms.arguments.filename',
         os.path.join(default_cache_dir, 'rc_cache_1'), lower=False)
 
     # cache_repo
     _string_setting(
         settings,
         'rc_cache.cache_repo.backend',
         'dogpile.cache.rc.file_namespace', lower=False)
     _int_setting(
         settings,
         'rc_cache.cache_repo.expiration_time',
         60)
     _string_setting(
         settings,
         'rc_cache.cache_repo.arguments.filename',
         os.path.join(default_cache_dir, 'rc_cache_2'), lower=False)
 
     # cache_license
     _string_setting(
         settings,
         'rc_cache.cache_license.backend',
         'dogpile.cache.rc.file_namespace', lower=False)
     _int_setting(
         settings,
         'rc_cache.cache_license.expiration_time',
         5*60)
     _string_setting(
         settings,
         'rc_cache.cache_license.arguments.filename',
         os.path.join(default_cache_dir, 'rc_cache_3'), lower=False)
 
     # cache_repo_longterm memory, 96H
     _string_setting(
         settings,
         'rc_cache.cache_repo_longterm.backend',
         'dogpile.cache.rc.memory_lru', lower=False)
     _int_setting(
         settings,
         'rc_cache.cache_repo_longterm.expiration_time',
         345600)
     _int_setting(
         settings,
         'rc_cache.cache_repo_longterm.max_size',
         10000)
 
     # sql_cache_short
     _string_setting(
         settings,
         'rc_cache.sql_cache_short.backend',
         'dogpile.cache.rc.memory_lru', lower=False)
     _int_setting(
         settings,
         'rc_cache.sql_cache_short.expiration_time',
         30)
     _int_setting(
         settings,
         'rc_cache.sql_cache_short.max_size',
         10000)
 
 
 def _int_setting(settings, name, default):
     settings[name] = int(settings.get(name, default))
     return settings[name]
 
 
 def _bool_setting(settings, name, default):
     input_val = settings.get(name, default)
     if isinstance(input_val, unicode):
         input_val = input_val.encode('utf8')
     settings[name] = asbool(input_val)
     return settings[name]
 
 
 def _list_setting(settings, name, default):
     raw_value = settings.get(name, default)
 
     old_separator = ','
     if old_separator in raw_value:
         # If we get a comma separated list, pass it to our own function.
         settings[name] = rhodecode_aslist(raw_value, sep=old_separator)
     else:
         # Otherwise we assume it uses pyramids space/newline separation.
         settings[name] = aslist(raw_value)
     return settings[name]
 
 
 def _string_setting(settings, name, default, lower=True, default_when_empty=False):
     value = settings.get(name, default)
 
     if default_when_empty and not value:
         # use default value when value is empty
         value = default
 
     if lower:
         value = value.lower()
     settings[name] = value
     return settings[name]
 
 
 def _substitute_values(mapping, substitutions):
     result = {}
 
     try:
         for key, value in mapping.items():
             # initialize without substitution first
             result[key] = value
 
             # Note: Cannot use regular replacements, since they would clash
             # with the implementation of ConfigParser. Using "format" instead.
             try:
                 result[key] = value.format(**substitutions)
             except KeyError as e:
                 env_var = '{}'.format(e.args[0])
 
                 msg = 'Failed to substitute: `{key}={{{var}}}` with environment entry. ' \
                       'Make sure your environment has {var} set, or remove this ' \
                       'variable from config file'.format(key=key, var=env_var)
 
                 if env_var.startswith('ENV_'):
                     raise ValueError(msg)
                 else:
                     log.warning(msg)
 
     except ValueError as e:
         log.warning('Failed to substitute ENV variable: %s', e)
         result = mapping
 
     return result

rhodecode/lib/helpers.py

@@ -1,2089 +1,2089 b''
 # -*- coding: utf-8 -*-
 
 # Copyright (C) 2010-2019 RhodeCode GmbH
 #
 # This program is free software: you can redistribute it and/or modify
 # it under the terms of the GNU Affero General Public License, version 3
 # (only), as published by the Free Software Foundation.
 #
 # This program is distributed in the hope that it will be useful,
 # but WITHOUT ANY WARRANTY; without even the implied warranty of
 # MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 # GNU General Public License for more details.
 #
 # You should have received a copy of the GNU Affero General Public License
 # along with this program.  If not, see <http://www.gnu.org/licenses/>.
 #
 # This program is dual-licensed. If you wish to learn more about the
 # RhodeCode Enterprise Edition, including its added features, Support services,
 # and proprietary license terms, please see https://rhodecode.com/licenses/
 
 """
 Helper functions
 
 Consists of functions to typically be used within templates, but also
 available to Controllers. This module is available to both as 'h'.
 """
 
 import os
 import random
 import hashlib
 import StringIO
 import textwrap
 import urllib
 import math
 import logging
 import re
 import time
 import string
 import hashlib
 from collections import OrderedDict
 
 import pygments
 import itertools
 import fnmatch
 import bleach
 
 from pyramid import compat
 from datetime import datetime
 from functools import partial
 from pygments.formatters.html import HtmlFormatter
 from pygments.lexers import (
     get_lexer_by_name, get_lexer_for_filename, get_lexer_for_mimetype)
 
 from pyramid.threadlocal import get_current_request
 
 from webhelpers.html import literal, HTML, escape
 from webhelpers.html.tools import *
 from webhelpers.html.builder import make_tag
 from webhelpers.html.tags import auto_discovery_link, checkbox, css_classes, \
     end_form, file, form as wh_form, hidden, image, javascript_link, link_to, \
     link_to_if, link_to_unless, ol, required_legend, select, stylesheet_link, \
     submit, text, password, textarea, title, ul, xml_declaration, radio
 from webhelpers.html.tools import auto_link, button_to, highlight, \
     js_obfuscate, mail_to, strip_links, strip_tags, tag_re
 from webhelpers.text import chop_at, collapse, convert_accented_entities, \
     convert_misc_entities, lchop, plural, rchop, remove_formatting, \
     replace_whitespace, urlify, truncate, wrap_paragraphs
 from webhelpers.date import time_ago_in_words
 from webhelpers.paginate import Page as _Page
 from webhelpers.html.tags import _set_input_attrs, _set_id_attr, \
     convert_boolean_attrs, NotGiven, _make_safe_id_component
 from webhelpers2.number import format_byte_size
 
 from rhodecode.lib.action_parser import action_parser
 from rhodecode.lib.ext_json import json
 from rhodecode.lib.utils import repo_name_slug, get_custom_lexer
 from rhodecode.lib.utils2 import str2bool, safe_unicode, safe_str, \
     get_commit_safe, datetime_to_time, time_to_datetime, time_to_utcdatetime, \
     AttributeDict, safe_int, md5, md5_safe
 from rhodecode.lib.markup_renderer import MarkupRenderer, relative_links
 from rhodecode.lib.vcs.exceptions import CommitDoesNotExistError
 from rhodecode.lib.vcs.backends.base import BaseChangeset, EmptyCommit
 from rhodecode.lib.index.search_utils import get_matching_line_offsets
 from rhodecode.config.conf import DATE_FORMAT, DATETIME_FORMAT
 from rhodecode.model.changeset_status import ChangesetStatusModel
 from rhodecode.model.db import Permission, User, Repository
 from rhodecode.model.repo_group import RepoGroupModel
 from rhodecode.model.settings import IssueTrackerSettingsModel
 
 
 log = logging.getLogger(__name__)
 
 
 DEFAULT_USER = User.DEFAULT_USER
 DEFAULT_USER_EMAIL = User.DEFAULT_USER_EMAIL
 
 
 def asset(path, ver=None, **kwargs):
     """
     Helper to generate a static asset file path for rhodecode assets
 
     eg. h.asset('images/image.png', ver='3923')
 
     :param path: path of asset
     :param ver: optional version query param to append as ?ver=
     """
     request = get_current_request()
     query = {}
     query.update(kwargs)
     if ver:
         query = {'ver': ver}
     return request.static_path(
         'rhodecode:public/{}'.format(path), _query=query)
 
 
 default_html_escape_table = {
     ord('&'): u'&amp;',
     ord('<'): u'&lt;',
     ord('>'): u'&gt;',
     ord('"'): u'&quot;',
     ord("'"): u'&#39;',
 }
 
 
 def html_escape(text, html_escape_table=default_html_escape_table):
     """Produce entities within text."""
     return text.translate(html_escape_table)
 
 
 def chop_at_smart(s, sub, inclusive=False, suffix_if_chopped=None):
     """
     Truncate string ``s`` at the first occurrence of ``sub``.
 
     If ``inclusive`` is true, truncate just after ``sub`` rather than at it.
     """
     suffix_if_chopped = suffix_if_chopped or ''
     pos = s.find(sub)
     if pos == -1:
         return s
 
     if inclusive:
         pos += len(sub)
 
     chopped = s[:pos]
     left = s[pos:].strip()
 
     if left and suffix_if_chopped:
         chopped += suffix_if_chopped
 
     return chopped
 
 
 def shorter(text, size=20, prefix=False):
     postfix = '...'
     if len(text) > size:
         if prefix:
             # shorten in front
             return postfix + text[-(size - len(postfix)):]
         else:
             return text[:size - len(postfix)] + postfix
     return text
 
 
 def _reset(name, value=None, id=NotGiven, type="reset", **attrs):
     """
     Reset button
     """
     _set_input_attrs(attrs, type, name, value)
     _set_id_attr(attrs, id, name)
     convert_boolean_attrs(attrs, ["disabled"])
     return HTML.input(**attrs)
 
 reset = _reset
 safeid = _make_safe_id_component
 
 
 def branding(name, length=40):
     return truncate(name, length, indicator="")
 
 
 def FID(raw_id, path):
     """
     Creates a unique ID for filenode based on it's hash of path and commit
     it's safe to use in urls
 
     :param raw_id:
     :param path:
     """
 
     return 'c-%s-%s' % (short_id(raw_id), md5_safe(path)[:12])
 
 
 class _GetError(object):
     """Get error from form_errors, and represent it as span wrapped error
     message
 
     :param field_name: field to fetch errors for
     :param form_errors: form errors dict
     """
 
     def __call__(self, field_name, form_errors):
         tmpl = """<span class="error_msg">%s</span>"""
         if form_errors and field_name in form_errors:
             return literal(tmpl % form_errors.get(field_name))
 
 
 get_error = _GetError()
 
 
 class _ToolTip(object):
 
     def __call__(self, tooltip_title, trim_at=50):
         """
         Special function just to wrap our text into nice formatted
         autowrapped text
 
         :param tooltip_title:
         """
         tooltip_title = escape(tooltip_title)
         tooltip_title = tooltip_title.replace('<', '&lt;').replace('>', '&gt;')
         return tooltip_title
 
 
 tooltip = _ToolTip()
 
 files_icon = u'<i class="file-breadcrumb-copy tooltip icon-clipboard clipboard-action" data-clipboard-text="{}" title="Copy the full path"></i>'
 
 
 def files_breadcrumbs(repo_name, commit_id, file_path, at_ref=None, limit_items=False, linkify_last_item=False):
     if isinstance(file_path, str):
         file_path = safe_unicode(file_path)
 
     route_qry = {'at': at_ref} if at_ref else None
 
     # first segment is a `..` link to repo files
     root_name = literal(u'<i class="icon-home"></i>')
     url_segments = [
         link_to(
             root_name,
             route_path(
                 'repo_files',
                 repo_name=repo_name,
                 commit_id=commit_id,
                 f_path='',
                 _query=route_qry),
         )]
 
     path_segments = file_path.split('/')
     last_cnt = len(path_segments) - 1
     for cnt, segment in enumerate(path_segments):
         if not segment:
             continue
         segment_html = escape(segment)
 
         last_item = cnt == last_cnt
 
         if last_item and linkify_last_item is False:
             # plain version
             url_segments.append(segment_html)
         else:
             url_segments.append(
                 link_to(
                     segment_html,
                     route_path(
                         'repo_files',
                         repo_name=repo_name,
                         commit_id=commit_id,
                         f_path='/'.join(path_segments[:cnt + 1]),
                         _query=route_qry),
                 ))
 
     limited_url_segments = url_segments[:1] + ['...'] + url_segments[-5:]
     if limit_items and len(limited_url_segments) < len(url_segments):
         url_segments = limited_url_segments
 
     full_path = file_path
     icon = files_icon.format(escape(full_path))
     if file_path == '':
         return root_name
     else:
         return literal(' / '.join(url_segments) + icon)
 
 
 def files_url_data(request):
     matchdict = request.matchdict
 
     if 'f_path' not in matchdict:
         matchdict['f_path'] = ''
 
     if 'commit_id' not in matchdict:
         matchdict['commit_id'] = 'tip'
 
     return json.dumps(matchdict)
 
 
 def code_highlight(code, lexer, formatter, use_hl_filter=False):
     """
     Lex ``code`` with ``lexer`` and format it with the formatter ``formatter``.
 
     If ``outfile`` is given and a valid file object (an object
     with a ``write`` method), the result will be written to it, otherwise
     it is returned as a string.
     """
     if use_hl_filter:
         # add HL filter
         from rhodecode.lib.index import search_utils
         lexer.add_filter(search_utils.ElasticSearchHLFilter())
     return pygments.format(pygments.lex(code, lexer), formatter)
 
 
 class CodeHtmlFormatter(HtmlFormatter):
     """
     My code Html Formatter for source codes
     """
 
     def wrap(self, source, outfile):
         return self._wrap_div(self._wrap_pre(self._wrap_code(source)))
 
     def _wrap_code(self, source):
         for cnt, it in enumerate(source):
             i, t = it
             t = '<div id="L%s">%s</div>' % (cnt + 1, t)
             yield i, t
 
     def _wrap_tablelinenos(self, inner):
         dummyoutfile = StringIO.StringIO()
         lncount = 0
         for t, line in inner:
             if t:
                 lncount += 1
             dummyoutfile.write(line)
 
         fl = self.linenostart
         mw = len(str(lncount + fl - 1))
         sp = self.linenospecial
         st = self.linenostep
         la = self.lineanchors
         aln = self.anchorlinenos
         nocls = self.noclasses
         if sp:
             lines = []
 
             for i in range(fl, fl + lncount):
                 if i % st == 0:
                     if i % sp == 0:
                         if aln:
                             lines.append('<a href="#%s%d" class="special">%*d</a>' %
                                          (la, i, mw, i))
                         else:
                             lines.append('<span class="special">%*d</span>' % (mw, i))
                     else:
                         if aln:
                             lines.append('<a href="#%s%d">%*d</a>' % (la, i, mw, i))
                         else:
                             lines.append('%*d' % (mw, i))
                 else:
                     lines.append('')
             ls = '\n'.join(lines)
         else:
             lines = []
             for i in range(fl, fl + lncount):
                 if i % st == 0:
                     if aln:
                         lines.append('<a href="#%s%d">%*d</a>' % (la, i, mw, i))
                     else:
                         lines.append('%*d' % (mw, i))
                 else:
                     lines.append('')
             ls = '\n'.join(lines)
 
         # in case you wonder about the seemingly redundant <div> here: since the
         # content in the other cell also is wrapped in a div, some browsers in
         # some configurations seem to mess up the formatting...
         if nocls:
             yield 0, ('<table class="%stable">' % self.cssclass +
                       '<tr><td><div class="linenodiv" '
                       'style="background-color: #f0f0f0; padding-right: 10px">'
                       '<pre style="line-height: 125%">' +
                       ls + '</pre></div></td><td id="hlcode" class="code">')
         else:
             yield 0, ('<table class="%stable">' % self.cssclass +
                       '<tr><td class="linenos"><div class="linenodiv"><pre>' +
                       ls + '</pre></div></td><td id="hlcode" class="code">')
         yield 0, dummyoutfile.getvalue()
         yield 0, '</td></tr></table>'
 
 
 class SearchContentCodeHtmlFormatter(CodeHtmlFormatter):
     def __init__(self, **kw):
         # only show these line numbers if set
         self.only_lines = kw.pop('only_line_numbers', [])
         self.query_terms = kw.pop('query_terms', [])
         self.max_lines = kw.pop('max_lines', 5)
         self.line_context = kw.pop('line_context', 3)
         self.url = kw.pop('url', None)
 
         super(CodeHtmlFormatter, self).__init__(**kw)
 
     def _wrap_code(self, source):
         for cnt, it in enumerate(source):
             i, t = it
             t = '<pre>%s</pre>' % t
             yield i, t
 
     def _wrap_tablelinenos(self, inner):
         yield 0, '<table class="code-highlight %stable">' % self.cssclass
 
         last_shown_line_number = 0
         current_line_number = 1
 
         for t, line in inner:
             if not t:
                 yield t, line
                 continue
 
             if current_line_number in self.only_lines:
                 if last_shown_line_number + 1 != current_line_number:
                     yield 0, '<tr>'
                     yield 0, '<td class="line">...</td>'
                     yield 0, '<td id="hlcode" class="code"></td>'
                     yield 0, '</tr>'
 
                 yield 0, '<tr>'
                 if self.url:
                     yield 0, '<td class="line"><a href="%s#L%i">%i</a></td>' % (
                         self.url, current_line_number, current_line_number)
                 else:
                     yield 0, '<td class="line"><a href="">%i</a></td>' % (
                         current_line_number)
                 yield 0, '<td id="hlcode" class="code">' + line + '</td>'
                 yield 0, '</tr>'
 
                 last_shown_line_number = current_line_number
 
             current_line_number += 1
 
         yield 0, '</table>'
 
 
 def hsv_to_rgb(h, s, v):
     """ Convert hsv color values to rgb """
 
     if s == 0.0:
         return v, v, v
     i = int(h * 6.0)  # XXX assume int() truncates!
     f = (h * 6.0) - i
     p = v * (1.0 - s)
     q = v * (1.0 - s * f)
     t = v * (1.0 - s * (1.0 - f))
     i = i % 6
     if i == 0:
         return v, t, p
     if i == 1:
         return q, v, p
     if i == 2:
         return p, v, t
     if i == 3:
         return p, q, v
     if i == 4:
         return t, p, v
     if i == 5:
         return v, p, q
 
 
 def unique_color_generator(n=10000, saturation=0.10, lightness=0.95):
     """
     Generator for getting n of evenly distributed colors using
     hsv color and golden ratio. It always return same order of colors
 
     :param n: number of colors to generate
     :param saturation: saturation of returned colors
     :param lightness: lightness of returned colors
     :returns: RGB tuple
     """
 
     golden_ratio = 0.618033988749895
     h = 0.22717784590367374
 
     for _ in xrange(n):
         h += golden_ratio
         h %= 1
         HSV_tuple = [h, saturation, lightness]
         RGB_tuple = hsv_to_rgb(*HSV_tuple)
         yield map(lambda x: str(int(x * 256)), RGB_tuple)
 
 
 def color_hasher(n=10000, saturation=0.10, lightness=0.95):
     """
     Returns a function which when called with an argument returns a unique
     color for that argument, eg.
 
     :param n: number of colors to generate
     :param saturation: saturation of returned colors
     :param lightness: lightness of returned colors
     :returns: css RGB string
 
     >>> color_hash = color_hasher()
     >>> color_hash('hello')
     'rgb(34, 12, 59)'
     >>> color_hash('hello')
     'rgb(34, 12, 59)'
     >>> color_hash('other')
     'rgb(90, 224, 159)'
     """
 
     color_dict = {}
     cgenerator = unique_color_generator(
         saturation=saturation, lightness=lightness)
 
     def get_color_string(thing):
         if thing in color_dict:
             col = color_dict[thing]
         else:
             col = color_dict[thing] = cgenerator.next()
         return "rgb(%s)" % (', '.join(col))
 
     return get_color_string
 
 
 def get_lexer_safe(mimetype=None, filepath=None):
     """
     Tries to return a relevant pygments lexer using mimetype/filepath name,
     defaulting to plain text if none could be found
     """
     lexer = None
     try:
         if mimetype:
             lexer = get_lexer_for_mimetype(mimetype)
         if not lexer:
             lexer = get_lexer_for_filename(filepath)
     except pygments.util.ClassNotFound:
         pass
 
     if not lexer:
         lexer = get_lexer_by_name('text')
 
     return lexer
 
 
 def get_lexer_for_filenode(filenode):
     lexer = get_custom_lexer(filenode.extension) or filenode.lexer
     return lexer
 
 
 def pygmentize(filenode, **kwargs):
     """
     pygmentize function using pygments
 
     :param filenode:
     """
     lexer = get_lexer_for_filenode(filenode)
     return literal(code_highlight(filenode.content, lexer,
                                   CodeHtmlFormatter(**kwargs)))
 
 
 def is_following_repo(repo_name, user_id):
     from rhodecode.model.scm import ScmModel
     return ScmModel().is_following_repo(repo_name, user_id)
 
 
 class _Message(object):
     """A message returned by ``Flash.pop_messages()``.
 
     Converting the message to a string returns the message text. Instances
     also have the following attributes:
 
     * ``message``: the message text.
     * ``category``: the category specified when the message was created.
     """
 
     def __init__(self, category, message):
         self.category = category
         self.message = message
 
     def __str__(self):
         return self.message
 
     __unicode__ = __str__
 
     def __html__(self):
         return escape(safe_unicode(self.message))
 
 
 class Flash(object):
     # List of allowed categories.  If None, allow any category.
     categories = ["warning", "notice", "error", "success"]
 
     # Default category if none is specified.
     default_category = "notice"
 
     def __init__(self, session_key="flash", categories=None,
                  default_category=None):
         """
         Instantiate a ``Flash`` object.
 
         ``session_key`` is the key to save the messages under in the user's
         session.
 
         ``categories`` is an optional list which overrides the default list
         of categories.
 
         ``default_category`` overrides the default category used for messages
         when none is specified.
         """
         self.session_key = session_key
         if categories is not None:
             self.categories = categories
         if default_category is not None:
             self.default_category = default_category
         if self.categories and self.default_category not in self.categories:
             raise ValueError(
                 "unrecognized default category %r" % (self.default_category,))
 
     def pop_messages(self, session=None, request=None):
         """
         Return all accumulated messages and delete them from the session.
 
         The return value is a list of ``Message`` objects.
         """
         messages = []
 
         if not session:
             if not request:
                 request = get_current_request()
             session = request.session
 
         # Pop the 'old' pylons flash messages. They are tuples of the form
         # (category, message)
         for cat, msg in session.pop(self.session_key, []):
             messages.append(_Message(cat, msg))
 
         # Pop the 'new' pyramid flash messages for each category as list
         # of strings.
         for cat in self.categories:
             for msg in session.pop_flash(queue=cat):
                 messages.append(_Message(cat, msg))
         # Map messages from the default queue to the 'notice' category.
         for msg in session.pop_flash():
             messages.append(_Message('notice', msg))
 
         session.save()
         return messages
 
     def json_alerts(self, session=None, request=None):
         payloads = []
         messages = flash.pop_messages(session=session, request=request)
         if messages:
             for message in messages:
                 subdata = {}
                 if hasattr(message.message, 'rsplit'):
                     flash_data = message.message.rsplit('|DELIM|', 1)
                     org_message = flash_data[0]
                     if len(flash_data) > 1:
                         subdata = json.loads(flash_data[1])
                 else:
                     org_message = message.message
                 payloads.append({
                     'message': {
                         'message': u'{}'.format(org_message),
                         'level': message.category,
                         'force': True,
                         'subdata': subdata
                     }
                 })
         return json.dumps(payloads)
 
     def __call__(self, message, category=None, ignore_duplicate=True,
                  session=None, request=None):
 
         if not session:
             if not request:
                 request = get_current_request()
             session = request.session
 
         session.flash(
             message, queue=category, allow_duplicate=not ignore_duplicate)
 
 
 flash = Flash()
 
 #==============================================================================
 # SCM FILTERS available via h.
 #==============================================================================
 from rhodecode.lib.vcs.utils import author_name, author_email
 from rhodecode.lib.utils2 import credentials_filter, age, age_from_seconds
 from rhodecode.model.db import User, ChangesetStatus
 
 capitalize = lambda x: x.capitalize()
 email = author_email
 short_id = lambda x: x[:12]
 hide_credentials = lambda x: ''.join(credentials_filter(x))
 
 
 import pytz
 import tzlocal
 local_timezone = tzlocal.get_localzone()
 
 
 def age_component(datetime_iso, value=None, time_is_local=False):
     title = value or format_date(datetime_iso)
     tzinfo = '+00:00'
 
     # detect if we have a timezone info, otherwise, add it
     if time_is_local and isinstance(datetime_iso, datetime) and not datetime_iso.tzinfo:
         force_timezone = os.environ.get('RC_TIMEZONE', '')
         if force_timezone:
             force_timezone = pytz.timezone(force_timezone)
         timezone = force_timezone or local_timezone
         offset = timezone.localize(datetime_iso).strftime('%z')
         tzinfo = '{}:{}'.format(offset[:-2], offset[-2:])
 
     return literal(
         '<time class="timeago tooltip" '
         'title="{1}{2}" datetime="{0}{2}">{1}</time>'.format(
             datetime_iso, title, tzinfo))
 
 
 def _shorten_commit_id(commit_id, commit_len=None):
     if commit_len is None:
         request = get_current_request()
         commit_len = request.call_context.visual.show_sha_length
     return commit_id[:commit_len]
 
 
 def show_id(commit, show_idx=None, commit_len=None):
     """
     Configurable function that shows ID
     by default it's r123:fffeeefffeee
 
     :param commit: commit instance
     """
     if show_idx is None:
         request = get_current_request()
         show_idx = request.call_context.visual.show_revision_number
 
     raw_id = _shorten_commit_id(commit.raw_id, commit_len=commit_len)
     if show_idx:
         return 'r%s:%s' % (commit.idx, raw_id)
     else:
         return '%s' % (raw_id, )
 
 
 def format_date(date):
     """
     use a standardized formatting for dates used in RhodeCode
 
     :param date: date/datetime object
     :return: formatted date
     """
 
     if date:
         _fmt = "%a, %d %b %Y %H:%M:%S"
         return safe_unicode(date.strftime(_fmt))
 
     return u""
 
 
 class _RepoChecker(object):
 
     def __init__(self, backend_alias):
         self._backend_alias = backend_alias
 
     def __call__(self, repository):
         if hasattr(repository, 'alias'):
             _type = repository.alias
         elif hasattr(repository, 'repo_type'):
             _type = repository.repo_type
         else:
             _type = repository
         return _type == self._backend_alias
 
 
 is_git = _RepoChecker('git')
 is_hg = _RepoChecker('hg')
 is_svn = _RepoChecker('svn')
 
 
 def get_repo_type_by_name(repo_name):
     repo = Repository.get_by_repo_name(repo_name)
     if repo:
         return repo.repo_type
 
 
 def is_svn_without_proxy(repository):
     if is_svn(repository):
         from rhodecode.model.settings import VcsSettingsModel
         conf = VcsSettingsModel().get_ui_settings_as_config_obj()
         return not str2bool(conf.get('vcs_svn_proxy', 'http_requests_enabled'))
     return False
 
 
 def discover_user(author):
     """
     Tries to discover RhodeCode User based on the autho string. Author string
     is typically `FirstName LastName <[e-mail]>`
     """
 
     # if author is already an instance use it for extraction
     if isinstance(author, User):
         return author
 
     # Valid email in the attribute passed, see if they're in the system
     _email = author_email(author)
     if _email != '':
         user = User.get_by_email(_email, case_insensitive=True, cache=True)
         if user is not None:
             return user
 
     # Maybe it's a username, we try to extract it and fetch by username ?
     _author = author_name(author)
     user = User.get_by_username(_author, case_insensitive=True, cache=True)
     if user is not None:
         return user
 
     return None
 
 
 def email_or_none(author):
     # extract email from the commit string
     _email = author_email(author)
 
     # If we have an email, use it, otherwise
     # see if it contains a username we can get an email from
     if _email != '':
         return _email
     else:
         user = User.get_by_username(
             author_name(author), case_insensitive=True, cache=True)
 
     if user is not None:
             return user.email
 
     # No valid email, not a valid user in the system, none!
     return None
 
 
 def link_to_user(author, length=0, **kwargs):
     user = discover_user(author)
     # user can be None, but if we have it already it means we can re-use it
     # in the person() function, so we save 1 intensive-query
     if user:
         author = user
 
     display_person = person(author, 'username_or_name_or_email')
     if length:
         display_person = shorter(display_person, length)
 
     if user:
         return link_to(
             escape(display_person),
             route_path('user_profile', username=user.username),
             **kwargs)
     else:
         return escape(display_person)
 
 
 def link_to_group(users_group_name, **kwargs):
     return link_to(
         escape(users_group_name),
         route_path('user_group_profile', user_group_name=users_group_name),
         **kwargs)
 
 
 def person(author, show_attr="username_and_name"):
     user = discover_user(author)
     if user:
         return getattr(user, show_attr)
     else:
         _author = author_name(author)
         _email = email(author)
         return _author or _email
 
 
 def author_string(email):
     if email:
         user = User.get_by_email(email, case_insensitive=True, cache=True)
         if user:
             if user.first_name or user.last_name:
                 return '%s %s &lt;%s&gt;' % (
                     user.first_name, user.last_name, email)
             else:
                 return email
         else:
             return email
     else:
         return None
 
 
 def person_by_id(id_, show_attr="username_and_name"):
     # attr to return from fetched user
     person_getter = lambda usr: getattr(usr, show_attr)
 
     #maybe it's an ID ?
     if str(id_).isdigit() or isinstance(id_, int):
         id_ = int(id_)
         user = User.get(id_)
         if user is not None:
             return person_getter(user)
     return id_
 
 
-def gravatar_with_user(request, author, show_disabled=False):
-    _render = request.get_partial_renderer(
-        'rhodecode:templates/base/base.mako')
-    return _render('gravatar_with_user', author, show_disabled=show_disabled)
+def gravatar_with_user(request, author, show_disabled=False, tooltip=False):
+    _render = request.get_partial_renderer('rhodecode:templates/base/base.mako')
+    return _render('gravatar_with_user', author, show_disabled=show_disabled, tooltip=tooltip)
 
 
 tags_paterns = OrderedDict((
     ('lang', (re.compile(r'\[(lang|language)\ \=\&gt;\ *([a-zA-Z\-\/\#\+\.]*)\]'),
              '<div class="metatag" tag="lang">\\2</div>')),
 
     ('see', (re.compile(r'\[see\ \=\&gt;\ *([a-zA-Z0-9\/\=\?\&amp;\ \:\/\.\-]*)\]'),
             '<div class="metatag" tag="see">see: \\1 </div>')),
 
     ('url', (re.compile(r'\[url\ \=\&gt;\ \[([a-zA-Z0-9\ \.\-\_]+)\]\((http://|https://|/)(.*?)\)\]'),
             '<div class="metatag" tag="url"> <a href="\\2\\3">\\1</a> </div>')),
 
     ('license', (re.compile(r'\[license\ \=\&gt;\ *([a-zA-Z0-9\/\=\?\&amp;\ \:\/\.\-]*)\]'),
                 '<div class="metatag" tag="license"><a href="http:\/\/www.opensource.org/licenses/\\1">\\1</a></div>')),
 
     ('ref', (re.compile(r'\[(requires|recommends|conflicts|base)\ \=\&gt;\ *([a-zA-Z0-9\-\/]*)\]'),
             '<div class="metatag" tag="ref \\1">\\1: <a href="/\\2">\\2</a></div>')),
 
     ('state', (re.compile(r'\[(stable|featured|stale|dead|dev|deprecated)\]'),
               '<div class="metatag" tag="state \\1">\\1</div>')),
 
     # label in grey
     ('label', (re.compile(r'\[([a-z]+)\]'),
               '<div class="metatag" tag="label">\\1</div>')),
 
     # generic catch all in grey
     ('generic', (re.compile(r'\[([a-zA-Z0-9\.\-\_]+)\]'),
                 '<div class="metatag" tag="generic">\\1</div>')),
 ))
 
 
 def extract_metatags(value):
     """
     Extract supported meta-tags from given text value
     """
     tags = []
     if not value:
         return tags, ''
 
     for key, val in tags_paterns.items():
         pat, replace_html = val
         tags.extend([(key, x.group()) for x in pat.finditer(value)])
         value = pat.sub('', value)
 
     return tags, value
 
 
 def style_metatag(tag_type, value):
     """
     converts tags from value into html equivalent
     """
     if not value:
         return ''
 
     html_value = value
     tag_data = tags_paterns.get(tag_type)
     if tag_data:
         pat, replace_html = tag_data
         # convert to plain `unicode` instead of a markup tag to be used in
         # regex expressions. safe_unicode doesn't work here
         html_value = pat.sub(replace_html, unicode(value))
 
     return html_value
 
 
 def bool2icon(value, show_at_false=True):
     """
     Returns boolean value of a given value, represented as html element with
     classes that will represent icons
 
     :param value: given value to convert to html node
     """
 
     if value:  # does bool conversion
         return HTML.tag('i', class_="icon-true", title='True')
     else:  # not true as bool
         if show_at_false:
             return HTML.tag('i', class_="icon-false", title='False')
         return HTML.tag('i')
 
 #==============================================================================
 # PERMS
 #==============================================================================
 from rhodecode.lib.auth import HasPermissionAny, HasPermissionAll, \
 HasRepoPermissionAny, HasRepoPermissionAll, HasRepoGroupPermissionAll, \
 HasRepoGroupPermissionAny, HasRepoPermissionAnyApi, get_csrf_token, \
 csrf_token_key
 
 
 #==============================================================================
 # GRAVATAR URL
 #==============================================================================
 class InitialsGravatar(object):
     def __init__(self, email_address, first_name, last_name, size=30,
                  background=None, text_color='#fff'):
         self.size = size
         self.first_name = first_name
         self.last_name = last_name
         self.email_address = email_address
         self.background = background or self.str2color(email_address)
         self.text_color = text_color
 
     def get_color_bank(self):
         """
         returns a predefined list of colors that gravatars can use.
         Those are randomized distinct colors that guarantee readability and
         uniqueness.
 
         generated with: http://phrogz.net/css/distinct-colors.html
         """
         return [
             '#bf3030', '#a67f53', '#00ff00', '#5989b3', '#392040', '#d90000',
             '#402910', '#204020', '#79baf2', '#a700b3', '#bf6060', '#7f5320',
             '#008000', '#003059', '#ee00ff', '#ff0000', '#8c4b00', '#007300',
             '#005fb3', '#de73e6', '#ff4040', '#ffaa00', '#3df255', '#203140',
             '#47004d', '#591616', '#664400', '#59b365', '#0d2133', '#83008c',
             '#592d2d', '#bf9f60', '#73e682', '#1d3f73', '#73006b', '#402020',
             '#b2862d', '#397341', '#597db3', '#e600d6', '#a60000', '#736039',
             '#00b318', '#79aaf2', '#330d30', '#ff8080', '#403010', '#16591f',
             '#002459', '#8c4688', '#e50000', '#ffbf40', '#00732e', '#102340',
             '#bf60ac', '#8c4646', '#cc8800', '#00a642', '#1d3473', '#b32d98',
             '#660e00', '#ffd580', '#80ffb2', '#7391e6', '#733967', '#d97b6c',
             '#8c5e00', '#59b389', '#3967e6', '#590047', '#73281d', '#665200',
             '#00e67a', '#2d50b3', '#8c2377', '#734139', '#b2982d', '#16593a',
             '#001859', '#ff00aa', '#a65e53', '#ffcc00', '#0d3321', '#2d3959',
             '#731d56', '#401610', '#4c3d00', '#468c6c', '#002ca6', '#d936a3',
             '#d94c36', '#403920', '#36d9a3', '#0d1733', '#592d4a', '#993626',
             '#cca300', '#00734d', '#46598c', '#8c005e', '#7f1100', '#8c7000',
             '#00a66f', '#7382e6', '#b32d74', '#d9896c', '#ffe680', '#1d7362',
             '#364cd9', '#73003d', '#d93a00', '#998a4d', '#59b3a1', '#5965b3',
             '#e5007a', '#73341d', '#665f00', '#00b38f', '#0018b3', '#59163a',
             '#b2502d', '#bfb960', '#00ffcc', '#23318c', '#a6537f', '#734939',
             '#b2a700', '#104036', '#3d3df2', '#402031', '#e56739', '#736f39',
             '#79f2ea', '#000059', '#401029', '#4c1400', '#ffee00', '#005953',
             '#101040', '#990052', '#402820', '#403d10', '#00ffee', '#0000d9',
             '#ff80c4', '#a66953', '#eeff00', '#00ccbe', '#8080ff', '#e673a1',
             '#a62c00', '#474d00', '#1a3331', '#46468c', '#733950', '#662900',
             '#858c23', '#238c85', '#0f0073', '#b20047', '#d9986c', '#becc00',
             '#396f73', '#281d73', '#ff0066', '#ff6600', '#dee673', '#59adb3',
             '#6559b3', '#590024', '#b2622d', '#98b32d', '#36ced9', '#332d59',
             '#40001a', '#733f1d', '#526600', '#005359', '#242040', '#bf6079',
             '#735039', '#cef23d', '#007780', '#5630bf', '#66001b', '#b24700',
             '#acbf60', '#1d6273', '#25008c', '#731d34', '#a67453', '#50592d',
             '#00ccff', '#6600ff', '#ff0044', '#4c1f00', '#8a994d', '#79daf2',
             '#a173e6', '#d93662', '#402310', '#aaff00', '#2d98b3', '#8c40ff',
             '#592d39', '#ff8c40', '#354020', '#103640', '#1a0040', '#331a20',
             '#331400', '#334d00', '#1d5673', '#583973', '#7f0022', '#4c3626',
             '#88cc00', '#36a3d9', '#3d0073', '#d9364c', '#33241a', '#698c23',
             '#5995b3', '#300059', '#e57382', '#7f3300', '#366600', '#00aaff',
             '#3a1659', '#733941', '#663600', '#74b32d', '#003c59', '#7f53a6',
             '#73000f', '#ff8800', '#baf279', '#79caf2', '#291040', '#a6293a',
             '#b2742d', '#587339', '#0077b3', '#632699', '#400009', '#d9a66c',
             '#294010', '#2d4a59', '#aa00ff', '#4c131b', '#b25f00', '#5ce600',
             '#267399', '#a336d9', '#990014', '#664e33', '#86bf60', '#0088ff',
             '#7700b3', '#593a16', '#073300', '#1d4b73', '#ac60bf', '#e59539',
             '#4f8c46', '#368dd9', '#5c0073'
         ]
 
     def rgb_to_hex_color(self, rgb_tuple):
         """
         Converts an rgb_tuple passed to an hex color.
 
         :param rgb_tuple: tuple with 3 ints represents rgb color space
         """
         return '#' + ("".join(map(chr, rgb_tuple)).encode('hex'))
 
     def email_to_int_list(self, email_str):
         """
         Get every byte of the hex digest value of email and turn it to integer.
         It's going to be always between 0-255
         """
         digest = md5_safe(email_str.lower())
         return [int(digest[i * 2:i * 2 + 2], 16) for i in range(16)]
 
     def pick_color_bank_index(self, email_str, color_bank):
         return self.email_to_int_list(email_str)[0] % len(color_bank)
 
     def str2color(self, email_str):
         """
         Tries to map in a stable algorithm an email to color
 
         :param email_str:
         """
         color_bank = self.get_color_bank()
         # pick position (module it's length so we always find it in the
         # bank even if it's smaller than 256 values
         pos = self.pick_color_bank_index(email_str, color_bank)
         return color_bank[pos]
 
     def normalize_email(self, email_address):
         import unicodedata
         # default host used to fill in the fake/missing email
         default_host = u'localhost'
 
         if not email_address:
             email_address = u'%s@%s' % (User.DEFAULT_USER, default_host)
 
         email_address = safe_unicode(email_address)
 
         if u'@' not in email_address:
             email_address = u'%s@%s' % (email_address, default_host)
 
         if email_address.endswith(u'@'):
             email_address = u'%s%s' % (email_address, default_host)
 
         email_address = unicodedata.normalize('NFKD', email_address)\
             .encode('ascii', 'ignore')
         return email_address
 
     def get_initials(self):
         """
         Returns 2 letter initials calculated based on the input.
         The algorithm picks first given email address, and takes first letter
         of part before @, and then the first letter of server name. In case
         the part before @ is in a format of `somestring.somestring2` it replaces
         the server letter with first letter of somestring2
 
         In case function was initialized with both first and lastname, this
         overrides the extraction from email by first letter of the first and
         last name. We add special logic to that functionality, In case Full name
         is compound, like Guido Von Rossum, we use last part of the last name
         (Von Rossum) picking `R`.
 
         Function also normalizes the non-ascii characters to they ascii
         representation, eg Ą => A
         """
         import unicodedata
         # replace non-ascii to ascii
         first_name = unicodedata.normalize(
             'NFKD', safe_unicode(self.first_name)).encode('ascii', 'ignore')
         last_name = unicodedata.normalize(
             'NFKD', safe_unicode(self.last_name)).encode('ascii', 'ignore')
 
         # do NFKD encoding, and also make sure email has proper format
         email_address = self.normalize_email(self.email_address)
 
         # first push the email initials
         prefix, server = email_address.split('@', 1)
 
         # check if prefix is maybe a 'first_name.last_name' syntax
         _dot_split = prefix.rsplit('.', 1)
         if len(_dot_split) == 2 and _dot_split[1]:
             initials = [_dot_split[0][0], _dot_split[1][0]]
         else:
             initials = [prefix[0], server[0]]
 
         # then try to replace either first_name or last_name
         fn_letter = (first_name or " ")[0].strip()
         ln_letter = (last_name.split(' ', 1)[-1] or " ")[0].strip()
 
         if fn_letter:
             initials[0] = fn_letter
 
         if ln_letter:
             initials[1] = ln_letter
 
         return ''.join(initials).upper()
 
     def get_img_data_by_type(self, font_family, img_type):
         default_user = """
         <svg xmlns="http://www.w3.org/2000/svg"
         version="1.1" x="0px" y="0px" width="{size}" height="{size}"
         viewBox="-15 -10 439.165 429.164"
 
         xml:space="preserve"
         style="background:{background};" >
 
         <path d="M204.583,216.671c50.664,0,91.74-48.075,
                  91.74-107.378c0-82.237-41.074-107.377-91.74-107.377
                  c-50.668,0-91.74,25.14-91.74,107.377C112.844,
                  168.596,153.916,216.671,
                  204.583,216.671z" fill="{text_color}"/>
         <path d="M407.164,374.717L360.88,
                  270.454c-2.117-4.771-5.836-8.728-10.465-11.138l-71.83-37.392
                  c-1.584-0.823-3.502-0.663-4.926,0.415c-20.316,
                  15.366-44.203,23.488-69.076,23.488c-24.877,
                  0-48.762-8.122-69.078-23.488
                  c-1.428-1.078-3.346-1.238-4.93-0.415L58.75,
                  259.316c-4.631,2.41-8.346,6.365-10.465,11.138L2.001,374.717
                  c-3.191,7.188-2.537,15.412,1.75,22.005c4.285,
                  6.592,11.537,10.526,19.4,10.526h362.861c7.863,0,15.117-3.936,
                  19.402-10.527 C409.699,390.129,
                  410.355,381.902,407.164,374.717z" fill="{text_color}"/>
         </svg>""".format(
             size=self.size,
             background='#979797',  # @grey4
             text_color=self.text_color,
             font_family=font_family)
 
         return {
             "default_user": default_user
         }[img_type]
 
     def get_img_data(self, svg_type=None):
         """
         generates the svg metadata for image
         """
         fonts = [
             '-apple-system',
              'BlinkMacSystemFont',
              'Segoe UI',
              'Roboto',
              'Oxygen-Sans',
              'Ubuntu',
              'Cantarell',
              'Helvetica Neue',
              'sans-serif'
         ]
         font_family = ','.join(fonts)
         if svg_type:
             return self.get_img_data_by_type(font_family, svg_type)
 
         initials = self.get_initials()
         img_data = """
         <svg xmlns="http://www.w3.org/2000/svg" pointer-events="none"
              width="{size}" height="{size}"
              style="width: 100%; height: 100%; background-color: {background}"
              viewBox="0 0 {size} {size}">
             <text text-anchor="middle" y="50%" x="50%" dy="0.35em"
                   pointer-events="auto" fill="{text_color}"
                   font-family="{font_family}"
                   style="font-weight: 400; font-size: {f_size}px;">{text}
             </text>
         </svg>""".format(
             size=self.size,
             f_size=self.size/2.05,  # scale the text inside the box nicely
             background=self.background,
             text_color=self.text_color,
             text=initials.upper(),
             font_family=font_family)
 
         return img_data
 
     def generate_svg(self, svg_type=None):
         img_data = self.get_img_data(svg_type)
         return "data:image/svg+xml;base64,%s" % img_data.encode('base64')
 
 
 def initials_gravatar(email_address, first_name, last_name, size=30):
     svg_type = None
     if email_address == User.DEFAULT_USER_EMAIL:
         svg_type = 'default_user'
     klass = InitialsGravatar(email_address, first_name, last_name, size)
     return klass.generate_svg(svg_type=svg_type)
 
 
 def gravatar_url(email_address, size=30, request=None):
     request = get_current_request()
     _use_gravatar = request.call_context.visual.use_gravatar
     _gravatar_url = request.call_context.visual.gravatar_url
 
     _gravatar_url = _gravatar_url or User.DEFAULT_GRAVATAR_URL
 
     email_address = email_address or User.DEFAULT_USER_EMAIL
     if isinstance(email_address, unicode):
         # hashlib crashes on unicode items
         email_address = safe_str(email_address)
 
     # empty email or default user
     if not email_address or email_address == User.DEFAULT_USER_EMAIL:
         return initials_gravatar(User.DEFAULT_USER_EMAIL, '', '', size=size)
 
     if _use_gravatar:
         # TODO: Disuse pyramid thread locals. Think about another solution to
         # get the host and schema here.
         request = get_current_request()
         tmpl = safe_str(_gravatar_url)
         tmpl = tmpl.replace('{email}', email_address)\
                    .replace('{md5email}', md5_safe(email_address.lower())) \
                    .replace('{netloc}', request.host)\
                    .replace('{scheme}', request.scheme)\
                    .replace('{size}', safe_str(size))
         return tmpl
     else:
         return initials_gravatar(email_address, '', '', size=size)
 
 
 class Page(_Page):
     """
     Custom pager to match rendering style with paginator
     """
 
     def _get_pos(self, cur_page, max_page, items):
         edge = (items / 2) + 1
         if (cur_page <= edge):
             radius = max(items / 2, items - cur_page)
         elif (max_page - cur_page) < edge:
             radius = (items - 1) - (max_page - cur_page)
         else:
             radius = items / 2
 
         left = max(1, (cur_page - (radius)))
         right = min(max_page, cur_page + (radius))
         return left, cur_page, right
 
     def _range(self, regexp_match):
         """
         Return range of linked pages (e.g. '1 2 [3] 4 5 6 7 8').
 
         Arguments:
 
         regexp_match
             A "re" (regular expressions) match object containing the
             radius of linked pages around the current page in
             regexp_match.group(1) as a string
 
         This function is supposed to be called as a callable in
         re.sub.
 
         """
         radius = int(regexp_match.group(1))
 
         # Compute the first and last page number within the radius
         # e.g. '1 .. 5 6 [7] 8 9 .. 12'
         # -> leftmost_page  = 5
         # -> rightmost_page = 9
         leftmost_page, _cur, rightmost_page = self._get_pos(self.page,
                                                             self.last_page,
                                                             (radius * 2) + 1)
         nav_items = []
 
         # Create a link to the first page (unless we are on the first page
         # or there would be no need to insert '..' spacers)
         if self.page != self.first_page and self.first_page < leftmost_page:
             nav_items.append(self._pagerlink(self.first_page, self.first_page))
 
         # Insert dots if there are pages between the first page
         # and the currently displayed page range
         if leftmost_page - self.first_page > 1:
             # Wrap in a SPAN tag if nolink_attr is set
             text = '..'
             if self.dotdot_attr:
                 text = HTML.span(c=text, **self.dotdot_attr)
             nav_items.append(text)
 
         for thispage in xrange(leftmost_page, rightmost_page + 1):
             # Hilight the current page number and do not use a link
             if thispage == self.page:
                 text = '%s' % (thispage,)
                 # Wrap in a SPAN tag if nolink_attr is set
                 if self.curpage_attr:
                     text = HTML.span(c=text, **self.curpage_attr)
                 nav_items.append(text)
             # Otherwise create just a link to that page
             else:
                 text = '%s' % (thispage,)
                 nav_items.append(self._pagerlink(thispage, text))
 
         # Insert dots if there are pages between the displayed
         # page numbers and the end of the page range
         if self.last_page - rightmost_page > 1:
             text = '..'
             # Wrap in a SPAN tag if nolink_attr is set
             if self.dotdot_attr:
                 text = HTML.span(c=text, **self.dotdot_attr)
             nav_items.append(text)
 
         # Create a link to the very last page (unless we are on the last
         # page or there would be no need to insert '..' spacers)
         if self.page != self.last_page and rightmost_page < self.last_page:
             nav_items.append(self._pagerlink(self.last_page, self.last_page))
 
         ## prerender links
         #_page_link = url.current()
         #nav_items.append(literal('<link rel="prerender" href="%s?page=%s">' % (_page_link, str(int(self.page)+1))))
         #nav_items.append(literal('<link rel="prefetch" href="%s?page=%s">' % (_page_link, str(int(self.page)+1))))
         return self.separator.join(nav_items)
 
     def pager(self, format='~2~', page_param='page', partial_param='partial',
         show_if_single_page=False, separator=' ', onclick=None,
         symbol_first='<<', symbol_last='>>',
         symbol_previous='<', symbol_next='>',
         link_attr={'class': 'pager_link', 'rel': 'prerender'},
         curpage_attr={'class': 'pager_curpage'},
         dotdot_attr={'class': 'pager_dotdot'}, **kwargs):
 
         self.curpage_attr = curpage_attr
         self.separator = separator
         self.pager_kwargs = kwargs
         self.page_param = page_param
         self.partial_param = partial_param
         self.onclick = onclick
         self.link_attr = link_attr
         self.dotdot_attr = dotdot_attr
 
         # Don't show navigator if there is no more than one page
         if self.page_count == 0 or (self.page_count == 1 and not show_if_single_page):
             return ''
 
         from string import Template
         # Replace ~...~ in token format by range of pages
         result = re.sub(r'~(\d+)~', self._range, format)
 
         # Interpolate '%' variables
         result = Template(result).safe_substitute({
             'first_page': self.first_page,
             'last_page': self.last_page,
             'page': self.page,
             'page_count': self.page_count,
             'items_per_page': self.items_per_page,
             'first_item': self.first_item,
             'last_item': self.last_item,
             'item_count': self.item_count,
             'link_first': self.page > self.first_page and \
                     self._pagerlink(self.first_page, symbol_first) or '',
             'link_last': self.page < self.last_page and \
                     self._pagerlink(self.last_page, symbol_last) or '',
             'link_previous': self.previous_page and \
                     self._pagerlink(self.previous_page, symbol_previous) \
                     or HTML.span(symbol_previous, class_="pg-previous disabled"),
             'link_next': self.next_page and \
                     self._pagerlink(self.next_page, symbol_next) \
                     or HTML.span(symbol_next, class_="pg-next disabled")
         })
 
         return literal(result)
 
 
 #==============================================================================
 # REPO PAGER, PAGER FOR REPOSITORY
 #==============================================================================
 class RepoPage(Page):
 
     def __init__(self, collection, page=1, items_per_page=20,
                  item_count=None, url=None, **kwargs):
 
         """Create a "RepoPage" instance. special pager for paging
         repository
         """
         self._url_generator = url
 
         # Safe the kwargs class-wide so they can be used in the pager() method
         self.kwargs = kwargs
 
         # Save a reference to the collection
         self.original_collection = collection
 
         self.collection = collection
 
         # The self.page is the number of the current page.
         # The first page has the number 1!
         try:
             self.page = int(page)  # make it int() if we get it as a string
         except (ValueError, TypeError):
             self.page = 1
 
         self.items_per_page = items_per_page
 
         # Unless the user tells us how many items the collections has
         # we calculate that ourselves.
         if item_count is not None:
             self.item_count = item_count
         else:
             self.item_count = len(self.collection)
 
         # Compute the number of the first and last available page
         if self.item_count > 0:
             self.first_page = 1
             self.page_count = int(math.ceil(float(self.item_count) /
                                             self.items_per_page))
             self.last_page = self.first_page + self.page_count - 1
 
             # Make sure that the requested page number is the range of
             # valid pages
             if self.page > self.last_page:
                 self.page = self.last_page
             elif self.page < self.first_page:
                 self.page = self.first_page
 
             # Note: the number of items on this page can be less than
             #       items_per_page if the last page is not full
             self.first_item = max(0, (self.item_count) - (self.page *
                                                           items_per_page))
             self.last_item = ((self.item_count - 1) - items_per_page *
                               (self.page - 1))
 
             self.items = list(self.collection[self.first_item:self.last_item + 1])
 
             # Links to previous and next page
             if self.page > self.first_page:
                 self.previous_page = self.page - 1
             else:
                 self.previous_page = None
 
             if self.page < self.last_page:
                 self.next_page = self.page + 1
             else:
                 self.next_page = None
 
         # No items available
         else:
             self.first_page = None
             self.page_count = 0
             self.last_page = None
             self.first_item = None
             self.last_item = None
             self.previous_page = None
             self.next_page = None
             self.items = []
 
         # This is a subclass of the 'list' type. Initialise the list now.
         list.__init__(self, reversed(self.items))
 
 
 def breadcrumb_repo_link(repo):
     """
     Makes a breadcrumbs path link to repo
 
     ex::
         group >> subgroup >> repo
 
     :param repo: a Repository instance
     """
 
     path = [
         link_to(group.name, route_path('repo_group_home', repo_group_name=group.group_name),
                 title='last change:{}'.format(format_date(group.last_commit_change)))
         for group in repo.groups_with_parents
     ] + [
         link_to(repo.just_name, route_path('repo_summary', repo_name=repo.repo_name),
                 title='last change:{}'.format(format_date(repo.last_commit_change)))
     ]
 
     return literal(' &raquo; '.join(path))
 
 
 def breadcrumb_repo_group_link(repo_group):
     """
     Makes a breadcrumbs path link to repo
 
     ex::
         group >> subgroup
 
     :param repo_group: a Repository Group instance
     """
 
     path = [
         link_to(group.name,
                 route_path('repo_group_home', repo_group_name=group.group_name),
                 title='last change:{}'.format(format_date(group.last_commit_change)))
         for group in repo_group.parents
     ] + [
         link_to(repo_group.name,
                 route_path('repo_group_home', repo_group_name=repo_group.group_name),
                 title='last change:{}'.format(format_date(repo_group.last_commit_change)))
     ]
 
     return literal(' &raquo; '.join(path))
 
 
 def format_byte_size_binary(file_size):
     """
     Formats file/folder sizes to standard.
     """
     if file_size is None:
         file_size = 0
 
     formatted_size = format_byte_size(file_size, binary=True)
     return formatted_size
 
 
 def urlify_text(text_, safe=True):
     """
     Extrac urls from text and make html links out of them
 
     :param text_:
     """
 
     url_pat = re.compile(r'''(http[s]?://(?:[a-zA-Z]|[0-9]|[$-_@#.&+]'''
                          '''|[!*\(\),]|(?:%[0-9a-fA-F][0-9a-fA-F]))+)''')
 
     def url_func(match_obj):
         url_full = match_obj.groups()[0]
         return '<a href="%(url)s">%(url)s</a>' % ({'url': url_full})
     _newtext = url_pat.sub(url_func, text_)
     if safe:
         return literal(_newtext)
     return _newtext
 
 
 def urlify_commits(text_, repository):
     """
     Extract commit ids from text and make link from them
 
     :param text_:
     :param repository: repo name to build the URL with
     """
 
     URL_PAT = re.compile(r'(^|\s)([0-9a-fA-F]{12,40})($|\s)')
 
     def url_func(match_obj):
         commit_id = match_obj.groups()[1]
         pref = match_obj.groups()[0]
         suf = match_obj.groups()[2]
 
         tmpl = (
             '%(pref)s<a class="%(cls)s" href="%(url)s">'
             '%(commit_id)s</a>%(suf)s'
         )
         return tmpl % {
             'pref': pref,
             'cls': 'revision-link',
             'url': route_url('repo_commit', repo_name=repository, commit_id=commit_id),
             'commit_id': commit_id,
             'suf': suf
         }
 
     newtext = URL_PAT.sub(url_func, text_)
 
     return newtext
 
 
 def _process_url_func(match_obj, repo_name, uid, entry,
                       return_raw_data=False, link_format='html'):
     pref = ''
     if match_obj.group().startswith(' '):
         pref = ' '
 
     issue_id = ''.join(match_obj.groups())
 
     if link_format == 'html':
         tmpl = (
-            '%(pref)s<a class="%(cls)s" href="%(url)s">'
+            '%(pref)s<a class="tooltip %(cls)s" href="%(url)s" title="%(title)s">'
             '%(issue-prefix)s%(id-repr)s'
             '</a>')
     elif link_format == 'rst':
         tmpl = '`%(issue-prefix)s%(id-repr)s <%(url)s>`_'
     elif link_format == 'markdown':
         tmpl = '[%(issue-prefix)s%(id-repr)s](%(url)s)'
     else:
         raise ValueError('Bad link_format:{}'.format(link_format))
 
     (repo_name_cleaned,
      parent_group_name) = RepoGroupModel()._get_group_name_and_parent(repo_name)
 
     # variables replacement
     named_vars = {
         'id': issue_id,
         'repo': repo_name,
         'repo_name': repo_name_cleaned,
-        'group_name': parent_group_name
+        'group_name': parent_group_name,
     }
     # named regex variables
     named_vars.update(match_obj.groupdict())
     _url = string.Template(entry['url']).safe_substitute(**named_vars)
 
     def quote_cleaner(input_str):
         """Remove quotes as it's HTML"""
         return input_str.replace('"', '')
 
     data = {
         'pref': pref,
         'cls': quote_cleaner('issue-tracker-link'),
         'url': quote_cleaner(_url),
         'id-repr': issue_id,
         'issue-prefix': entry['pref'],
         'serv': entry['url'],
+        'title': entry['desc']
     }
     if return_raw_data:
         return {
             'id': issue_id,
             'url': _url
         }
     return tmpl % data
 
 
 def get_active_pattern_entries(repo_name):
     repo = None
     if repo_name:
         # Retrieving repo_name to avoid invalid repo_name to explode on
         # IssueTrackerSettingsModel but still passing invalid name further down
         repo = Repository.get_by_repo_name(repo_name, cache=True)
 
     settings_model = IssueTrackerSettingsModel(repo=repo)
     active_entries = settings_model.get_settings(cache=True)
     return active_entries
 
 
 def process_patterns(text_string, repo_name, link_format='html', active_entries=None):
 
     allowed_formats = ['html', 'rst', 'markdown']
     if link_format not in allowed_formats:
         raise ValueError('Link format can be only one of:{} got {}'.format(
                          allowed_formats, link_format))
 
     active_entries = active_entries or get_active_pattern_entries(repo_name)
     issues_data = []
     newtext = text_string
 
     for uid, entry in active_entries.items():
         log.debug('found issue tracker entry with uid %s', uid)
 
         if not (entry['pat'] and entry['url']):
             log.debug('skipping due to missing data')
             continue
 
         log.debug('issue tracker entry: uid: `%s` PAT:%s URL:%s PREFIX:%s',
                   uid, entry['pat'], entry['url'], entry['pref'])
 
         try:
             pattern = re.compile(r'%s' % entry['pat'])
         except re.error:
             log.exception(
                 'issue tracker pattern: `%s` failed to compile',
                 entry['pat'])
             continue
 
         data_func = partial(
             _process_url_func, repo_name=repo_name, entry=entry, uid=uid,
             return_raw_data=True)
 
         for match_obj in pattern.finditer(text_string):
             issues_data.append(data_func(match_obj))
 
         url_func = partial(
             _process_url_func, repo_name=repo_name, entry=entry, uid=uid,
             link_format=link_format)
 
         newtext = pattern.sub(url_func, newtext)
         log.debug('processed prefix:uid `%s`', uid)
 
     return newtext, issues_data
 
 
 def urlify_commit_message(commit_text, repository=None, active_pattern_entries=None):
     """
     Parses given text message and makes proper links.
     issues are linked to given issue-server, and rest is a commit link
 
     :param commit_text:
     :param repository:
     """
     def escaper(string):
         return string.replace('<', '&lt;').replace('>', '&gt;')
 
     newtext = escaper(commit_text)
 
     # extract http/https links and make them real urls
     newtext = urlify_text(newtext, safe=False)
 
     # urlify commits - extract commit ids and make link out of them, if we have
     # the scope of repository present.
     if repository:
         newtext = urlify_commits(newtext, repository)
 
     # process issue tracker patterns
     newtext, issues = process_patterns(newtext, repository or '',
                                        active_entries=active_pattern_entries)
 
     return literal(newtext)
 
 
 def render_binary(repo_name, file_obj):
     """
     Choose how to render a binary file
     """
 
     filename = file_obj.name
 
     # images
     for ext in ['*.png', '*.jpg', '*.ico', '*.gif']:
         if fnmatch.fnmatch(filename, pat=ext):
             alt = escape(filename)
             src = route_path(
                 'repo_file_raw', repo_name=repo_name,
                 commit_id=file_obj.commit.raw_id,
                 f_path=file_obj.path)
             return literal(
                 '<img class="rendered-binary" alt="{}" src="{}">'.format(alt, src))
 
 
 def renderer_from_filename(filename, exclude=None):
     """
     choose a renderer based on filename, this works only for text based files
     """
 
     # ipython
     for ext in ['*.ipynb']:
         if fnmatch.fnmatch(filename, pat=ext):
             return 'jupyter'
 
     is_markup = MarkupRenderer.renderer_from_filename(filename, exclude=exclude)
     if is_markup:
         return is_markup
     return None
 
 
 def render(source, renderer='rst', mentions=False, relative_urls=None,
            repo_name=None):
 
     def maybe_convert_relative_links(html_source):
         if relative_urls:
             return relative_links(html_source, relative_urls)
         return html_source
 
     if renderer == 'plain':
         return literal(
             MarkupRenderer.plain(source, leading_newline=False))
 
     elif renderer == 'rst':
         if repo_name:
             # process patterns on comments if we pass in repo name
             source, issues = process_patterns(
                 source, repo_name, link_format='rst')
 
         return literal(
             '<div class="rst-block">%s</div>' %
             maybe_convert_relative_links(
                 MarkupRenderer.rst(source, mentions=mentions)))
 
     elif renderer == 'markdown':
         if repo_name:
             # process patterns on comments if we pass in repo name
             source, issues = process_patterns(
                 source, repo_name, link_format='markdown')
 
         return literal(
             '<div class="markdown-block">%s</div>' %
             maybe_convert_relative_links(
                 MarkupRenderer.markdown(source, flavored=True,
                                         mentions=mentions)))
 
     elif renderer == 'jupyter':
         return literal(
             '<div class="ipynb">%s</div>' %
             maybe_convert_relative_links(
                 MarkupRenderer.jupyter(source)))
 
     # None means just show the file-source
     return None
 
 
 def commit_status(repo, commit_id):
     return ChangesetStatusModel().get_status(repo, commit_id)
 
 
 def commit_status_lbl(commit_status):
     return dict(ChangesetStatus.STATUSES).get(commit_status)
 
 
 def commit_time(repo_name, commit_id):
     repo = Repository.get_by_repo_name(repo_name)
     commit = repo.get_commit(commit_id=commit_id)
     return commit.date
 
 
 def get_permission_name(key):
     return dict(Permission.PERMS).get(key)
 
 
 def journal_filter_help(request):
     _ = request.translate
     from rhodecode.lib.audit_logger import ACTIONS
     actions = '\n'.join(textwrap.wrap(', '.join(sorted(ACTIONS.keys())), 80))
 
     return _(
         'Example filter terms:\n' +
         '     repository:vcs\n' +
         '     username:marcin\n' +
         '     username:(NOT marcin)\n' +
         '     action:*push*\n' +
         '     ip:127.0.0.1\n' +
         '     date:20120101\n' +
         '     date:[20120101100000 TO 20120102]\n' +
         '\n' +
         'Actions: {actions}\n' +
         '\n' +
         'Generate wildcards using \'*\' character:\n' +
         '     "repository:vcs*" - search everything starting with \'vcs\'\n' +
         '     "repository:*vcs*" - search for repository containing \'vcs\'\n' +
         '\n' +
         'Optional AND / OR operators in queries\n' +
         '     "repository:vcs OR repository:test"\n' +
         '     "username:test AND repository:test*"\n'
     ).format(actions=actions)
 
 
 def not_mapped_error(repo_name):
     from rhodecode.translation import _
     flash(_('%s repository is not mapped to db perhaps'
             ' it was created or renamed from the filesystem'
             ' please run the application again'
             ' in order to rescan repositories') % repo_name, category='error')
 
 
 def ip_range(ip_addr):
     from rhodecode.model.db import UserIpMap
     s, e = UserIpMap._get_ip_range(ip_addr)
     return '%s - %s' % (s, e)
 
 
 def form(url, method='post', needs_csrf_token=True, **attrs):
     """Wrapper around webhelpers.tags.form to prevent CSRF attacks."""
     if method.lower() != 'get' and needs_csrf_token:
         raise Exception(
             'Forms to POST/PUT/DELETE endpoints should have (in general) a ' +
             'CSRF token. If the endpoint does not require such token you can ' +
             'explicitly set the parameter needs_csrf_token to false.')
 
     return wh_form(url, method=method, **attrs)
 
 
 def secure_form(form_url, method="POST", multipart=False, **attrs):
     """Start a form tag that points the action to an url. This
     form tag will also include the hidden field containing
     the auth token.
 
     The url options should be given either as a string, or as a
     ``url()`` function. The method for the form defaults to POST.
 
     Options:
 
     ``multipart``
         If set to True, the enctype is set to "multipart/form-data".
     ``method``
         The method to use when submitting the form, usually either
         "GET" or "POST". If "PUT", "DELETE", or another verb is used, a
         hidden input with name _method is added to simulate the verb
         over POST.
 
     """
     from webhelpers.pylonslib.secure_form import insecure_form
 
     if 'request' in attrs:
         session = attrs['request'].session
         del attrs['request']
     else:
         raise ValueError(
             'Calling this form requires request= to be passed as argument')
 
     form = insecure_form(form_url, method, multipart, **attrs)
     token = literal(
         '<input type="hidden" id="{}" name="{}" value="{}">'.format(
         csrf_token_key, csrf_token_key, get_csrf_token(session)))
 
     return literal("%s\n%s" % (form, token))
 
 
 def dropdownmenu(name, selected, options, enable_filter=False, **attrs):
     select_html = select(name, selected, options, **attrs)
 
     select2 = """
         <script>
             $(document).ready(function() {
                   $('#%s').select2({
                       containerCssClass: 'drop-menu %s',
                       dropdownCssClass: 'drop-menu-dropdown',
                       dropdownAutoWidth: true%s
                   });
             });
         </script>
     """
 
     filter_option = """,
                         minimumResultsForSearch: -1
     """
     input_id = attrs.get('id') or name
     extra_classes = ' '.join(attrs.pop('extra_classes', []))
     filter_enabled = "" if enable_filter else filter_option
     select_script = literal(select2 % (input_id, extra_classes, filter_enabled))
 
     return literal(select_html+select_script)
 
 
 def get_visual_attr(tmpl_context_var, attr_name):
     """
     A safe way to get a variable from visual variable of template context
 
     :param tmpl_context_var: instance of tmpl_context, usually present as `c`
     :param attr_name: name of the attribute we fetch from the c.visual
     """
     visual = getattr(tmpl_context_var, 'visual', None)
     if not visual:
         return
     else:
         return getattr(visual, attr_name, None)
 
 
 def get_last_path_part(file_node):
     if not file_node.path:
         return u'/'
 
     path = safe_unicode(file_node.path.split('/')[-1])
     return u'../' + path
 
 
 def route_url(*args, **kwargs):
     """
     Wrapper around pyramids `route_url` (fully qualified url) function. 
     """
     req = get_current_request()
     return req.route_url(*args, **kwargs)
 
 
 def route_path(*args, **kwargs):
     """
     Wrapper around pyramids `route_path` function.
     """
     req = get_current_request()
     return req.route_path(*args, **kwargs)
 
 
 def route_path_or_none(*args, **kwargs):
     try:
         return route_path(*args, **kwargs)
     except KeyError:
         return None
 
 
 def current_route_path(request, **kw):
     new_args = request.GET.mixed()
     new_args.update(kw)
     return request.current_route_path(_query=new_args)
 
 
 def curl_api_example(method, args):
     args_json = json.dumps(OrderedDict([
         ('id', 1),
         ('auth_token', 'SECRET'),
         ('method', method),
         ('args', args)
     ]))
 
     return "curl {api_url} -X POST -H 'content-type:text/plain' --data-binary '{args_json}'".format(
         api_url=route_url('apiv2'),
         args_json=args_json
     )
 
 
 def api_call_example(method, args):
     """
     Generates an API call example via CURL
     """
     curl_call = curl_api_example(method, args)
 
     return literal(
         curl_call +
         "<br/><br/>SECRET can be found in <a href=\"{token_url}\">auth-tokens</a> page, "
         "and needs to be of `api calls` role."
         .format(token_url=route_url('my_account_auth_tokens')))
 
 
 def notification_description(notification, request):
     """
     Generate notification human readable description based on notification type
     """
     from rhodecode.model.notification import NotificationModel
     return NotificationModel().make_description(
         notification, translate=request.translate)
 
 
 def go_import_header(request, db_repo=None):
     """
     Creates a header for go-import functionality in Go Lang
     """
 
     if not db_repo:
         return
     if 'go-get' not in request.GET:
         return
 
     clone_url = db_repo.clone_url()
     prefix = re.split(r'^https?:\/\/', clone_url)[-1]
     # we have a repo and go-get flag,
     return literal('<meta name="go-import" content="{} {} {}">'.format(
         prefix, db_repo.repo_type, clone_url))
 
 
 def reviewer_as_json(*args, **kwargs):
     from rhodecode.apps.repository.utils import reviewer_as_json as _reviewer_as_json
     return _reviewer_as_json(*args, **kwargs)
 
 
 def get_repo_view_type(request):
     route_name = request.matched_route.name
     route_to_view_type = {
         'repo_changelog': 'commits',
         'repo_commits': 'commits',
         'repo_files': 'files',
         'repo_summary': 'summary',
         'repo_commit': 'commit'
     }
 
     return route_to_view_type.get(route_name)

rhodecode/public/css/main.less

@@ -1,2821 +1,2897 b''
 //Primary CSS
 
 //--- IMPORTS ------------------//
 
 @import 'helpers';
 @import 'mixins';
 @import 'rcicons';
 @import 'variables';
 @import 'bootstrap-variables';
 @import 'form-bootstrap';
 @import 'codemirror';
 @import 'legacy_code_styles';
 @import 'readme-box';
 @import 'progress-bar';
 
 @import 'type';
 @import 'alerts';
 @import 'buttons';
 @import 'tags';
 @import 'code-block';
 @import 'examples';
 @import 'login';
 @import 'main-content';
 @import 'select2';
 @import 'comments';
 @import 'panels-bootstrap';
 @import 'panels';
 @import 'deform';
+@import 'tooltips';
 
 //--- BASE ------------------//
 .noscript-error {
   top: 0;
   left: 0;
   width: 100%;
   z-index: 101;
   text-align: center;
   font-size: 120%;
   color: white;
   background-color: @alert2;
   padding: 5px 0 5px 0;
   font-weight: @text-semibold-weight;
   font-family: @text-semibold;
 }
 
 html {
     display: table;
     height: 100%;
     width: 100%;
 }
 
 body {
     display: table-cell;
     width: 100%;
 }
 
 //--- LAYOUT ------------------//
 
 .hidden{
 	display: none !important;
 }
 
 .box{
 	float: left;
 	width: 100%;
 }
 
 .browser-header {
     clear: both;
 }
 .main {
   clear: both;
   padding:0 0 @pagepadding;
   height: auto;
 
 	&:after { //clearfix
 		content:"";
 		clear:both;
 		width:100%;
 		display:block;
 	}
 }
 
 .action-link{
 	margin-left: @padding;
 	padding-left: @padding;
 	border-left: @border-thickness solid @border-default-color;
 }
 
 input + .action-link, .action-link.first{
 	border-left: none;
 }
 
 .action-link.last{
 	margin-right: @padding;
 	padding-right: @padding;
 }
 
 .action-link.active,
 .action-link.active a{
 	color: @grey4;
 }
 
 .action-link.disabled {
     color: @grey4;
     cursor: inherit;
 }
 
 .clipboard-action {
   cursor: pointer;
   color: @grey4;
   margin-left: 5px;
 
   &:hover {
     color: @grey2;
   }
 }
 
 ul.simple-list{
 	list-style: none;
 	margin: 0;
 	padding: 0;
 }
 
 .main-content {
 	padding-bottom: @pagepadding;
 }
 
 .wide-mode-wrapper {
     max-width:4000px !important;
 }
 
 .wrapper {
 	position: relative;
 	max-width: @wrapper-maxwidth;
 	margin: 0 auto;
 }
 
 #content {
     clear: both;
     padding: 0 @contentpadding;
 }
 
 .advanced-settings-fields{
 	input{
 		margin-left: @textmargin;
 		margin-right: @padding/2;
 	}
 }
 
 .cs_files_title {
     margin: @pagepadding 0 0;
 }
 
 input.inline[type="file"] {
 	display: inline;
 }
 
 .error_page {
     margin: 10% auto;
 
     h1 {
         color: @grey2;
     }
 
     .alert {
         margin: @padding 0;
     }
 
     .error-branding {
       color: @grey4;
       font-weight: @text-semibold-weight;
       font-family: @text-semibold;
     }
 
     .error_message {
         font-family: @text-regular;
     }
 
     .sidebar {
         min-height: 275px;
         margin: 0;
         padding: 0 0 @sidebarpadding @sidebarpadding;
         border: none;
     }
 
     .main-content {
         position: relative;
         margin: 0 @sidebarpadding @sidebarpadding;
         padding: 0 0 0 @sidebarpadding;
         border-left: @border-thickness solid @grey5;
 
         @media (max-width:767px) {
             clear: both;
             width: 100%;
             margin: 0;
             border: none;
         }
     }
 
     .inner-column {
         float: left;
         width: 29.75%;
         min-height: 150px;
         margin: @sidebarpadding 2% 0 0;
         padding: 0 2% 0 0;
         border-right: @border-thickness solid @grey5;
 
         @media (max-width:767px) {
             clear: both;
             width: 100%;
             border: none;
         }
 
         ul {
             padding-left: 1.25em;
         }
 
         &:last-child {
             margin: @sidebarpadding 0 0;
             border: none;
         }
 
         h4 {
           margin: 0 0 @padding;
           font-weight: @text-semibold-weight;
           font-family: @text-semibold;
         }
     }
 }
 .error-page-logo {
     width: 130px;
     height: 160px;
 }
 
 // HEADER
 .header {
 
     // TODO: johbo: Fix login pages, so that they work without a min-height
     // for the header and then remove the min-height. I chose a smaller value
     // intentionally here to avoid rendering issues in the main navigation.
     min-height: 49px;
     min-width: 1024px;
 
 	position: relative;
 	vertical-align: bottom;
 	padding: 0 @header-padding;
 	background-color: @grey1;
 	color: @grey5;
 
 	.title {
 		overflow: visible;
 	}
 
 	&:before,
 	&:after {
 		content: "";
 		clear: both;
 		width: 100%;
 	}
 
 	// TODO: johbo: Avoids breaking "Repositories" chooser
 	.select2-container .select2-choice .select2-arrow {
 	    display: none;
 	}
 }
 
 #header-inner {
 	&.title {
 		margin: 0;
 	}
 	&:before,
 	&:after {
 		content: "";
 		clear: both;
 	}
 }
 
 // Gists
 #files_data {
     clear: both; //for firefox
     padding-top: 10px;
 }
 
 #gistid {
     margin-right: @padding;
 }
 
 // Global Settings Editor
 .textarea.editor {
 	float: left;
 	position: relative;
 	max-width: @texteditor-width;
 
 	select {
 		position: absolute;
 		top:10px;
 		right:0;
 	}
 
 	.CodeMirror {
 		margin: 0;
 	}
 
 	.help-block {
 		margin: 0 0 @padding;
 		padding:.5em;
 		background-color: @grey6;
         &.pre-formatting {
             white-space: pre;
         }
 	}
 }
 
 ul.auth_plugins {
 	margin: @padding 0 @padding @legend-width;
 	padding: 0;
 
 	li {
 		margin-bottom: @padding;
         line-height: 1em;
 		list-style-type: none;
 
 		.auth_buttons .btn {
 			margin-right: @padding;
 		}
 
 	}
 }
 
 
 // My Account PR list
 
 #show_closed {
     margin: 0 1em 0 0;
 }
 
 #pull_request_list_table {
     .closed {
         background-color: @grey6;
     }
 
     .state-creating,
     .state-updating,
     .state-merging
     {
         background-color: @grey6;
     }
 
     .td-status {
         padding-left: .5em;
     }
     .log-container .truncate {
         height: 2.75em;
         white-space: pre-line;
     }
     table.rctable .user {
         padding-left: 0;
     }
     table.rctable {
         td.td-description,
         .rc-user {
             min-width: auto;
         }
     }
 }
 
 // Pull Requests
 
 .pullrequests_section_head {
   display: block;
   clear: both;
   margin: @padding 0;
   font-weight: @text-bold-weight;
   font-family: @text-bold;
 }
 
 .pr-origininfo, .pr-targetinfo {
     position: relative;
 
     .tag {
         display: inline-block;
         margin: 0 1em .5em 0;
     }
 
     .clone-url {
         display: inline-block;
         margin: 0 0 .5em 0;
         padding: 0;
         line-height: 1.2em;
     }
 }
 
 .pr-mergeinfo {
       min-width: 95% !important;
       padding: 0 !important;
       border: 0;
 }
 .pr-mergeinfo-copy {
     padding: 0 0;
 }
 
 .pr-pullinfo {
       min-width: 95% !important;
       padding: 0 !important;
       border: 0;
 }
 .pr-pullinfo-copy {
     padding: 0 0;
 }
 
 
 #pr-title-input {
   width: 72%;
   font-size: 1em;
   margin: 0;
   padding: 0 0 0 @padding/4;
   line-height: 1.7em;
   color: @text-color;
   letter-spacing: .02em;
   font-weight: @text-bold-weight;
   font-family: @text-bold;
 }
 
 #pullrequest_title {
     width: 100%;
     box-sizing: border-box;
 }
 
 #pr_open_message {
     border: @border-thickness solid #fff;
     border-radius: @border-radius;
     padding: @padding-large-vertical @padding-large-vertical @padding-large-vertical 0;
     text-align: left;
     overflow: hidden;
 }
 
 .pr-submit-button {
     float: right;
     margin: 0 0 0 5px;
 }
 
 .pr-spacing-container {
     padding: 20px;
     clear: both
 }
 
 #pr-description-input {
     margin-bottom: 0;
 }
 
 .pr-description-label {
     vertical-align: top;
 }
 
 .perms_section_head {
     min-width: 625px;
 
     h2 {
         margin-bottom: 0;
     }
 
     .label-checkbox {
         float: left;
     }
 
     &.field {
         margin: @space 0 @padding;
     }
 
     &:first-child.field {
         margin-top: 0;
 
         .label {
             margin-top: 0;
             padding-top: 0;
         }
 
         .radios {
             padding-top: 0;
         }
     }
 
     .radios {
         position: relative;
         width: 505px;
     }
 }
 
 //--- MODULES ------------------//
 
 
 // Server Announcement
 #server-announcement {
   width: 95%;
   margin: @padding auto;
   padding: @padding;
   border-width: 2px;
   border-style: solid;
   .border-radius(2px);
   font-weight: @text-bold-weight;
   font-family: @text-bold;
 
   &.info    { border-color: @alert4; background-color: @alert4-inner; }
   &.warning { border-color: @alert3; background-color: @alert3-inner; }
   &.error   { border-color: @alert2; background-color: @alert2-inner; }
   &.success { border-color: @alert1; background-color: @alert1-inner; }
   &.neutral { border-color: @grey3; background-color: @grey6; }
 }
 
 // Fixed Sidebar Column
 .sidebar-col-wrapper {
     padding-left: @sidebar-all-width;
 
     .sidebar {
         width: @sidebar-width;
         margin-left: -@sidebar-all-width;
     }
 }
 
 .sidebar-col-wrapper.scw-small {
     padding-left: @sidebar-small-all-width;
 
     .sidebar {
         width: @sidebar-small-width;
         margin-left: -@sidebar-small-all-width;
     }
 }
 
 
 // FOOTER
 #footer {
 	padding: 0;
 	text-align: center;
 	vertical-align: middle;
 	color: @grey2;
     font-size: 11px;
 
 	p {
 		margin: 0;
 		padding: 1em;
 		line-height: 1em;
 	}
 
 	.server-instance { //server instance
 		display: none;
 	}
 
 	.title {
 		float: none;
 		margin: 0 auto;
 	}
 }
 
 button.close {
 	padding: 0;
 	cursor: pointer;
 	background: transparent;
 	border: 0;
 	.box-shadow(none);
 	-webkit-appearance: none;
 }
 
 .close {
 	float: right;
 	font-size: 21px;
 	font-family: @text-bootstrap;
 	line-height: 1em;
 	font-weight: bold;
 	color: @grey2;
 
 	&:hover,
 	&:focus {
 		color: @grey1;
 		text-decoration: none;
 		cursor: pointer;
 	}
 }
 
 // GRID
 .sorting,
 .sorting_desc,
 .sorting_asc {
 	cursor: pointer;
 }
 .sorting_desc:after {
 	content: "\00A0\25B2";
 	font-size: .75em;
 }
 .sorting_asc:after {
 	content: "\00A0\25BC";
 	font-size: .68em;
 }
 
 
 .user_auth_tokens {
 
     &.truncate {
         white-space: nowrap;
         overflow: hidden;
         text-overflow: ellipsis;
     }
 
 	.fields .field .input {
 		margin: 0;
 	}
 
 	input#description {
 		width: 100px;
 		margin: 0;
 	}
 
 	.drop-menu {
 	    // TODO: johbo: Remove this, should work out of the box when
 	    // having multiple inputs inline
 		margin: 0 0 0 5px;
 	}
 }
 #user_list_table {
   .closed {
     background-color: @grey6;
   }
 }
 
 
 input, textarea {
 	&.disabled {
 		opacity: .5;
 	}
 
     &:hover {
         border-color: @grey3;
         box-shadow: @button-shadow;
     }
 
     &:focus {
         border-color: @rcblue;
         box-shadow: @button-shadow;
     }
 }
 
 // remove extra padding in firefox
 input::-moz-focus-inner { border:0; padding:0 }
 
 .adjacent input {
 	margin-bottom: @padding;
 }
 
 .permissions_boxes {
 	display: block;
 }
 
 //FORMS
 
 .medium-inline,
 input#description.medium-inline {
 	display: inline;
 	width: @medium-inline-input-width;
 	min-width: 100px;
 }
 
 select {
 	//reset
 	-webkit-appearance: none;
 	-moz-appearance: none;
 
 	display: inline-block;
 	height: 28px;
 	width: auto;
 	margin: 0 @padding @padding 0;
 	padding: 0 18px 0 8px;
 	line-height:1em;
 	font-size: @basefontsize;
 	border: @border-thickness solid @grey5;
     border-radius: @border-radius;
 	background:white url("../images/dt-arrow-dn.png") no-repeat 100% 50%;
 	color: @grey4;
     box-shadow: @button-shadow;
 
 	&:after {
 		content: "\00A0\25BE";
 	}
 
 	&:focus, &:hover {
 		outline: none;
         border-color: @grey4;
         color: @rcdarkblue;
 	}
 }
 
 option {
 	&:focus {
 		outline: none;
 	}
 }
 
 input,
 textarea {
 	padding: @input-padding;
 	border: @input-border-thickness solid @border-highlight-color;
 	.border-radius (@border-radius);
 	font-family: @text-light;
 	font-size: @basefontsize;
 
 	&.input-sm {
 		padding: 5px;
 	}
 
 	&#description {
 		min-width: @input-description-minwidth;
 		min-height: 1em;
 		padding: 10px;
 	}
 }
 
 .field-sm {
     input,
     textarea {
         padding: 5px;
     }
 }
 
 textarea {
 	display: block;
 	clear: both;
 	width: 100%;
 	min-height: 100px;
 	margin-bottom: @padding;
     .box-sizing(border-box);
     overflow: auto;
 }
 
 label {
 	font-family: @text-light;
 }
 
 // GRAVATARS
 // centers gravatar on username to the right
 
 .gravatar {
     display: inline;
     min-width: 16px;
     min-height: 16px;
     margin: -5px 0;
     padding: 0;
     line-height: 1em;
     box-sizing: content-box;
     border-radius: 50%;
 
     &.gravatar-large {
         margin: -0.5em .25em -0.5em 0;
     }
 
     & + .user {
         display: inline;
         margin: 0;
         padding: 0 0 0 .17em;
         line-height: 1em;
     }
 }
 
 .user-inline-data {
     display: inline-block;
     float: left;
     padding-left: .5em;
     line-height: 1.3em;
 }
 
 .rc-user { // gravatar + user wrapper
     float: left;
     position: relative;
     min-width: 100px;
     max-width: 200px;
     min-height: (@gravatar-size + @border-thickness * 2); // account for border
     display: block;
     padding: 0 0 0 (@gravatar-size  + @basefontsize/2 + @border-thickness * 2);
 
 
     .gravatar {
         display: block;
         position: absolute;
         top: 0;
         left: 0;
         min-width:  @gravatar-size;
         min-height: @gravatar-size;
         margin: 0;
     }
 
     .user {
         display: block;
         max-width: 175px;
         padding-top: 2px;
         overflow: hidden;
         text-overflow: ellipsis;
     }
 }
 
 .gist-gravatar,
 .journal_container {
     .gravatar-large {
         margin: 0 .5em -10px 0;
     }
 }
 
 
 // ADMIN SETTINGS
 
 // Tag Patterns
 .tag_patterns {
 	.tag_input {
 		margin-bottom: @padding;
 	}
 }
 
 .locked_input {
     position: relative;
 
     input {
         display: inline;
         margin: 3px 5px 0px 0px;
     }
 
     br {
         display: none;
     }
 
     .error-message {
         float: left;
         width: 100%;
     }
 
     .lock_input_button {
         display: inline;
     }
 
     .help-block {
         clear: both;
     }
 }
 
 // Notifications
 
 .notifications_buttons {
 	margin: 0 0 @space 0;
 	padding: 0;
 
 	.btn {
 		display: inline-block;
 	}
 }
 
 .notification-list {
 
 	div {
 		display: inline-block;
 		vertical-align: middle;
 	}
 
 	.container {
 		display: block;
 		margin: 0 0 @padding 0;
 	}
 
 	.delete-notifications {
 		margin-left: @padding;
 		text-align: right;
         cursor: pointer;
 	}
 
 	.read-notifications {
 		margin-left: @padding/2;
 		text-align: right;
 		width: 35px;
         cursor: pointer;
 	}
 
 	.icon-minus-sign {
 		color: @alert2;
 	}
 
 	.icon-ok-sign {
 		color: @alert1;
 	}
 }
 
 .user_settings {
 	float: left;
 	clear: both;
 	display: block;
 	width: 100%;
 
 	.gravatar_box {
 		margin-bottom: @padding;
 
 		&:after {
 			content: " ";
 			clear: both;
 			width: 100%;
 		}
 	}
 
 	.fields .field {
 		clear: both;
 	}
 }
 
 .advanced_settings {
 	margin-bottom: @space;
 
 	.help-block {
 		margin-left: 0;
 	}
 
 	button + .help-block {
 		margin-top: @padding;
 	}
 }
 
 // admin settings radio buttons and labels
 .label-2 {
 	float: left;
 	width: @label2-width;
 
 	label {
 		color: @grey1;
 	}
 }
 .checkboxes {
 	float: left;
 	width: @checkboxes-width;
 	margin-bottom: @padding;
 
 	.checkbox {
 		width: 100%;
 
 		label {
 			margin: 0;
 			padding: 0;
 		}
 	}
 
 	.checkbox + .checkbox {
 		display: inline-block;
 	}
 
 	label {
 		margin-right: 1em;
 	}
 }
 
 // CHANGELOG
 .container_header {
     float: left;
 	display: block;
 	width: 100%;
 	margin: @padding 0 @padding;
 
     #filter_changelog {
         float: left;
         margin-right: @padding;
     }
 
     .breadcrumbs_light {
         display: inline-block;
     }
 }
 
 .info_box {
 	float: right;
 }
 
 
 
 #graph_content{
 
     // adjust for table headers so that graph renders properly
     //           #graph_nodes padding - table cell padding
     padding-top: (@space - (@basefontsize * 2.4));
 
     &.graph_full_width {
         width: 100%;
         max-width: 100%;
     }
 }
 
 #graph {
 
     .pagination-left {
         float: left;
         clear: both;
     }
 
     .log-container {
         max-width: 345px;
 
         .message{
             max-width: 340px;
         }
     }
 
     .graph-col-wrapper {
 
         #graph_nodes {
             width: 100px;
             position: absolute;
             left: 70px;
             z-index: -1;
         }
     }
 
     .load-more-commits {
         text-align: center;
     }
     .load-more-commits:hover {
         background-color: @grey7;
     }
     .load-more-commits {
       a {
         display: block;
       }
     }
 }
 
 .obsolete-toggle {
     line-height: 30px;
     margin-left: -15px;
 }
 
 #rev_range_container, #rev_range_clear, #rev_range_more {
     margin-top: -5px;
     margin-bottom: -5px;
 }
 
 #filter_changelog {
     float: left;
 }
 
 
 //--- THEME ------------------//
 
 #logo {
 	float: left;
 	margin: 9px 0 0 0;
 
     .header {
     	background-color: transparent;
     }
 
     a {
     	display: inline-block;
     }
 
     img {
     	height:30px;
     }
 }
 
 .logo-wrapper {
 	float:left;
 }
 
 .branding {
 	float: left;
 	padding: 9px 2px;
 	line-height: 1em;
 	font-size: @navigation-fontsize;
 
     a {
       color: @grey5
     }
     @media screen and (max-width: 1200px) {
       display: none;
     }
 }
 
 img {
 	border: none;
 	outline: none;
 }
  user-profile-header
 label {
 
     input[type="checkbox"] {
         margin-right: 1em;
     }
     input[type="radio"] {
         margin-right: 1em;
     }
 }
 
 .review-status {
     &.under_review {
         color: @alert3;
     }
     &.approved {
         color: @alert1;
     }
     &.rejected,
     &.forced_closed{
         color: @alert2;
     }
     &.not_reviewed {
         color: @grey5;
     }
 }
 
 .review-status-under_review {
   color: @alert3;
 }
 .status-tag-under_review {
   border-color: @alert3;
 }
 
 .review-status-approved {
   color: @alert1;
 }
 .status-tag-approved {
   border-color: @alert1;
 }
 
 .review-status-rejected,
 .review-status-forced_closed {
   color: @alert2;
 }
 .status-tag-rejected,
 .status-tag-forced_closed {
   border-color: @alert2;
 }
 
 .review-status-not_reviewed {
   color: @grey5;
 }
 .status-tag-not_reviewed {
   border-color: @grey5;
 }
 
 .test_pattern_preview {
 	margin: @space 0;
 
 	p {
         margin-bottom: 0;
 		border-bottom: @border-thickness solid @border-default-color;
 		color: @grey3;
 	}
 
 	.btn {
 		margin-bottom: @padding;
 	}
 }
 #test_pattern_result {
     display: none;
     &:extend(pre);
     padding: .9em;
     color: @grey3;
     background-color: @grey7;
     border-right: @border-thickness solid @border-default-color;
     border-bottom: @border-thickness solid @border-default-color;
     border-left: @border-thickness solid @border-default-color;
 }
 
 #repo_vcs_settings {
     #inherit_overlay_vcs_default {
         display: none;
     }
     #inherit_overlay_vcs_custom {
         display: custom;
     }
     &.inherited {
         #inherit_overlay_vcs_default {
             display: block;
         }
         #inherit_overlay_vcs_custom {
             display: none;
         }
     }
 }
 
 .issue-tracker-link {
 	color: @rcblue;
 }
 
 // Issue Tracker Table Show/Hide
 #repo_issue_tracker {
     #inherit_overlay {
         display: none;
     }
     #custom_overlay {
         display: custom;
     }
     &.inherited {
         #inherit_overlay {
             display: block;
         }
         #custom_overlay {
             display: none;
         }
     }
 }
 table.issuetracker {
     &.readonly {
         tr, td {
             color: @grey3;
         }
     }
     .edit {
         display: none;
     }
     .editopen {
         .edit {
             display: inline;
         }
         .entry {
             display: none;
         }
     }
     tr td.td-action {
         min-width: 117px;
     }
     td input {
         max-width: none;
         min-width: 30px;
         width: 80%;
     }
     .issuetracker_pref input {
         width: 40%;
     }
     input.edit_issuetracker_update {
         margin-right: 0;
         width: auto;
     }
 }
 
 table.integrations {
     .td-icon {
         width: 20px;
         .integration-icon {
             height: 20px;
             width: 20px;
         }
     }
 }
 
 .integrations {
     a.integration-box {
         color: @text-color;
         &:hover {
             .panel {
                 background: #fbfbfb;
             }
         }
         .integration-icon {
           width: 30px;
           height: 30px;
           margin-right: 20px;
           float: left;
         }
 
         .panel-body {
             padding: 10px;
         }
         .panel {
             margin-bottom: 10px;
         }
         h2 {
             display: inline-block;
             margin: 0;
             min-width: 140px;
         }
     }
     a.integration-box.dummy-integration {
       color: @grey4
     }
 }
 
 //Permissions Settings
 #add_perm {
     margin: 0 0 @padding;
 	cursor: pointer;
 }
 
 .perm_ac {
     input {
         width: 95%;
     }
 }
 
 .autocomplete-suggestions {
     width: auto !important; // overrides autocomplete.js
     min-width: 278px;
     margin: 0;
     border: @border-thickness solid @grey5;
     border-radius: @border-radius;
     color: @grey2;
     background-color: white;
 }
 
 .autocomplete-qfilter-suggestions {
     width: auto !important; // overrides autocomplete.js
     max-height: 100% !important;
     min-width: 376px;
     margin: 0;
     border: @border-thickness solid @grey5;
     color: @grey2;
     background-color: white;
 }
 
 .autocomplete-selected {
     background: #F0F0F0;
 }
 
 .ac-container-wrap {
 	margin: 0;
 	padding: 8px;
 	border-bottom: @border-thickness solid @grey5;
 	list-style-type: none;
 	cursor: pointer;
 
 		&:hover {
 			background-color: @grey7;
 	}
 
 	img {
         height: @gravatar-size;
         width: @gravatar-size;
 		margin-right: 1em;
 	}
 
 	strong {
 		font-weight: normal;
 	}
 }
 
 // Settings Dropdown
 .user-menu .container {
     padding: 0 4px;
     margin: 0;
 }
 
 .user-menu .gravatar {
     cursor: pointer;
 }
 
 .codeblock {
 	margin-bottom: @padding;
     clear: both;
 
     .stats {
         overflow: hidden;
     }
 
     .message{
         textarea{
             margin: 0;
         }
     }
 
     .code-header {
     	.stats {
             line-height: 2em;
 
     		.revision_id {
     			margin-left: 0;
     		}
 			.buttons {
                 padding-right: 0;
 			}
     	}
 
         .item{
             margin-right: 0.5em;
         }
     }
 
     #editor_container {
       position: relative;
       margin: @padding 10px;
     }
 }
 
 #file_history_container {
     display: none;
 }
 
 .file-history-inner {
     margin-bottom: 10px;
 }
 
 // Pull Requests
 .summary-details {
     width: 72%;
 }
 .pr-summary {
     border-bottom: @border-thickness solid @grey5;
     margin-bottom: @space;
 }
 .reviewers-title {
     width: 25%;
     min-width: 200px;
 }
 .reviewers {
     width: 25%;
     min-width: 200px;
 }
 .reviewers ul li {
     position: relative;
     width: 100%;
     padding-bottom: 8px;
     list-style-type: none;
 }
 
 .reviewer_entry {
   min-height: 55px;
 }
 
 .reviewers_member {
     width: 100%;
     overflow: auto;
 }
 .reviewer_reason {
     padding-left: 20px;
     line-height: 1.5em;
 }
 .reviewer_status {
     display: inline-block;
     width: 25px;
     min-width: 25px;
     height: 1.2em;
     line-height: 1em;
 }
 
 .reviewer_name {
     display: inline-block;
     max-width: 83%;
     padding-right: 20px;
     vertical-align: middle;
     line-height: 1;
 
     .rc-user {
         min-width: 0;
         margin: -2px 1em 0 0;
     }
 
     .reviewer {
         float: left;
     }
 }
 
 .reviewer_member_mandatory {
     position: absolute;
     left: 15px;
     top: 8px;
     width: 16px;
     font-size: 11px;
     margin: 0;
     padding: 0;
     color: black;
 }
 
 .reviewer_member_mandatory_remove,
 .reviewer_member_remove {
     position: absolute;
     right: 0;
     top: 0;
     width: 16px;
     margin-bottom: 10px;
     padding: 0;
     color: black;
 }
 
 .reviewer_member_mandatory_remove {
   color: @grey4;
 }
 
 .reviewer_member_status {
     margin-top: 5px;
 }
 .pr-summary #summary{
     width: 100%;
 }
 .pr-summary .action_button:hover {
     border: 0;
     cursor: pointer;
 }
 .pr-details-title {
     padding-bottom: 8px;
     border-bottom: @border-thickness solid @grey5;
 
     .action_button.disabled {
         color: @grey4;
         cursor: inherit;
     }
     .action_button {
         color: @rcblue;
     }
 }
 .pr-details-content {
     margin-top: @textmargin;
     margin-bottom: @textmargin;
 }
 
 .pr-reviewer-rules {
    padding: 10px 0px 20px 0px;
 }
 
 .group_members {
     margin-top: 0;
     padding: 0;
     list-style: outside none none;
 
     img {
         height: @gravatar-size;
         width: @gravatar-size;
         margin-right: .5em;
         margin-left: 3px;
     }
 
     .to-delete {
         .user {
           text-decoration: line-through;
         }
     }
 }
 
 .compare_view_commits_title {
   .disabled {
     cursor: inherit;
     &:hover{
       background-color: inherit;
       color: inherit;
     }
   }
 }
 
 .subtitle-compare {
   margin: -15px 0px 0px 0px;
 }
 
 // new entry in group_members
 .td-author-new-entry {
   background-color: rgba(red(@alert1), green(@alert1), blue(@alert1), 0.3);
 }
 
 .usergroup_member_remove {
     width: 16px;
     margin-bottom: 10px;
     padding: 0;
     color: black !important;
     cursor: pointer;
 }
 
 .reviewer_ac .ac-input {
     width: 92%;
     margin-bottom: 1em;
 }
 
 .compare_view_commits tr{
     height: 20px;
 }
 .compare_view_commits td {
     vertical-align: top;
     padding-top: 10px;
 }
 .compare_view_commits .author {
     margin-left: 5px;
 }
 
 .compare_view_commits {
   .color-a {
     color: @alert1;
   }
 
   .color-c {
     color: @color3;
   }
 
   .color-r {
     color: @color5;
   }
 
   .color-a-bg {
     background-color: @alert1;
   }
 
   .color-c-bg {
     background-color: @alert3;
   }
 
   .color-r-bg {
     background-color: @alert2;
   }
 
   .color-a-border {
     border: 1px solid @alert1;
   }
 
   .color-c-border {
     border: 1px solid @alert3;
   }
 
   .color-r-border {
     border: 1px solid @alert2;
   }
 
   .commit-change-indicator {
     width: 15px;
     height: 15px;
     position: relative;
     left: 15px;
   }
 
   .commit-change-content {
     text-align: center;
     vertical-align: middle;
     line-height: 15px;
   }
 }
 
 .compare_view_filepath {
     color: @grey1;
 }
 
 .show_more {
     display: inline-block;
     width: 0;
     height: 0;
     vertical-align: middle;
     content: "";
     border: 4px solid;
     border-right-color: transparent;
     border-bottom-color: transparent;
     border-left-color: transparent;
     font-size: 0;
 }
 
 .journal_more .show_more {
     display: inline;
 
     &:after {
         content: none;
     }
 }
 
 .compare_view_commits .collapse_commit:after {
     cursor: pointer;
     content: "\00A0\25B4";
     margin-left: -3px;
     font-size: 17px;
     color: @grey4;
 }
 
 .diff_links {
     margin-left: 8px;
 }
 
 #pull_request_overview {
   div.ancestor {
       margin: -33px 0;
   }
 }
 
 div.ancestor {
     line-height: 33px;
 }
 
 .cs_icon_td input[type="checkbox"] {
     display: none;
 }
 
 .cs_icon_td .expand_file_icon:after {
     cursor: pointer;
     content: "\00A0\25B6";
     font-size: 12px;
     color: @grey4;
 }
 
 .cs_icon_td .collapse_file_icon:after {
     cursor: pointer;
     content: "\00A0\25BC";
     font-size: 12px;
     color: @grey4;
 }
 
 /*new binary
 NEW_FILENODE = 1
 DEL_FILENODE = 2
 MOD_FILENODE = 3
 RENAMED_FILENODE = 4
 COPIED_FILENODE = 5
 CHMOD_FILENODE = 6
 BIN_FILENODE = 7
 */
 .cs_files_expand {
     font-size: @basefontsize + 5px;
     line-height: 1.8em;
     float: right;
 }
 
 .cs_files_expand span{
     color: @rcblue;
     cursor: pointer;
 }
 .cs_files {
     clear: both;
 	padding-bottom: @padding;
 
     .cur_cs {
         margin: 10px 2px;
         font-weight: bold;
     }
 
     .node {
         float: left;
     }
 
     .changes {
         float: right;
         color: white;
         font-size: @basefontsize - 4px;
         margin-top: 4px;
         opacity: 0.6;
         filter: Alpha(opacity=60); /* IE8 and earlier */
 
         .added {
             background-color: @alert1;
             float: left;
             text-align: center;
         }
 
         .deleted {
             background-color: @alert2;
             float: left;
             text-align: center;
         }
 
         .bin {
             background-color: @alert1;
             text-align: center;
         }
 
         /*new binary*/
         .bin.bin1 {
             background-color: @alert1;
             text-align: center;
         }
 
         /*deleted binary*/
         .bin.bin2 {
             background-color: @alert2;
             text-align: center;
         }
 
         /*mod binary*/
         .bin.bin3 {
             background-color: @grey2;
             text-align: center;
         }
 
         /*rename file*/
         .bin.bin4 {
             background-color: @alert4;
             text-align: center;
         }
 
         /*copied file*/
         .bin.bin5 {
             background-color: @alert4;
             text-align: center;
         }
 
         /*chmod file*/
         .bin.bin6 {
             background-color: @grey2;
             text-align: center;
         }
     }
 }
 
 .cs_files .cs_added, .cs_files .cs_A,
 .cs_files .cs_added, .cs_files .cs_M,
 .cs_files .cs_added, .cs_files .cs_D {
     height: 16px;
     padding-right: 10px;
     margin-top: 7px;
     text-align: left;
 }
 
 .cs_icon_td {
   min-width: 16px;
   width: 16px;
 }
 
 .pull-request-merge {
     border: 1px solid @grey5;
     padding: 10px 0px 20px;
     margin-top: 10px;
     margin-bottom: 20px;
 }
 
 .pull-request-merge-refresh {
   margin: 2px 7px;
 }
 
 .pull-request-merge ul {
     padding: 0px 0px;
 }
 
 .pull-request-merge li {
     list-style-type: none;
 }
 
 .pull-request-merge .pull-request-wrap {
     height: auto;
     padding: 0px 0px;
     text-align: right;
 }
 
 .pull-request-merge span {
     margin-right: 5px;
 }
 
 .pull-request-merge-actions {
     min-height: 30px;
     padding: 0px 0px;
 }
 
 .pull-request-merge-info {
   padding: 0px 5px 5px 0px;
 }
 
 .merge-status {
   margin-right: 5px;
 }
 
 .merge-message {
     font-size: 1.2em
 }
 
 .merge-message.success i,
 .merge-icon.success i {
     color:@alert1;
 }
 
 .merge-message.warning i,
 .merge-icon.warning i {
   color: @alert3;
 }
 
 .merge-message.error i,
 .merge-icon.error i  {
     color:@alert2;
 }
 
 .pr-versions {
     font-size: 1.1em;
 
     table {
       padding: 0px 5px;
     }
 
     td {
       line-height: 15px;
     }
 
     .compare-radio-button {
       position: relative;
       top: -3px;
     }
 }
 
 
 #close_pull_request {
     margin-right: 0px;
 }
 
 .empty_data {
     color: @grey4;
 }
 
 #changeset_compare_view_content {
     clear: both;
     width: 100%;
     box-sizing: border-box;
     .border-radius(@border-radius);
 
     .help-block {
         margin: @padding 0;
         color: @text-color;
         &.pre-formatting {
             white-space: pre;
         }
     }
 
     .empty_data {
         margin: @padding 0;
     }
 
     .alert {
         margin-bottom: @space;
     }
 }
 
 .table_disp {
 	.status {
 		width: auto;
 	}
 }
 
 
 .creation_in_progress {
   color: @grey4
 }
 
 .status_box_menu {
     margin: 0;
 }
 
 .notification-table{
 	margin-bottom: @space;
 	display: table;
 	width: 100%;
 
 	.container{
 		display: table-row;
 
 		.notification-header{
 			border-bottom: @border-thickness solid @border-default-color;
 		}
 
 		.notification-subject{
 			display: table-cell;
 		}
 	}
 }
 
 // Notifications
 .notification-header{
 	display: table;
 	width: 100%;
 	padding: floor(@basefontsize/2) 0;
     line-height: 1em;
 
 	.desc, .delete-notifications, .read-notifications{
 		display: table-cell;
 		text-align: left;
 	}
 
 	.desc{
 		width: 1163px;
 	}
 
 	.delete-notifications, .read-notifications{
 		width: 35px;
 		min-width: 35px; //fixes when only one button is displayed
 	}
 }
 
 .notification-body {
     .markdown-block,
 	.rst-block {
 		padding: @padding 0;
 	}
 
 	.notification-subject {
 		padding: @textmargin 0;
 		border-bottom: @border-thickness solid @border-default-color;
 	}
 }
 
 
 .notifications_buttons{
 	float: right;
 }
 
 #notification-status{
   display: inline;
 }
 
 // Repositories
 
 #summary.fields{
 	display: table;
 
 	.field{
 		display: table-row;
 
 		.label-summary{
 			display: table-cell;
 			min-width: @label-summary-minwidth;
 			padding-top: @padding/2;
 			padding-bottom: @padding/2;
 			padding-right: @padding/2;
 		}
 
 		.input{
 			display: table-cell;
 			padding: @padding/2;
 
 			input{
 				min-width: 29em;
 				padding:  @padding/4;
 			}
 		}
 		.statistics, .downloads{
 			.disabled{
 				color: @grey4;
 			}
 		}
 	}
 }
 
 #summary{
 	width: 70%;
 }
 
 
 // Journal
 .journal.title {
 	h5 {
 		float: left;
 		margin: 0;
 		width: 70%;
 	}
 
 	ul {
 		float: right;
 		display: inline-block;
 		margin: 0;
 		width: 30%;
 		text-align: right;
 
 		li {
 			display: inline;
 			font-size: @journal-fontsize;
             line-height: 1em;
 
             list-style-type: none;
 		}
 	}
 }
 
 .filterexample {
     position: absolute;
     top: 95px;
     left: @contentpadding;
     color: @rcblue;
     font-size: 11px;
     font-family: @text-regular;
     cursor: help;
 
     &:hover {
         color: @rcdarkblue;
     }
 
     @media (max-width:768px) {
         position: relative;
         top: auto;
         left: auto;
         display: block;
     }
 }
 
 
 #journal{
 	margin-bottom: @space;
 
 	.journal_day{
 		margin-bottom: @textmargin/2;
 		padding-bottom: @textmargin/2;
 		font-size: @journal-fontsize;
 		border-bottom: @border-thickness solid @border-default-color;
 	}
 
 	.journal_container{
 		margin-bottom: @space;
 
 		.journal_user{
 			display: inline-block;
 		}
 		.journal_action_container{
 			display: block;
 			margin-top: @textmargin;
 
 			div{
 				display: inline;
 			}
 
 			div.journal_action_params{
 				display: block;
 			}
 
 			div.journal_repo:after{
 				content: "\A";
 				white-space: pre;
 			}
 
 			div.date{
 				display: block;
 				margin-bottom: @textmargin;
 			}
 		}
 	}
 }
 
 // Files
 .edit-file-title {
     font-size: 16px;
 
     .title-heading {
       padding: 2px;
     }
 }
 
 .edit-file-fieldset {
     margin: @sidebarpadding 0;
 
     .fieldset {
         .left-label {
             width: 13%;
         }
         .right-content {
             width: 87%;
             max-width: 100%;
         }
         .filename-label {
             margin-top: 13px;
         }
         .commit-message-label {
             margin-top: 4px;
         }
         .file-upload-input {
             input {
                 display: none;
             }
           margin-top: 10px;
         }
         .file-upload-label {
           margin-top: 10px;
         }
         p {
             margin-top: 5px;
         }
 
     }
     .custom-path-link {
         margin-left: 5px;
     }
     #commit {
         resize: vertical;
     }
 }
 
 .delete-file-preview {
     max-height: 250px;
 }
 
 .new-file,
 #filter_activate,
 #filter_deactivate {
     float: right;
     margin: 0 0 0 10px;
 }
 
 .file-upload-transaction-wrapper {
     margin-top: 57px;
     clear: both;
 }
 
 .file-upload-transaction-wrapper .error {
     color: @color5;
 }
 
 .file-upload-transaction {
     min-height: 200px;
     padding: 54px;
     border: 1px solid @grey5;
     text-align: center;
     clear: both;
 }
 
 .file-upload-transaction i {
     font-size: 48px
 }
 
 h3.files_location{
     line-height: 2.4em;
 }
 
 .browser-nav {
     width: 100%;
 	display: table;
     margin-bottom: 20px;
 
 	.info_box {
         float: left;
 		display: inline-table;
 		height: 2.5em;
 
         .browser-cur-rev, .info_box_elem {
 			display: table-cell;
 			vertical-align: middle;
 		}
 
         .drop-menu {
             margin: 0 10px;
         }
 
 		.info_box_elem {
 			border-top: @border-thickness solid @grey5;
 			border-bottom: @border-thickness solid @grey5;
             box-shadow: @button-shadow;
 
             #at_rev, a {
                 padding: 0.6em 0.4em;
                 margin: 0;
                 .box-shadow(none);
                 border: 0;
                 height: 12px;
                 color: @grey2;
             }
 
             input#at_rev {
                 max-width: 50px;
                 text-align: center;
             }
 
 			&.previous {
 				border: @border-thickness solid @grey5;
                 border-top-left-radius: @border-radius;
                 border-bottom-left-radius: @border-radius;
 
                 &:hover {
                     border-color: @grey4;
                 }
 
                 .disabled {
                   color: @grey5;
                   cursor: not-allowed;
                   opacity: 0.5;
                 }
 			}
 
 			&.next {
 				border: @border-thickness solid @grey5;
                 border-top-right-radius: @border-radius;
                 border-bottom-right-radius: @border-radius;
 
                 &:hover {
                     border-color: @grey4;
                 }
 
                 .disabled {
                   color: @grey5;
                   cursor: not-allowed;
                   opacity: 0.5;
                 }
 			}
 		}
 
 		.browser-cur-rev {
 
 			span{
                 margin: 0;
 				color: @rcblue;
                 height: 12px;
                 display: inline-block;
                 padding:  0.7em 1em ;
                 border: @border-thickness solid @rcblue;
                 margin-right: @padding;
 			}
 		}
 
 	}
 
     .select-index-number {
         margin: 0 0 0 20px;
         color: @grey3;
     }
 
 	.search_activate {
 		display: table-cell;
 		vertical-align: middle;
 
 		input, label{
 			margin: 0;
 			padding: 0;
 		}
 
 		input{
 			margin-left: @textmargin;
 		}
 
 	}
 }
 
 .browser-cur-rev{
 	margin-bottom: @textmargin;
 }
 
 #node_filter_box_loading{
 	.info_text;
 }
 
 .browser-search {
 	margin: -25px 0px 5px 0px;
 }
 
 .files-quick-filter {
   float: right;
   width: 180px;
   position: relative;
 }
 
 .files-filter-box {
   display: flex;
   padding: 0px;
   border-radius: 3px;
   margin-bottom: 0;
 
   a {
     border: none !important;
   }
 
   li {
     list-style-type: none
   }
 }
 
 .files-filter-box-path {
   line-height: 33px;
   padding: 0;
   width: 20px;
   position: absolute;
   z-index: 11;
   left: 5px;
 }
 
 .files-filter-box-input {
   margin-right: 0;
 
   input {
     border: 1px solid @white;
     padding-left: 25px;
     width: 145px;
 
     &:hover {
         border-color: @grey6;
     }
 
     &:focus {
         border-color: @grey5;
     }
   }
 }
 
 .browser-result{
 	td a{
 		margin-left: 0.5em;
 		display: inline-block;
 
 		em {
           font-weight: @text-bold-weight;
           font-family: @text-bold;
         }
 	}
 }
 
 .browser-highlight{
 	background-color: @grey5-alpha;
 }
 
 
 .edit-file-fieldset #location,
 .edit-file-fieldset #filename {
   display: flex;
   width: -moz-available; /* WebKit-based browsers will ignore this. */
   width: -webkit-fill-available; /* Mozilla-based browsers will ignore this. */
   width: fill-available;
   border: 0;
 }
 
 .path-items {
   display: flex;
   padding: 0;
   border: 1px solid #eeeeee;
   width: 100%;
   float: left;
 
   .breadcrumb-path {
     line-height: 30px;
     padding: 0 4px;
     white-space: nowrap;
   }
 
   .location-path {
     width: -moz-available; /* WebKit-based browsers will ignore this. */
     width: -webkit-fill-available; /* Mozilla-based browsers will ignore this. */
     width: fill-available;
 
     .file-name-input {
       padding: 0.5em 0;
     }
 
   }
 
   ul {
     display: flex;
     margin: 0;
     padding: 0;
     width: 100%;
   }
 
   li {
     list-style-type: none;
   }
 
 }
 
 .editor-items {
   height: 40px;
   margin: 10px 0 -17px 10px;
 
   .editor-action {
     cursor: pointer;
   }
 
   .editor-action.active {
     border-bottom: 2px solid #5C5C5C;
   }
 
   li {
     list-style-type: none;
   }
 }
 
 .edit-file-fieldset .message textarea {
   border: 1px solid #eeeeee;
 }
 
 #files_data .codeblock {
   background-color: #F5F5F5;
 }
 
 #editor_preview {
   background: white;
 }
 
 .show-editor {
   padding: 10px;
   background-color: white;
 
 }
 
 .show-preview {
   padding: 10px;
   background-color: white;
   border-left: 1px solid #eeeeee;
 }
 // quick filter
 .grid-quick-filter {
   float: right;
     position: relative;
 }
 
 .grid-filter-box {
   display: flex;
   padding: 0px;
   border-radius: 3px;
   margin-bottom: 0;
 
   a {
     border: none !important;
   }
 
   li {
     list-style-type: none
   }
 }
 
 .grid-filter-box-icon {
   line-height: 33px;
   padding: 0;
   width: 20px;
   position: absolute;
   z-index: 11;
   left: 5px;
 }
 
 .grid-filter-box-input {
   margin-right: 0;
 
   input {
     border: 1px solid @white;
     padding-left: 25px;
     width: 145px;
 
     &:hover {
         border-color: @grey6;
     }
 
     &:focus {
         border-color: @grey5;
     }
   }
 }
 
 
 
 // Search
 
 .search-form{
     #q {
         width: @search-form-width;
     }
 	.fields{
 		margin: 0 0 @space;
 	}
 
 	label{
 		display: inline-block;
 		margin-right: @textmargin;
 		padding-top: 0.25em;
 	}
 
 
 	.results{
 		clear: both;
 		margin: 0 0 @padding;
 	}
 
     .search-tags {
       padding: 5px 0;
     }
 }
 
 div.search-feedback-items {
 	display: inline-block;
 }
 
 div.search-code-body {
     background-color: #ffffff; padding: 5px 0 5px 10px;
     pre {
         .match { background-color: #faffa6;}
         .break { display: block; width: 100%; background-color: #DDE7EF; color: #747474; }
     }
 }
 
 .expand_commit.search {
     .show_more.open {
         height: auto;
         max-height: none;
     }
 }
 
 .search-results {
 
     h2 {
         margin-bottom: 0;
     }
     .codeblock {
         border: none;
         background: transparent;
     }
 
     .codeblock-header {
         border: none;
         background: transparent;
     }
 
     .code-body {
         border: @border-thickness solid @grey6;
         .border-radius(@border-radius);
     }
 
     .td-commit {
         &:extend(pre);
         border-bottom: @border-thickness solid @border-default-color;
     }
 
     .message {
         height: auto;
         max-width: 350px;
         white-space: normal;
         text-overflow: initial;
         overflow: visible;
 
         .match { background-color: #faffa6;}
         .break { background-color: #DDE7EF; width: 100%; color: #747474; display: block; }
     }
 
     .path {
       border-bottom: none !important;
       border-left: 1px solid @grey6 !important;
       border-right: 1px solid @grey6 !important;
     }
 }
 
 table.rctable td.td-search-results div {
     max-width: 100%;
 }
 
 #tip-box, .tip-box{
 	padding: @menupadding/2;
 	display: block;
 	border: @border-thickness solid @border-highlight-color;
 	.border-radius(@border-radius);
 	background-color: white;
     z-index: 99;
     white-space: pre-wrap;
 }
 
 #linktt {
     width: 79px;
 }
 
 #help_kb .modal-content{
 	max-width: 750px;
 	margin: 10% auto;
 
 	table{
 		td,th{
 			border-bottom: none;
 			line-height: 2.5em;
 		}
 		th{
 			padding-bottom: @textmargin/2;
 		}
 		td.keys{
 			text-align: center;
 		}
 	}
 
 	.block-left{
 		width: 45%;
 		margin-right: 5%;
 	}
 	.modal-footer{
 		clear: both;
 	}
 	.key.tag{
 		padding: 0.5em;
 		background-color: @rcblue;
 		color: white;
 		border-color: @rcblue;
 		.box-shadow(none);
 	}
 }
 
 
 
 //--- IMPORTS FOR REFACTORED STYLES ------------------//
 
 @import 'statistics-graph';
 @import 'tables';
 @import 'forms';
 @import 'diff';
 @import 'summary';
 @import 'navigation';
 
 //--- SHOW/HIDE SECTIONS --//
 
 .btn-collapse {
     float: right;
     text-align: right;
     font-family: @text-light;
     font-size: @basefontsize;
     cursor: pointer;
     border: none;
     color: @rcblue;
 }
 
 table.rctable,
 table.dataTable {
     .btn-collapse {
         float: right;
         text-align: right;
     }
 }
 
 table.rctable {
   &.permissions {
 
     th.td-owner {
       padding: 0;
     }
 
     th {
       font-weight: normal;
       padding: 0 5px;
     }
 
   }
 }
 
 
 // TODO: johbo: Fix for IE10, this avoids that we see a border
 // and padding around checkboxes and radio boxes. Move to the right place,
 // or better: Remove this once we did the form refactoring.
 input[type=checkbox],
 input[type=radio] {
     padding: 0;
     border: none;
 }
 
 .toggle-ajax-spinner{
   height: 16px;
   width: 16px;
 }
 
 
 .markup-form .clearfix {
     .border-radius(@border-radius);
     margin: 0px;
 }
 
 .markup-form-area {
     padding: 8px 12px;
     border: 1px solid @grey4;
     .border-radius(@border-radius);
 }
 
 .markup-form-area-header .nav-links {
     display: flex;
     flex-flow: row wrap;
     -webkit-flex-flow: row wrap;
     width: 100%;
 }
 
 .markup-form-area-footer {
     display: flex;
 }
 
 .markup-form-area-footer .toolbar {
 
 }
 
 // markup Form
 div.markup-form {
     margin-top: 20px;
 }
 
 .markup-form strong {
     display: block;
     margin-bottom: 15px;
 }
 
 .markup-form textarea {
     width: 100%;
     height: 100px;
     font-family: @text-monospace;
 }
 
 form.markup-form {
     margin-top: 10px;
     margin-left: 10px;
 }
 
 .markup-form .comment-block-ta,
 .markup-form .preview-box {
     .border-radius(@border-radius);
     .box-sizing(border-box);
     background-color: white;
 }
 
 .markup-form .preview-box.unloaded {
     height: 50px;
     text-align: center;
     padding: 20px;
     background-color: white;
 }
 
 
 .dropzone-wrapper {
   border: 1px solid @grey5;
   padding: 20px;
 }
 
 .dropzone,
 .dropzone-pure {
-    border: 2px dashed @grey5;
-    border-radius: 5px;
-    background: white;
-    min-height: 200px;
-    padding: 54px;
+  border: 2px dashed @grey5;
+  border-radius: 5px;
+  background: white;
+  min-height: 200px;
+  padding: 54px;
 
   .dz-message {
-      font-weight: 700;
-      text-align: center;
-      margin: 2em 0;
+    font-weight: 700;
+    text-align: center;
+    margin: 2em 0;
   }
 
 }
 
 .dz-preview {
-    margin: 10px 0 !important;
-    position: relative;
-    vertical-align: top;
-    padding: 10px;
-    border-bottom: 1px solid @grey5;
+  margin: 10px 0 !important;
+  position: relative;
+  vertical-align: top;
+  padding: 10px;
+  border-bottom: 1px solid @grey5;
 }
 
 .dz-filename {
-    font-weight: 700;
-    float:left;
+  font-weight: 700;
+  float: left;
 }
 
 .dz-sending {
   float: right;
 }
 
 .dz-response {
-  clear:both
+  clear: both
 }
 
 .dz-filename-size {
-    float:right
+  float: right
 }
 
 .dz-error-message {
-    color: @alert2;
-    padding-top: 10px;
-    clear: both;
+  color: @alert2;
+  padding-top: 10px;
+  clear: both;
+}
+
+
+.user-hovercard {
+  padding: 5px;
+}
+
+.user-hovercard-icon {
+  display: inline;
+  padding: 0;
+  box-sizing: content-box;
+  border-radius: 50%;
+  float: left;
+}
+
+.user-hovercard-name {
+  float: right;
+  vertical-align: top;
+  padding-left: 10px;
+  min-width: 150px;
+}
+
+.user-hovercard-bio {
+  clear: both;
+  padding-top: 10px;
+}
+
+.user-hovercard-header {
+  clear: both;
+  min-height: 10px;
+}
+
+.user-hovercard-footer {
+  clear: both;
+  min-height: 10px;
 }
+
+.user-group-hovercard {
+  padding: 5px;
+}
+
+.user-group-hovercard-icon {
+  display: inline;
+  padding: 0;
+  box-sizing: content-box;
+  border-radius: 50%;
+  float: left;
+}
+
+.user-group-hovercard-name {
+  float: left;
+  vertical-align: top;
+  padding-left: 10px;
+  min-width: 150px;
+}
+
+.user-group-hovercard-icon i {
+  border: 1px solid @grey4;
+  border-radius: 4px;
+}
+
+.user-group-hovercard-bio {
+  clear: both;
+  padding-top: 10px;
+  line-height: 1.0em;
+}
+
+.user-group-hovercard-header {
+  clear: both;
+  min-height: 10px;
+}
+
+.user-group-hovercard-footer {
+  clear: both;
+  min-height: 10px;
+}

rhodecode/public/css/rcicons.less

@@ -1,289 +1,290 b''
 @font-face {
   font-family: 'rcicons';
 
   src: url('../fonts/RCIcons/rcicons.eot?44705679');
   src: url('../fonts/RCIcons/rcicons.eot?44705679#iefix') format('embedded-opentype'),
        url('../fonts/RCIcons/rcicons.woff2?44705679') format('woff2'),
        url('../fonts/RCIcons/rcicons.woff?44705679') format('woff'),
        url('../fonts/RCIcons/rcicons.ttf?44705679') format('truetype'),
        url('../fonts/RCIcons/rcicons.svg?44705679#rcicons') format('svg');
 
   font-weight: normal;
   font-style: normal;
 }
 /* Chrome hack: SVG is rendered more smooth in Windozze. 100% magic, uncomment if you need it. */
 /* Note, that will break hinting! In other OS-es font will be not as sharp as it could be */
 /*
 @media screen and (-webkit-min-device-pixel-ratio:0) {
   @font-face {
     font-family: 'rcicons';
     src: url('../fonts/RCIcons/rcicons.svg?74666722#rcicons') format('svg');
   }
 }
 */
  
  [class^="icon-"]:before, [class*=" icon-"]:before {
   font-family: "rcicons";
   font-style: normal;
   font-weight: normal;
   speak: none;
  
   display: inline-block;
   text-decoration: inherit;
   width: 1em;
   margin-right: .2em;
   text-align: center;
   /* opacity: .8; */
  
   /* For safety - reset parent styles, that can break glyph codes*/
   font-variant: normal;
   text-transform: none;
  
   /* fix buttons height, for twitter bootstrap */
   line-height: 1em;
  
   /* Animation center compensation - margins should be symmetric */
   /* remove if not needed */
   margin-left: .2em;
  
   /* you can be more comfortable with increased icons size */
   /* font-size: 120%; */
  
   /* Font smoothing. That was taken from TWBS */
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
  
   /* Uncomment for 3D effect */
   /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
 }
 
 .animate-spin {
   -moz-animation: spin 2s infinite linear;
   -o-animation: spin 2s infinite linear;
   -webkit-animation: spin 2s infinite linear;
   animation: spin 2s infinite linear;
   display: inline-block;
 }
 @-moz-keyframes spin {
   0% {
     -moz-transform: rotate(0deg);
     -o-transform: rotate(0deg);
     -webkit-transform: rotate(0deg);
     transform: rotate(0deg);
   }
 
   100% {
     -moz-transform: rotate(359deg);
     -o-transform: rotate(359deg);
     -webkit-transform: rotate(359deg);
     transform: rotate(359deg);
   }
 }
 @-webkit-keyframes spin {
   0% {
     -moz-transform: rotate(0deg);
     -o-transform: rotate(0deg);
     -webkit-transform: rotate(0deg);
     transform: rotate(0deg);
   }
 
   100% {
     -moz-transform: rotate(359deg);
     -o-transform: rotate(359deg);
     -webkit-transform: rotate(359deg);
     transform: rotate(359deg);
   }
 }
 @-o-keyframes spin {
   0% {
     -moz-transform: rotate(0deg);
     -o-transform: rotate(0deg);
     -webkit-transform: rotate(0deg);
     transform: rotate(0deg);
   }
 
   100% {
     -moz-transform: rotate(359deg);
     -o-transform: rotate(359deg);
     -webkit-transform: rotate(359deg);
     transform: rotate(359deg);
   }
 }
 @-ms-keyframes spin {
   0% {
     -moz-transform: rotate(0deg);
     -o-transform: rotate(0deg);
     -webkit-transform: rotate(0deg);
     transform: rotate(0deg);
   }
 
   100% {
     -moz-transform: rotate(359deg);
     -o-transform: rotate(359deg);
     -webkit-transform: rotate(359deg);
     transform: rotate(359deg);
   }
 }
 @keyframes spin {
   0% {
     -moz-transform: rotate(0deg);
     -o-transform: rotate(0deg);
     -webkit-transform: rotate(0deg);
     transform: rotate(0deg);
   }
 
   100% {
     -moz-transform: rotate(359deg);
     -o-transform: rotate(359deg);
     -webkit-transform: rotate(359deg);
     transform: rotate(359deg);
   }
 }
 
 
 
 .icon-no-margin::before {
     margin: 0;
 
 }
 // -- ICON CLASSES -- //
 // sorter = lambda s: '\n'.join(sorted(s.splitlines()))
 
 .icon-delete:before { content: '\e800'; } /* '' */
 .icon-ok:before { content: '\e801'; } /* '' */
 .icon-comment:before { content: '\e802'; } /* '' */
 .icon-bookmark:before { content: '\e803'; } /* '' */
 .icon-branch:before { content: '\e804'; } /* '' */
 .icon-tag:before { content: '\e805'; } /* '' */
 .icon-lock:before { content: '\e806'; } /* '' */
 .icon-unlock:before { content: '\e807'; } /* '' */
 .icon-feed:before { content: '\e808'; } /* '' */
 .icon-left:before { content: '\e809'; } /* '' */
 .icon-right:before { content: '\e80a'; } /* '' */
 .icon-down:before { content: '\e80b'; } /* '' */
 .icon-folder:before { content: '\e80c'; } /* '' */
 .icon-folder-open:before { content: '\e80d'; } /* '' */
 .icon-trash-empty:before { content: '\e80e'; } /* '' */
 .icon-group:before { content: '\e80f'; } /* '' */
 .icon-remove:before { content: '\e810'; } /* '' */
 .icon-fork:before { content: '\e811'; } /* '' */
 .icon-more:before { content: '\e812'; } /* '' */
 .icon-search:before { content: '\e813'; } /* '' */
 .icon-scissors:before { content: '\e814'; } /* '' */
 .icon-download:before { content: '\e815'; } /* '' */
 .icon-doc:before { content: '\e816'; } /* '' */
 .icon-cog:before { content: '\e817'; } /* '' */
 .icon-cog-alt:before { content: '\e818'; } /* '' */
 .icon-eye:before { content: '\e819'; } /* '' */
 .icon-eye-off:before { content: '\e81a'; } /* '' */
 .icon-cancel-circled2:before { content: '\e81b'; } /* '' */
 .icon-cancel-circled:before { content: '\e81c'; } /* '' */
 .icon-plus:before { content: '\e81d'; } /* '' */
 .icon-plus-circled:before { content: '\e81e'; } /* '' */
 .icon-minus-circled:before { content: '\e81f'; } /* '' */
 .icon-minus:before { content: '\e820'; } /* '' */
 .icon-info-circled:before { content: '\e821'; } /* '' */
 .icon-upload:before { content: '\e822'; } /* '' */
 .icon-home:before { content: '\e823'; } /* '' */
 .icon-flag-filled:before { content: '\e824'; } /* '' */
 .icon-git:before { content: '\e82a'; } /* '' */
 .icon-hg:before { content: '\e82d'; } /* '' */
 .icon-svn:before { content: '\e82e'; } /* '' */
 .icon-comment-add:before { content: '\e82f'; } /* '' */
 .icon-comment-toggle:before { content: '\e830'; } /* '' */
 .icon-rhodecode:before { content: '\e831'; } /* '' */
 .icon-up:before { content: '\e832'; } /* '' */
 .icon-merge:before { content: '\e833'; } /* '' */
 .icon-spin-alt:before { content: '\e834'; } /* '' */
 .icon-spin:before { content: '\e838'; } /* '' */
 .icon-docs:before { content: '\f0c5'; } /* '' */
 .icon-menu:before { content: '\f0c9'; } /* '' */
 .icon-sort:before { content: '\f0dc'; } /* '' */
 .icon-paste:before { content: '\f0ea'; } /* '' */
 .icon-doc-text:before { content: '\f0f6'; } /* '' */
 .icon-plus-squared:before { content: '\f0fe'; } /* '' */
 .icon-angle-left:before { content: '\f104'; } /* '' */
 .icon-angle-right:before { content: '\f105'; } /* '' */
 .icon-angle-up:before { content: '\f106'; } /* '' */
 .icon-angle-down:before { content: '\f107'; } /* '' */
 .icon-circle-empty:before { content: '\f10c'; } /* '' */
 .icon-circle:before { content: '\f111'; } /* '' */
 .icon-folder-empty:before { content: '\f114'; } /* '' */
 .icon-folder-open-empty:before { content: '\f115'; } /* '' */
 .icon-code:before { content: '\f121'; } /* '' */
 .icon-info:before { content: '\f129'; } /* '' */
 .icon-minus-squared:before { content: '\f146'; } /* '' */
 .icon-minus-squared-alt:before { content: '\f147'; } /* '' */
 .icon-doc-inv:before { content: '\f15b'; } /* '' */
 .icon-doc-text-inv:before { content: '\f15c'; } /* '' */
 .icon-plus-squared-alt:before { content: '\f196'; } /* '' */
 .icon-file-code:before { content: '\f1c9'; } /* '' */
 .icon-history:before { content: '\f1da'; } /* '' */
 .icon-circle-thin:before { content: '\f1db'; } /* '' */
 .icon-sliders:before { content: '\f1de'; } /* '' */
 .icon-trash:before { content: '\f1f8'; } /* '' */
 
 
 // MERGED ICONS BASED ON CURRENT ONES
 .icon-repo-group:before { &:extend(.icon-folder-open:before); }
 .icon-repo-private:before { &:extend(.icon-lock:before); }
 .icon-repo-lock:before { &:extend(.icon-lock:before); }
 .icon-unlock-alt:before { &:extend(.icon-unlock:before); }
 .icon-repo-unlock:before { &:extend(.icon-unlock:before); }
 .icon-repo-public:before { &:extend(.icon-unlock:before); }
 .icon-rss-sign:before { &:extend(.icon-feed:before); }
 .icon-code-fork:before {  &:extend(.icon-fork:before);  }
 .icon-arrow_up:before { &:extend(.icon-up:before); }
 .icon-file:before { &:extend(.icon-file-code:before); }
 .icon-file-text:before { &:extend(.icon-file-code:before); }
 .icon-directory:before { &:extend(.icon-folder:before); }
 .icon-more-linked:before { &:extend(.icon-more:before); }
 .icon-clipboard:before { &:extend(.icon-docs:before); }
 .icon-copy:before { &:extend(.icon-docs:before); }
 .icon-true:before { &:extend(.icon-ok:before); }
 .icon-false:before { &:extend(.icon-delete:before); }
 .icon-expand-linked:before { &:extend(.icon-down:before); }
 .icon-pr-merge-fail:before { &:extend(.icon-delete:before); }
 .icon-wide-mode:before { &:extend(.icon-sort:before); }
 .icon-flag-filled-red:before { &:extend(.icon-flag-filled:before); }
+.icon-user-group-alt:before { &:extend(.icon-group:before); }
 
 // TRANSFORM
 .icon-merge:before {transform: rotate(180deg);}
 .icon-wide-mode:before {transform: rotate(90deg);}
 
 // -- END ICON CLASSES -- //
 
 
 //--- ICONS STYLING ------------------//
 
 .icon-git { color: @color4 !important; }
 .icon-hg { color: @color8 !important; }
 .icon-svn { color: @color1 !important; }
 .icon-git-inv { color: @color4 !important; }
 .icon-hg-inv { color: @color8 !important; }
 .icon-svn-inv { color: @color1 !important; }
 .icon-repo-lock { color: #FF0000; }
 .icon-repo-unlock { color: #FF0000; }
 .icon-false { color: @grey5 }
 .icon-expand-linked { cursor: pointer; color: @grey3; font-size: 14px }
 .icon-more-linked { cursor: pointer; color: @grey3 }
 .icon-flag-filled-red { color: @color5 !important; }
 
 .repo-switcher-dropdown .select2-result-label {
     .icon-git:before {
         &:extend(.icon-git-transparent:before);
     }
     .icon-hg:before {
         &:extend(.icon-hg-transparent:before);
         color: @alert4;
     }
     .icon-svn:before {
         &:extend(.icon-svn-transparent:before);
     }
 }
 
 .icon-user-group:before {
   &:extend(.icon-group:before);
   margin: 0;
   font-size: 16px;
 }

rhodecode/public/js/rhodecode/routes.js

@@ -1,382 +1,385 b''
 
 /******************************************************************************
  *                                                                            *
  *                      DO NOT CHANGE THIS FILE MANUALLY                      *
  *                                                                            *
  *                                                                            *
  *        This file is automatically generated when the app starts up with    *
  *                         generate_js_files = true                           *
  *                                                                            *
  *  To add a route here pass jsroute=True to the route definition in the app  *
  *                                                                            *
  ******************************************************************************/
 function registerRCRoutes() {
     // routes registration
     pyroutes.register('favicon', '/favicon.ico', []);
     pyroutes.register('robots', '/robots.txt', []);
     pyroutes.register('auth_home', '/_admin/auth*traverse', []);
     pyroutes.register('global_integrations_new', '/_admin/integrations/new', []);
     pyroutes.register('global_integrations_home', '/_admin/integrations', []);
     pyroutes.register('global_integrations_list', '/_admin/integrations/%(integration)s', ['integration']);
     pyroutes.register('global_integrations_create', '/_admin/integrations/%(integration)s/new', ['integration']);
     pyroutes.register('global_integrations_edit', '/_admin/integrations/%(integration)s/%(integration_id)s', ['integration', 'integration_id']);
     pyroutes.register('repo_group_integrations_home', '/%(repo_group_name)s/_settings/integrations', ['repo_group_name']);
     pyroutes.register('repo_group_integrations_new', '/%(repo_group_name)s/_settings/integrations/new', ['repo_group_name']);
     pyroutes.register('repo_group_integrations_list', '/%(repo_group_name)s/_settings/integrations/%(integration)s', ['repo_group_name', 'integration']);
     pyroutes.register('repo_group_integrations_create', '/%(repo_group_name)s/_settings/integrations/%(integration)s/new', ['repo_group_name', 'integration']);
     pyroutes.register('repo_group_integrations_edit', '/%(repo_group_name)s/_settings/integrations/%(integration)s/%(integration_id)s', ['repo_group_name', 'integration', 'integration_id']);
     pyroutes.register('repo_integrations_home', '/%(repo_name)s/settings/integrations', ['repo_name']);
     pyroutes.register('repo_integrations_new', '/%(repo_name)s/settings/integrations/new', ['repo_name']);
     pyroutes.register('repo_integrations_list', '/%(repo_name)s/settings/integrations/%(integration)s', ['repo_name', 'integration']);
     pyroutes.register('repo_integrations_create', '/%(repo_name)s/settings/integrations/%(integration)s/new', ['repo_name', 'integration']);
     pyroutes.register('repo_integrations_edit', '/%(repo_name)s/settings/integrations/%(integration)s/%(integration_id)s', ['repo_name', 'integration', 'integration_id']);
+    pyroutes.register('hovercard_user', '/_hovercard/user/%(user_id)s', ['user_id']);
+    pyroutes.register('hovercard_user_group', '/_hovercard/user_group/%(user_group_id)s', ['user_group_id']);
+    pyroutes.register('hovercard_commit', '/_hovercard/commit/%(repo_name)s/%(user_id)s', ['repo_name', 'user_id']);
     pyroutes.register('ops_ping', '/_admin/ops/ping', []);
     pyroutes.register('ops_error_test', '/_admin/ops/error', []);
     pyroutes.register('ops_redirect_test', '/_admin/ops/redirect', []);
     pyroutes.register('ops_ping_legacy', '/_admin/ping', []);
     pyroutes.register('ops_error_test_legacy', '/_admin/error_test', []);
     pyroutes.register('admin_home', '/_admin', []);
     pyroutes.register('admin_audit_logs', '/_admin/audit_logs', []);
     pyroutes.register('admin_audit_log_entry', '/_admin/audit_logs/%(audit_log_id)s', ['audit_log_id']);
     pyroutes.register('pull_requests_global_0', '/_admin/pull_requests/%(pull_request_id)s', ['pull_request_id']);
     pyroutes.register('pull_requests_global_1', '/_admin/pull-requests/%(pull_request_id)s', ['pull_request_id']);
     pyroutes.register('pull_requests_global', '/_admin/pull-request/%(pull_request_id)s', ['pull_request_id']);
     pyroutes.register('admin_settings_open_source', '/_admin/settings/open_source', []);
     pyroutes.register('admin_settings_vcs_svn_generate_cfg', '/_admin/settings/vcs/svn_generate_cfg', []);
     pyroutes.register('admin_settings_system', '/_admin/settings/system', []);
     pyroutes.register('admin_settings_system_update', '/_admin/settings/system/updates', []);
     pyroutes.register('admin_settings_exception_tracker', '/_admin/settings/exceptions', []);
     pyroutes.register('admin_settings_exception_tracker_delete_all', '/_admin/settings/exceptions/delete', []);
     pyroutes.register('admin_settings_exception_tracker_show', '/_admin/settings/exceptions/%(exception_id)s', ['exception_id']);
     pyroutes.register('admin_settings_exception_tracker_delete', '/_admin/settings/exceptions/%(exception_id)s/delete', ['exception_id']);
     pyroutes.register('admin_settings_sessions', '/_admin/settings/sessions', []);
     pyroutes.register('admin_settings_sessions_cleanup', '/_admin/settings/sessions/cleanup', []);
     pyroutes.register('admin_settings_process_management', '/_admin/settings/process_management', []);
     pyroutes.register('admin_settings_process_management_data', '/_admin/settings/process_management/data', []);
     pyroutes.register('admin_settings_process_management_signal', '/_admin/settings/process_management/signal', []);
     pyroutes.register('admin_settings_process_management_master_signal', '/_admin/settings/process_management/master_signal', []);
     pyroutes.register('admin_defaults_repositories', '/_admin/defaults/repositories', []);
     pyroutes.register('admin_defaults_repositories_update', '/_admin/defaults/repositories/update', []);
     pyroutes.register('admin_settings', '/_admin/settings', []);
     pyroutes.register('admin_settings_update', '/_admin/settings/update', []);
     pyroutes.register('admin_settings_global', '/_admin/settings/global', []);
     pyroutes.register('admin_settings_global_update', '/_admin/settings/global/update', []);
     pyroutes.register('admin_settings_vcs', '/_admin/settings/vcs', []);
     pyroutes.register('admin_settings_vcs_update', '/_admin/settings/vcs/update', []);
     pyroutes.register('admin_settings_vcs_svn_pattern_delete', '/_admin/settings/vcs/svn_pattern_delete', []);
     pyroutes.register('admin_settings_mapping', '/_admin/settings/mapping', []);
     pyroutes.register('admin_settings_mapping_update', '/_admin/settings/mapping/update', []);
     pyroutes.register('admin_settings_visual', '/_admin/settings/visual', []);
     pyroutes.register('admin_settings_visual_update', '/_admin/settings/visual/update', []);
     pyroutes.register('admin_settings_issuetracker', '/_admin/settings/issue-tracker', []);
     pyroutes.register('admin_settings_issuetracker_update', '/_admin/settings/issue-tracker/update', []);
     pyroutes.register('admin_settings_issuetracker_test', '/_admin/settings/issue-tracker/test', []);
     pyroutes.register('admin_settings_issuetracker_delete', '/_admin/settings/issue-tracker/delete', []);
     pyroutes.register('admin_settings_email', '/_admin/settings/email', []);
     pyroutes.register('admin_settings_email_update', '/_admin/settings/email/update', []);
     pyroutes.register('admin_settings_hooks', '/_admin/settings/hooks', []);
     pyroutes.register('admin_settings_hooks_update', '/_admin/settings/hooks/update', []);
     pyroutes.register('admin_settings_hooks_delete', '/_admin/settings/hooks/delete', []);
     pyroutes.register('admin_settings_search', '/_admin/settings/search', []);
     pyroutes.register('admin_settings_labs', '/_admin/settings/labs', []);
     pyroutes.register('admin_settings_labs_update', '/_admin/settings/labs/update', []);
     pyroutes.register('admin_permissions_application', '/_admin/permissions/application', []);
     pyroutes.register('admin_permissions_application_update', '/_admin/permissions/application/update', []);
     pyroutes.register('admin_permissions_global', '/_admin/permissions/global', []);
     pyroutes.register('admin_permissions_global_update', '/_admin/permissions/global/update', []);
     pyroutes.register('admin_permissions_object', '/_admin/permissions/object', []);
     pyroutes.register('admin_permissions_object_update', '/_admin/permissions/object/update', []);
     pyroutes.register('admin_permissions_ips', '/_admin/permissions/ips', []);
     pyroutes.register('admin_permissions_overview', '/_admin/permissions/overview', []);
     pyroutes.register('admin_permissions_auth_token_access', '/_admin/permissions/auth_token_access', []);
     pyroutes.register('admin_permissions_ssh_keys', '/_admin/permissions/ssh_keys', []);
     pyroutes.register('admin_permissions_ssh_keys_data', '/_admin/permissions/ssh_keys/data', []);
     pyroutes.register('admin_permissions_ssh_keys_update', '/_admin/permissions/ssh_keys/update', []);
     pyroutes.register('users', '/_admin/users', []);
     pyroutes.register('users_data', '/_admin/users_data', []);
     pyroutes.register('users_create', '/_admin/users/create', []);
     pyroutes.register('users_new', '/_admin/users/new', []);
     pyroutes.register('user_edit', '/_admin/users/%(user_id)s/edit', ['user_id']);
     pyroutes.register('user_edit_advanced', '/_admin/users/%(user_id)s/edit/advanced', ['user_id']);
     pyroutes.register('user_edit_global_perms', '/_admin/users/%(user_id)s/edit/global_permissions', ['user_id']);
     pyroutes.register('user_edit_global_perms_update', '/_admin/users/%(user_id)s/edit/global_permissions/update', ['user_id']);
     pyroutes.register('user_update', '/_admin/users/%(user_id)s/update', ['user_id']);
     pyroutes.register('user_delete', '/_admin/users/%(user_id)s/delete', ['user_id']);
     pyroutes.register('user_enable_force_password_reset', '/_admin/users/%(user_id)s/password_reset_enable', ['user_id']);
     pyroutes.register('user_disable_force_password_reset', '/_admin/users/%(user_id)s/password_reset_disable', ['user_id']);
     pyroutes.register('user_create_personal_repo_group', '/_admin/users/%(user_id)s/create_repo_group', ['user_id']);
     pyroutes.register('edit_user_auth_tokens_delete', '/_admin/users/%(user_id)s/edit/auth_tokens/delete', ['user_id']);
     pyroutes.register('edit_user_ssh_keys', '/_admin/users/%(user_id)s/edit/ssh_keys', ['user_id']);
     pyroutes.register('edit_user_ssh_keys_generate_keypair', '/_admin/users/%(user_id)s/edit/ssh_keys/generate', ['user_id']);
     pyroutes.register('edit_user_ssh_keys_add', '/_admin/users/%(user_id)s/edit/ssh_keys/new', ['user_id']);
     pyroutes.register('edit_user_ssh_keys_delete', '/_admin/users/%(user_id)s/edit/ssh_keys/delete', ['user_id']);
     pyroutes.register('edit_user_emails', '/_admin/users/%(user_id)s/edit/emails', ['user_id']);
     pyroutes.register('edit_user_emails_add', '/_admin/users/%(user_id)s/edit/emails/new', ['user_id']);
     pyroutes.register('edit_user_emails_delete', '/_admin/users/%(user_id)s/edit/emails/delete', ['user_id']);
     pyroutes.register('edit_user_ips', '/_admin/users/%(user_id)s/edit/ips', ['user_id']);
     pyroutes.register('edit_user_ips_add', '/_admin/users/%(user_id)s/edit/ips/new', ['user_id']);
     pyroutes.register('edit_user_ips_delete', '/_admin/users/%(user_id)s/edit/ips/delete', ['user_id']);
     pyroutes.register('edit_user_perms_summary', '/_admin/users/%(user_id)s/edit/permissions_summary', ['user_id']);
     pyroutes.register('edit_user_perms_summary_json', '/_admin/users/%(user_id)s/edit/permissions_summary/json', ['user_id']);
     pyroutes.register('edit_user_groups_management', '/_admin/users/%(user_id)s/edit/groups_management', ['user_id']);
     pyroutes.register('edit_user_groups_management_updates', '/_admin/users/%(user_id)s/edit/edit_user_groups_management/updates', ['user_id']);
     pyroutes.register('edit_user_audit_logs', '/_admin/users/%(user_id)s/edit/audit', ['user_id']);
     pyroutes.register('edit_user_audit_logs_download', '/_admin/users/%(user_id)s/edit/audit/download', ['user_id']);
     pyroutes.register('edit_user_caches', '/_admin/users/%(user_id)s/edit/caches', ['user_id']);
     pyroutes.register('edit_user_caches_update', '/_admin/users/%(user_id)s/edit/caches/update', ['user_id']);
     pyroutes.register('user_groups', '/_admin/user_groups', []);
     pyroutes.register('user_groups_data', '/_admin/user_groups_data', []);
     pyroutes.register('user_groups_new', '/_admin/user_groups/new', []);
     pyroutes.register('user_groups_create', '/_admin/user_groups/create', []);
     pyroutes.register('repos', '/_admin/repos', []);
     pyroutes.register('repo_new', '/_admin/repos/new', []);
     pyroutes.register('repo_create', '/_admin/repos/create', []);
     pyroutes.register('repo_groups', '/_admin/repo_groups', []);
     pyroutes.register('repo_groups_data', '/_admin/repo_groups_data', []);
     pyroutes.register('repo_group_new', '/_admin/repo_group/new', []);
     pyroutes.register('repo_group_create', '/_admin/repo_group/create', []);
     pyroutes.register('channelstream_connect', '/_admin/channelstream/connect', []);
     pyroutes.register('channelstream_subscribe', '/_admin/channelstream/subscribe', []);
     pyroutes.register('channelstream_proxy', '/_channelstream', []);
     pyroutes.register('upload_file', '/_file_store/upload', []);
     pyroutes.register('download_file', '/_file_store/download/%(fid)s', ['fid']);
     pyroutes.register('download_file_by_token', '/_file_store/token-download/%(_auth_token)s/%(fid)s', ['_auth_token', 'fid']);
     pyroutes.register('logout', '/_admin/logout', []);
     pyroutes.register('reset_password', '/_admin/password_reset', []);
     pyroutes.register('reset_password_confirmation', '/_admin/password_reset_confirmation', []);
     pyroutes.register('home', '/', []);
     pyroutes.register('user_autocomplete_data', '/_users', []);
     pyroutes.register('user_group_autocomplete_data', '/_user_groups', []);
     pyroutes.register('repo_list_data', '/_repos', []);
     pyroutes.register('repo_group_list_data', '/_repo_groups', []);
     pyroutes.register('goto_switcher_data', '/_goto_data', []);
     pyroutes.register('markup_preview', '/_markup_preview', []);
     pyroutes.register('file_preview', '/_file_preview', []);
     pyroutes.register('store_user_session_value', '/_store_session_attr', []);
     pyroutes.register('journal', '/_admin/journal', []);
     pyroutes.register('journal_rss', '/_admin/journal/rss', []);
     pyroutes.register('journal_atom', '/_admin/journal/atom', []);
     pyroutes.register('journal_public', '/_admin/public_journal', []);
     pyroutes.register('journal_public_atom', '/_admin/public_journal/atom', []);
     pyroutes.register('journal_public_atom_old', '/_admin/public_journal_atom', []);
     pyroutes.register('journal_public_rss', '/_admin/public_journal/rss', []);
     pyroutes.register('journal_public_rss_old', '/_admin/public_journal_rss', []);
     pyroutes.register('toggle_following', '/_admin/toggle_following', []);
     pyroutes.register('repo_creating', '/%(repo_name)s/repo_creating', ['repo_name']);
     pyroutes.register('repo_creating_check', '/%(repo_name)s/repo_creating_check', ['repo_name']);
     pyroutes.register('repo_summary_explicit', '/%(repo_name)s/summary', ['repo_name']);
     pyroutes.register('repo_summary_commits', '/%(repo_name)s/summary-commits', ['repo_name']);
     pyroutes.register('repo_commit', '/%(repo_name)s/changeset/%(commit_id)s', ['repo_name', 'commit_id']);
     pyroutes.register('repo_commit_children', '/%(repo_name)s/changeset_children/%(commit_id)s', ['repo_name', 'commit_id']);
     pyroutes.register('repo_commit_parents', '/%(repo_name)s/changeset_parents/%(commit_id)s', ['repo_name', 'commit_id']);
     pyroutes.register('repo_commit_raw', '/%(repo_name)s/changeset-diff/%(commit_id)s', ['repo_name', 'commit_id']);
     pyroutes.register('repo_commit_patch', '/%(repo_name)s/changeset-patch/%(commit_id)s', ['repo_name', 'commit_id']);
     pyroutes.register('repo_commit_download', '/%(repo_name)s/changeset-download/%(commit_id)s', ['repo_name', 'commit_id']);
     pyroutes.register('repo_commit_data', '/%(repo_name)s/changeset-data/%(commit_id)s', ['repo_name', 'commit_id']);
     pyroutes.register('repo_commit_comment_create', '/%(repo_name)s/changeset/%(commit_id)s/comment/create', ['repo_name', 'commit_id']);
     pyroutes.register('repo_commit_comment_preview', '/%(repo_name)s/changeset/%(commit_id)s/comment/preview', ['repo_name', 'commit_id']);
     pyroutes.register('repo_commit_comment_attachment_upload', '/%(repo_name)s/changeset/%(commit_id)s/comment/attachment_upload', ['repo_name', 'commit_id']);
     pyroutes.register('repo_commit_comment_delete', '/%(repo_name)s/changeset/%(commit_id)s/comment/%(comment_id)s/delete', ['repo_name', 'commit_id', 'comment_id']);
     pyroutes.register('repo_commit_raw_deprecated', '/%(repo_name)s/raw-changeset/%(commit_id)s', ['repo_name', 'commit_id']);
     pyroutes.register('repo_archivefile', '/%(repo_name)s/archive/%(fname)s', ['repo_name', 'fname']);
     pyroutes.register('repo_files_diff', '/%(repo_name)s/diff/%(f_path)s', ['repo_name', 'f_path']);
     pyroutes.register('repo_files_diff_2way_redirect', '/%(repo_name)s/diff-2way/%(f_path)s', ['repo_name', 'f_path']);
     pyroutes.register('repo_files', '/%(repo_name)s/files/%(commit_id)s/%(f_path)s', ['repo_name', 'commit_id', 'f_path']);
     pyroutes.register('repo_files:default_path', '/%(repo_name)s/files/%(commit_id)s/', ['repo_name', 'commit_id']);
     pyroutes.register('repo_files:default_commit', '/%(repo_name)s/files', ['repo_name']);
     pyroutes.register('repo_files:rendered', '/%(repo_name)s/render/%(commit_id)s/%(f_path)s', ['repo_name', 'commit_id', 'f_path']);
     pyroutes.register('repo_files:annotated', '/%(repo_name)s/annotate/%(commit_id)s/%(f_path)s', ['repo_name', 'commit_id', 'f_path']);
     pyroutes.register('repo_files:annotated_previous', '/%(repo_name)s/annotate-previous/%(commit_id)s/%(f_path)s', ['repo_name', 'commit_id', 'f_path']);
     pyroutes.register('repo_nodetree_full', '/%(repo_name)s/nodetree_full/%(commit_id)s/%(f_path)s', ['repo_name', 'commit_id', 'f_path']);
     pyroutes.register('repo_nodetree_full:default_path', '/%(repo_name)s/nodetree_full/%(commit_id)s/', ['repo_name', 'commit_id']);
     pyroutes.register('repo_files_nodelist', '/%(repo_name)s/nodelist/%(commit_id)s/%(f_path)s', ['repo_name', 'commit_id', 'f_path']);
     pyroutes.register('repo_file_raw', '/%(repo_name)s/raw/%(commit_id)s/%(f_path)s', ['repo_name', 'commit_id', 'f_path']);
     pyroutes.register('repo_file_download', '/%(repo_name)s/download/%(commit_id)s/%(f_path)s', ['repo_name', 'commit_id', 'f_path']);
     pyroutes.register('repo_file_download:legacy', '/%(repo_name)s/rawfile/%(commit_id)s/%(f_path)s', ['repo_name', 'commit_id', 'f_path']);
     pyroutes.register('repo_file_history', '/%(repo_name)s/history/%(commit_id)s/%(f_path)s', ['repo_name', 'commit_id', 'f_path']);
     pyroutes.register('repo_file_authors', '/%(repo_name)s/authors/%(commit_id)s/%(f_path)s', ['repo_name', 'commit_id', 'f_path']);
     pyroutes.register('repo_files_remove_file', '/%(repo_name)s/remove_file/%(commit_id)s/%(f_path)s', ['repo_name', 'commit_id', 'f_path']);
     pyroutes.register('repo_files_delete_file', '/%(repo_name)s/delete_file/%(commit_id)s/%(f_path)s', ['repo_name', 'commit_id', 'f_path']);
     pyroutes.register('repo_files_edit_file', '/%(repo_name)s/edit_file/%(commit_id)s/%(f_path)s', ['repo_name', 'commit_id', 'f_path']);
     pyroutes.register('repo_files_update_file', '/%(repo_name)s/update_file/%(commit_id)s/%(f_path)s', ['repo_name', 'commit_id', 'f_path']);
     pyroutes.register('repo_files_add_file', '/%(repo_name)s/add_file/%(commit_id)s/%(f_path)s', ['repo_name', 'commit_id', 'f_path']);
     pyroutes.register('repo_files_upload_file', '/%(repo_name)s/upload_file/%(commit_id)s/%(f_path)s', ['repo_name', 'commit_id', 'f_path']);
     pyroutes.register('repo_files_create_file', '/%(repo_name)s/create_file/%(commit_id)s/%(f_path)s', ['repo_name', 'commit_id', 'f_path']);
     pyroutes.register('repo_refs_data', '/%(repo_name)s/refs-data', ['repo_name']);
     pyroutes.register('repo_refs_changelog_data', '/%(repo_name)s/refs-data-changelog', ['repo_name']);
     pyroutes.register('repo_stats', '/%(repo_name)s/repo_stats/%(commit_id)s', ['repo_name', 'commit_id']);
     pyroutes.register('repo_commits', '/%(repo_name)s/commits', ['repo_name']);
     pyroutes.register('repo_commits_file', '/%(repo_name)s/commits/%(commit_id)s/%(f_path)s', ['repo_name', 'commit_id', 'f_path']);
     pyroutes.register('repo_commits_elements', '/%(repo_name)s/commits_elements', ['repo_name']);
     pyroutes.register('repo_commits_elements_file', '/%(repo_name)s/commits_elements/%(commit_id)s/%(f_path)s', ['repo_name', 'commit_id', 'f_path']);
     pyroutes.register('repo_changelog', '/%(repo_name)s/changelog', ['repo_name']);
     pyroutes.register('repo_changelog_file', '/%(repo_name)s/changelog/%(commit_id)s/%(f_path)s', ['repo_name', 'commit_id', 'f_path']);
     pyroutes.register('repo_compare_select', '/%(repo_name)s/compare', ['repo_name']);
     pyroutes.register('repo_compare', '/%(repo_name)s/compare/%(source_ref_type)s@%(source_ref)s...%(target_ref_type)s@%(target_ref)s', ['repo_name', 'source_ref_type', 'source_ref', 'target_ref_type', 'target_ref']);
     pyroutes.register('tags_home', '/%(repo_name)s/tags', ['repo_name']);
     pyroutes.register('branches_home', '/%(repo_name)s/branches', ['repo_name']);
     pyroutes.register('bookmarks_home', '/%(repo_name)s/bookmarks', ['repo_name']);
     pyroutes.register('repo_fork_new', '/%(repo_name)s/fork', ['repo_name']);
     pyroutes.register('repo_fork_create', '/%(repo_name)s/fork/create', ['repo_name']);
     pyroutes.register('repo_forks_show_all', '/%(repo_name)s/forks', ['repo_name']);
     pyroutes.register('repo_forks_data', '/%(repo_name)s/forks/data', ['repo_name']);
     pyroutes.register('pullrequest_show', '/%(repo_name)s/pull-request/%(pull_request_id)s', ['repo_name', 'pull_request_id']);
     pyroutes.register('pullrequest_show_all', '/%(repo_name)s/pull-request', ['repo_name']);
     pyroutes.register('pullrequest_show_all_data', '/%(repo_name)s/pull-request-data', ['repo_name']);
     pyroutes.register('pullrequest_repo_refs', '/%(repo_name)s/pull-request/refs/%(target_repo_name)s', ['repo_name', 'target_repo_name']);
     pyroutes.register('pullrequest_repo_targets', '/%(repo_name)s/pull-request/repo-targets', ['repo_name']);
     pyroutes.register('pullrequest_new', '/%(repo_name)s/pull-request/new', ['repo_name']);
     pyroutes.register('pullrequest_create', '/%(repo_name)s/pull-request/create', ['repo_name']);
     pyroutes.register('pullrequest_update', '/%(repo_name)s/pull-request/%(pull_request_id)s/update', ['repo_name', 'pull_request_id']);
     pyroutes.register('pullrequest_merge', '/%(repo_name)s/pull-request/%(pull_request_id)s/merge', ['repo_name', 'pull_request_id']);
     pyroutes.register('pullrequest_delete', '/%(repo_name)s/pull-request/%(pull_request_id)s/delete', ['repo_name', 'pull_request_id']);
     pyroutes.register('pullrequest_comment_create', '/%(repo_name)s/pull-request/%(pull_request_id)s/comment', ['repo_name', 'pull_request_id']);
     pyroutes.register('pullrequest_comment_delete', '/%(repo_name)s/pull-request/%(pull_request_id)s/comment/%(comment_id)s/delete', ['repo_name', 'pull_request_id', 'comment_id']);
     pyroutes.register('edit_repo', '/%(repo_name)s/settings', ['repo_name']);
     pyroutes.register('edit_repo_advanced', '/%(repo_name)s/settings/advanced', ['repo_name']);
     pyroutes.register('edit_repo_advanced_archive', '/%(repo_name)s/settings/advanced/archive', ['repo_name']);
     pyroutes.register('edit_repo_advanced_delete', '/%(repo_name)s/settings/advanced/delete', ['repo_name']);
     pyroutes.register('edit_repo_advanced_locking', '/%(repo_name)s/settings/advanced/locking', ['repo_name']);
     pyroutes.register('edit_repo_advanced_journal', '/%(repo_name)s/settings/advanced/journal', ['repo_name']);
     pyroutes.register('edit_repo_advanced_fork', '/%(repo_name)s/settings/advanced/fork', ['repo_name']);
     pyroutes.register('edit_repo_advanced_hooks', '/%(repo_name)s/settings/advanced/hooks', ['repo_name']);
     pyroutes.register('edit_repo_caches', '/%(repo_name)s/settings/caches', ['repo_name']);
     pyroutes.register('edit_repo_perms', '/%(repo_name)s/settings/permissions', ['repo_name']);
     pyroutes.register('edit_repo_perms_set_private', '/%(repo_name)s/settings/permissions/set_private', ['repo_name']);
     pyroutes.register('edit_repo_maintenance', '/%(repo_name)s/settings/maintenance', ['repo_name']);
     pyroutes.register('edit_repo_maintenance_execute', '/%(repo_name)s/settings/maintenance/execute', ['repo_name']);
     pyroutes.register('edit_repo_fields', '/%(repo_name)s/settings/fields', ['repo_name']);
     pyroutes.register('edit_repo_fields_create', '/%(repo_name)s/settings/fields/create', ['repo_name']);
     pyroutes.register('edit_repo_fields_delete', '/%(repo_name)s/settings/fields/%(field_id)s/delete', ['repo_name', 'field_id']);
     pyroutes.register('repo_edit_toggle_locking', '/%(repo_name)s/settings/toggle_locking', ['repo_name']);
     pyroutes.register('edit_repo_remote', '/%(repo_name)s/settings/remote', ['repo_name']);
     pyroutes.register('edit_repo_remote_pull', '/%(repo_name)s/settings/remote/pull', ['repo_name']);
     pyroutes.register('edit_repo_statistics', '/%(repo_name)s/settings/statistics', ['repo_name']);
     pyroutes.register('edit_repo_statistics_reset', '/%(repo_name)s/settings/statistics/update', ['repo_name']);
     pyroutes.register('edit_repo_issuetracker', '/%(repo_name)s/settings/issue_trackers', ['repo_name']);
     pyroutes.register('edit_repo_issuetracker_test', '/%(repo_name)s/settings/issue_trackers/test', ['repo_name']);
     pyroutes.register('edit_repo_issuetracker_delete', '/%(repo_name)s/settings/issue_trackers/delete', ['repo_name']);
     pyroutes.register('edit_repo_issuetracker_update', '/%(repo_name)s/settings/issue_trackers/update', ['repo_name']);
     pyroutes.register('edit_repo_vcs', '/%(repo_name)s/settings/vcs', ['repo_name']);
     pyroutes.register('edit_repo_vcs_update', '/%(repo_name)s/settings/vcs/update', ['repo_name']);
     pyroutes.register('edit_repo_vcs_svn_pattern_delete', '/%(repo_name)s/settings/vcs/svn_pattern/delete', ['repo_name']);
     pyroutes.register('repo_reviewers', '/%(repo_name)s/settings/review/rules', ['repo_name']);
     pyroutes.register('repo_default_reviewers_data', '/%(repo_name)s/settings/review/default-reviewers', ['repo_name']);
     pyroutes.register('edit_repo_strip', '/%(repo_name)s/settings/strip', ['repo_name']);
     pyroutes.register('strip_check', '/%(repo_name)s/settings/strip_check', ['repo_name']);
     pyroutes.register('strip_execute', '/%(repo_name)s/settings/strip_execute', ['repo_name']);
     pyroutes.register('edit_repo_audit_logs', '/%(repo_name)s/settings/audit_logs', ['repo_name']);
     pyroutes.register('rss_feed_home', '/%(repo_name)s/feed-rss', ['repo_name']);
     pyroutes.register('atom_feed_home', '/%(repo_name)s/feed-atom', ['repo_name']);
     pyroutes.register('rss_feed_home_old', '/%(repo_name)s/feed/rss', ['repo_name']);
     pyroutes.register('atom_feed_home_old', '/%(repo_name)s/feed/atom', ['repo_name']);
     pyroutes.register('repo_summary', '/%(repo_name)s', ['repo_name']);
     pyroutes.register('repo_summary_slash', '/%(repo_name)s/', ['repo_name']);
     pyroutes.register('edit_repo_group', '/%(repo_group_name)s/_edit', ['repo_group_name']);
     pyroutes.register('edit_repo_group_advanced', '/%(repo_group_name)s/_settings/advanced', ['repo_group_name']);
     pyroutes.register('edit_repo_group_advanced_delete', '/%(repo_group_name)s/_settings/advanced/delete', ['repo_group_name']);
     pyroutes.register('edit_repo_group_perms', '/%(repo_group_name)s/_settings/permissions', ['repo_group_name']);
     pyroutes.register('edit_repo_group_perms_update', '/%(repo_group_name)s/_settings/permissions/update', ['repo_group_name']);
     pyroutes.register('repo_group_home', '/%(repo_group_name)s', ['repo_group_name']);
     pyroutes.register('repo_group_home_slash', '/%(repo_group_name)s/', ['repo_group_name']);
     pyroutes.register('user_group_members_data', '/_admin/user_groups/%(user_group_id)s/members', ['user_group_id']);
     pyroutes.register('edit_user_group_perms_summary', '/_admin/user_groups/%(user_group_id)s/edit/permissions_summary', ['user_group_id']);
     pyroutes.register('edit_user_group_perms_summary_json', '/_admin/user_groups/%(user_group_id)s/edit/permissions_summary/json', ['user_group_id']);
     pyroutes.register('edit_user_group', '/_admin/user_groups/%(user_group_id)s/edit', ['user_group_id']);
     pyroutes.register('user_groups_update', '/_admin/user_groups/%(user_group_id)s/update', ['user_group_id']);
     pyroutes.register('edit_user_group_global_perms', '/_admin/user_groups/%(user_group_id)s/edit/global_permissions', ['user_group_id']);
     pyroutes.register('edit_user_group_global_perms_update', '/_admin/user_groups/%(user_group_id)s/edit/global_permissions/update', ['user_group_id']);
     pyroutes.register('edit_user_group_perms', '/_admin/user_groups/%(user_group_id)s/edit/permissions', ['user_group_id']);
     pyroutes.register('edit_user_group_perms_update', '/_admin/user_groups/%(user_group_id)s/edit/permissions/update', ['user_group_id']);
     pyroutes.register('edit_user_group_advanced', '/_admin/user_groups/%(user_group_id)s/edit/advanced', ['user_group_id']);
     pyroutes.register('edit_user_group_advanced_sync', '/_admin/user_groups/%(user_group_id)s/edit/advanced/sync', ['user_group_id']);
     pyroutes.register('user_groups_delete', '/_admin/user_groups/%(user_group_id)s/delete', ['user_group_id']);
     pyroutes.register('search', '/_admin/search', []);
     pyroutes.register('search_repo', '/%(repo_name)s/_search', ['repo_name']);
     pyroutes.register('search_repo_alt', '/%(repo_name)s/search', ['repo_name']);
     pyroutes.register('search_repo_group', '/%(repo_group_name)s/_search', ['repo_group_name']);
     pyroutes.register('user_profile', '/_profiles/%(username)s', ['username']);
     pyroutes.register('user_group_profile', '/_profile_user_group/%(user_group_name)s', ['user_group_name']);
     pyroutes.register('my_account_profile', '/_admin/my_account/profile', []);
     pyroutes.register('my_account_edit', '/_admin/my_account/edit', []);
     pyroutes.register('my_account_update', '/_admin/my_account/update', []);
     pyroutes.register('my_account_password', '/_admin/my_account/password', []);
     pyroutes.register('my_account_password_update', '/_admin/my_account/password/update', []);
     pyroutes.register('my_account_auth_tokens_delete', '/_admin/my_account/auth_tokens/delete', []);
     pyroutes.register('my_account_ssh_keys', '/_admin/my_account/ssh_keys', []);
     pyroutes.register('my_account_ssh_keys_generate', '/_admin/my_account/ssh_keys/generate', []);
     pyroutes.register('my_account_ssh_keys_add', '/_admin/my_account/ssh_keys/new', []);
     pyroutes.register('my_account_ssh_keys_delete', '/_admin/my_account/ssh_keys/delete', []);
     pyroutes.register('my_account_user_group_membership', '/_admin/my_account/user_group_membership', []);
     pyroutes.register('my_account_emails', '/_admin/my_account/emails', []);
     pyroutes.register('my_account_emails_add', '/_admin/my_account/emails/new', []);
     pyroutes.register('my_account_emails_delete', '/_admin/my_account/emails/delete', []);
     pyroutes.register('my_account_repos', '/_admin/my_account/repos', []);
     pyroutes.register('my_account_watched', '/_admin/my_account/watched', []);
     pyroutes.register('my_account_bookmarks', '/_admin/my_account/bookmarks', []);
     pyroutes.register('my_account_bookmarks_update', '/_admin/my_account/bookmarks/update', []);
     pyroutes.register('my_account_goto_bookmark', '/_admin/my_account/bookmark/%(bookmark_id)s', ['bookmark_id']);
     pyroutes.register('my_account_perms', '/_admin/my_account/perms', []);
     pyroutes.register('my_account_notifications', '/_admin/my_account/notifications', []);
     pyroutes.register('my_account_notifications_toggle_visibility', '/_admin/my_account/toggle_visibility', []);
     pyroutes.register('my_account_pullrequests', '/_admin/my_account/pull_requests', []);
     pyroutes.register('my_account_pullrequests_data', '/_admin/my_account/pull_requests/data', []);
     pyroutes.register('notifications_show_all', '/_admin/notifications', []);
     pyroutes.register('notifications_mark_all_read', '/_admin/notifications/mark_all_read', []);
     pyroutes.register('notifications_show', '/_admin/notifications/%(notification_id)s', ['notification_id']);
     pyroutes.register('notifications_update', '/_admin/notifications/%(notification_id)s/update', ['notification_id']);
     pyroutes.register('notifications_delete', '/_admin/notifications/%(notification_id)s/delete', ['notification_id']);
     pyroutes.register('my_account_notifications_test_channelstream', '/_admin/my_account/test_channelstream', []);
     pyroutes.register('gists_show', '/_admin/gists', []);
     pyroutes.register('gists_new', '/_admin/gists/new', []);
     pyroutes.register('gists_create', '/_admin/gists/create', []);
     pyroutes.register('gist_show', '/_admin/gists/%(gist_id)s', ['gist_id']);
     pyroutes.register('gist_delete', '/_admin/gists/%(gist_id)s/delete', ['gist_id']);
     pyroutes.register('gist_edit', '/_admin/gists/%(gist_id)s/edit', ['gist_id']);
     pyroutes.register('gist_edit_check_revision', '/_admin/gists/%(gist_id)s/edit/check_revision', ['gist_id']);
     pyroutes.register('gist_update', '/_admin/gists/%(gist_id)s/update', ['gist_id']);
     pyroutes.register('gist_show_rev', '/_admin/gists/%(gist_id)s/%(revision)s', ['gist_id', 'revision']);
     pyroutes.register('gist_show_formatted', '/_admin/gists/%(gist_id)s/%(revision)s/%(format)s', ['gist_id', 'revision', 'format']);
     pyroutes.register('gist_show_formatted_path', '/_admin/gists/%(gist_id)s/%(revision)s/%(format)s/%(f_path)s', ['gist_id', 'revision', 'format', 'f_path']);
     pyroutes.register('debug_style_home', '/_admin/debug_style', []);
     pyroutes.register('debug_style_template', '/_admin/debug_style/t/%(t_path)s', ['t_path']);
     pyroutes.register('apiv2', '/_admin/api', []);
     pyroutes.register('admin_settings_license', '/_admin/settings/license', []);
     pyroutes.register('admin_settings_license_unlock', '/_admin/settings/license_unlock', []);
     pyroutes.register('login', '/_admin/login', []);
     pyroutes.register('register', '/_admin/register', []);
     pyroutes.register('repo_reviewers_review_rule_new', '/%(repo_name)s/settings/review/rules/new', ['repo_name']);
     pyroutes.register('repo_reviewers_review_rule_edit', '/%(repo_name)s/settings/review/rules/%(rule_id)s', ['repo_name', 'rule_id']);
     pyroutes.register('repo_reviewers_review_rule_delete', '/%(repo_name)s/settings/review/rules/%(rule_id)s/delete', ['repo_name', 'rule_id']);
     pyroutes.register('plugin_admin_chat', '/_admin/plugin_admin_chat/%(action)s', ['action']);
     pyroutes.register('edit_user_auth_tokens', '/_admin/users/%(user_id)s/edit/auth_tokens', ['user_id']);
     pyroutes.register('edit_user_auth_tokens_add', '/_admin/users/%(user_id)s/edit/auth_tokens/new', ['user_id']);
     pyroutes.register('admin_settings_scheduler_show_tasks', '/_admin/settings/scheduler/_tasks', []);
     pyroutes.register('admin_settings_scheduler_show_all', '/_admin/settings/scheduler', []);
     pyroutes.register('admin_settings_scheduler_new', '/_admin/settings/scheduler/new', []);
     pyroutes.register('admin_settings_scheduler_create', '/_admin/settings/scheduler/create', []);
     pyroutes.register('admin_settings_scheduler_edit', '/_admin/settings/scheduler/%(schedule_id)s', ['schedule_id']);
     pyroutes.register('admin_settings_scheduler_update', '/_admin/settings/scheduler/%(schedule_id)s/update', ['schedule_id']);
     pyroutes.register('admin_settings_scheduler_delete', '/_admin/settings/scheduler/%(schedule_id)s/delete', ['schedule_id']);
     pyroutes.register('admin_settings_scheduler_execute', '/_admin/settings/scheduler/%(schedule_id)s/execute', ['schedule_id']);
     pyroutes.register('admin_settings_automation', '/_admin/settings/automation', []);
     pyroutes.register('admin_settings_automation_update', '/_admin/settings/automation/%(entry_id)s/update', ['entry_id']);
     pyroutes.register('admin_permissions_branch', '/_admin/permissions/branch', []);
     pyroutes.register('admin_permissions_branch_update', '/_admin/permissions/branch/update', []);
     pyroutes.register('my_account_auth_tokens', '/_admin/my_account/auth_tokens', []);
     pyroutes.register('my_account_auth_tokens_add', '/_admin/my_account/auth_tokens/new', []);
     pyroutes.register('my_account_external_identity', '/_admin/my_account/external-identity', []);
     pyroutes.register('my_account_external_identity_delete', '/_admin/my_account/external-identity/delete', []);
     pyroutes.register('repo_artifacts_list', '/%(repo_name)s/artifacts', ['repo_name']);
     pyroutes.register('repo_artifacts_data', '/%(repo_name)s/artifacts_data', ['repo_name']);
     pyroutes.register('repo_artifacts_new', '/%(repo_name)s/artifacts/new', ['repo_name']);
     pyroutes.register('repo_artifacts_get', '/%(repo_name)s/artifacts/download/%(uid)s', ['repo_name', 'uid']);
     pyroutes.register('repo_artifacts_store', '/%(repo_name)s/artifacts/store', ['repo_name']);
     pyroutes.register('repo_artifacts_info', '/%(repo_name)s/artifacts/info/%(uid)s', ['repo_name', 'uid']);
     pyroutes.register('repo_artifacts_delete', '/%(repo_name)s/artifacts/delete/%(uid)s', ['repo_name', 'uid']);
     pyroutes.register('repo_automation', '/%(repo_name)s/settings/automation', ['repo_name']);
     pyroutes.register('repo_automation_update', '/%(repo_name)s/settings/automation/%(entry_id)s/update', ['repo_name', 'entry_id']);
     pyroutes.register('edit_repo_remote_push', '/%(repo_name)s/settings/remote/push', ['repo_name']);
     pyroutes.register('edit_repo_perms_branch', '/%(repo_name)s/settings/branch_permissions', ['repo_name']);
     pyroutes.register('edit_repo_perms_branch_delete', '/%(repo_name)s/settings/branch_permissions/%(rule_id)s/delete', ['repo_name', 'rule_id']);
 }

rhodecode/public/js/src/rhodecode.js

@@ -1,572 +1,656 b''
 // # Copyright (C) 2010-2019 RhodeCode GmbH
 // #
 // # This program is free software: you can redistribute it and/or modify
 // # it under the terms of the GNU Affero General Public License, version 3
 // # (only), as published by the Free Software Foundation.
 // #
 // # This program is distributed in the hope that it will be useful,
 // # but WITHOUT ANY WARRANTY; without even the implied warranty of
 // # MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 // # GNU General Public License for more details.
 // #
 // # You should have received a copy of the GNU Affero General Public License
 // # along with this program.  If not, see <http://www.gnu.org/licenses/>.
 // #
 // # This program is dual-licensed. If you wish to learn more about the
 // # RhodeCode Enterprise Edition, including its added features, Support services,
 // # and proprietary license terms, please see https://rhodecode.com/licenses/
 
 /**
 RhodeCode JS Files
 **/
 
 if (typeof console == "undefined" || typeof console.log == "undefined"){
     console = { log: function() {} }
 }
 
 // TODO: move the following function to submodules
 
 /**
  * show more
  */
 var show_more_event = function(){
   $('table .show_more').click(function(e) {
     var cid = e.target.id.substring(1);
     var button = $(this);
     if (button.hasClass('open')) {
       $('#'+cid).hide();
       button.removeClass('open');
     } else {
       $('#'+cid).show();
       button.addClass('open one');
     }
   });
 };
 
 var compare_radio_buttons = function(repo_name, compare_ref_type){
     $('#compare_action').on('click', function(e){
         e.preventDefault();
 
         var source = $('input[name=compare_source]:checked').val();
         var target = $('input[name=compare_target]:checked').val();
         if(source && target){
             var url_data = {
                 repo_name: repo_name,
                 source_ref: source,
                 source_ref_type: compare_ref_type,
                 target_ref: target,
                 target_ref_type: compare_ref_type,
                 merge: 1
             };
             window.location = pyroutes.url('repo_compare', url_data);
         }
     });
     $('.compare-radio-button').on('click', function(e){
         var source = $('input[name=compare_source]:checked').val();
         var target = $('input[name=compare_target]:checked').val();
         if(source && target){
             $('#compare_action').removeAttr("disabled");
             $('#compare_action').removeClass("disabled");
         }
     })
 };
 
 var showRepoSize = function(target, repo_name, commit_id, callback) {
     var container = $('#' + target);
     var url = pyroutes.url('repo_stats',
       {"repo_name": repo_name, "commit_id": commit_id});
 
     container.show();
     if (!container.hasClass('loaded')) {
         $.ajax({url: url})
             .complete(function (data) {
                 var responseJSON = data.responseJSON;
                 container.addClass('loaded');
                 container.html(responseJSON.size);
                 callback(responseJSON.code_stats)
             })
             .fail(function (data) {
                 console.log('failed to load repo stats');
             });
     }
 
 };
 
 var showRepoStats = function(target, data){
     var container = $('#' + target);
 
     if (container.hasClass('loaded')) {
         return
     }
 
     var total = 0;
     var no_data = true;
     var tbl = document.createElement('table');
     tbl.setAttribute('class', 'trending_language_tbl rctable');
 
     $.each(data, function(key, val){
         total += val.count;
     });
 
     var sortedStats = [];
     for (var obj in data){
         sortedStats.push([obj, data[obj]])
     }
     var sortedData = sortedStats.sort(function (a, b) {
         return b[1].count - a[1].count
     });
     var cnt = 0;
     $.each(sortedData, function(idx, val){
         cnt += 1;
         no_data = false;
 
         var tr = document.createElement('tr');
 
         var key = val[0];
         var obj = {"desc": val[1].desc, "count": val[1].count};
 
         // meta language names
         var td1 = document.createElement('td');
         var trending_language_label = document.createElement('div');
         trending_language_label.innerHTML = obj.desc;
         td1.appendChild(trending_language_label);
 
         // extensions
         var td2 = document.createElement('td');
         var extension = document.createElement('div');
         extension.innerHTML = ".{0}".format(key)
         td2.appendChild(extension);
 
         // number of files
         var td3 = document.createElement('td');
         var file_count = document.createElement('div');
         var percentage_num = Math.round((obj.count / total * 100), 2);
         var label = _ngettext('file', 'files', obj.count);
         file_count.innerHTML = "{0} {1} ({2}%)".format(obj.count, label, percentage_num) ;
         td3.appendChild(file_count);
 
         // percentage
         var td4 = document.createElement('td');
         td4.setAttribute("class", 'trending_language');
 
         var percentage = document.createElement('div');
         percentage.setAttribute('class', 'lang-bar');
         percentage.innerHTML = "&nbsp;";
         percentage.style.width = percentage_num + '%';
         td4.appendChild(percentage);
 
         tr.appendChild(td1);
         tr.appendChild(td2);
         tr.appendChild(td3);
         tr.appendChild(td4);
         tbl.appendChild(tr);
 
     });
 
     $(container).html(tbl);
     $(container).addClass('loaded');
 
     $('#code_stats_show_more').on('click', function (e) {
         e.preventDefault();
         $('.stats_hidden').each(function (idx) {
             $(this).css("display", "");
         });
         $('#code_stats_show_more').hide();
     });
 
 };
 
 // returns a node from given html;
 var fromHTML = function(html){
   var _html = document.createElement('element');
   _html.innerHTML = html;
   return _html;
 };
 
 // Toggle Collapsable Content
 function collapsableContent() {
 
     $('.collapsable-content').not('.no-hide').hide();
 
     $('.btn-collapse').unbind(); //in case we've been here before
     $('.btn-collapse').click(function() {
         var button = $(this);
         var togglename = $(this).data("toggle");
         $('.collapsable-content[data-toggle='+togglename+']').toggle();
         if ($(this).html()=="Show Less")
             $(this).html("Show More");
         else
             $(this).html("Show Less");
     });
 };
 
 var timeagoActivate = function() {
     $("time.timeago").timeago();
 };
 
 
 var clipboardActivate = function() {
     /*
     *
     * <i class="tooltip icon-plus clipboard-action" data-clipboard-text="${commit.raw_id}" title="${_('Copy the full commit id')}"></i>
     * */
     var clipboard = new ClipboardJS('.clipboard-action');
 
     clipboard.on('success', function(e) {
         var callback = function () {
             $(e.trigger).animate({'opacity': 1.00}, 200)
         };
         $(e.trigger).animate({'opacity': 0.15}, 200, callback);
         e.clearSelection();
     });
 };
 
+var tooltipActivate = function () {
+    var delay = 50;
+    var animation = 'fade';
+    var theme = 'tooltipster-shadow';
+    var debug = false;
+
+    $('.tooltip').tooltipster({
+        debug: debug,
+        theme: theme,
+        animation: animation,
+        delay: delay,
+        contentCloning: true,
+        contentAsHTML: true,
+
+        functionBefore: function (instance, helper) {
+            var $origin = $(helper.origin);
+            var data = '<div style="white-space: pre-wrap">{0}</div>'.format(instance.content());
+            instance.content(data);
+        }
+    });
+    var hovercardCache = {};
+
+    var loadHoverCard = function (url, callback) {
+        var id = url;
+
+        if (hovercardCache[id] !== undefined) {
+            callback(hovercardCache[id]);
+            return;
+        }
+
+        hovercardCache[id] = undefined;
+        $.get(url, function (data) {
+            hovercardCache[id] = data;
+            callback(hovercardCache[id]);
+        }).fail(function (data, textStatus, errorThrown) {
+            var msg = "Error while fetching hovercard.\nError code {0} ({1}).".format(data.status,data.statusText);
+            callback(msg);
+        });
+    };
+
+    $('.tooltip-hovercard').tooltipster({
+        debug: debug,
+        theme: theme,
+        animation: animation,
+        delay: delay,
+        interactive: true,
+        contentCloning: true,
+
+        trigger: 'custom',
+        triggerOpen: {
+            mouseenter: true,
+        },
+        triggerClose: {
+            mouseleave: true,
+            originClick: true,
+            touchleave: true
+        },
+        content: _gettext('Loading...'),
+        contentAsHTML: true,
+        updateAnimation: null,
+
+        functionBefore: function (instance, helper) {
+
+            var $origin = $(helper.origin);
+
+            // we set a variable so the data is only loaded once via Ajax, not every time the tooltip opens
+            if ($origin.data('loaded') !== true) {
+                var hovercardUrl = $origin.data('hovercardUrl');
+
+                if (hovercardUrl !== undefined && hovercardUrl !== "") {
+                    loadHoverCard(hovercardUrl, function (data) {
+                        instance.content(data);
+                    })
+                } else {
+                    var data = '<div style="white-space: pre-wrap">{0}</div>'.format($origin.data('hovercardAlt'))
+                    instance.content(data);
+                }
+
+                // to remember that the data has been loaded
+                $origin.data('loaded', true);
+            }
+        }
+    })
+};
 
 // Formatting values in a Select2 dropdown of commit references
 var formatSelect2SelectionRefs = function(commit_ref){
   var tmpl = '';
   if (!commit_ref.text || commit_ref.type === 'sha'){
     return commit_ref.text;
   }
   if (commit_ref.type === 'branch'){
     tmpl = tmpl.concat('<i class="icon-branch"></i> ');
   } else if (commit_ref.type === 'tag'){
     tmpl = tmpl.concat('<i class="icon-tag"></i> ');
   } else if (commit_ref.type === 'book'){
     tmpl = tmpl.concat('<i class="icon-bookmark"></i> ');
   }
   return tmpl.concat(escapeHtml(commit_ref.text));
 };
 
 // takes a given html element and scrolls it down offset pixels
 function offsetScroll(element, offset) {
     setTimeout(function() {
         var location = element.offset().top;
         // some browsers use body, some use html
         $('html, body').animate({ scrollTop: (location - offset) });
     }, 100);
 }
 
 // scroll an element `percent`% from the top of page in `time` ms
 function scrollToElement(element, percent, time) {
     percent = (percent === undefined ? 25 : percent);
     time = (time === undefined ? 100 : time);
 
     var $element = $(element);
     if ($element.length == 0) {
         throw('Cannot scroll to {0}'.format(element))
     }
     var elOffset = $element.offset().top;
     var elHeight = $element.height();
     var windowHeight = $(window).height();
     var offset = elOffset;
     if (elHeight < windowHeight) {
         offset = elOffset - ((windowHeight / (100 / percent)) - (elHeight / 2));
     }
     setTimeout(function() {
         $('html, body').animate({ scrollTop: offset});
     }, time);
 }
 
 /**
  * global hooks after DOM is loaded
  */
 $(document).ready(function() {
     firefoxAnchorFix();
 
     $('.navigation a.menulink').on('click', function(e){
         var menuitem = $(this).parent('li');
         if (menuitem.hasClass('open')) {
             menuitem.removeClass('open');
         } else {
             menuitem.addClass('open');
             $(document).on('click', function(event) {
                 if (!$(event.target).closest(menuitem).length) {
                     menuitem.removeClass('open');
                 }
             });
         }
     });
 
     $('body').on('click', '.cb-lineno a', function(event) {
         function sortNumber(a,b) {
             return a - b;
         }
 
         var lineNo = $(this).data('lineNo');
         var lineName = $(this).attr('name');
 
         if (lineNo) {
             var prevLine = $('.cb-line-selected a').data('lineNo');
 
             // on shift, we do a range selection, if we got previous line
             if (event.shiftKey && prevLine !== undefined) {
                 var prevLine = parseInt(prevLine);
                 var nextLine = parseInt(lineNo);
                 var pos = [prevLine, nextLine].sort(sortNumber);
                 var anchor = '#L{0}-{1}'.format(pos[0], pos[1]);
 
             // single click
             } else {
                 var nextLine = parseInt(lineNo);
                 var pos = [nextLine, nextLine];
                 var anchor = '#L{0}'.format(pos[0]);
 
             }
             // highlight
             var range = [];
             for (var i = pos[0]; i <= pos[1]; i++) {
                 range.push(i);
             }
             // clear old selected lines
             $('.cb-line-selected').removeClass('cb-line-selected');
 
             $.each(range, function (i, lineNo) {
                 var line_td = $('td.cb-lineno#L' + lineNo);
 
                 if (line_td.length) {
                     line_td.addClass('cb-line-selected'); // line number td
                     line_td.prev().addClass('cb-line-selected'); // line data
                     line_td.next().addClass('cb-line-selected'); // line content
                 }
             });
 
         } else if (lineName !== undefined) { // lineName only occurs in diffs
             // clear old selected lines
             $('td.cb-line-selected').removeClass('cb-line-selected');
             var anchor = '#{0}'.format(lineName);
             var diffmode = templateContext.session_attrs.diffmode || "sideside";
 
             if (diffmode === "unified") {
                 $(this).closest('tr').find('td').addClass('cb-line-selected');
             } else {
                 var activeTd = $(this).closest('td');
                 activeTd.addClass('cb-line-selected');
                 activeTd.next('td').addClass('cb-line-selected');
             }
 
         }
 
         // Replace URL without jumping to it if browser supports.
         // Default otherwise
         if (history.pushState && anchor !== undefined) {
             var new_location = location.href.rstrip('#');
             if (location.hash) {
                 // location without hash
                 new_location = new_location.replace(location.hash, "");
             }
 
             // Make new anchor url
             new_location = new_location + anchor;
             history.pushState(true, document.title, new_location);
 
             return false;
         }
 
     });
 
     $('.collapse_file').on('click', function(e) {
         e.stopPropagation();
         if ($(e.target).is('a')) { return; }
         var node = $(e.delegateTarget).first();
         var icon = $($(node.children().first()).children().first());
         var id = node.attr('fid');
         var target = $('#'+id);
         var tr = $('#tr_'+id);
         var diff = $('#diff_'+id);
         if(node.hasClass('expand_file')){
             node.removeClass('expand_file');
             icon.removeClass('expand_file_icon');
             node.addClass('collapse_file');
             icon.addClass('collapse_file_icon');
             diff.show();
             tr.show();
             target.show();
         } else {
             node.removeClass('collapse_file');
             icon.removeClass('collapse_file_icon');
             node.addClass('expand_file');
             icon.addClass('expand_file_icon');
             diff.hide();
             tr.hide();
             target.hide();
         }
     });
 
     $('#expand_all_files').click(function() {
         $('.expand_file').each(function() {
             var node = $(this);
             var icon = $($(node.children().first()).children().first());
             var id = $(this).attr('fid');
             var target = $('#'+id);
             var tr = $('#tr_'+id);
             var diff = $('#diff_'+id);
             node.removeClass('expand_file');
             icon.removeClass('expand_file_icon');
             node.addClass('collapse_file');
             icon.addClass('collapse_file_icon');
             diff.show();
             tr.show();
             target.show();
         });
     });
 
     $('#collapse_all_files').click(function() {
         $('.collapse_file').each(function() {
             var node = $(this);
             var icon = $($(node.children().first()).children().first());
             var id = $(this).attr('fid');
             var target = $('#'+id);
             var tr = $('#tr_'+id);
             var diff = $('#diff_'+id);
             node.removeClass('collapse_file');
             icon.removeClass('collapse_file_icon');
             node.addClass('expand_file');
             icon.addClass('expand_file_icon');
             diff.hide();
             tr.hide();
             target.hide();
         });
     });
 
     // Mouse over behavior for comments and line selection
 
     // Select the line that comes from the url anchor
     // At the time of development, Chrome didn't seem to support jquery's :target
     // element, so I had to scroll manually
 
     if (location.hash) {
         var result = splitDelimitedHash(location.hash);
         var loc  = result.loc;
         if (loc.length > 1) {
 
             var highlightable_line_tds = [];
 
             // source code line format
             var page_highlights = loc.substring(
                 loc.indexOf('#') + 1).split('L');
 
             if (page_highlights.length > 1) {
                 var highlight_ranges = page_highlights[1].split(",");
                 var h_lines = [];
                 for (var pos in highlight_ranges) {
                     var _range = highlight_ranges[pos].split('-');
                     if (_range.length === 2) {
                         var start = parseInt(_range[0]);
                         var end = parseInt(_range[1]);
                         if (start < end) {
                             for (var i = start; i <= end; i++) {
                                 h_lines.push(i);
                             }
                         }
                     }
                     else {
                         h_lines.push(parseInt(highlight_ranges[pos]));
                     }
                 }
                 for (pos in h_lines) {
                     var line_td = $('td.cb-lineno#L' + h_lines[pos]);
                     if (line_td.length) {
                         highlightable_line_tds.push(line_td);
                     }
                 }
             }
 
             // now check a direct id reference (diff page)
             if ($(loc).length && $(loc).hasClass('cb-lineno')) {
                 highlightable_line_tds.push($(loc));
             }
             $.each(highlightable_line_tds, function (i, $td) {
                 $td.addClass('cb-line-selected'); // line number td
                 $td.prev().addClass('cb-line-selected'); // line data
                 $td.next().addClass('cb-line-selected'); // line content
             });
 
             if (highlightable_line_tds.length) {
                 var $first_line_td = highlightable_line_tds[0];
                 scrollToElement($first_line_td);
                 $.Topic('/ui/plugins/code/anchor_focus').prepareOrPublish({
                     td: $first_line_td,
                     remainder: result.remainder
                 });
             }
         }
     }
     collapsableContent();
 });
 
 var feedLifetimeOptions = function(query, initialData){
     var data = {results: []};
     var isQuery = typeof query.term !== 'undefined';
 
     var section = _gettext('Lifetime');
     var children = [];
 
     //filter results
     $.each(initialData.results, function(idx, value) {
 
         if (!isQuery || query.term.length === 0 || value.text.toUpperCase().indexOf(query.term.toUpperCase()) >= 0) {
             children.push({
                 'id': this.id,
                 'text': this.text
             })
         }
 
     });
     data.results.push({
         'text': section,
         'children': children
     });
 
     if (isQuery) {
 
         var now = moment.utc();
 
         var parseQuery = function(entry, now){
             var fmt = 'DD/MM/YYYY H:mm';
             var parsed = moment.utc(entry, fmt);
             var diffInMin = parsed.diff(now, 'minutes');
 
             if (diffInMin > 0){
                 return {
                     id: diffInMin,
                     text: parsed.format(fmt)
                 }
             } else {
                 return {
                     id: undefined,
                     text: parsed.format('DD/MM/YYYY') + ' ' + _gettext('date not in future')
                 }
             }
 
 
         };
 
         data.results.push({
             'text': _gettext('Specified expiration date'),
             'children': [{
                 'id': parseQuery(query.term, now).id,
                 'text': parseQuery(query.term, now).text
             }]
         });
     }
 
     query.callback(data);
 };
 
 
 var storeUserSessionAttr = function (key, val) {
 
     var postData = {
         'key': key,
         'val': val,
         'csrf_token': CSRF_TOKEN
     };
 
     var success = function(o) {
         return true
     };
 
     ajaxPOST(pyroutes.url('store_user_session_value'), postData, success);
     return false;
 };

rhodecode/public/js/src/rhodecode/comments.js

@@ -1,927 +1,929 b''
 // # Copyright (C) 2010-2019 RhodeCode GmbH
 // #
 // # This program is free software: you can redistribute it and/or modify
 // # it under the terms of the GNU Affero General Public License, version 3
 // # (only), as published by the Free Software Foundation.
 // #
 // # This program is distributed in the hope that it will be useful,
 // # but WITHOUT ANY WARRANTY; without even the implied warranty of
 // # MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 // # GNU General Public License for more details.
 // #
 // # You should have received a copy of the GNU Affero General Public License
 // # along with this program.  If not, see <http://www.gnu.org/licenses/>.
 // #
 // # This program is dual-licensed. If you wish to learn more about the
 // # RhodeCode Enterprise Edition, including its added features, Support services,
 // # and proprietary license terms, please see https://rhodecode.com/licenses/
 
 var firefoxAnchorFix = function() {
   // hack to make anchor links behave properly on firefox, in our inline
   // comments generation when comments are injected firefox is misbehaving
   // when jumping to anchor links
   if (location.href.indexOf('#') > -1) {
     location.href += '';
   }
 };
 
 var linkifyComments = function(comments) {
   var firstCommentId = null;
   if (comments) {
       firstCommentId = $(comments[0]).data('comment-id');
   }
 
   if (firstCommentId){
     $('#inline-comments-counter').attr('href', '#comment-' + firstCommentId);
   }
 };
 
 var bindToggleButtons = function() {
   $('.comment-toggle').on('click', function() {
         $(this).parent().nextUntil('tr.line').toggle('inline-comments');
   });
 };
 
 
 
 var _submitAjaxPOST = function(url, postData, successHandler, failHandler) {
     failHandler = failHandler || function() {};
     postData = toQueryString(postData);
     var request = $.ajax({
         url: url,
         type: 'POST',
         data: postData,
         headers: {'X-PARTIAL-XHR': true}
     })
     .done(function (data) {
         successHandler(data);
     })
     .fail(function (data, textStatus, errorThrown) {
         failHandler(data, textStatus, errorThrown)
     });
     return request;
 };
 
 
 
 
 /* Comment form for main and inline comments */
 (function(mod) {
 
     if (typeof exports == "object" && typeof module == "object") {
         // CommonJS
         module.exports = mod();
     }
     else {
         // Plain browser env
         (this || window).CommentForm = mod();
     }
 
 })(function() {
     "use strict";
 
     function CommentForm(formElement, commitId, pullRequestId, lineNo, initAutocompleteActions, resolvesCommentId) {
         if (!(this instanceof CommentForm)) {
             return new CommentForm(formElement, commitId, pullRequestId, lineNo, initAutocompleteActions, resolvesCommentId);
         }
 
         // bind the element instance to our Form
         $(formElement).get(0).CommentForm = this;
 
         this.withLineNo = function(selector) {
             var lineNo = this.lineNo;
             if (lineNo === undefined) {
                 return selector
             } else {
                 return selector + '_' + lineNo;
             }
         };
 
         this.commitId = commitId;
         this.pullRequestId = pullRequestId;
         this.lineNo = lineNo;
         this.initAutocompleteActions = initAutocompleteActions;
 
         this.previewButton = this.withLineNo('#preview-btn');
         this.previewContainer = this.withLineNo('#preview-container');
 
         this.previewBoxSelector = this.withLineNo('#preview-box');
 
         this.editButton = this.withLineNo('#edit-btn');
         this.editContainer = this.withLineNo('#edit-container');
         this.cancelButton = this.withLineNo('#cancel-btn');
         this.commentType = this.withLineNo('#comment_type');
 
         this.resolvesId = null;
         this.resolvesActionId = null;
 
         this.closesPr = '#close_pull_request';
 
         this.cmBox = this.withLineNo('#text');
         this.cm = initCommentBoxCodeMirror(this, this.cmBox, this.initAutocompleteActions);
 
         this.statusChange = this.withLineNo('#change_status');
 
         this.submitForm = formElement;
         this.submitButton = $(this.submitForm).find('input[type="submit"]');
         this.submitButtonText = this.submitButton.val();
 
         this.previewUrl = pyroutes.url('repo_commit_comment_preview',
             {'repo_name': templateContext.repo_name,
              'commit_id': templateContext.commit_data.commit_id});
 
         if (resolvesCommentId){
             this.resolvesId = '#resolve_comment_{0}'.format(resolvesCommentId);
             this.resolvesActionId = '#resolve_comment_action_{0}'.format(resolvesCommentId);
             $(this.commentType).prop('disabled', true);
             $(this.commentType).addClass('disabled');
 
             // disable select
             setTimeout(function() {
                 $(self.statusChange).select2('readonly', true);
             }, 10);
 
             var resolvedInfo = (
                 '<li class="resolve-action">' +
                 '<input type="hidden" id="resolve_comment_{0}" name="resolve_comment_{0}" value="{0}">' +
                 '<button id="resolve_comment_action_{0}" class="resolve-text btn btn-sm" onclick="return Rhodecode.comments.submitResolution({0})">{1} #{0}</button>' +
                 '</li>'
             ).format(resolvesCommentId, _gettext('resolve comment'));
             $(resolvedInfo).insertAfter($(this.commentType).parent());
         }
 
         // based on commitId, or pullRequestId decide where do we submit
         // out data
         if (this.commitId){
             this.submitUrl = pyroutes.url('repo_commit_comment_create',
                 {'repo_name': templateContext.repo_name,
                  'commit_id': this.commitId});
             this.selfUrl = pyroutes.url('repo_commit',
                 {'repo_name': templateContext.repo_name,
                  'commit_id': this.commitId});
 
         } else if (this.pullRequestId) {
             this.submitUrl = pyroutes.url('pullrequest_comment_create',
                 {'repo_name': templateContext.repo_name,
                  'pull_request_id': this.pullRequestId});
             this.selfUrl = pyroutes.url('pullrequest_show',
                 {'repo_name': templateContext.repo_name,
                  'pull_request_id': this.pullRequestId});
 
         } else {
             throw new Error(
                 'CommentForm requires pullRequestId, or commitId to be specified.')
         }
 
         // FUNCTIONS and helpers
         var self = this;
 
         this.isInline = function(){
             return this.lineNo && this.lineNo != 'general';
         };
 
         this.getCmInstance = function(){
             return this.cm
         };
 
         this.setPlaceholder = function(placeholder) {
             var cm = this.getCmInstance();
             if (cm){
                 cm.setOption('placeholder', placeholder);
             }
         };
 
         this.getCommentStatus = function() {
           return $(this.submitForm).find(this.statusChange).val();
         };
         this.getCommentType = function() {
           return $(this.submitForm).find(this.commentType).val();
         };
 
         this.getResolvesId = function() {
             return $(this.submitForm).find(this.resolvesId).val() || null;
         };
 
         this.getClosePr = function() {
             return $(this.submitForm).find(this.closesPr).val() || null;
         };
 
         this.markCommentResolved = function(resolvedCommentId){
             $('#comment-label-{0}'.format(resolvedCommentId)).find('.resolved').show();
             $('#comment-label-{0}'.format(resolvedCommentId)).find('.resolve').hide();
         };
 
         this.isAllowedToSubmit = function() {
           return !$(this.submitButton).prop('disabled');
         };
 
         this.initStatusChangeSelector = function(){
             var formatChangeStatus = function(state, escapeMarkup) {
                 var originalOption = state.element;
                 var tmpl = '<i class="icon-circle review-status-{0}"></i><span>{1}</span>'.format($(originalOption).data('status'), escapeMarkup(state.text));
                 return tmpl
             };
             var formatResult = function(result, container, query, escapeMarkup) {
                 return formatChangeStatus(result, escapeMarkup);
             };
 
             var formatSelection = function(data, container, escapeMarkup) {
                 return formatChangeStatus(data, escapeMarkup);
             };
 
             $(this.submitForm).find(this.statusChange).select2({
                 placeholder: _gettext('Status Review'),
                 formatResult: formatResult,
                 formatSelection: formatSelection,
                 containerCssClass: "drop-menu status_box_menu",
                 dropdownCssClass: "drop-menu-dropdown",
                 dropdownAutoWidth: true,
                 minimumResultsForSearch: -1
             });
             $(this.submitForm).find(this.statusChange).on('change', function() {
                 var status = self.getCommentStatus();
 
                 if (status && !self.isInline()) {
                     $(self.submitButton).prop('disabled', false);
                 }
 
                 var placeholderText = _gettext('Comment text will be set automatically based on currently selected status ({0}) ...').format(status);
                 self.setPlaceholder(placeholderText)
             })
         };
 
         // reset the comment form into it's original state
         this.resetCommentFormState = function(content) {
             content = content || '';
 
             $(this.editContainer).show();
             $(this.editButton).parent().addClass('active');
 
             $(this.previewContainer).hide();
             $(this.previewButton).parent().removeClass('active');
 
             this.setActionButtonsDisabled(true);
             self.cm.setValue(content);
             self.cm.setOption("readOnly", false);
 
             if (this.resolvesId) {
                 // destroy the resolve action
                 $(this.resolvesId).parent().remove();
             }
             // reset closingPR flag
             $('.close-pr-input').remove();
 
             $(this.statusChange).select2('readonly', false);
         };
 
         this.globalSubmitSuccessCallback = function(){
             // default behaviour is to call GLOBAL hook, if it's registered.
             if (window.commentFormGlobalSubmitSuccessCallback !== undefined){
                 commentFormGlobalSubmitSuccessCallback()
             }
         };
 
         this.submitAjaxPOST = function(url, postData, successHandler, failHandler) {
             return _submitAjaxPOST(url, postData, successHandler, failHandler);
         };
 
         // overwrite a submitHandler, we need to do it for inline comments
         this.setHandleFormSubmit = function(callback) {
             this.handleFormSubmit = callback;
         };
 
         // overwrite a submitSuccessHandler
         this.setGlobalSubmitSuccessCallback = function(callback) {
             this.globalSubmitSuccessCallback = callback;
         };
 
         // default handler for for submit for main comments
         this.handleFormSubmit = function() {
             var text = self.cm.getValue();
             var status = self.getCommentStatus();
             var commentType = self.getCommentType();
             var resolvesCommentId = self.getResolvesId();
             var closePullRequest = self.getClosePr();
 
             if (text === "" && !status) {
                 return;
             }
 
             var excludeCancelBtn = false;
             var submitEvent = true;
             self.setActionButtonsDisabled(true, excludeCancelBtn, submitEvent);
             self.cm.setOption("readOnly", true);
 
             var postData = {
                 'text': text,
                 'changeset_status': status,
                 'comment_type': commentType,
                 'csrf_token': CSRF_TOKEN
             };
 
             if (resolvesCommentId) {
                 postData['resolves_comment_id'] = resolvesCommentId;
             }
 
             if (closePullRequest) {
                 postData['close_pull_request'] = true;
             }
 
             var submitSuccessCallback = function(o) {
                 // reload page if we change status for single commit.
                 if (status && self.commitId) {
                     location.reload(true);
                 } else {
                     $('#injected_page_comments').append(o.rendered_text);
                     self.resetCommentFormState();
                     timeagoActivate();
+                    tooltipActivate();
 
                     // mark visually which comment was resolved
                     if (resolvesCommentId) {
                         self.markCommentResolved(resolvesCommentId);
                     }
                 }
 
                 // run global callback on submit
                 self.globalSubmitSuccessCallback();
 
             };
             var submitFailCallback = function(data) {
                 alert(
                 "Error while submitting comment.\n" +
                 "Error code {0} ({1}).".format(data.status, data.statusText)
                 );
                 self.resetCommentFormState(text);
             };
             self.submitAjaxPOST(
                 self.submitUrl, postData, submitSuccessCallback, submitFailCallback);
         };
 
         this.previewSuccessCallback = function(o) {
             $(self.previewBoxSelector).html(o);
             $(self.previewBoxSelector).removeClass('unloaded');
 
             // swap buttons, making preview active
             $(self.previewButton).parent().addClass('active');
             $(self.editButton).parent().removeClass('active');
 
             // unlock buttons
             self.setActionButtonsDisabled(false);
         };
 
         this.setActionButtonsDisabled = function(state, excludeCancelBtn, submitEvent) {
             excludeCancelBtn = excludeCancelBtn || false;
             submitEvent = submitEvent || false;
 
             $(this.editButton).prop('disabled', state);
             $(this.previewButton).prop('disabled', state);
 
             if (!excludeCancelBtn) {
                 $(this.cancelButton).prop('disabled', state);
             }
 
             var submitState = state;
             if (!submitEvent && this.getCommentStatus() && !self.isInline()) {
                 // if the value of commit review status is set, we allow
                 // submit button, but only on Main form, isInline means inline
                 submitState = false
             }
 
             $(this.submitButton).prop('disabled', submitState);
             if (submitEvent) {
               $(this.submitButton).val(_gettext('Submitting...'));
             } else {
               $(this.submitButton).val(this.submitButtonText);
             }
 
         };
 
         // lock preview/edit/submit buttons on load, but exclude cancel button
         var excludeCancelBtn = true;
         this.setActionButtonsDisabled(true, excludeCancelBtn);
 
         // anonymous users don't have access to initialized CM instance
         if (this.cm !== undefined){
             this.cm.on('change', function(cMirror) {
                 if (cMirror.getValue() === "") {
                     self.setActionButtonsDisabled(true, excludeCancelBtn)
                 } else {
                     self.setActionButtonsDisabled(false, excludeCancelBtn)
                 }
             });
         }
 
         $(this.editButton).on('click', function(e) {
             e.preventDefault();
 
             $(self.previewButton).parent().removeClass('active');
             $(self.previewContainer).hide();
 
             $(self.editButton).parent().addClass('active');
             $(self.editContainer).show();
 
         });
 
         $(this.previewButton).on('click', function(e) {
             e.preventDefault();
             var text = self.cm.getValue();
 
             if (text === "") {
                 return;
             }
 
             var postData = {
                 'text': text,
                 'renderer': templateContext.visual.default_renderer,
                 'csrf_token': CSRF_TOKEN
             };
 
             // lock ALL buttons on preview
             self.setActionButtonsDisabled(true);
 
             $(self.previewBoxSelector).addClass('unloaded');
             $(self.previewBoxSelector).html(_gettext('Loading ...'));
 
             $(self.editContainer).hide();
             $(self.previewContainer).show();
 
             // by default we reset state of comment preserving the text
             var previewFailCallback = function(data){
                 alert(
                 "Error while preview of comment.\n" +
                 "Error code {0} ({1}).".format(data.status, data.statusText)
                 );
                 self.resetCommentFormState(text)
             };
             self.submitAjaxPOST(
                 self.previewUrl, postData, self.previewSuccessCallback,
                 previewFailCallback);
 
             $(self.previewButton).parent().addClass('active');
             $(self.editButton).parent().removeClass('active');
         });
 
         $(this.submitForm).submit(function(e) {
             e.preventDefault();
             var allowedToSubmit = self.isAllowedToSubmit();
             if (!allowedToSubmit){
                return false;
             }
             self.handleFormSubmit();
         });
 
     }
 
     return CommentForm;
 });
 
 /* comments controller */
 var CommentsController = function() {
   var mainComment = '#text';
   var self = this;
 
   this.cancelComment = function(node) {
       var $node = $(node);
       var $td = $node.closest('td');
       $node.closest('.comment-inline-form').remove();
       return false;
   };
 
   this.getLineNumber = function(node) {
       var $node = $(node);
       var lineNo = $node.closest('td').attr('data-line-no');
       if (lineNo === undefined && $node.data('commentInline')){
           lineNo = $node.data('commentLineNo')
       }
 
       return lineNo
   };
 
   this.scrollToComment = function(node, offset, outdated) {
     if (offset === undefined) {
       offset = 0;
     }
     var outdated = outdated || false;
     var klass = outdated ? 'div.comment-outdated' : 'div.comment-current';
 
     if (!node) {
       node = $('.comment-selected');
       if (!node.length) {
         node = $('comment-current')
       }
     }
     $wrapper = $(node).closest('div.comment');
     $comment = $(node).closest(klass);
     $comments = $(klass);
 
     // show hidden comment when referenced.
     if (!$wrapper.is(':visible')){
         $wrapper.show();
     }
 
     $('.comment-selected').removeClass('comment-selected');
 
     var nextIdx = $(klass).index($comment) + offset;
     if (nextIdx >= $comments.length) {
       nextIdx = 0;
     }
     var $next = $(klass).eq(nextIdx);
 
     var $cb = $next.closest('.cb');
     $cb.removeClass('cb-collapsed');
 
     var $filediffCollapseState = $cb.closest('.filediff').prev();
     $filediffCollapseState.prop('checked', false);
     $next.addClass('comment-selected');
     scrollToElement($next);
     return false;
   };
 
   this.nextComment = function(node) {
     return self.scrollToComment(node, 1);
   };
 
   this.prevComment = function(node) {
     return self.scrollToComment(node, -1);
   };
 
   this.nextOutdatedComment = function(node) {
     return self.scrollToComment(node, 1, true);
   };
 
   this.prevOutdatedComment = function(node) {
     return self.scrollToComment(node, -1, true);
   };
 
   this.deleteComment = function(node) {
       if (!confirm(_gettext('Delete this comment?'))) {
         return false;
       }
       var $node = $(node);
       var $td = $node.closest('td');
       var $comment = $node.closest('.comment');
       var comment_id = $comment.attr('data-comment-id');
       var url = AJAX_COMMENT_DELETE_URL.replace('__COMMENT_ID__', comment_id);
       var postData = {
         'csrf_token': CSRF_TOKEN
       };
 
       $comment.addClass('comment-deleting');
       $comment.hide('fast');
 
       var success = function(response) {
         $comment.remove();
         return false;
       };
       var failure = function(data, textStatus, xhr) {
         alert("error processing request: " + textStatus);
         $comment.show('fast');
         $comment.removeClass('comment-deleting');
         return false;
       };
       ajaxPOST(url, postData, success, failure);
   };
 
   this.toggleWideMode = function (node) {
       if ($('#content').hasClass('wrapper')) {
           $('#content').removeClass("wrapper");
           $('#content').addClass("wide-mode-wrapper");
           $(node).addClass('btn-success');
           return true
       } else {
           $('#content').removeClass("wide-mode-wrapper");
           $('#content').addClass("wrapper");
           $(node).removeClass('btn-success');
           return false
       }
 
   };
 
   this.toggleComments = function(node, show) {
     var $filediff = $(node).closest('.filediff');
     if (show === true) {
       $filediff.removeClass('hide-comments');
     } else if (show === false) {
       $filediff.find('.hide-line-comments').removeClass('hide-line-comments');
       $filediff.addClass('hide-comments');
     } else {
       $filediff.find('.hide-line-comments').removeClass('hide-line-comments');
       $filediff.toggleClass('hide-comments');
     }
     return false;
   };
 
   this.toggleLineComments = function(node) {
     self.toggleComments(node, true);
     var $node = $(node);
     // mark outdated comments as visible before the toggle;
     $(node.closest('tr')).find('.comment-outdated').show();
     $node.closest('tr').toggleClass('hide-line-comments');
   };
 
   this.createCommentForm = function(formElement, lineno, placeholderText, initAutocompleteActions, resolvesCommentId){
       var pullRequestId = templateContext.pull_request_data.pull_request_id;
       var commitId = templateContext.commit_data.commit_id;
 
       var commentForm = new CommentForm(
           formElement, commitId, pullRequestId, lineno, initAutocompleteActions, resolvesCommentId);
       var cm = commentForm.getCmInstance();
 
       if (resolvesCommentId){
         var placeholderText = _gettext('Leave a comment, or click resolve button to resolve TODO comment #{0}').format(resolvesCommentId);
       }
 
       setTimeout(function() {
           // callbacks
           if (cm !== undefined) {
               commentForm.setPlaceholder(placeholderText);
               if (commentForm.isInline()) {
                 cm.focus();
                 cm.refresh();
               }
           }
       }, 10);
 
       // trigger scrolldown to the resolve comment, since it might be away
       // from the clicked
       if (resolvesCommentId){
         var actionNode = $(commentForm.resolvesActionId).offset();
 
         setTimeout(function() {
             if (actionNode) {
                 $('body, html').animate({scrollTop: actionNode.top}, 10);
             }
         }, 100);
       }
 
         // add dropzone support
         var insertAttachmentText = function (cm, attachmentName, attachmentStoreUrl, isRendered) {
             var renderer = templateContext.visual.default_renderer;
             if (renderer == 'rst') {
                 var attachmentUrl = '`#{0} <{1}>`_'.format(attachmentName, attachmentStoreUrl);
                 if (isRendered){
                     attachmentUrl = '\n.. image:: {0}'.format(attachmentStoreUrl);
                 }
             } else if (renderer == 'markdown') {
                 var attachmentUrl = '[{0}]({1})'.format(attachmentName, attachmentStoreUrl);
                 if (isRendered){
                     attachmentUrl = '!' + attachmentUrl;
                 }
             } else {
                 var attachmentUrl = '{}'.format(attachmentStoreUrl);
             }
             cm.replaceRange(attachmentUrl+'\n', CodeMirror.Pos(cm.lastLine()));
 
             return false;
         };
 
         //see: https://www.dropzonejs.com/#configuration
         var storeUrl = pyroutes.url('repo_commit_comment_attachment_upload',
             {'repo_name': templateContext.repo_name,
                      'commit_id': templateContext.commit_data.commit_id})
 
         var previewTmpl = $(formElement).find('.comment-attachment-uploader-template').get(0);
         if (previewTmpl !== undefined){
             var selectLink = $(formElement).find('.pick-attachment').get(0);
             $(formElement).find('.comment-attachment-uploader').dropzone({
                 url: storeUrl,
                 headers: {"X-CSRF-Token": CSRF_TOKEN},
                 paramName: function () {
                     return "attachment"
                 }, // The name that will be used to transfer the file
                 clickable: selectLink,
                 parallelUploads: 1,
                 maxFiles: 10,
                 maxFilesize: templateContext.attachment_store.max_file_size_mb,
                 uploadMultiple: false,
                 autoProcessQueue: true, // if false queue will not be processed automatically.
                 createImageThumbnails: false,
                 previewTemplate: previewTmpl.innerHTML,
 
                 accept: function (file, done) {
                     done();
                 },
                 init: function () {
 
                     this.on("sending", function (file, xhr, formData) {
                         $(formElement).find('.comment-attachment-uploader').find('.dropzone-text').hide();
                         $(formElement).find('.comment-attachment-uploader').find('.dropzone-upload').show();
                     });
 
                     this.on("success", function (file, response) {
                         $(formElement).find('.comment-attachment-uploader').find('.dropzone-text').show();
                         $(formElement).find('.comment-attachment-uploader').find('.dropzone-upload').hide();
 
                         var isRendered = false;
                         var ext = file.name.split('.').pop();
                         var imageExts = templateContext.attachment_store.image_ext;
                         if (imageExts.indexOf(ext) !== -1){
                             isRendered = true;
                         }
 
                         insertAttachmentText(cm, file.name, response.repo_fqn_access_path, isRendered)
                     });
 
                     this.on("error", function (file, errorMessage, xhr) {
                         $(formElement).find('.comment-attachment-uploader').find('.dropzone-upload').hide();
 
                         var error = null;
 
                         if (xhr !== undefined){
                             var httpStatus = xhr.status + " " + xhr.statusText;
                             if (xhr !== undefined && xhr.status >= 500) {
                                 error = httpStatus;
                             }
                         }
 
                         if (error === null) {
                             error = errorMessage.error || errorMessage || httpStatus;
                         }
                         $(file.previewElement).find('.dz-error-message').html('ERROR: {0}'.format(error));
 
                     });
                 }
             });
         }
       return commentForm;
   };
 
   this.createGeneralComment = function (lineNo, placeholderText, resolvesCommentId) {
 
       var tmpl = $('#cb-comment-general-form-template').html();
       tmpl = tmpl.format(null, 'general');
       var $form = $(tmpl);
 
       var $formPlaceholder = $('#cb-comment-general-form-placeholder');
       var curForm = $formPlaceholder.find('form');
       if (curForm){
           curForm.remove();
       }
       $formPlaceholder.append($form);
 
       var _form = $($form[0]);
       var autocompleteActions = ['approve', 'reject', 'as_note', 'as_todo'];
       var commentForm = this.createCommentForm(
           _form, lineNo, placeholderText, autocompleteActions, resolvesCommentId);
       commentForm.initStatusChangeSelector();
 
       return commentForm;
   };
 
   this.createComment = function(node, resolutionComment) {
       var resolvesCommentId = resolutionComment || null;
       var $node = $(node);
       var $td = $node.closest('td');
       var $form = $td.find('.comment-inline-form');
 
       if (!$form.length) {
 
           var $filediff = $node.closest('.filediff');
           $filediff.removeClass('hide-comments');
           var f_path = $filediff.attr('data-f-path');
           var lineno = self.getLineNumber(node);
           // create a new HTML from template
           var tmpl = $('#cb-comment-inline-form-template').html();
           tmpl = tmpl.format(escapeHtml(f_path), lineno);
           $form = $(tmpl);
 
           var $comments = $td.find('.inline-comments');
           if (!$comments.length) {
             $comments = $(
               $('#cb-comments-inline-container-template').html());
             $td.append($comments);
           }
 
           $td.find('.cb-comment-add-button').before($form);
 
           var placeholderText = _gettext('Leave a comment on line {0}.').format(lineno);
           var _form = $($form[0]).find('form');
           var autocompleteActions = ['as_note', 'as_todo'];
           var commentForm = this.createCommentForm(
               _form, lineno, placeholderText, autocompleteActions, resolvesCommentId);
 
           $.Topic('/ui/plugins/code/comment_form_built').prepareOrPublish({
               form: _form,
               parent: $td[0],
               lineno: lineno,
               f_path: f_path}
           );
 
           // set a CUSTOM submit handler for inline comments.
           commentForm.setHandleFormSubmit(function(o) {
             var text = commentForm.cm.getValue();
             var commentType = commentForm.getCommentType();
             var resolvesCommentId = commentForm.getResolvesId();
 
             if (text === "") {
               return;
             }
 
             if (lineno === undefined) {
               alert('missing line !');
               return;
             }
             if (f_path === undefined) {
               alert('missing file path !');
               return;
             }
 
             var excludeCancelBtn = false;
             var submitEvent = true;
             commentForm.setActionButtonsDisabled(true, excludeCancelBtn, submitEvent);
             commentForm.cm.setOption("readOnly", true);
             var postData = {
                 'text': text,
                 'f_path': f_path,
                 'line': lineno,
                 'comment_type': commentType,
                 'csrf_token': CSRF_TOKEN
             };
             if (resolvesCommentId){
                 postData['resolves_comment_id'] = resolvesCommentId;
             }
 
             var submitSuccessCallback = function(json_data) {
               $form.remove();
               try {
                 var html = json_data.rendered_text;
                 var lineno = json_data.line_no;
                 var target_id = json_data.target_id;
 
                 $comments.find('.cb-comment-add-button').before(html);
 
                 //mark visually which comment was resolved
                 if (resolvesCommentId) {
                     commentForm.markCommentResolved(resolvesCommentId);
                 }
 
                 // run global callback on submit
                 commentForm.globalSubmitSuccessCallback();
 
               } catch (e) {
                 console.error(e);
               }
 
               // re trigger the linkification of next/prev navigation
               linkifyComments($('.inline-comment-injected'));
               timeagoActivate();
+              tooltipActivate();
 
               if (window.updateSticky !== undefined) {
                   // potentially our comments change the active window size, so we
                   // notify sticky elements
                   updateSticky()
               }
 
               commentForm.setActionButtonsDisabled(false);
 
             };
             var submitFailCallback = function(data){
                 alert(
                 "Error while submitting comment.\n" +
                 "Error code {0} ({1}).".format(data.status, data.statusText)
                 );
                 commentForm.resetCommentFormState(text)
             };
             commentForm.submitAjaxPOST(
                 commentForm.submitUrl, postData, submitSuccessCallback, submitFailCallback);
           });
       }
 
       $form.addClass('comment-inline-form-open');
   };
 
   this.createResolutionComment = function(commentId){
     // hide the trigger text
     $('#resolve-comment-{0}'.format(commentId)).hide();
 
     var comment = $('#comment-'+commentId);
     var commentData = comment.data();
     if (commentData.commentInline) {
         this.createComment(comment, commentId)
     } else {
         Rhodecode.comments.createGeneralComment('general', "$placeholder", commentId)
     }
 
     return false;
   };
 
   this.submitResolution = function(commentId){
     var form = $('#resolve_comment_{0}'.format(commentId)).closest('form');
     var commentForm = form.get(0).CommentForm;
 
     var cm = commentForm.getCmInstance();
     var renderer = templateContext.visual.default_renderer;
     if (renderer == 'rst'){
         var commentUrl = '`#{0} <{1}#comment-{0}>`_'.format(commentId, commentForm.selfUrl);
     } else if (renderer == 'markdown') {
         var commentUrl = '[#{0}]({1}#comment-{0})'.format(commentId, commentForm.selfUrl);
     } else {
         var commentUrl = '{1}#comment-{0}'.format(commentId, commentForm.selfUrl);
     }
 
     cm.setValue(_gettext('TODO from comment {0} was fixed.').format(commentUrl));
     form.submit();
     return false;
   };
 
 };

rhodecode/public/js/src/rhodecode/files.js

@@ -1,517 +1,519 b''
 // # Copyright (C) 2010-2019 RhodeCode GmbH
 // #
 // # This program is free software: you can redistribute it and/or modify
 // # it under the terms of the GNU Affero General Public License, version 3
 // # (only), as published by the Free Software Foundation.
 // #
 // # This program is distributed in the hope that it will be useful,
 // # but WITHOUT ANY WARRANTY; without even the implied warranty of
 // # MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 // # GNU General Public License for more details.
 // #
 // # You should have received a copy of the GNU Affero General Public License
 // # along with this program.  If not, see <http://www.gnu.org/licenses/>.
 // #
 // # This program is dual-licensed. If you wish to learn more about the
 // # RhodeCode Enterprise Edition, including its added features, Support services,
 // # and proprietary license terms, please see https://rhodecode.com/licenses/
 
 /**
  * Search file list
  */
 
 var NodeFilter = {};
 
 var fileBrowserListeners = function (node_list_url, url_base) {
     var $filterInput = $('#node_filter');
     var n_filter = $filterInput.get(0);
 
     NodeFilter.filterTimeout = null;
     var nodes = null;
 
     NodeFilter.focus = function () {
         $filterInput.focus()
     };
 
     NodeFilter.fetchNodes = function (callback) {
         $.ajax(
             {url: node_list_url, headers: {'X-PARTIAL-XHR': true}})
             .done(function (data) {
                 nodes = data.nodes;
                 if (callback) {
                     callback();
                 }
             })
             .fail(function (data) {
                 console.log('failed to load');
             });
     };
 
     NodeFilter.initFilter = function (e) {
         if ($filterInput.hasClass('loading')) {
             return
         }
 
         // in case we are already loaded, do nothing
         if (!$filterInput.hasClass('init')) {
             return NodeFilter.handleKey(e);
         }
         var iconLoading = 'icon-spin animate-spin';
         var iconSearch = 'icon-search';
         $('.files-filter-box-path i').removeClass(iconSearch).addClass(iconLoading);
         $filterInput.addClass('loading');
 
         var callback = function (org) {
             return function () {
                 if ($filterInput.hasClass('init')) {
                     $filterInput.removeClass('init');
                     $filterInput.removeClass('loading');
                 }
                 $('.files-filter-box-path i').removeClass(iconLoading).addClass(iconSearch);
 
                 // auto re-filter if we filled in the input
                 if (n_filter.value !== "") {
                     NodeFilter.updateFilter(n_filter, e)()
                 }
 
             }
         };
         // load node data
         NodeFilter.fetchNodes(callback());
 
     };
 
     NodeFilter.resetFilter = function () {
         $('#tbody').show();
         $('#tbody_filtered').hide();
         $filterInput.val('');
     };
 
     NodeFilter.handleKey = function (e) {
         var scrollDown = function (element) {
             var elementBottom = element.offset().top + $(element).outerHeight();
             var windowBottom = window.innerHeight + $(window).scrollTop();
             if (elementBottom > windowBottom) {
                 var offset = elementBottom - window.innerHeight;
                 $('html,body').scrollTop(offset);
                 return false;
             }
             return true;
         };
 
         var scrollUp = function (element) {
             if (element.offset().top < $(window).scrollTop()) {
                 $('html,body').scrollTop(element.offset().top);
                 return false;
             }
             return true;
         };
         var $hlElem = $('.browser-highlight');
 
         if (e.keyCode === 40) { // Down
             if ($hlElem.length === 0) {
                 $('.browser-result').first().addClass('browser-highlight');
             } else {
                 var next = $hlElem.next();
                 if (next.length !== 0) {
                     $hlElem.removeClass('browser-highlight');
                     next.addClass('browser-highlight');
                 }
             }
 
             if ($hlElem.get(0) !== undefined){
                 scrollDown($hlElem);
             }
         }
         if (e.keyCode === 38) { // Up
             e.preventDefault();
             if ($hlElem.length !== 0) {
                 var next = $hlElem.prev();
                 if (next.length !== 0) {
                     $('.browser-highlight').removeClass('browser-highlight');
                     next.addClass('browser-highlight');
                 }
             }
 
             if ($hlElem.get(0) !== undefined){
                 scrollUp($hlElem);
             }
 
         }
         if (e.keyCode === 13) { // Enter
             if ($('.browser-highlight').length !== 0) {
                 var url = $('.browser-highlight').find('.match-link').attr('href');
                 window.location = url;
             }
         }
         if (e.keyCode === 27) { // Esc
             NodeFilter.resetFilter();
             $('html,body').scrollTop(0);
         }
 
         var capture_keys = [
             40, // ArrowDown
             38, // ArrowUp
             39, // ArrowRight
             37, // ArrowLeft
             13, // Enter
             27  // Esc
         ];
 
         if ($.inArray(e.keyCode, capture_keys) === -1) {
             clearTimeout(NodeFilter.filterTimeout);
             NodeFilter.filterTimeout = setTimeout(NodeFilter.updateFilter(n_filter, e), 200);
         }
 
     };
 
     NodeFilter.fuzzy_match = function (filepath, query) {
         var highlight = [];
         var order = 0;
         for (var i = 0; i < query.length; i++) {
             var match_position = filepath.indexOf(query[i]);
             if (match_position !== -1) {
                 var prev_match_position = highlight[highlight.length - 1];
                 if (prev_match_position === undefined) {
                     highlight.push(match_position);
                 } else {
                     var current_match_position = prev_match_position + match_position + 1;
                     highlight.push(current_match_position);
                     order = order + current_match_position - prev_match_position;
                 }
                 filepath = filepath.substring(match_position + 1);
             } else {
                 return false;
             }
         }
         return {
             'order': order,
             'highlight': highlight
         };
     };
 
     NodeFilter.sortPredicate = function (a, b) {
         if (a.order < b.order) return -1;
         if (a.order > b.order) return 1;
         if (a.filepath < b.filepath) return -1;
         if (a.filepath > b.filepath) return 1;
         return 0;
     };
 
     NodeFilter.updateFilter = function (elem, e) {
         return function () {
             // Reset timeout
             NodeFilter.filterTimeout = null;
             var query = elem.value.toLowerCase();
             var match = [];
             var matches_max = 20;
             if (query !== "") {
                 var results = [];
                 for (var k = 0; k < nodes.length; k++) {
                     var result = NodeFilter.fuzzy_match(
                             nodes[k].name.toLowerCase(), query);
                     if (result) {
                         result.type = nodes[k].type;
                         result.filepath = nodes[k].name;
                         results.push(result);
                     }
                 }
                 results = results.sort(NodeFilter.sortPredicate);
                 var limit = matches_max;
                 if (results.length < matches_max) {
                     limit = results.length;
                 }
                 for (var i = 0; i < limit; i++) {
                     if (query && results.length > 0) {
                         var n = results[i].filepath;
                         var t = results[i].type;
                         var n_hl = n.split("");
                         var pos = results[i].highlight;
                         for (var j = 0; j < pos.length; j++) {
                             n_hl[pos[j]] = "<em>" + n_hl[pos[j]] + "</em>";
                         }
                         n_hl = n_hl.join("");
                         var new_url = url_base.replace('__FPATH__', n);
 
                         var typeObj = {
                             dir: 'icon-directory browser-dir',
                             file: 'icon-file-text browser-file'
                         };
 
                         var typeIcon = '<i class="{0}"></i>'.format(typeObj[t]);
                         match.push('<tr class="browser-result"><td><a class="match-link" href="{0}">{1}{2}</a></td><td colspan="5"></td></tr>'.format(new_url, typeIcon, n_hl));
                     }
                 }
                 if (results.length > limit) {
                     var truncated_count = results.length - matches_max;
                     if (truncated_count === 1) {
                         match.push('<tr><td>{0} {1}</td><td colspan="5"></td></tr>'.format(truncated_count, _gettext('truncated result')));
                     } else {
                         match.push('<tr><td>{0} {1}</td><td colspan="5"></td></tr>'.format(truncated_count, _gettext('truncated results')));
                     }
                 }
             }
             if (query !== "") {
                 $('#tbody').hide();
                 $('#tbody_filtered').show();
 
                 if (match.length === 0) {
                     match.push('<tr><td>{0}</td><td colspan="5"></td></tr>'.format(_gettext('No matching files')));
                 }
                 $('#tbody_filtered').html(match.join(""));
             } else {
                 $('#tbody').show();
                 $('#tbody_filtered').hide();
             }
 
         };
     };
 
 };
 
 var getIdentNode = function(n){
   // iterate through nodes until matched interesting node
   if (typeof n === 'undefined'){
     return -1;
   }
   if(typeof n.id !== "undefined" && n.id.match('L[0-9]+')){
     return n;
   }
   else{
     return getIdentNode(n.parentNode);
   }
 };
 
 var getSelectionLink = function(e) {
   // get selection from start/to nodes
   if (typeof window.getSelection !== "undefined") {
     s = window.getSelection();
 
     from = getIdentNode(s.anchorNode);
     till = getIdentNode(s.focusNode);
 
     f_int = parseInt(from.id.replace('L',''));
     t_int = parseInt(till.id.replace('L',''));
 
     if (f_int > t_int){
       // highlight from bottom
       offset = -35;
       ranges = [t_int,f_int];
     }
     else{
       // highligth from top
       offset = 35;
       ranges = [f_int,t_int];
     }
     // if we select more than 2 lines
     if (ranges[0] !== ranges[1]){
       if($('#linktt').length === 0){
         hl_div = document.createElement('div');
         hl_div.id = 'linktt';
       }
       hl_div.innerHTML = '';
 
       anchor = '#L'+ranges[0]+'-'+ranges[1];
       var link = document.createElement('a');
       link.href = location.href.substring(0,location.href.indexOf('#'))+anchor;
       link.innerHTML = _gettext('Selection link');
       hl_div.appendChild(link);
       $('#codeblock').append(hl_div);
 
       var xy = $(till).offset();
       $('#linktt').addClass('hl-tip-box tip-box');
       $('#linktt').offset({top: xy.top + offset, left: xy.left});
       $('#linktt').css('visibility','visible');
     }
     else{
       $('#linktt').css('visibility','hidden');
     }
   }
 };
 
 var getFileState = function() {
     // relies on a global set filesUrlData
     var f_path = filesUrlData['f_path'];
     var commit_id = filesUrlData['commit_id'];
 
     var url_params = {
         repo_name: templateContext.repo_name,
         commit_id: commit_id,
         f_path:'__FPATH__'
     };
     if (atRef !== '') {
         url_params['at'] = atRef
     }
 
     var _url_base = pyroutes.url('repo_files', url_params);
     var _node_list_url = pyroutes.url('repo_files_nodelist',
             {repo_name: templateContext.repo_name,
              commit_id: commit_id, f_path: f_path});
 
     return {
         f_path: f_path,
         commit_id: commit_id,
         node_list_url: _node_list_url,
         url_base: _url_base
     };
 };
 
 var getFilesMetadata = function() {
     // relies on metadataRequest global state
     if (metadataRequest && metadataRequest.readyState != 4) {
         metadataRequest.abort();
     }
 
     if ($('#file-tree-wrapper').hasClass('full-load')) {
         // in case our HTML wrapper has full-load class we don't
         // trigger the async load of metadata
         return false;
     }
 
     var state = getFileState();
     var url_data = {
         'repo_name': templateContext.repo_name,
         'commit_id': state.commit_id,
         'f_path': state.f_path
     };
 
     var url = pyroutes.url('repo_nodetree_full', url_data);
 
     metadataRequest = $.ajax({url: url});
 
     metadataRequest.done(function(data) {
         $('#file-tree').html(data);
         timeagoActivate();
+        tooltipActivate();
     });
     metadataRequest.fail(function (data, textStatus, errorThrown) {
         if (data.status != 0) {
             alert("Error while fetching metadata.\nError code {0} ({1}).Please consider reloading the page".format(data.status,data.statusText));
         }
     });
 };
 
 // show more authors
 var showAuthors = function(elem, annotate) {
     var state = getFileState('callbacks');
 
     var url = pyroutes.url('repo_file_authors',
                 {'repo_name': templateContext.repo_name,
                  'commit_id': state.commit_id, 'f_path': state.f_path});
 
     $.pjax({
         url: url,
         data: 'annotate={0}'.format(annotate),
         container: '#file_authors',
         push: false,
         timeout: 5000
     }).complete(function(){
         $(elem).hide();
-        $('#file_authors_title').html(_gettext('All Authors'))
+        $('#file_authors_title').html(_gettext('All Authors'));
+        tooltipActivate();
     })
 };
 
 
 (function (mod) {
 
     if (typeof exports == "object" && typeof module == "object") {
         // CommonJS
         module.exports = mod();
     } else {
         // Plain browser env
         (this || window).FileEditor = mod();
     }
 
 })(function () {
     "use strict";
 
     function FileEditor(textAreaElement, options) {
         if (!(this instanceof FileEditor)) {
             return new FileEditor(textAreaElement, options);
         }
         // bind the element instance to our Form
         var te = $(textAreaElement).get(0);
         if (te !== undefined) {
             te.FileEditor = this;
         }
 
         this.modes_select = '#set_mode';
         this.filename_selector = '#filename';
         this.commit_btn_selector = '#commit_btn';
         this.line_wrap_selector = '#line_wrap';
         this.editor_preview_selector = '#editor_preview';
 
         if (te !== undefined) {
             this.cm = initCodeMirror(textAreaElement, null, false);
         }
 
         // FUNCTIONS and helpers
         var self = this;
 
         this.submitHandler = function() {
             $(self.commit_btn_selector).on('click', function(e) {
 
                 var filename = $(self.filename_selector).val();
                 if (filename === "") {
                     alert("Missing filename");
                     e.preventDefault();
                 }
 
                 var button = $(this);
                 if (button.hasClass('clicked')) {
                     button.attr('disabled', true);
                 } else {
                     button.addClass('clicked');
                 }
             });
         };
         this.submitHandler();
 
         // on select line wraps change the editor
         this.lineWrapHandler = function () {
             $(self.line_wrap_selector).on('change', function (e) {
                 var selected = e.currentTarget;
                 var line_wraps = {'on': true, 'off': false}[selected.value];
                 setCodeMirrorLineWrap(self.cm, line_wraps)
             });
         };
         this.lineWrapHandler();
 
 
         this.showPreview = function () {
 
             var _text = self.cm.getValue();
             var _file_path = $(self.filename_selector).val();
             if (_text && _file_path) {
                 $('.show-preview').addClass('active');
                 $('.show-editor').removeClass('active');
 
                 $(self.editor_preview_selector).show();
                 $(self.cm.getWrapperElement()).hide();
 
 
                 var post_data = {'text': _text, 'file_path': _file_path, 'csrf_token': CSRF_TOKEN};
                 $(self.editor_preview_selector).html(_gettext('Loading ...'));
 
                 var url = pyroutes.url('file_preview');
 
                 ajaxPOST(url, post_data, function (o) {
                     $(self.editor_preview_selector).html(o);
                 })
             }
 
         };
 
         this.showEditor = function () {
             $(self.editor_preview_selector).hide();
             $('.show-editor').addClass('active');
             $('.show-preview').removeClass('active');
 
             $(self.cm.getWrapperElement()).show();
         };
 
 
     }
 
     return FileEditor;
 });
 

rhodecode/public/js/src/rhodecode/pullrequests.js

@@ -1,551 +1,552 b''
 // # Copyright (C) 2010-2019 RhodeCode GmbH
 // #
 // # This program is free software: you can redistribute it and/or modify
 // # it under the terms of the GNU Affero General Public License, version 3
 // # (only), as published by the Free Software Foundation.
 // #
 // # This program is distributed in the hope that it will be useful,
 // # but WITHOUT ANY WARRANTY; without even the implied warranty of
 // # MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 // # GNU General Public License for more details.
 // #
 // # You should have received a copy of the GNU Affero General Public License
 // # along with this program.  If not, see <http://www.gnu.org/licenses/>.
 // #
 // # This program is dual-licensed. If you wish to learn more about the
 // # RhodeCode Enterprise Edition, including its added features, Support services,
 // # and proprietary license terms, please see https://rhodecode.com/licenses/
 
 
 var prButtonLockChecks = {
   'compare': false,
   'reviewers': false
 };
 
 /**
  * lock button until all checks and loads are made. E.g reviewer calculation
  * should prevent from submitting a PR
  * @param lockEnabled
  * @param msg
  * @param scope
  */
 var prButtonLock = function(lockEnabled, msg, scope) {
       scope = scope || 'all';
       if (scope == 'all'){
           prButtonLockChecks['compare'] = !lockEnabled;
           prButtonLockChecks['reviewers'] = !lockEnabled;
       } else if (scope == 'compare') {
           prButtonLockChecks['compare'] = !lockEnabled;
       } else if (scope == 'reviewers'){
           prButtonLockChecks['reviewers'] = !lockEnabled;
       }
       var checksMeet = prButtonLockChecks.compare && prButtonLockChecks.reviewers;
       if (lockEnabled) {
           $('#pr_submit').attr('disabled', 'disabled');
       }
       else if (checksMeet) {
           $('#pr_submit').removeAttr('disabled');
       }
 
       if (msg) {
           $('#pr_open_message').html(msg);
       }
 };
 
 
 /**
 Generate Title and Description for a PullRequest.
 In case of 1 commits, the title and description is that one commit
 in case of multiple commits, we iterate on them with max N number of commits,
 and build description in a form
 - commitN
 - commitN+1
 ...
 
 Title is then constructed from branch names, or other references,
 replacing '-' and '_' into spaces
 
 * @param sourceRef
 * @param elements
 * @param limit
 * @returns {*[]}
 */
 var getTitleAndDescription = function(sourceRef, elements, limit) {
   var title = '';
   var desc = '';
 
   $.each($(elements).get().reverse().slice(0, limit), function(idx, value) {
       var rawMessage = $(value).find('td.td-description .message').data('messageRaw');
       desc += '- ' + rawMessage.split('\n')[0].replace(/\n+$/, "") + '\n';
   });
   // only 1 commit, use commit message as title
   if (elements.length === 1) {
       title = $(elements[0]).find('td.td-description .message').data('messageRaw').split('\n')[0];
   }
   else {
       // use reference name
       title = sourceRef.replace(/-/g, ' ').replace(/_/g, ' ').capitalizeFirstLetter();
   }
 
   return [title, desc]
 };
 
 
 
 ReviewersController = function () {
     var self = this;
     this.$reviewRulesContainer = $('#review_rules');
     this.$rulesList = this.$reviewRulesContainer.find('.pr-reviewer-rules');
     this.forbidReviewUsers = undefined;
     this.$reviewMembers = $('#review_members');
     this.currentRequest = null;
 
     this.defaultForbidReviewUsers = function() {
         return [
             {'username': 'default',
              'user_id': templateContext.default_user.user_id}
         ];
     };
 
     this.hideReviewRules = function() {
         self.$reviewRulesContainer.hide();
     };
 
     this.showReviewRules = function() {
         self.$reviewRulesContainer.show();
     };
 
     this.addRule = function(ruleText) {
         self.showReviewRules();
         return '<div>- {0}</div>'.format(ruleText)
     };
 
     this.loadReviewRules = function(data) {
         // reset forbidden Users
         this.forbidReviewUsers = self.defaultForbidReviewUsers();
 
         // reset state of review rules
         self.$rulesList.html('');
 
         if (!data || data.rules === undefined || $.isEmptyObject(data.rules)) {
             // default rule, case for older repo that don't have any rules stored
             self.$rulesList.append(
                 self.addRule(
                     _gettext('All reviewers must vote.'))
             );
             return self.forbidReviewUsers
         }
 
         if (data.rules.voting !== undefined) {
             if (data.rules.voting < 0) {
                 self.$rulesList.append(
                     self.addRule(
                          _gettext('All individual reviewers must vote.'))
                 )
             } else if (data.rules.voting === 1) {
                 self.$rulesList.append(
                     self.addRule(
                         _gettext('At least {0} reviewer must vote.').format(data.rules.voting))
                 )
 
             } else {
                 self.$rulesList.append(
                     self.addRule(
                         _gettext('At least {0} reviewers must vote.').format(data.rules.voting))
                 )
             }
         }
 
         if (data.rules.voting_groups !== undefined) {
             $.each(data.rules.voting_groups, function(index, rule_data) {
                 self.$rulesList.append(
                     self.addRule(rule_data.text)
                 )
             });
         }
 
         if (data.rules.use_code_authors_for_review) {
             self.$rulesList.append(
                 self.addRule(
                     _gettext('Reviewers picked from source code changes.'))
             )
         }
         if (data.rules.forbid_adding_reviewers) {
             $('#add_reviewer_input').remove();
             self.$rulesList.append(
                 self.addRule(
                     _gettext('Adding new reviewers is forbidden.'))
             )
         }
         if (data.rules.forbid_author_to_review) {
             self.forbidReviewUsers.push(data.rules_data.pr_author);
             self.$rulesList.append(
                 self.addRule(
                     _gettext('Author is not allowed to be a reviewer.'))
             )
         }
         if (data.rules.forbid_commit_author_to_review) {
 
             if (data.rules_data.forbidden_users) {
                 $.each(data.rules_data.forbidden_users, function(index, member_data) {
                     self.forbidReviewUsers.push(member_data)
                 });
 
             }
 
             self.$rulesList.append(
                 self.addRule(
                     _gettext('Commit Authors are not allowed to be a reviewer.'))
             )
         }
 
         return self.forbidReviewUsers
     };
 
     this.loadDefaultReviewers = function(sourceRepo, sourceRef, targetRepo, targetRef) {
 
         if (self.currentRequest) {
             // make sure we cleanup old running requests before triggering this
             // again
             self.currentRequest.abort();
         }
 
         $('.calculate-reviewers').show();
         // reset reviewer members
         self.$reviewMembers.empty();
 
         prButtonLock(true, null, 'reviewers');
         $('#user').hide(); // hide user autocomplete before load
 
         if (sourceRef.length !== 3 || targetRef.length !== 3) {
             // don't load defaults in case we're missing some refs...
             $('.calculate-reviewers').hide();
             return
         }
 
         var url = pyroutes.url('repo_default_reviewers_data',
                 {
                     'repo_name': templateContext.repo_name,
                     'source_repo': sourceRepo,
                     'source_ref': sourceRef[2],
                     'target_repo': targetRepo,
                     'target_ref': targetRef[2]
                 });
 
         self.currentRequest = $.get(url)
             .done(function(data) {
                 self.currentRequest = null;
 
                 // review rules
                 self.loadReviewRules(data);
 
                 for (var i = 0; i < data.reviewers.length; i++) {
                   var reviewer = data.reviewers[i];
                   self.addReviewMember(
                       reviewer, reviewer.reasons, reviewer.mandatory);
                 }
                 $('.calculate-reviewers').hide();
                 prButtonLock(false, null, 'reviewers');
                 $('#user').show(); // show user autocomplete after load
             });
     };
 
     // check those, refactor
     this.removeReviewMember = function(reviewer_id, mark_delete) {
         var reviewer = $('#reviewer_{0}'.format(reviewer_id));
 
         if(typeof(mark_delete) === undefined){
             mark_delete = false;
         }
 
         if(mark_delete === true){
             if (reviewer){
                 // now delete the input
                 $('#reviewer_{0} input'.format(reviewer_id)).remove();
                 // mark as to-delete
                 var obj = $('#reviewer_{0}_name'.format(reviewer_id));
                 obj.addClass('to-delete');
                 obj.css({"text-decoration":"line-through", "opacity": 0.5});
             }
         }
         else{
             $('#reviewer_{0}'.format(reviewer_id)).remove();
         }
     };
     this.reviewMemberEntry = function() {
 
     };
     this.addReviewMember = function(reviewer_obj, reasons, mandatory) {
         var members = self.$reviewMembers.get(0);
         var id = reviewer_obj.user_id;
         var username = reviewer_obj.username;
 
         var reasons = reasons || [];
         var mandatory = mandatory || false;
 
         // register IDS to check if we don't have this ID already in
         var currentIds = [];
         var _els = self.$reviewMembers.find('li').toArray();
         for (el in _els){
             currentIds.push(_els[el].id)
         }
 
         var userAllowedReview = function(userId) {
             var allowed = true;
             $.each(self.forbidReviewUsers, function(index, member_data) {
                 if (parseInt(userId) === member_data['user_id']) {
                     allowed = false;
                     return false // breaks the loop
                 }
             });
             return allowed
         };
 
         var userAllowed = userAllowedReview(id);
         if (!userAllowed){
            alert(_gettext('User `{0}` not allowed to be a reviewer').format(username));
         } else {
             // only add if it's not there
             var alreadyReviewer = currentIds.indexOf('reviewer_'+id) != -1;
 
             if (alreadyReviewer) {
                 alert(_gettext('User `{0}` already in reviewers').format(username));
             } else {
                 members.innerHTML += renderTemplate('reviewMemberEntry', {
                         'member': reviewer_obj,
                         'mandatory': mandatory,
                         'allowed_to_update': true,
                         'review_status': 'not_reviewed',
                         'review_status_label': _gettext('Not Reviewed'),
                         'reasons': reasons,
                         'create': true
                         });
+                tooltipActivate();
             }
         }
 
     };
 
     this.updateReviewers = function(repo_name, pull_request_id){
         var postData = $('#reviewers input').serialize();
         _updatePullRequest(repo_name, pull_request_id, postData);
     };
 
 };
 
 
 var _updatePullRequest = function(repo_name, pull_request_id, postData) {
     var url = pyroutes.url(
         'pullrequest_update',
         {"repo_name": repo_name, "pull_request_id": pull_request_id});
     if (typeof postData === 'string' ) {
         postData += '&csrf_token=' + CSRF_TOKEN;
     } else {
         postData.csrf_token = CSRF_TOKEN;
     }
     var success = function(o) {
         window.location.reload();
     };
     ajaxPOST(url, postData, success);
 };
 
 /**
  * PULL REQUEST update commits
  */
 var updateCommits = function(repo_name, pull_request_id) {
     var postData = {
         'update_commits': true};
     _updatePullRequest(repo_name, pull_request_id, postData);
 };
 
 
 /**
  * PULL REQUEST edit info
  */
 var editPullRequest = function(repo_name, pull_request_id, title, description, renderer) {
     var url = pyroutes.url(
         'pullrequest_update',
         {"repo_name": repo_name, "pull_request_id": pull_request_id});
 
     var postData = {
         'title': title,
         'description': description,
         'description_renderer': renderer,
         'edit_pull_request': true,
         'csrf_token': CSRF_TOKEN
     };
     var success = function(o) {
         window.location.reload();
     };
     ajaxPOST(url, postData, success);
 };
 
 
 /**
  * Reviewer autocomplete
  */
 var ReviewerAutoComplete = function(inputId) {
   $(inputId).autocomplete({
     serviceUrl: pyroutes.url('user_autocomplete_data'),
     minChars:2,
     maxHeight:400,
     deferRequestBy: 300, //miliseconds
     showNoSuggestionNotice: true,
     tabDisabled: true,
     autoSelectFirst: true,
     params: { user_id: templateContext.rhodecode_user.user_id, user_groups:true, user_groups_expand:true, skip_default_user:true },
     formatResult: autocompleteFormatResult,
     lookupFilter: autocompleteFilterResult,
     onSelect: function(element, data) {
         var mandatory = false;
         var reasons = [_gettext('added manually by "{0}"').format(templateContext.rhodecode_user.username)];
 
         // add whole user groups
         if (data.value_type == 'user_group') {
             reasons.push(_gettext('member of "{0}"').format(data.value_display));
 
             $.each(data.members, function(index, member_data) {
                 var reviewer = member_data;
                 reviewer['user_id'] = member_data['id'];
                 reviewer['gravatar_link'] = member_data['icon_link'];
                 reviewer['user_link'] = member_data['profile_link'];
                 reviewer['rules'] = [];
                 reviewersController.addReviewMember(reviewer, reasons, mandatory);
             })
         }
         // add single user
         else {
             var reviewer = data;
             reviewer['user_id'] = data['id'];
             reviewer['gravatar_link'] = data['icon_link'];
             reviewer['user_link'] = data['profile_link'];
             reviewer['rules'] = [];
             reviewersController.addReviewMember(reviewer, reasons, mandatory);
         }
 
       $(inputId).val('');
     }
   });
 };
 
 
 VersionController = function () {
     var self = this;
     this.$verSource = $('input[name=ver_source]');
     this.$verTarget = $('input[name=ver_target]');
     this.$showVersionDiff = $('#show-version-diff');
 
     this.adjustRadioSelectors = function (curNode) {
         var getVal = function (item) {
             if (item == 'latest') {
                 return Number.MAX_SAFE_INTEGER
             }
             else {
                 return parseInt(item)
             }
         };
 
         var curVal = getVal($(curNode).val());
         var cleared = false;
 
         $.each(self.$verSource, function (index, value) {
             var elVal = getVal($(value).val());
 
             if (elVal > curVal) {
                 if ($(value).is(':checked')) {
                     cleared = true;
                 }
                 $(value).attr('disabled', 'disabled');
                 $(value).removeAttr('checked');
                 $(value).css({'opacity': 0.1});
             }
             else {
                 $(value).css({'opacity': 1});
                 $(value).removeAttr('disabled');
             }
         });
 
         if (cleared) {
             // if we unchecked an active, set the next one to same loc.
             $(this.$verSource).filter('[value={0}]'.format(
                 curVal)).attr('checked', 'checked');
         }
 
         self.setLockAction(false,
             $(curNode).data('verPos'),
             $(this.$verSource).filter(':checked').data('verPos')
         );
     };
 
 
     this.attachVersionListener = function () {
         self.$verTarget.change(function (e) {
             self.adjustRadioSelectors(this)
         });
         self.$verSource.change(function (e) {
             self.adjustRadioSelectors(self.$verTarget.filter(':checked'))
         });
     };
 
     this.init = function () {
 
         var curNode = self.$verTarget.filter(':checked');
         self.adjustRadioSelectors(curNode);
         self.setLockAction(true);
         self.attachVersionListener();
 
     };
 
     this.setLockAction = function (state, selectedVersion, otherVersion) {
         var $showVersionDiff = this.$showVersionDiff;
 
         if (state) {
             $showVersionDiff.attr('disabled', 'disabled');
             $showVersionDiff.addClass('disabled');
             $showVersionDiff.html($showVersionDiff.data('labelTextLocked'));
         }
         else {
             $showVersionDiff.removeAttr('disabled');
             $showVersionDiff.removeClass('disabled');
 
             if (selectedVersion == otherVersion) {
                 $showVersionDiff.html($showVersionDiff.data('labelTextShow'));
             } else {
                 $showVersionDiff.html($showVersionDiff.data('labelTextDiff'));
             }
         }
 
     };
 
     this.showVersionDiff = function () {
         var target = self.$verTarget.filter(':checked');
         var source = self.$verSource.filter(':checked');
 
         if (target.val() && source.val()) {
             var params = {
                 'pull_request_id': templateContext.pull_request_data.pull_request_id,
                 'repo_name': templateContext.repo_name,
                 'version': target.val(),
                 'from_version': source.val()
             };
             window.location = pyroutes.url('pullrequest_show', params)
         }
 
         return false;
     };
 
     this.toggleVersionView = function (elem) {
 
         if (this.$showVersionDiff.is(':visible')) {
             $('.version-pr').hide();
             this.$showVersionDiff.hide();
             $(elem).html($(elem).data('toggleOn'))
         } else {
             $('.version-pr').show();
             this.$showVersionDiff.show();
             $(elem).html($(elem).data('toggleOff'))
         }
 
         return false
     }
 
 };
  No newline at end of file

rhodecode/public/js/src/rhodecode/tooltips.js

@@ -1,94 +1,4283 b''
-// # Copyright (C) 2010-2019 RhodeCode GmbH
-// #
-// # This program is free software: you can redistribute it and/or modify
-// # it under the terms of the GNU Affero General Public License, version 3
-// # (only), as published by the Free Software Foundation.
-// #
-// # This program is distributed in the hope that it will be useful,
-// # but WITHOUT ANY WARRANTY; without even the implied warranty of
-// # MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
-// # GNU General Public License for more details.
-// #
-// # You should have received a copy of the GNU Affero General Public License
-// # along with this program.  If not, see <http://www.gnu.org/licenses/>.
-// #
-// # This program is dual-licensed. If you wish to learn more about the
-// # RhodeCode Enterprise Edition, including its added features, Support services,
-// # and proprietary license terms, please see https://rhodecode.com/licenses/
+/**
+ * tooltipster http://iamceege.github.io/tooltipster/
+ * A rockin' custom tooltip jQuery plugin
+ * Developed by Caleb Jacob and Louis Ameline
+ * MIT license
+ */
+(function (root, factory) {
+  if (typeof define === 'function' && define.amd) {
+    // AMD. Register as an anonymous module unless amdModuleId is set
+    define(["jquery"], function (a0) {
+      return (factory(a0));
+    });
+  } else if (typeof exports === 'object') {
+    // Node. Does not work with strict CommonJS, but
+    // only CommonJS-like environments that support module.exports,
+    // like Node.
+    module.exports = factory(require("jquery"));
+  } else {
+    factory(jQuery);
+  }
+}(this, function ($) {
+
+// This file will be UMDified by a build task.
+
+var defaults = {
+		animation: 'fade',
+		animationDuration: 350,
+		content: null,
+		contentAsHTML: false,
+		contentCloning: false,
+		debug: true,
+		delay: 300,
+		delayTouch: [300, 500],
+		functionInit: null,
+		functionBefore: null,
+		functionReady: null,
+		functionAfter: null,
+		functionFormat: null,
+		IEmin: 6,
+		interactive: false,
+		multiple: false,
+		// will default to document.body, or must be an element positioned at (0, 0)
+		// in the document, typically like the very top views of an app.
+		parent: null,
+		plugins: ['sideTip'],
+		repositionOnScroll: false,
+		restoration: 'none',
+		selfDestruction: true,
+		theme: [],
+		timer: 0,
+		trackerInterval: 500,
+		trackOrigin: false,
+		trackTooltip: false,
+		trigger: 'hover',
+		triggerClose: {
+			click: false,
+			mouseleave: false,
+			originClick: false,
+			scroll: false,
+			tap: false,
+			touchleave: false
+		},
+		triggerOpen: {
+			click: false,
+			mouseenter: false,
+			tap: false,
+			touchstart: false
+		},
+		updateAnimation: 'rotate',
+		zIndex: 9999999
+	},
+	// we'll avoid using the 'window' global as a good practice but npm's
+	// jquery@<2.1.0 package actually requires a 'window' global, so not sure
+	// it's useful at all
+	win = (typeof window != 'undefined') ? window : null,
+	// env will be proxied by the core for plugins to have access its properties
+	env = {
+		// detect if this device can trigger touch events. Better have a false
+		// positive (unused listeners, that's ok) than a false negative.
+		// https://github.com/Modernizr/Modernizr/blob/master/feature-detects/touchevents.js
+		// http://stackoverflow.com/questions/4817029/whats-the-best-way-to-detect-a-touch-screen-device-using-javascript
+		hasTouchCapability: !!(
+			win
+			&&	(	'ontouchstart' in win
+				||	(win.DocumentTouch && win.document instanceof win.DocumentTouch)
+				||	win.navigator.maxTouchPoints
+			)
+		),
+		hasTransitions: transitionSupport(),
+		IE: false,
+		// don't set manually, it will be updated by a build task after the manifest
+		semVer: '4.2.7',
+		window: win
+	},
+	core = function() {
+
+		// core variables
+
+		// the core emitters
+		this.__$emitterPrivate = $({});
+		this.__$emitterPublic = $({});
+		this.__instancesLatestArr = [];
+		// collects plugin constructors
+		this.__plugins = {};
+		// proxy env variables for plugins who might use them
+		this._env = env;
+	};
+
+// core methods
+core.prototype = {
+
+	/**
+	 * A function to proxy the public methods of an object onto another
+	 *
+	 * @param {object} constructor The constructor to bridge
+	 * @param {object} obj The object that will get new methods (an instance or the core)
+	 * @param {string} pluginName A plugin name for the console log message
+	 * @return {core}
+	 * @private
+	 */
+	__bridge: function(constructor, obj, pluginName) {
+
+		// if it's not already bridged
+		if (!obj[pluginName]) {
+
+			var fn = function() {};
+			fn.prototype = constructor;
+
+			var pluginInstance = new fn();
+
+			// the _init method has to exist in instance constructors but might be missing
+			// in core constructors
+			if (pluginInstance.__init) {
+				pluginInstance.__init(obj);
+			}
+
+			$.each(constructor, function(methodName, fn) {
+
+				// don't proxy "private" methods, only "protected" and public ones
+				if (methodName.indexOf('__') != 0) {
+
+					// if the method does not exist yet
+					if (!obj[methodName]) {
+
+						obj[methodName] = function() {
+							return pluginInstance[methodName].apply(pluginInstance, Array.prototype.slice.apply(arguments));
+						};
+
+						// remember to which plugin this method corresponds (several plugins may
+						// have methods of the same name, we need to be sure)
+						obj[methodName].bridged = pluginInstance;
+					}
+					else if (defaults.debug) {
+
+						console.log('The '+ methodName +' method of the '+ pluginName
+							+' plugin conflicts with another plugin or native methods');
+					}
+				}
+			});
+
+			obj[pluginName] = pluginInstance;
+		}
+
+		return this;
+	},
+
+	/**
+	 * For mockup in Node env if need be, for testing purposes
+	 *
+	 * @return {core}
+	 * @private
+	 */
+	__setWindow: function(window) {
+		env.window = window;
+		return this;
+	},
+
+	/**
+	 * Returns a ruler, a tool to help measure the size of a tooltip under
+	 * various settings. Meant for plugins
+	 *
+	 * @see Ruler
+	 * @return {object} A Ruler instance
+	 * @protected
+	 */
+	_getRuler: function($tooltip) {
+		return new Ruler($tooltip);
+	},
+
+	/**
+	 * For internal use by plugins, if needed
+	 *
+	 * @return {core}
+	 * @protected
+	 */
+	_off: function() {
+		this.__$emitterPrivate.off.apply(this.__$emitterPrivate, Array.prototype.slice.apply(arguments));
+		return this;
+	},
+
+	/**
+	 * For internal use by plugins, if needed
+	 *
+	 * @return {core}
+	 * @protected
+	 */
+	_on: function() {
+		this.__$emitterPrivate.on.apply(this.__$emitterPrivate, Array.prototype.slice.apply(arguments));
+		return this;
+	},
+
+	/**
+	 * For internal use by plugins, if needed
+	 *
+	 * @return {core}
+	 * @protected
+	 */
+	_one: function() {
+		this.__$emitterPrivate.one.apply(this.__$emitterPrivate, Array.prototype.slice.apply(arguments));
+		return this;
+	},
+
+	/**
+	 * Returns (getter) or adds (setter) a plugin
+	 *
+	 * @param {string|object} plugin Provide a string (in the full form
+	 * "namespace.name") to use as as getter, an object to use as a setter
+	 * @return {object|core}
+	 * @protected
+	 */
+	_plugin: function(plugin) {
+
+		var self = this;
+
+		// getter
+		if (typeof plugin == 'string') {
+
+			var pluginName = plugin,
+				p = null;
+
+			// if the namespace is provided, it's easy to search
+			if (pluginName.indexOf('.') > 0) {
+				p = self.__plugins[pluginName];
+			}
+			// otherwise, return the first name that matches
+			else {
+				$.each(self.__plugins, function(i, plugin) {
+
+					if (plugin.name.substring(plugin.name.length - pluginName.length - 1) == '.'+ pluginName) {
+						p = plugin;
+						return false;
+					}
+				});
+			}
+
+			return p;
+		}
+		// setter
+		else {
+
+			// force namespaces
+			if (plugin.name.indexOf('.') < 0) {
+				throw new Error('Plugins must be namespaced');
+			}
+
+			self.__plugins[plugin.name] = plugin;
+
+			// if the plugin has core features
+			if (plugin.core) {
+
+				// bridge non-private methods onto the core to allow new core methods
+				self.__bridge(plugin.core, self, plugin.name);
+			}
+
+			return this;
+		}
+	},
+
+	/**
+	 * Trigger events on the core emitters
+	 *
+	 * @returns {core}
+	 * @protected
+	 */
+	_trigger: function() {
+
+		var args = Array.prototype.slice.apply(arguments);
+
+		if (typeof args[0] == 'string') {
+			args[0] = { type: args[0] };
+		}
+
+		// note: the order of emitters matters
+		this.__$emitterPrivate.trigger.apply(this.__$emitterPrivate, args);
+		this.__$emitterPublic.trigger.apply(this.__$emitterPublic, args);
+
+		return this;
+	},
+
+	/**
+	 * Returns instances of all tooltips in the page or an a given element
+	 *
+	 * @param {string|HTML object collection} selector optional Use this
+	 * parameter to restrict the set of objects that will be inspected
+	 * for the retrieval of instances. By default, all instances in the
+	 * page are returned.
+	 * @return {array} An array of instance objects
+	 * @public
+	 */
+	instances: function(selector) {
+
+		var instances = [],
+			sel = selector || '.tooltipstered';
+
+		$(sel).each(function() {
+
+			var $this = $(this),
+				ns = $this.data('tooltipster-ns');
+
+			if (ns) {
+
+				$.each(ns, function(i, namespace) {
+					instances.push($this.data(namespace));
+				});
+			}
+		});
+
+		return instances;
+	},
+
+	/**
+	 * Returns the Tooltipster objects generated by the last initializing call
+	 *
+	 * @return {array} An array of instance objects
+	 * @public
+	 */
+	instancesLatest: function() {
+		return this.__instancesLatestArr;
+	},
+
+	/**
+	 * For public use only, not to be used by plugins (use ::_off() instead)
+	 *
+	 * @return {core}
+	 * @public
+	 */
+	off: function() {
+		this.__$emitterPublic.off.apply(this.__$emitterPublic, Array.prototype.slice.apply(arguments));
+		return this;
+	},
+
+	/**
+	 * For public use only, not to be used by plugins (use ::_on() instead)
+	 *
+	 * @return {core}
+	 * @public
+	 */
+	on: function() {
+		this.__$emitterPublic.on.apply(this.__$emitterPublic, Array.prototype.slice.apply(arguments));
+		return this;
+	},
+
+	/**
+	 * For public use only, not to be used by plugins (use ::_one() instead)
+	 *
+	 * @return {core}
+	 * @public
+	 */
+	one: function() {
+		this.__$emitterPublic.one.apply(this.__$emitterPublic, Array.prototype.slice.apply(arguments));
+		return this;
+	},
+
+	/**
+	 * Returns all HTML elements which have one or more tooltips
+	 *
+	 * @param {string} selector optional Use this to restrict the results
+	 * to the descendants of an element
+	 * @return {array} An array of HTML elements
+	 * @public
+	 */
+	origins: function(selector) {
+
+		var sel = selector ?
+			selector +' ' :
+			'';
+
+		return $(sel +'.tooltipstered').toArray();
+	},
+
+	/**
+	 * Change default options for all future instances
+	 *
+	 * @param {object} d The options that should be made defaults
+	 * @return {core}
+	 * @public
+	 */
+	setDefaults: function(d) {
+		$.extend(defaults, d);
+		return this;
+	},
+
+	/**
+	 * For users to trigger their handlers on the public emitter
+	 *
+	 * @returns {core}
+	 * @public
+	 */
+	triggerHandler: function() {
+		this.__$emitterPublic.triggerHandler.apply(this.__$emitterPublic, Array.prototype.slice.apply(arguments));
+		return this;
+	}
+};
+
+// $.tooltipster will be used to call core methods
+$.tooltipster = new core();
+
+// the Tooltipster instance class (mind the capital T)
+$.Tooltipster = function(element, options) {
+
+	// list of instance variables
+
+	// stack of custom callbacks provided as parameters to API methods
+	this.__callbacks = {
+		close: [],
+		open: []
+	};
+	// the schedule time of DOM removal
+	this.__closingTime;
+	// this will be the user content shown in the tooltip. A capital "C" is used
+	// because there is also a method called content()
+	this.__Content;
+	// for the size tracker
+	this.__contentBcr;
+	// to disable the tooltip after destruction
+	this.__destroyed = false;
+	// we can't emit directly on the instance because if a method with the same
+	// name as the event exists, it will be called by jQuery. Se we use a plain
+	// object as emitter. This emitter is for internal use by plugins,
+	// if needed.
+	this.__$emitterPrivate = $({});
+	// this emitter is for the user to listen to events without risking to mess
+	// with our internal listeners
+	this.__$emitterPublic = $({});
+	this.__enabled = true;
+	// the reference to the gc interval
+	this.__garbageCollector;
+	// various position and size data recomputed before each repositioning
+	this.__Geometry;
+	// the tooltip position, saved after each repositioning by a plugin
+	this.__lastPosition;
+	// a unique namespace per instance
+	this.__namespace = 'tooltipster-'+ Math.round(Math.random()*1000000);
+	this.__options;
+	// will be used to support origins in scrollable areas
+	this.__$originParents;
+	this.__pointerIsOverOrigin = false;
+	// to remove themes if needed
+	this.__previousThemes = [];
+	// the state can be either: appearing, stable, disappearing, closed
+	this.__state = 'closed';
+	// timeout references
+	this.__timeouts = {
+		close: [],
+		open: null
+	};
+	// store touch events to be able to detect emulated mouse events
+	this.__touchEvents = [];
+	// the reference to the tracker interval
+	this.__tracker = null;
+	// the element to which this tooltip is associated
+	this._$origin;
+	// this will be the tooltip element (jQuery wrapped HTML element).
+	// It's the job of a plugin to create it and append it to the DOM
+	this._$tooltip;
+
+	// launch
+	this.__init(element, options);
+};
+
+$.Tooltipster.prototype = {
+
+	/**
+	 * @param origin
+	 * @param options
+	 * @private
+	 */
+	__init: function(origin, options) {
+
+		var self = this;
+
+		self._$origin = $(origin);
+		self.__options = $.extend(true, {}, defaults, options);
+
+		// some options may need to be reformatted
+		self.__optionsFormat();
+
+		// don't run on old IE if asked no to
+		if (	!env.IE
+			||	env.IE >= self.__options.IEmin
+		) {
+
+			// note: the content is null (empty) by default and can stay that
+			// way if the plugin remains initialized but not fed any content. The
+			// tooltip will just not appear.
+
+			// let's save the initial value of the title attribute for later
+			// restoration if need be.
+			var initialTitle = null;
+
+			// it will already have been saved in case of multiple tooltips
+			if (self._$origin.data('tooltipster-initialTitle') === undefined) {
+
+				initialTitle = self._$origin.attr('title');
+
+				// we do not want initialTitle to be "undefined" because
+				// of how jQuery's .data() method works
+				if (initialTitle === undefined) initialTitle = null;
+
+				self._$origin.data('tooltipster-initialTitle', initialTitle);
+			}
+
+			// If content is provided in the options, it has precedence over the
+			// title attribute.
+			// Note: an empty string is considered content, only 'null' represents
+			// the absence of content.
+			// Also, an existing title="" attribute will result in an empty string
+			// content
+			if (self.__options.content !== null) {
+				self.__contentSet(self.__options.content);
+			}
+			else {
+
+				var selector = self._$origin.attr('data-tooltip-content'),
+					$el;
+
+				if (selector){
+					$el = $(selector);
+				}
+
+				if ($el && $el[0]) {
+					self.__contentSet($el.first());
+				}
+				else {
+					self.__contentSet(initialTitle);
+				}
+			}
+
+			self._$origin
+				// strip the title off of the element to prevent the default tooltips
+				// from popping up
+				.removeAttr('title')
+				// to be able to find all instances on the page later (upon window
+				// events in particular)
+				.addClass('tooltipstered');
+
+			// set listeners on the origin
+			self.__prepareOrigin();
+
+			// set the garbage collector
+			self.__prepareGC();
+
+			// init plugins
+			$.each(self.__options.plugins, function(i, pluginName) {
+				self._plug(pluginName);
+			});
+
+			// to detect swiping
+			if (env.hasTouchCapability) {
+				$(env.window.document.body).on('touchmove.'+ self.__namespace +'-triggerOpen', function(event) {
+					self._touchRecordEvent(event);
+				});
+			}
+
+			self
+				// prepare the tooltip when it gets created. This event must
+				// be fired by a plugin
+				._on('created', function() {
+					self.__prepareTooltip();
+				})
+				// save position information when it's sent by a plugin
+				._on('repositioned', function(e) {
+					self.__lastPosition = e.position;
+				});
+		}
+		else {
+			self.__options.disabled = true;
+		}
+	},
+
+	/**
+	 * Insert the content into the appropriate HTML element of the tooltip
+	 *
+	 * @returns {self}
+	 * @private
+	 */
+	__contentInsert: function() {
+
+		var self = this,
+			$el = self._$tooltip.find('.tooltipster-content'),
+			formattedContent = self.__Content,
+			format = function(content) {
+				formattedContent = content;
+			};
+
+		self._trigger({
+			type: 'format',
+			content: self.__Content,
+			format: format
+		});
+
+		if (self.__options.functionFormat) {
+
+			formattedContent = self.__options.functionFormat.call(
+				self,
+				self,
+				{ origin: self._$origin[0] },
+				self.__Content
+			);
+		}
+
+		if (typeof formattedContent === 'string' && !self.__options.contentAsHTML) {
+			$el.text(formattedContent);
+		}
+		else {
+			$el
+				.empty()
+				.append(formattedContent);
+		}
+
+		return self;
+	},
+
+	/**
+	 * Save the content, cloning it beforehand if need be
+	 *
+	 * @param content
+	 * @returns {self}
+	 * @private
+	 */
+	__contentSet: function(content) {
+
+		// clone if asked. Cloning the object makes sure that each instance has its
+		// own version of the content (in case a same object were provided for several
+		// instances)
+		// reminder: typeof null === object
+		if (content instanceof $ && this.__options.contentCloning) {
+			content = content.clone(true);
+		}
+
+		this.__Content = content;
+
+		this._trigger({
+			type: 'updated',
+			content: content
+		});
+
+		return this;
+	},
+
+	/**
+	 * Error message about a method call made after destruction
+	 *
+	 * @private
+	 */
+	__destroyError: function() {
+		throw new Error('This tooltip has been destroyed and cannot execute your method call.');
+	},
+
+	/**
+	 * Gather all information about dimensions and available space,
+	 * called before every repositioning
+	 *
+	 * @private
+	 * @returns {object}
+	 */
+	__geometry: function() {
+
+		var	self = this,
+			$target = self._$origin,
+			originIsArea = self._$origin.is('area');
+
+		// if this._$origin is a map area, the target we'll need
+		// the dimensions of is actually the image using the map,
+		// not the area itself
+		if (originIsArea) {
+
+			var mapName = self._$origin.parent().attr('name');
+
+			$target = $('img[usemap="#'+ mapName +'"]');
+		}
+
+		var bcr = $target[0].getBoundingClientRect(),
+			$document = $(env.window.document),
+			$window = $(env.window),
+			$parent = $target,
+			// some useful properties of important elements
+			geo = {
+				// available space for the tooltip, see down below
+				available: {
+					document: null,
+					window: null
+				},
+				document: {
+					size: {
+						height: $document.height(),
+						width: $document.width()
+					}
+				},
+				window: {
+					scroll: {
+						// the second ones are for IE compatibility
+						left: env.window.scrollX || env.window.document.documentElement.scrollLeft,
+						top: env.window.scrollY || env.window.document.documentElement.scrollTop
+					},
+					size: {
+						height: $window.height(),
+						width: $window.width()
+					}
+				},
+				origin: {
+					// the origin has a fixed lineage if itself or one of its
+					// ancestors has a fixed position
+					fixedLineage: false,
+					// relative to the document
+					offset: {},
+					size: {
+						height: bcr.bottom - bcr.top,
+						width: bcr.right - bcr.left
+					},
+					usemapImage: originIsArea ? $target[0] : null,
+					// relative to the window
+					windowOffset: {
+						bottom: bcr.bottom,
+						left: bcr.left,
+						right: bcr.right,
+						top: bcr.top
+					}
+				}
+			},
+			geoFixed = false;
+
+		// if the element is a map area, some properties may need
+		// to be recalculated
+		if (originIsArea) {
+
+			var shape = self._$origin.attr('shape'),
+				coords = self._$origin.attr('coords');
+
+			if (coords) {
+
+				coords = coords.split(',');
+
+				$.map(coords, function(val, i) {
+					coords[i] = parseInt(val);
+				});
+			}
+
+			// if the image itself is the area, nothing more to do
+			if (shape != 'default') {
+
+				switch(shape) {
+
+					case 'circle':
+
+						var circleCenterLeft = coords[0],
+							circleCenterTop = coords[1],
+							circleRadius = coords[2],
+							areaTopOffset = circleCenterTop - circleRadius,
+							areaLeftOffset = circleCenterLeft - circleRadius;
+
+						geo.origin.size.height = circleRadius * 2;
+						geo.origin.size.width = geo.origin.size.height;
+
+						geo.origin.windowOffset.left += areaLeftOffset;
+						geo.origin.windowOffset.top += areaTopOffset;
+
+						break;
+
+					case 'rect':
+
+						var areaLeft = coords[0],
+							areaTop = coords[1],
+							areaRight = coords[2],
+							areaBottom = coords[3];
+
+						geo.origin.size.height = areaBottom - areaTop;
+						geo.origin.size.width = areaRight - areaLeft;
+
+						geo.origin.windowOffset.left += areaLeft;
+						geo.origin.windowOffset.top += areaTop;
+
+						break;
+
+					case 'poly':
+
+						var areaSmallestX = 0,
+							areaSmallestY = 0,
+							areaGreatestX = 0,
+							areaGreatestY = 0,
+							arrayAlternate = 'even';
+
+						for (var i = 0; i < coords.length; i++) {
+
+							var areaNumber = coords[i];
+
+							if (arrayAlternate == 'even') {
+
+								if (areaNumber > areaGreatestX) {
+
+									areaGreatestX = areaNumber;
+
+									if (i === 0) {
+										areaSmallestX = areaGreatestX;
+									}
+								}
+
+								if (areaNumber < areaSmallestX) {
+									areaSmallestX = areaNumber;
+								}
+
+								arrayAlternate = 'odd';
+							}
+							else {
+								if (areaNumber > areaGreatestY) {
+
+									areaGreatestY = areaNumber;
+
+									if (i == 1) {
+										areaSmallestY = areaGreatestY;
+									}
+								}
+
+								if (areaNumber < areaSmallestY) {
+									areaSmallestY = areaNumber;
+								}
+
+								arrayAlternate = 'even';
+							}
+						}
+
+						geo.origin.size.height = areaGreatestY - areaSmallestY;
+						geo.origin.size.width = areaGreatestX - areaSmallestX;
+
+						geo.origin.windowOffset.left += areaSmallestX;
+						geo.origin.windowOffset.top += areaSmallestY;
+
+						break;
+				}
+			}
+		}
+
+		// user callback through an event
+		var edit = function(r) {
+			geo.origin.size.height = r.height,
+				geo.origin.windowOffset.left = r.left,
+				geo.origin.windowOffset.top = r.top,
+				geo.origin.size.width = r.width
+		};
+
+		self._trigger({
+			type: 'geometry',
+			edit: edit,
+			geometry: {
+				height: geo.origin.size.height,
+				left: geo.origin.windowOffset.left,
+				top: geo.origin.windowOffset.top,
+				width: geo.origin.size.width
+			}
+		});
+
+		// calculate the remaining properties with what we got
+
+		geo.origin.windowOffset.right = geo.origin.windowOffset.left + geo.origin.size.width;
+		geo.origin.windowOffset.bottom = geo.origin.windowOffset.top + geo.origin.size.height;
+
+		geo.origin.offset.left = geo.origin.windowOffset.left + geo.window.scroll.left;
+		geo.origin.offset.top = geo.origin.windowOffset.top + geo.window.scroll.top;
+		geo.origin.offset.bottom = geo.origin.offset.top + geo.origin.size.height;
+		geo.origin.offset.right = geo.origin.offset.left + geo.origin.size.width;
+
+		// the space that is available to display the tooltip relatively to the document
+		geo.available.document = {
+			bottom: {
+				height: geo.document.size.height - geo.origin.offset.bottom,
+				width: geo.document.size.width
+			},
+			left: {
+				height: geo.document.size.height,
+				width: geo.origin.offset.left
+			},
+			right: {
+				height: geo.document.size.height,
+				width: geo.document.size.width - geo.origin.offset.right
+			},
+			top: {
+				height: geo.origin.offset.top,
+				width: geo.document.size.width
+			}
+		};
+
+		// the space that is available to display the tooltip relatively to the viewport
+		// (the resulting values may be negative if the origin overflows the viewport)
+		geo.available.window = {
+			bottom: {
+				// the inner max is here to make sure the available height is no bigger
+				// than the viewport height (when the origin is off screen at the top).
+				// The outer max just makes sure that the height is not negative (when
+				// the origin overflows at the bottom).
+				height: Math.max(geo.window.size.height - Math.max(geo.origin.windowOffset.bottom, 0), 0),
+				width: geo.window.size.width
+			},
+			left: {
+				height: geo.window.size.height,
+				width: Math.max(geo.origin.windowOffset.left, 0)
+			},
+			right: {
+				height: geo.window.size.height,
+				width: Math.max(geo.window.size.width - Math.max(geo.origin.windowOffset.right, 0), 0)
+			},
+			top: {
+				height: Math.max(geo.origin.windowOffset.top, 0),
+				width: geo.window.size.width
+			}
+		};
+
+		while ($parent[0].tagName.toLowerCase() != 'html') {
+
+			if ($parent.css('position') == 'fixed') {
+				geo.origin.fixedLineage = true;
+				break;
+			}
+
+			$parent = $parent.parent();
+		}
+
+		return geo;
+	},
+
+	/**
+	 * Some options may need to be formated before being used
+	 *
+	 * @returns {self}
+	 * @private
+	 */
+	__optionsFormat: function() {
+
+		if (typeof this.__options.animationDuration == 'number') {
+			this.__options.animationDuration = [this.__options.animationDuration, this.__options.animationDuration];
+		}
+
+		if (typeof this.__options.delay == 'number') {
+			this.__options.delay = [this.__options.delay, this.__options.delay];
+		}
+
+		if (typeof this.__options.delayTouch == 'number') {
+			this.__options.delayTouch = [this.__options.delayTouch, this.__options.delayTouch];
+		}
+
+		if (typeof this.__options.theme == 'string') {
+			this.__options.theme = [this.__options.theme];
+		}
+
+		// determine the future parent
+		if (this.__options.parent === null) {
+			this.__options.parent = $(env.window.document.body);
+		}
+		else if (typeof this.__options.parent == 'string') {
+			this.__options.parent = $(this.__options.parent);
+		}
+
+		if (this.__options.trigger == 'hover') {
+
+			this.__options.triggerOpen = {
+				mouseenter: true,
+				touchstart: true
+			};
+
+			this.__options.triggerClose = {
+				mouseleave: true,
+				originClick: true,
+				touchleave: true
+			};
+		}
+		else if (this.__options.trigger == 'click') {
+
+			this.__options.triggerOpen = {
+				click: true,
+				tap: true
+			};
+
+			this.__options.triggerClose = {
+				click: true,
+				tap: true
+			};
+		}
+
+		// for the plugins
+		this._trigger('options');
+
+		return this;
+	},
+
+	/**
+	 * Schedules or cancels the garbage collector task
+	 *
+	 * @returns {self}
+	 * @private
+	 */
+	__prepareGC: function() {
+
+		var self = this;
+
+		// in case the selfDestruction option has been changed by a method call
+		if (self.__options.selfDestruction) {
+
+			// the GC task
+			self.__garbageCollector = setInterval(function() {
+
+				var now = new Date().getTime();
+
+				// forget the old events
+				self.__touchEvents = $.grep(self.__touchEvents, function(event, i) {
+					// 1 minute
+					return now - event.time > 60000;
+				});
+
+				// auto-destruct if the origin is gone
+				if (!bodyContains(self._$origin)) {
+
+					self.close(function(){
+						self.destroy();
+					});
+				}
+			}, 20000);
+		}
+		else {
+			clearInterval(self.__garbageCollector);
+		}
+
+		return self;
+	},
+
+	/**
+	 * Sets listeners on the origin if the open triggers require them.
+	 * Unlike the listeners set at opening time, these ones
+	 * remain even when the tooltip is closed. It has been made a
+	 * separate method so it can be called when the triggers are
+	 * changed in the options. Closing is handled in _open()
+	 * because of the bindings that may be needed on the tooltip
+	 * itself
+	 *
+	 * @returns {self}
+	 * @private
+	 */
+	__prepareOrigin: function() {
+
+		var self = this;
+
+		// in case we're resetting the triggers
+		self._$origin.off('.'+ self.__namespace +'-triggerOpen');
+
+		// if the device is touch capable, even if only mouse triggers
+		// are asked, we need to listen to touch events to know if the mouse
+		// events are actually emulated (so we can ignore them)
+		if (env.hasTouchCapability) {
+
+			self._$origin.on(
+				'touchstart.'+ self.__namespace +'-triggerOpen ' +
+				'touchend.'+ self.__namespace +'-triggerOpen ' +
+				'touchcancel.'+ self.__namespace +'-triggerOpen',
+				function(event){
+					self._touchRecordEvent(event);
+				}
+			);
+		}
+
+		// mouse click and touch tap work the same way
+		if (	self.__options.triggerOpen.click
+			||	(self.__options.triggerOpen.tap && env.hasTouchCapability)
+		) {
+
+			var eventNames = '';
+			if (self.__options.triggerOpen.click) {
+				eventNames += 'click.'+ self.__namespace +'-triggerOpen ';
+			}
+			if (self.__options.triggerOpen.tap && env.hasTouchCapability) {
+				eventNames += 'touchend.'+ self.__namespace +'-triggerOpen';
+			}
+
+			self._$origin.on(eventNames, function(event) {
+				if (self._touchIsMeaningfulEvent(event)) {
+					self._open(event);
+				}
+			});
+		}
+
+		// mouseenter and touch start work the same way
+		if (	self.__options.triggerOpen.mouseenter
+			||	(self.__options.triggerOpen.touchstart && env.hasTouchCapability)
+		) {
+
+			var eventNames = '';
+			if (self.__options.triggerOpen.mouseenter) {
+				eventNames += 'mouseenter.'+ self.__namespace +'-triggerOpen ';
+			}
+			if (self.__options.triggerOpen.touchstart && env.hasTouchCapability) {
+				eventNames += 'touchstart.'+ self.__namespace +'-triggerOpen';
+			}
+
+			self._$origin.on(eventNames, function(event) {
+				if (	self._touchIsTouchEvent(event)
+					||	!self._touchIsEmulatedEvent(event)
+				) {
+					self.__pointerIsOverOrigin = true;
+					self._openShortly(event);
+				}
+			});
+		}
+
+		// info for the mouseleave/touchleave close triggers when they use a delay
+		if (	self.__options.triggerClose.mouseleave
+			||	(self.__options.triggerClose.touchleave && env.hasTouchCapability)
+		) {
+
+			var eventNames = '';
+			if (self.__options.triggerClose.mouseleave) {
+				eventNames += 'mouseleave.'+ self.__namespace +'-triggerOpen ';
+			}
+			if (self.__options.triggerClose.touchleave && env.hasTouchCapability) {
+				eventNames += 'touchend.'+ self.__namespace +'-triggerOpen touchcancel.'+ self.__namespace +'-triggerOpen';
+			}
+
+			self._$origin.on(eventNames, function(event) {
+
+				if (self._touchIsMeaningfulEvent(event)) {
+					self.__pointerIsOverOrigin = false;
+				}
+			});
+		}
+
+		return self;
+	},
+
+	/**
+	 * Do the things that need to be done only once after the tooltip
+	 * HTML element it has been created. It has been made a separate
+	 * method so it can be called when options are changed. Remember
+	 * that the tooltip may actually exist in the DOM before it is
+	 * opened, and present after it has been closed: it's the display
+	 * plugin that takes care of handling it.
+	 *
+	 * @returns {self}
+	 * @private
+	 */
+	__prepareTooltip: function() {
+
+		var self = this,
+			p = self.__options.interactive ? 'auto' : '';
+
+		// this will be useful to know quickly if the tooltip is in
+		// the DOM or not
+		self._$tooltip
+			.attr('id', self.__namespace)
+			.css({
+				// pointer events
+				'pointer-events': p,
+				zIndex: self.__options.zIndex
+			});
+
+		// themes
+		// remove the old ones and add the new ones
+		$.each(self.__previousThemes, function(i, theme) {
+			self._$tooltip.removeClass(theme);
+		});
+		$.each(self.__options.theme, function(i, theme) {
+			self._$tooltip.addClass(theme);
+		});
+
+		self.__previousThemes = $.merge([], self.__options.theme);
+
+		return self;
+	},
+
+	/**
+	 * Handles the scroll on any of the parents of the origin (when the
+	 * tooltip is open)
+	 *
+	 * @param {object} event
+	 * @returns {self}
+	 * @private
+	 */
+	__scrollHandler: function(event) {
+
+		var self = this;
+
+		if (self.__options.triggerClose.scroll) {
+			self._close(event);
+		}
+		else {
+
+			// if the origin or tooltip have been removed: do nothing, the tracker will
+			// take care of it later
+			if (bodyContains(self._$origin) && bodyContains(self._$tooltip)) {
+
+				var geo = null;
+
+				// if the scroll happened on the window
+				if (event.target === env.window.document) {
+
+					// if the origin has a fixed lineage, window scroll will have no
+					// effect on its position nor on the position of the tooltip
+					if (!self.__Geometry.origin.fixedLineage) {
+
+						// we don't need to do anything unless repositionOnScroll is true
+						// because the tooltip will already have moved with the window
+						// (and of course with the origin)
+						if (self.__options.repositionOnScroll) {
+							self.reposition(event);
+						}
+					}
+				}
+				// if the scroll happened on another parent of the tooltip, it means
+				// that it's in a scrollable area and now needs to have its position
+				// adjusted or recomputed, depending ont the repositionOnScroll
+				// option. Also, if the origin is partly hidden due to a parent that
+				// hides its overflow, we'll just hide (not close) the tooltip.
+				else {
+
+					geo = self.__geometry();
+
+					var overflows = false;
+
+					// a fixed position origin is not affected by the overflow hiding
+					// of a parent
+					if (self._$origin.css('position') != 'fixed') {
+
+						self.__$originParents.each(function(i, el) {
+
+							var $el = $(el),
+								overflowX = $el.css('overflow-x'),
+								overflowY = $el.css('overflow-y');
+
+							if (overflowX != 'visible' || overflowY != 'visible') {
+
+								var bcr = el.getBoundingClientRect();
+
+								if (overflowX != 'visible') {
+
+									if (	geo.origin.windowOffset.left < bcr.left
+										||	geo.origin.windowOffset.right > bcr.right
+									) {
+										overflows = true;
+										return false;
+									}
+								}
+
+								if (overflowY != 'visible') {
+
+									if (	geo.origin.windowOffset.top < bcr.top
+										||	geo.origin.windowOffset.bottom > bcr.bottom
+									) {
+										overflows = true;
+										return false;
+									}
+								}
+							}
+
+							// no need to go further if fixed, for the same reason as above
+							if ($el.css('position') == 'fixed') {
+								return false;
+							}
+						});
+					}
+
+					if (overflows) {
+						self._$tooltip.css('visibility', 'hidden');
+					}
+					else {
+
+						self._$tooltip.css('visibility', 'visible');
+
+						// reposition
+						if (self.__options.repositionOnScroll) {
+							self.reposition(event);
+						}
+						// or just adjust offset
+						else {
+
+							// we have to use offset and not windowOffset because this way,
+							// only the scroll distance of the scrollable areas are taken into
+							// account (the scrolltop value of the main window must be
+							// ignored since the tooltip already moves with it)
+							var offsetLeft = geo.origin.offset.left - self.__Geometry.origin.offset.left,
+								offsetTop = geo.origin.offset.top - self.__Geometry.origin.offset.top;
+
+							// add the offset to the position initially computed by the display plugin
+							self._$tooltip.css({
+								left: self.__lastPosition.coord.left + offsetLeft,
+								top: self.__lastPosition.coord.top + offsetTop
+							});
+						}
+					}
+				}
+
+				self._trigger({
+					type: 'scroll',
+					event: event,
+					geo: geo
+				});
+			}
+		}
+
+		return self;
+	},
+
+	/**
+	 * Changes the state of the tooltip
+	 *
+	 * @param {string} state
+	 * @returns {self}
+	 * @private
+	 */
+	__stateSet: function(state) {
+
+		this.__state = state;
+
+		this._trigger({
+			type: 'state',
+			state: state
+		});
+
+		return this;
+	},
+
+	/**
+	 * Clear appearance timeouts
+	 *
+	 * @returns {self}
+	 * @private
+	 */
+	__timeoutsClear: function() {
+
+		// there is only one possible open timeout: the delayed opening
+		// when the mouseenter/touchstart open triggers are used
+		clearTimeout(this.__timeouts.open);
+		this.__timeouts.open = null;
+
+		// ... but several close timeouts: the delayed closing when the
+		// mouseleave close trigger is used and the timer option
+		$.each(this.__timeouts.close, function(i, timeout) {
+			clearTimeout(timeout);
+		});
+		this.__timeouts.close = [];
+
+		return this;
+	},
+
+	/**
+	 * Start the tracker that will make checks at regular intervals
+	 *
+	 * @returns {self}
+	 * @private
+	 */
+	__trackerStart: function() {
+
+		var self = this,
+			$content = self._$tooltip.find('.tooltipster-content');
+
+		// get the initial content size
+		if (self.__options.trackTooltip) {
+			self.__contentBcr = $content[0].getBoundingClientRect();
+		}
+
+		self.__tracker = setInterval(function() {
+
+			// if the origin or tooltip elements have been removed.
+			// Note: we could destroy the instance now if the origin has
+			// been removed but we'll leave that task to our garbage collector
+			if (!bodyContains(self._$origin) || !bodyContains(self._$tooltip)) {
+				self._close();
+			}
+			// if everything is alright
+			else {
+
+				// compare the former and current positions of the origin to reposition
+				// the tooltip if need be
+				if (self.__options.trackOrigin) {
+
+					var g = self.__geometry(),
+						identical = false;
+
+					// compare size first (a change requires repositioning too)
+					if (areEqual(g.origin.size, self.__Geometry.origin.size)) {
+
+						// for elements that have a fixed lineage (see __geometry()), we track the
+						// top and left properties (relative to window)
+						if (self.__Geometry.origin.fixedLineage) {
+							if (areEqual(g.origin.windowOffset, self.__Geometry.origin.windowOffset)) {
+								identical = true;
+							}
+						}
+						// otherwise, track total offset (relative to document)
+						else {
+							if (areEqual(g.origin.offset, self.__Geometry.origin.offset)) {
+								identical = true;
+							}
+						}
+					}
+
+					if (!identical) {
+
+						// close the tooltip when using the mouseleave close trigger
+						// (see https://github.com/iamceege/tooltipster/pull/253)
+						if (self.__options.triggerClose.mouseleave) {
+							self._close();
+						}
+						else {
+							self.reposition();
+						}
+					}
+				}
+
+				if (self.__options.trackTooltip) {
+
+					var currentBcr = $content[0].getBoundingClientRect();
+
+					if (	currentBcr.height !== self.__contentBcr.height
+						||	currentBcr.width !== self.__contentBcr.width
+					) {
+						self.reposition();
+						self.__contentBcr = currentBcr;
+					}
+				}
+			}
+		}, self.__options.trackerInterval);
+
+		return self;
+	},
+
+	/**
+	 * Closes the tooltip (after the closing delay)
+	 *
+	 * @param event
+	 * @param callback
+	 * @param force Set to true to override a potential refusal of the user's function
+	 * @returns {self}
+	 * @protected
+	 */
+	_close: function(event, callback, force) {
+
+		var self = this,
+			ok = true;
+
+		self._trigger({
+			type: 'close',
+			event: event,
+			stop: function() {
+				ok = false;
+			}
+		});
+
+		// a destroying tooltip (force == true) may not refuse to close
+		if (ok || force) {
+
+			// save the method custom callback and cancel any open method custom callbacks
+			if (callback) self.__callbacks.close.push(callback);
+			self.__callbacks.open = [];
+
+			// clear open/close timeouts
+			self.__timeoutsClear();
+
+			var finishCallbacks = function() {
+
+				// trigger any close method custom callbacks and reset them
+				$.each(self.__callbacks.close, function(i,c) {
+					c.call(self, self, {
+						event: event,
+						origin: self._$origin[0]
+					});
+				});
+
+				self.__callbacks.close = [];
+			};
+
+			if (self.__state != 'closed') {
+
+				var necessary = true,
+					d = new Date(),
+					now = d.getTime(),
+					newClosingTime = now + self.__options.animationDuration[1];
+
+				// the tooltip may already already be disappearing, but if a new
+				// call to close() is made after the animationDuration was changed
+				// to 0 (for example), we ought to actually close it sooner than
+				// previously scheduled. In that case it should be noted that the
+				// browser will not adapt the animation duration to the new
+				// animationDuration that was set after the start of the closing
+				// animation.
+				// Note: the same thing could be considered at opening, but is not
+				// really useful since the tooltip is actually opened immediately
+				// upon a call to _open(). Since it would not make the opening
+				// animation finish sooner, its sole impact would be to trigger the
+				// state event and the open callbacks sooner than the actual end of
+				// the opening animation, which is not great.
+				if (self.__state == 'disappearing') {
+
+					if (	newClosingTime > self.__closingTime
+						// in case closing is actually overdue because the script
+						// execution was suspended. See #679
+						&&	self.__options.animationDuration[1] > 0
+					) {
+						necessary = false;
+					}
+				}
+
+				if (necessary) {
+
+					self.__closingTime = newClosingTime;
+
+					if (self.__state != 'disappearing') {
+						self.__stateSet('disappearing');
+					}
+
+					var finish = function() {
+
+						// stop the tracker
+						clearInterval(self.__tracker);
+
+						// a "beforeClose" option has been asked several times but would
+						// probably useless since the content element is still accessible
+						// via ::content(), and because people can always use listeners
+						// inside their content to track what's going on. For the sake of
+						// simplicity, this has been denied. Bur for the rare people who
+						// really need the option (for old browsers or for the case where
+						// detaching the content is actually destructive, for file or
+						// password inputs for example), this event will do the work.
+						self._trigger({
+							type: 'closing',
+							event: event
+						});
+
+						// unbind listeners which are no longer needed
+
+						self._$tooltip
+							.off('.'+ self.__namespace +'-triggerClose')
+							.removeClass('tooltipster-dying');
+
+						// orientationchange, scroll and resize listeners
+						$(env.window).off('.'+ self.__namespace +'-triggerClose');
+
+						// scroll listeners
+						self.__$originParents.each(function(i, el) {
+							$(el).off('scroll.'+ self.__namespace +'-triggerClose');
+						});
+						// clear the array to prevent memory leaks
+						self.__$originParents = null;
+
+						$(env.window.document.body).off('.'+ self.__namespace +'-triggerClose');
+
+						self._$origin.off('.'+ self.__namespace +'-triggerClose');
+
+						self._off('dismissable');
+
+						// a plugin that would like to remove the tooltip from the
+						// DOM when closed should bind on this
+						self.__stateSet('closed');
+
+						// trigger event
+						self._trigger({
+							type: 'after',
+							event: event
+						});
+
+						// call our constructor custom callback function
+						if (self.__options.functionAfter) {
+							self.__options.functionAfter.call(self, self, {
+								event: event,
+								origin: self._$origin[0]
+							});
+						}
+
+						// call our method custom callbacks functions
+						finishCallbacks();
+					};
+
+					if (env.hasTransitions) {
+
+						self._$tooltip.css({
+							'-moz-animation-duration': self.__options.animationDuration[1] + 'ms',
+							'-ms-animation-duration': self.__options.animationDuration[1] + 'ms',
+							'-o-animation-duration': self.__options.animationDuration[1] + 'ms',
+							'-webkit-animation-duration': self.__options.animationDuration[1] + 'ms',
+							'animation-duration': self.__options.animationDuration[1] + 'ms',
+							'transition-duration': self.__options.animationDuration[1] + 'ms'
+						});
+
+						self._$tooltip
+							// clear both potential open and close tasks
+							.clearQueue()
+							.removeClass('tooltipster-show')
+							// for transitions only
+							.addClass('tooltipster-dying');
+
+						if (self.__options.animationDuration[1] > 0) {
+							self._$tooltip.delay(self.__options.animationDuration[1]);
+						}
+
+						self._$tooltip.queue(finish);
+					}
+					else {
+
+						self._$tooltip
+							.stop()
+							.fadeOut(self.__options.animationDuration[1], finish);
+					}
+				}
+			}
+			// if the tooltip is already closed, we still need to trigger
+			// the method custom callbacks
+			else {
+				finishCallbacks();
+			}
+		}
+
+		return self;
+	},
+
+	/**
+	 * For internal use by plugins, if needed
+	 *
+	 * @returns {self}
+	 * @protected
+	 */
+	_off: function() {
+		this.__$emitterPrivate.off.apply(this.__$emitterPrivate, Array.prototype.slice.apply(arguments));
+		return this;
+	},
+
+	/**
+	 * For internal use by plugins, if needed
+	 *
+	 * @returns {self}
+	 * @protected
+	 */
+	_on: function() {
+		this.__$emitterPrivate.on.apply(this.__$emitterPrivate, Array.prototype.slice.apply(arguments));
+		return this;
+	},
+
+	/**
+	 * For internal use by plugins, if needed
+	 *
+	 * @returns {self}
+	 * @protected
+	 */
+	_one: function() {
+		this.__$emitterPrivate.one.apply(this.__$emitterPrivate, Array.prototype.slice.apply(arguments));
+		return this;
+	},
+
+	/**
+	 * Opens the tooltip right away.
+	 *
+	 * @param event
+	 * @param callback Will be called when the opening animation is over
+	 * @returns {self}
+	 * @protected
+	 */
+	_open: function(event, callback) {
+
+		var self = this;
+
+		// if the destruction process has not begun and if this was not
+		// triggered by an unwanted emulated click event
+		if (!self.__destroying) {
+
+			// check that the origin is still in the DOM
+			if (	bodyContains(self._$origin)
+				// if the tooltip is enabled
+				&&	self.__enabled
+			) {
+
+				var ok = true;
+
+				// if the tooltip is not open yet, we need to call functionBefore.
+				// otherwise we can jst go on
+				if (self.__state == 'closed') {
+
+					// trigger an event. The event.stop function allows the callback
+					// to prevent the opening of the tooltip
+					self._trigger({
+						type: 'before',
+						event: event,
+						stop: function() {
+							ok = false;
+						}
+					});
+
+					if (ok && self.__options.functionBefore) {
+
+						// call our custom function before continuing
+						ok = self.__options.functionBefore.call(self, self, {
+							event: event,
+							origin: self._$origin[0]
+						});
+					}
+				}
+
+				if (ok !== false) {
+
+					// if there is some content
+					if (self.__Content !== null) {
+
+						// save the method callback and cancel close method callbacks
+						if (callback) {
+							self.__callbacks.open.push(callback);
+						}
+						self.__callbacks.close = [];
+
+						// get rid of any appearance timeouts
+						self.__timeoutsClear();
+
+						var extraTime,
+							finish = function() {
+
+								if (self.__state != 'stable') {
+									self.__stateSet('stable');
+								}
+
+								// trigger any open method custom callbacks and reset them
+								$.each(self.__callbacks.open, function(i,c) {
+									c.call(self, self, {
+										origin: self._$origin[0],
+										tooltip: self._$tooltip[0]
+									});
+								});
+
+								self.__callbacks.open = [];
+							};
+
+						// if the tooltip is already open
+						if (self.__state !== 'closed') {
+
+							// the timer (if any) will start (or restart) right now
+							extraTime = 0;
+
+							// if it was disappearing, cancel that
+							if (self.__state === 'disappearing') {
+
+								self.__stateSet('appearing');
+
+								if (env.hasTransitions) {
+
+									self._$tooltip
+										.clearQueue()
+										.removeClass('tooltipster-dying')
+										.addClass('tooltipster-show');
+
+									if (self.__options.animationDuration[0] > 0) {
+										self._$tooltip.delay(self.__options.animationDuration[0]);
+									}
+
+									self._$tooltip.queue(finish);
+								}
+								else {
+									// in case the tooltip was currently fading out, bring it back
+									// to life
+									self._$tooltip
+										.stop()
+										.fadeIn(finish);
+								}
+							}
+							// if the tooltip is already open, we still need to trigger the method
+							// custom callback
+							else if (self.__state == 'stable') {
+								finish();
+							}
+						}
+						// if the tooltip isn't already open, open it
+						else {
+
+							// a plugin must bind on this and store the tooltip in this._$tooltip
+							self.__stateSet('appearing');
+
+							// the timer (if any) will start when the tooltip has fully appeared
+							// after its transition
+							extraTime = self.__options.animationDuration[0];
+
+							// insert the content inside the tooltip
+							self.__contentInsert();
+
+							// reposition the tooltip and attach to the DOM
+							self.reposition(event, true);
+
+							// animate in the tooltip. If the display plugin wants no css
+							// animations, it may override the animation option with a
+							// dummy value that will produce no effect
+							if (env.hasTransitions) {
+
+								// note: there seems to be an issue with start animations which
+								// are randomly not played on fast devices in both Chrome and FF,
+								// couldn't find a way to solve it yet. It seems that applying
+								// the classes before appending to the DOM helps a little, but
+								// it messes up some CSS transitions. The issue almost never
+								// happens when delay[0]==0 though
+								self._$tooltip
+									.addClass('tooltipster-'+ self.__options.animation)
+									.addClass('tooltipster-initial')
+									.css({
+										'-moz-animation-duration': self.__options.animationDuration[0] + 'ms',
+										'-ms-animation-duration': self.__options.animationDuration[0] + 'ms',
+										'-o-animation-duration': self.__options.animationDuration[0] + 'ms',
+										'-webkit-animation-duration': self.__options.animationDuration[0] + 'ms',
+										'animation-duration': self.__options.animationDuration[0] + 'ms',
+										'transition-duration': self.__options.animationDuration[0] + 'ms'
+									});
+
+								setTimeout(
+									function() {
+
+										// a quick hover may have already triggered a mouseleave
+										if (self.__state != 'closed') {
+
+											self._$tooltip
+												.addClass('tooltipster-show')
+												.removeClass('tooltipster-initial');
+
+											if (self.__options.animationDuration[0] > 0) {
+												self._$tooltip.delay(self.__options.animationDuration[0]);
+											}
+
+											self._$tooltip.queue(finish);
+										}
+									},
+									0
+								);
+							}
+							else {
+
+								// old browsers will have to live with this
+								self._$tooltip
+									.css('display', 'none')
+									.fadeIn(self.__options.animationDuration[0], finish);
+							}
+
+							// checks if the origin is removed while the tooltip is open
+							self.__trackerStart();
+
+							// NOTE: the listeners below have a '-triggerClose' namespace
+							// because we'll remove them when the tooltip closes (unlike
+							// the '-triggerOpen' listeners). So some of them are actually
+							// not about close triggers, rather about positioning.
+
+							$(env.window)
+								// reposition on resize
+								.on('resize.'+ self.__namespace +'-triggerClose', function(e) {
+
+									var $ae = $(document.activeElement);
+
+									// reposition only if the resize event was not triggered upon the opening
+									// of a virtual keyboard due to an input field being focused within the tooltip
+									// (otherwise the repositioning would lose the focus)
+									if (	(!$ae.is('input') && !$ae.is('textarea'))
+										||	!$.contains(self._$tooltip[0], $ae[0])
+									) {
+										self.reposition(e);
+									}
+								})
+								// same as below for parents
+								.on('scroll.'+ self.__namespace +'-triggerClose', function(e) {
+									self.__scrollHandler(e);
+								});
+
+							self.__$originParents = self._$origin.parents();
+
+							// scrolling may require the tooltip to be moved or even
+							// repositioned in some cases
+							self.__$originParents.each(function(i, parent) {
+
+								$(parent).on('scroll.'+ self.__namespace +'-triggerClose', function(e) {
+									self.__scrollHandler(e);
+								});
+							});
+
+							if (	self.__options.triggerClose.mouseleave
+								||	(self.__options.triggerClose.touchleave && env.hasTouchCapability)
+							) {
+
+								// we use an event to allow users/plugins to control when the mouseleave/touchleave
+								// close triggers will come to action. It allows to have more triggering elements
+								// than just the origin and the tooltip for example, or to cancel/delay the closing,
+								// or to make the tooltip interactive even if it wasn't when it was open, etc.
+								self._on('dismissable', function(event) {
+
+									if (event.dismissable) {
+
+										if (event.delay) {
+
+											timeout = setTimeout(function() {
+												// event.event may be undefined
+												self._close(event.event);
+											}, event.delay);
+
+											self.__timeouts.close.push(timeout);
+										}
+										else {
+											self._close(event);
+										}
+									}
+									else {
+										clearTimeout(timeout);
+									}
+								});
+
+								// now set the listeners that will trigger 'dismissable' events
+								var $elements = self._$origin,
+									eventNamesIn = '',
+									eventNamesOut = '',
+									timeout = null;
+
+								// if we have to allow interaction, bind on the tooltip too
+								if (self.__options.interactive) {
+									$elements = $elements.add(self._$tooltip);
+								}
+
+								if (self.__options.triggerClose.mouseleave) {
+									eventNamesIn += 'mouseenter.'+ self.__namespace +'-triggerClose ';
+									eventNamesOut += 'mouseleave.'+ self.__namespace +'-triggerClose ';
+								}
+								if (self.__options.triggerClose.touchleave && env.hasTouchCapability) {
+									eventNamesIn += 'touchstart.'+ self.__namespace +'-triggerClose';
+									eventNamesOut += 'touchend.'+ self.__namespace +'-triggerClose touchcancel.'+ self.__namespace +'-triggerClose';
+								}
+
+								$elements
+									// close after some time spent outside of the elements
+									.on(eventNamesOut, function(event) {
+
+										// it's ok if the touch gesture ended up to be a swipe,
+										// it's still a "touch leave" situation
+										if (	self._touchIsTouchEvent(event)
+											||	!self._touchIsEmulatedEvent(event)
+										) {
+
+											var delay = (event.type == 'mouseleave') ?
+												self.__options.delay :
+												self.__options.delayTouch;
+
+											self._trigger({
+												delay: delay[1],
+												dismissable: true,
+												event: event,
+												type: 'dismissable'
+											});
+										}
+									})
+									// suspend the mouseleave timeout when the pointer comes back
+									// over the elements
+									.on(eventNamesIn, function(event) {
+
+										// it's also ok if the touch event is a swipe gesture
+										if (	self._touchIsTouchEvent(event)
+											||	!self._touchIsEmulatedEvent(event)
+										) {
+											self._trigger({
+												dismissable: false,
+												event: event,
+												type: 'dismissable'
+											});
+										}
+									});
+							}
+
+							// close the tooltip when the origin gets a mouse click (common behavior of
+							// native tooltips)
+							if (self.__options.triggerClose.originClick) {
+
+								self._$origin.on('click.'+ self.__namespace + '-triggerClose', function(event) {
+
+									// we could actually let a tap trigger this but this feature just
+									// does not make sense on touch devices
+									if (	!self._touchIsTouchEvent(event)
+										&&	!self._touchIsEmulatedEvent(event)
+									) {
+										self._close(event);
+									}
+								});
+							}
+
+							// set the same bindings for click and touch on the body to close the tooltip
+							if (	self.__options.triggerClose.click
+								||	(self.__options.triggerClose.tap && env.hasTouchCapability)
+							) {
+
+								// don't set right away since the click/tap event which triggered this method
+								// (if it was a click/tap) is going to bubble up to the body, we don't want it
+								// to close the tooltip immediately after it opened
+								setTimeout(function() {
+
+									if (self.__state != 'closed') {
+
+										var eventNames = '',
+											$body = $(env.window.document.body);
+
+										if (self.__options.triggerClose.click) {
+											eventNames += 'click.'+ self.__namespace +'-triggerClose ';
+										}
+										if (self.__options.triggerClose.tap && env.hasTouchCapability) {
+											eventNames += 'touchend.'+ self.__namespace +'-triggerClose';
+										}
+
+										$body.on(eventNames, function(event) {
+
+											if (self._touchIsMeaningfulEvent(event)) {
+
+												self._touchRecordEvent(event);
+
+												if (!self.__options.interactive || !$.contains(self._$tooltip[0], event.target)) {
+													self._close(event);
+												}
+											}
+										});
+
+										// needed to detect and ignore swiping
+										if (self.__options.triggerClose.tap && env.hasTouchCapability) {
+
+											$body.on('touchstart.'+ self.__namespace +'-triggerClose', function(event) {
+												self._touchRecordEvent(event);
+											});
+										}
+									}
+								}, 0);
+							}
+
+							self._trigger('ready');
+
+							// call our custom callback
+							if (self.__options.functionReady) {
+								self.__options.functionReady.call(self, self, {
+									origin: self._$origin[0],
+									tooltip: self._$tooltip[0]
+								});
+							}
+						}
+
+						// if we have a timer set, let the countdown begin
+						if (self.__options.timer > 0) {
+
+							var timeout = setTimeout(function() {
+								self._close();
+							}, self.__options.timer + extraTime);
+
+							self.__timeouts.close.push(timeout);
+						}
+					}
+				}
+			}
+		}
+
+		return self;
+	},
+
+	/**
+	 * When using the mouseenter/touchstart open triggers, this function will
+	 * schedule the opening of the tooltip after the delay, if there is one
+	 *
+	 * @param event
+	 * @returns {self}
+	 * @protected
+ 	 */
+	_openShortly: function(event) {
+
+		var self = this,
+			ok = true;
+
+		if (self.__state != 'stable' && self.__state != 'appearing') {
+
+			// if a timeout is not already running
+			if (!self.__timeouts.open) {
+
+				self._trigger({
+					type: 'start',
+					event: event,
+					stop: function() {
+						ok = false;
+					}
+				});
+
+				if (ok) {
+
+					var delay = (event.type.indexOf('touch') == 0) ?
+						self.__options.delayTouch :
+						self.__options.delay;
+
+					if (delay[0]) {
+
+						self.__timeouts.open = setTimeout(function() {
+
+							self.__timeouts.open = null;
+
+							// open only if the pointer (mouse or touch) is still over the origin.
+							// The check on the "meaningful event" can only be made here, after some
+							// time has passed (to know if the touch was a swipe or not)
+							if (self.__pointerIsOverOrigin && self._touchIsMeaningfulEvent(event)) {
+
+								// signal that we go on
+								self._trigger('startend');
+
+								self._open(event);
+							}
+							else {
+								// signal that we cancel
+								self._trigger('startcancel');
+							}
+						}, delay[0]);
+					}
+					else {
+						// signal that we go on
+						self._trigger('startend');
+
+						self._open(event);
+					}
+				}
+			}
+		}
+
+		return self;
+	},
+
+	/**
+	 * Meant for plugins to get their options
+	 *
+	 * @param {string} pluginName The name of the plugin that asks for its options
+	 * @param {object} defaultOptions The default options of the plugin
+	 * @returns {object} The options
+	 * @protected
+	 */
+	_optionsExtract: function(pluginName, defaultOptions) {
+
+		var self = this,
+			options = $.extend(true, {}, defaultOptions);
+
+		// if the plugin options were isolated in a property named after the
+		// plugin, use them (prevents conflicts with other plugins)
+		var pluginOptions = self.__options[pluginName];
+
+		// if not, try to get them as regular options
+		if (!pluginOptions){
+
+			pluginOptions = {};
+
+			$.each(defaultOptions, function(optionName, value) {
+
+				var o = self.__options[optionName];
+
+				if (o !== undefined) {
+					pluginOptions[optionName] = o;
+				}
+			});
+		}
+
+		// let's merge the default options and the ones that were provided. We'd want
+		// to do a deep copy but not let jQuery merge arrays, so we'll do a shallow
+		// extend on two levels, that will be enough if options are not more than 1
+		// level deep
+		$.each(options, function(optionName, value) {
+
+			if (pluginOptions[optionName] !== undefined) {
+
+				if ((		typeof value == 'object'
+						&&	!(value instanceof Array)
+						&&	value != null
+					)
+					&&
+					(		typeof pluginOptions[optionName] == 'object'
+						&&	!(pluginOptions[optionName] instanceof Array)
+						&&	pluginOptions[optionName] != null
+					)
+				) {
+					$.extend(options[optionName], pluginOptions[optionName]);
+				}
+				else {
+					options[optionName] = pluginOptions[optionName];
+				}
+			}
+		});
+
+		return options;
+	},
+
+	/**
+	 * Used at instantiation of the plugin, or afterwards by plugins that activate themselves
+	 * on existing instances
+	 *
+	 * @param {object} pluginName
+	 * @returns {self}
+	 * @protected
+	 */
+	_plug: function(pluginName) {
+
+		var plugin = $.tooltipster._plugin(pluginName);
+
+		if (plugin) {
+
+			// if there is a constructor for instances
+			if (plugin.instance) {
+
+				// proxy non-private methods on the instance to allow new instance methods
+				$.tooltipster.__bridge(plugin.instance, this, plugin.name);
+			}
+		}
+		else {
+			throw new Error('The "'+ pluginName +'" plugin is not defined');
+		}
+
+		return this;
+	},
+
+	/**
+	 * This will return true if the event is a mouse event which was
+	 * emulated by the browser after a touch event. This allows us to
+	 * really dissociate mouse and touch triggers.
+	 *
+	 * There is a margin of error if a real mouse event is fired right
+	 * after (within the delay shown below) a touch event on the same
+	 * element, but hopefully it should not happen often.
+	 *
+	 * @returns {boolean}
+	 * @protected
+	 */
+	_touchIsEmulatedEvent: function(event) {
+
+		var isEmulated = false,
+			now = new Date().getTime();
+
+		for (var i = this.__touchEvents.length - 1; i >= 0; i--) {
+
+			var e = this.__touchEvents[i];
+
+			// delay, in milliseconds. It's supposed to be 300ms in
+			// most browsers (350ms on iOS) to allow a double tap but
+			// can be less (check out FastClick for more info)
+			if (now - e.time < 500) {
+
+				if (e.target === event.target) {
+					isEmulated = true;
+				}
+			}
+			else {
+				break;
+			}
+		}
+
+		return isEmulated;
+	},
+
+	/**
+	 * Returns false if the event was an emulated mouse event or
+	 * a touch event involved in a swipe gesture.
+	 *
+	 * @param {object} event
+	 * @returns {boolean}
+	 * @protected
+	 */
+	_touchIsMeaningfulEvent: function(event) {
+		return (
+				(this._touchIsTouchEvent(event) && !this._touchSwiped(event.target))
+			||	(!this._touchIsTouchEvent(event) && !this._touchIsEmulatedEvent(event))
+		);
+	},
+
+	/**
+	 * Checks if an event is a touch event
+	 *
+	 * @param {object} event
+	 * @returns {boolean}
+	 * @protected
+	 */
+	_touchIsTouchEvent: function(event){
+		return event.type.indexOf('touch') == 0;
+	},
+
+	/**
+	 * Store touch events for a while to detect swiping and emulated mouse events
+	 *
+	 * @param {object} event
+	 * @returns {self}
+	 * @protected
+	 */
+	_touchRecordEvent: function(event) {
+
+		if (this._touchIsTouchEvent(event)) {
+			event.time = new Date().getTime();
+			this.__touchEvents.push(event);
+		}
+
+		return this;
+	},
+
+	/**
+	 * Returns true if a swipe happened after the last touchstart event fired on
+	 * event.target.
+	 *
+	 * We need to differentiate a swipe from a tap before we let the event open
+	 * or close the tooltip. A swipe is when a touchmove (scroll) event happens
+	 * on the body between the touchstart and the touchend events of an element.
+	 *
+	 * @param {object} target The HTML element that may have triggered the swipe
+	 * @returns {boolean}
+	 * @protected
+	 */
+	_touchSwiped: function(target) {
+
+		var swiped = false;
+
+		for (var i = this.__touchEvents.length - 1; i >= 0; i--) {
+
+			var e = this.__touchEvents[i];
+
+			if (e.type == 'touchmove') {
+				swiped = true;
+				break;
+			}
+			else if (
+				e.type == 'touchstart'
+				&&	target === e.target
+			) {
+				break;
+			}
+		}
+
+		return swiped;
+	},
+
+	/**
+	 * Triggers an event on the instance emitters
+	 *
+	 * @returns {self}
+	 * @protected
+	 */
+	_trigger: function() {
+
+		var args = Array.prototype.slice.apply(arguments);
+
+		if (typeof args[0] == 'string') {
+			args[0] = { type: args[0] };
+		}
+
+		// add properties to the event
+		args[0].instance = this;
+		args[0].origin = this._$origin ? this._$origin[0] : null;
+		args[0].tooltip = this._$tooltip ? this._$tooltip[0] : null;
+
+		// note: the order of emitters matters
+		this.__$emitterPrivate.trigger.apply(this.__$emitterPrivate, args);
+		$.tooltipster._trigger.apply($.tooltipster, args);
+		this.__$emitterPublic.trigger.apply(this.__$emitterPublic, args);
+
+		return this;
+	},
+
+	/**
+	 * Deactivate a plugin on this instance
+	 *
+	 * @returns {self}
+	 * @protected
+	 */
+	_unplug: function(pluginName) {
+
+		var self = this;
+
+		// if the plugin has been activated on this instance
+		if (self[pluginName]) {
+
+			var plugin = $.tooltipster._plugin(pluginName);
+
+			// if there is a constructor for instances
+			if (plugin.instance) {
+
+				// unbridge
+				$.each(plugin.instance, function(methodName, fn) {
+
+					// if the method exists (privates methods do not) and comes indeed from
+					// this plugin (may be missing or come from a conflicting plugin).
+					if (	self[methodName]
+						&&	self[methodName].bridged === self[pluginName]
+					) {
+						delete self[methodName];
+					}
+				});
+			}
+
+			// destroy the plugin
+			if (self[pluginName].__destroy) {
+				self[pluginName].__destroy();
+			}
+
+			// remove the reference to the plugin instance
+			delete self[pluginName];
+		}
+
+		return self;
+	},
+
+	/**
+	 * @see self::_close
+	 * @returns {self}
+	 * @public
+	 */
+	close: function(callback) {
+
+		if (!this.__destroyed) {
+			this._close(null, callback);
+		}
+		else {
+			this.__destroyError();
+		}
+
+		return this;
+	},
+
+	/**
+	 * Sets or gets the content of the tooltip
+	 *
+	 * @returns {mixed|self}
+	 * @public
+	 */
+	content: function(content) {
+
+		var self = this;
+
+		// getter method
+		if (content === undefined) {
+			return self.__Content;
+		}
+		// setter method
+		else {
+
+			if (!self.__destroyed) {
+
+				// change the content
+				self.__contentSet(content);
+
+				if (self.__Content !== null) {
+
+					// update the tooltip if it is open
+					if (self.__state !== 'closed') {
+
+						// reset the content in the tooltip
+						self.__contentInsert();
+
+						// reposition and resize the tooltip
+						self.reposition();
+
+						// if we want to play a little animation showing the content changed
+						if (self.__options.updateAnimation) {
+
+							if (env.hasTransitions) {
+
+								// keep the reference in the local scope
+								var animation = self.__options.updateAnimation;
+
+								self._$tooltip.addClass('tooltipster-update-'+ animation);
+
+								// remove the class after a while. The actual duration of the
+								// update animation may be shorter, it's set in the CSS rules
+								setTimeout(function() {
+
+									if (self.__state != 'closed') {
+
+										self._$tooltip.removeClass('tooltipster-update-'+ animation);
+									}
+								}, 1000);
+							}
+							else {
+								self._$tooltip.fadeTo(200, 0.5, function() {
+									if (self.__state != 'closed') {
+										self._$tooltip.fadeTo(200, 1);
+									}
+								});
+							}
+						}
+					}
+				}
+				else {
+					self._close();
+				}
+			}
+			else {
+				self.__destroyError();
+			}
+
+			return self;
+		}
+	},
+
+	/**
+	 * Destroys the tooltip
+	 *
+	 * @returns {self}
+	 * @public
+	 */
+	destroy: function() {
+
+		var self = this;
+
+		if (!self.__destroyed) {
+
+			if(self.__state != 'closed'){
+
+				// no closing delay
+				self.option('animationDuration', 0)
+					// force closing
+					._close(null, null, true);
+			}
+			else {
+				// there might be an open timeout still running
+				self.__timeoutsClear();
+			}
+
+			// send event
+			self._trigger('destroy');
+
+			self.__destroyed = true;
+
+			self._$origin
+				.removeData(self.__namespace)
+				// remove the open trigger listeners
+				.off('.'+ self.__namespace +'-triggerOpen');
+
+			// remove the touch listener
+			$(env.window.document.body).off('.' + self.__namespace +'-triggerOpen');
+
+			var ns = self._$origin.data('tooltipster-ns');
+
+			// if the origin has been removed from DOM, its data may
+			// well have been destroyed in the process and there would
+			// be nothing to clean up or restore
+			if (ns) {
+
+				// if there are no more tooltips on this element
+				if (ns.length === 1) {
+
+					// optional restoration of a title attribute
+					var title = null;
+					if (self.__options.restoration == 'previous') {
+						title = self._$origin.data('tooltipster-initialTitle');
+					}
+					else if (self.__options.restoration == 'current') {
+
+						// old school technique to stringify when outerHTML is not supported
+						title = (typeof self.__Content == 'string') ?
+							self.__Content :
+							$('<div></div>').append(self.__Content).html();
+					}
+
+					if (title) {
+						self._$origin.attr('title', title);
+					}
+
+					// final cleaning
+
+					self._$origin.removeClass('tooltipstered');
+
+					self._$origin
+						.removeData('tooltipster-ns')
+						.removeData('tooltipster-initialTitle');
+				}
+				else {
+					// remove the instance namespace from the list of namespaces of
+					// tooltips present on the element
+					ns = $.grep(ns, function(el, i) {
+						return el !== self.__namespace;
+					});
+					self._$origin.data('tooltipster-ns', ns);
+				}
+			}
+
+			// last event
+			self._trigger('destroyed');
+
+			// unbind private and public event listeners
+			self._off();
+			self.off();
+
+			// remove external references, just in case
+			self.__Content = null;
+			self.__$emitterPrivate = null;
+			self.__$emitterPublic = null;
+			self.__options.parent = null;
+			self._$origin = null;
+			self._$tooltip = null;
+
+			// make sure the object is no longer referenced in there to prevent
+			// memory leaks
+			$.tooltipster.__instancesLatestArr = $.grep($.tooltipster.__instancesLatestArr, function(el, i) {
+				return self !== el;
+			});
+
+			clearInterval(self.__garbageCollector);
+		}
+		else {
+			self.__destroyError();
+		}
+
+		// we return the scope rather than true so that the call to
+		// .tooltipster('destroy') actually returns the matched elements
+		// and applies to all of them
+		return self;
+	},
+
+	/**
+	 * Disables the tooltip
+	 *
+	 * @returns {self}
+	 * @public
+	 */
+	disable: function() {
+
+		if (!this.__destroyed) {
+
+			// close first, in case the tooltip would not disappear on
+			// its own (no close trigger)
+			this._close();
+			this.__enabled = false;
+
+			return this;
+		}
+		else {
+			this.__destroyError();
+		}
+
+		return this;
+	},
+
+	/**
+	 * Returns the HTML element of the origin
+	 *
+	 * @returns {self}
+	 * @public
+	 */
+	elementOrigin: function() {
+
+		if (!this.__destroyed) {
+			return this._$origin[0];
+		}
+		else {
+			this.__destroyError();
+		}
+	},
+
+	/**
+	 * Returns the HTML element of the tooltip
+	 *
+	 * @returns {self}
+	 * @public
+	 */
+	elementTooltip: function() {
+		return this._$tooltip ? this._$tooltip[0] : null;
+	},
+
+	/**
+	 * Enables the tooltip
+	 *
+	 * @returns {self}
+	 * @public
+	 */
+	enable: function() {
+		this.__enabled = true;
+		return this;
+	},
+
+	/**
+	 * Alias, deprecated in 4.0.0
+	 *
+	 * @param {function} callback
+	 * @returns {self}
+	 * @public
+	 */
+	hide: function(callback) {
+		return this.close(callback);
+	},
+
+	/**
+	 * Returns the instance
+	 *
+	 * @returns {self}
+	 * @public
+	 */
+	instance: function() {
+		return this;
+	},
+
+	/**
+	 * For public use only, not to be used by plugins (use ::_off() instead)
+	 *
+	 * @returns {self}
+	 * @public
+	 */
+	off: function() {
+
+		if (!this.__destroyed) {
+			this.__$emitterPublic.off.apply(this.__$emitterPublic, Array.prototype.slice.apply(arguments));
+		}
+
+		return this;
+	},
+
+	/**
+	 * For public use only, not to be used by plugins (use ::_on() instead)
+	 *
+	 * @returns {self}
+	 * @public
+	 */
+	on: function() {
+
+		if (!this.__destroyed) {
+			this.__$emitterPublic.on.apply(this.__$emitterPublic, Array.prototype.slice.apply(arguments));
+		}
+		else {
+			this.__destroyError();
+		}
+
+		return this;
+	},
+
+	/**
+	 * For public use only, not to be used by plugins
+	 *
+	 * @returns {self}
+	 * @public
+	 */
+	one: function() {
+
+		if (!this.__destroyed) {
+			this.__$emitterPublic.one.apply(this.__$emitterPublic, Array.prototype.slice.apply(arguments));
+		}
+		else {
+			this.__destroyError();
+		}
+
+		return this;
+	},
+
+	/**
+	 * @see self::_open
+	 * @returns {self}
+	 * @public
+	 */
+	open: function(callback) {
+
+		if (!this.__destroyed) {
+			this._open(null, callback);
+		}
+		else {
+			this.__destroyError();
+		}
+
+		return this;
+	},
+
+	/**
+	 * Get or set options. For internal use and advanced users only.
+	 *
+	 * @param {string} o Option name
+	 * @param {mixed} val optional A new value for the option
+	 * @return {mixed|self} If val is omitted, the value of the option
+	 * is returned, otherwise the instance itself is returned
+	 * @public
+	 */
+	option: function(o, val) {
+
+		// getter
+		if (val === undefined) {
+			return this.__options[o];
+		}
+		// setter
+		else {
+
+			if (!this.__destroyed) {
+
+				// change value
+				this.__options[o] = val;
+
+				// format
+				this.__optionsFormat();
+
+				// re-prepare the triggers if needed
+				if ($.inArray(o, ['trigger', 'triggerClose', 'triggerOpen']) >= 0) {
+					this.__prepareOrigin();
+				}
+
+				if (o === 'selfDestruction') {
+					this.__prepareGC();
+				}
+			}
+			else {
+				this.__destroyError();
+			}
+
+			return this;
+		}
+	},
+
+	/**
+	 * This method is in charge of setting the position and size properties of the tooltip.
+	 * All the hard work is delegated to the display plugin.
+	 * Note: The tooltip may be detached from the DOM at the moment the method is called
+	 * but must be attached by the end of the method call.
+	 *
+	 * @param {object} event For internal use only. Defined if an event such as
+	 * window resizing triggered the repositioning
+	 * @param {boolean} tooltipIsDetached For internal use only. Set this to true if you
+	 * know that the tooltip not being in the DOM is not an issue (typically when the
+	 * tooltip element has just been created but has not been added to the DOM yet).
+	 * @returns {self}
+	 * @public
+	 */
+	reposition: function(event, tooltipIsDetached) {
+
+		var self = this;
+
+		if (!self.__destroyed) {
+
+			// if the tooltip is still open and the origin is still in the DOM
+			if (self.__state != 'closed' && bodyContains(self._$origin)) {
+
+				// if the tooltip has not been removed from DOM manually (or if it
+				// has been detached on purpose)
+				if (tooltipIsDetached || bodyContains(self._$tooltip)) {
+
+					if (!tooltipIsDetached) {
+						// detach in case the tooltip overflows the window and adds
+						// scrollbars to it, so __geometry can be accurate
+						self._$tooltip.detach();
+					}
+
+					// refresh the geometry object before passing it as a helper
+					self.__Geometry = self.__geometry();
+
+					// let a plugin fo the rest
+					self._trigger({
+						type: 'reposition',
+						event: event,
+						helper: {
+							geo: self.__Geometry
+						}
+					});
+				}
+			}
+		}
+		else {
+			self.__destroyError();
+		}
+
+		return self;
+	},
+
+	/**
+	 * Alias, deprecated in 4.0.0
+	 *
+	 * @param callback
+	 * @returns {self}
+	 * @public
+	 */
+	show: function(callback) {
+		return this.open(callback);
+	},
+
+	/**
+	 * Returns some properties about the instance
+	 *
+	 * @returns {object}
+	 * @public
+	 */
+	status: function() {
+
+		return {
+			destroyed: this.__destroyed,
+			enabled: this.__enabled,
+			open: this.__state !== 'closed',
+			state: this.__state
+		};
+	},
+
+	/**
+	 * For public use only, not to be used by plugins
+	 *
+	 * @returns {self}
+	 * @public
+	 */
+	triggerHandler: function() {
+
+		if (!this.__destroyed) {
+			this.__$emitterPublic.triggerHandler.apply(this.__$emitterPublic, Array.prototype.slice.apply(arguments));
+		}
+		else {
+			this.__destroyError();
+		}
+
+		return this;
+	}
+};
+
+$.fn.tooltipster = function() {
+
+	// for using in closures
+	var args = Array.prototype.slice.apply(arguments),
+		// common mistake: an HTML element can't be in several tooltips at the same time
+		contentCloningWarning = 'You are using a single HTML element as content for several tooltips. You probably want to set the contentCloning option to TRUE.';
+
+	// this happens with $(sel).tooltipster(...) when $(sel) does not match anything
+	if (this.length === 0) {
+
+		// still chainable
+		return this;
+	}
+	// this happens when calling $(sel).tooltipster('methodName or options')
+	// where $(sel) matches one or more elements
+	else {
+
+		// method calls
+		if (typeof args[0] === 'string') {
+
+			var v = '#*$~&';
+
+			this.each(function() {
+
+				// retrieve the namepaces of the tooltip(s) that exist on that element.
+				// We will interact with the first tooltip only.
+				var ns = $(this).data('tooltipster-ns'),
+					// self represents the instance of the first tooltipster plugin
+					// associated to the current HTML object of the loop
+					self = ns ? $(this).data(ns[0]) : null;
+
+				// if the current element holds a tooltipster instance
+				if (self) {
+
+					if (typeof self[args[0]] === 'function') {
+
+						if (	this.length > 1
+							&&	args[0] == 'content'
+							&&	(	args[1] instanceof $
+								|| (typeof args[1] == 'object' && args[1] != null && args[1].tagName)
+							)
+							&&	!self.__options.contentCloning
+							&&	self.__options.debug
+						) {
+							console.log(contentCloningWarning);
+						}
+
+						// note : args[1] and args[2] may not be defined
+						var resp = self[args[0]](args[1], args[2]);
+					}
+					else {
+						throw new Error('Unknown method "'+ args[0] +'"');
+					}
+
+					// if the function returned anything other than the instance
+					// itself (which implies chaining, except for the `instance` method)
+					if (resp !== self || args[0] === 'instance') {
+
+						v = resp;
+
+						// return false to stop .each iteration on the first element
+						// matched by the selector
+						return false;
+					}
+				}
+				else {
+					throw new Error('You called Tooltipster\'s "'+ args[0] +'" method on an uninitialized element');
+				}
+			});
+
+			return (v !== '#*$~&') ? v : this;
+		}
+		// first argument is undefined or an object: the tooltip is initializing
+		else {
+
+			// reset the array of last initialized objects
+			$.tooltipster.__instancesLatestArr = [];
+
+			// is there a defined value for the multiple option in the options object ?
+			var	multipleIsSet = args[0] && args[0].multiple !== undefined,
+				// if the multiple option is set to true, or if it's not defined but
+				// set to true in the defaults
+				multiple = (multipleIsSet && args[0].multiple) || (!multipleIsSet && defaults.multiple),
+				// same for content
+				contentIsSet = args[0] && args[0].content !== undefined,
+				content = (contentIsSet && args[0].content) || (!contentIsSet && defaults.content),
+				// same for contentCloning
+				contentCloningIsSet = args[0] && args[0].contentCloning !== undefined,
+				contentCloning =
+						(contentCloningIsSet && args[0].contentCloning)
+					||	(!contentCloningIsSet && defaults.contentCloning),
+				// same for debug
+				debugIsSet = args[0] && args[0].debug !== undefined,
+				debug = (debugIsSet && args[0].debug) || (!debugIsSet && defaults.debug);
+
+			if (	this.length > 1
+				&&	(	content instanceof $
+					|| (typeof content == 'object' && content != null && content.tagName)
+				)
+				&&	!contentCloning
+				&&	debug
+			) {
+				console.log(contentCloningWarning);
+			}
+
+			// create a tooltipster instance for each element if it doesn't
+			// already have one or if the multiple option is set, and attach the
+			// object to it
+			this.each(function() {
+
+				var go = false,
+					$this = $(this),
+					ns = $this.data('tooltipster-ns'),
+					obj = null;
+
+				if (!ns) {
+					go = true;
+				}
+				else if (multiple) {
+					go = true;
+				}
+				else if (debug) {
+					console.log('Tooltipster: one or more tooltips are already attached to the element below. Ignoring.');
+					console.log(this);
+				}
+
+				if (go) {
+					obj = new $.Tooltipster(this, args[0]);
+
+					// save the reference of the new instance
+					if (!ns) ns = [];
+					ns.push(obj.__namespace);
+					$this.data('tooltipster-ns', ns);
+
+					// save the instance itself
+					$this.data(obj.__namespace, obj);
+
+					// call our constructor custom function.
+					// we do this here and not in ::init() because we wanted
+					// the object to be saved in $this.data before triggering
+					// it
+					if (obj.__options.functionInit) {
+						obj.__options.functionInit.call(obj, obj, {
+							origin: this
+						});
+					}
+
+					// and now the event, for the plugins and core emitter
+					obj._trigger('init');
+				}
+
+				$.tooltipster.__instancesLatestArr.push(obj);
+			});
+
+			return this;
+		}
+	}
+};
+
+// Utilities
 
 /**
- * TOOLTIP IMPL.
+ * A class to check if a tooltip can fit in given dimensions
+ *
+ * @param {object} $tooltip The jQuery wrapped tooltip element, or a clone of it
+ */
+function Ruler($tooltip) {
+
+	// list of instance variables
+
+	this.$container;
+	this.constraints = null;
+	this.__$tooltip;
+
+	this.__init($tooltip);
+}
+
+Ruler.prototype = {
+
+	/**
+	 * Move the tooltip into an invisible div that does not allow overflow to make
+	 * size tests. Note: the tooltip may or may not be attached to the DOM at the
+	 * moment this method is called, it does not matter.
+	 *
+	 * @param {object} $tooltip The object to test. May be just a clone of the
+	 * actual tooltip.
+	 * @private
+	 */
+	__init: function($tooltip) {
+
+		this.__$tooltip = $tooltip;
+
+		this.__$tooltip
+			.css({
+				// for some reason we have to specify top and left 0
+				left: 0,
+				// any overflow will be ignored while measuring
+				overflow: 'hidden',
+				// positions at (0,0) without the div using 100% of the available width
+				position: 'absolute',
+				top: 0
+			})
+			// overflow must be auto during the test. We re-set this in case
+			// it were modified by the user
+			.find('.tooltipster-content')
+				.css('overflow', 'auto');
+
+		this.$container = $('<div class="tooltipster-ruler"></div>')
+			.append(this.__$tooltip)
+			.appendTo(env.window.document.body);
+	},
+
+	/**
+	 * Force the browser to redraw (re-render) the tooltip immediately. This is required
+	 * when you changed some CSS properties and need to make something with it
+	 * immediately, without waiting for the browser to redraw at the end of instructions.
+	 *
+	 * @see http://stackoverflow.com/questions/3485365/how-can-i-force-webkit-to-redraw-repaint-to-propagate-style-changes
+	 * @private
+	 */
+	__forceRedraw: function() {
+
+		// note: this would work but for Webkit only
+		//this.__$tooltip.close();
+		//this.__$tooltip[0].offsetHeight;
+		//this.__$tooltip.open();
+
+		// works in FF too
+		var $p = this.__$tooltip.parent();
+		this.__$tooltip.detach();
+		this.__$tooltip.appendTo($p);
+	},
+
+	/**
+	 * Set maximum dimensions for the tooltip. A call to ::measure afterwards
+	 * will tell us if the content overflows or if it's ok
+	 *
+	 * @param {int} width
+	 * @param {int} height
+	 * @return {Ruler}
+	 * @public
+	 */
+	constrain: function(width, height) {
+
+		this.constraints = {
+			width: width,
+			height: height
+		};
+
+		this.__$tooltip.css({
+			// we disable display:flex, otherwise the content would overflow without
+			// creating horizontal scrolling (which we need to detect).
+			display: 'block',
+			// reset any previous height
+			height: '',
+			// we'll check if horizontal scrolling occurs
+			overflow: 'auto',
+			// we'll set the width and see what height is generated and if there
+			// is horizontal overflow
+			width: width
+		});
+
+		return this;
+	},
+
+	/**
+	 * Reset the tooltip content overflow and remove the test container
+	 *
+	 * @returns {Ruler}
+	 * @public
+	 */
+	destroy: function() {
+
+		// in case the element was not a clone
+		this.__$tooltip
+			.detach()
+			.find('.tooltipster-content')
+				.css({
+					// reset to CSS value
+					display: '',
+					overflow: ''
+				});
+
+		this.$container.remove();
+	},
+
+	/**
+	 * Removes any constraints
+	 *
+	 * @returns {Ruler}
+	 * @public
+	 */
+	free: function() {
+
+		this.constraints = null;
+
+		// reset to natural size
+		this.__$tooltip.css({
+			display: '',
+			height: '',
+			overflow: 'visible',
+			width: ''
+		});
+
+		return this;
+	},
+
+	/**
+	 * Returns the size of the tooltip. When constraints are applied, also returns
+	 * whether the tooltip fits in the provided dimensions.
+	 * The idea is to see if the new height is small enough and if the content does
+	 * not overflow horizontally.
+	 *
+	 * @param {int} width
+	 * @param {int} height
+	 * @returns {object} An object with a bool `fits` property and a `size` property
+	 * @public
+	 */
+	measure: function() {
+
+		this.__forceRedraw();
+
+		var tooltipBcr = this.__$tooltip[0].getBoundingClientRect(),
+			result = { size: {
+				// bcr.width/height are not defined in IE8- but in this
+				// case, bcr.right/bottom will have the same value
+				// except in iOS 8+ where tooltipBcr.bottom/right are wrong
+				// after scrolling for reasons yet to be determined.
+				// tooltipBcr.top/left might not be 0, see issue #514
+				height: tooltipBcr.height || (tooltipBcr.bottom - tooltipBcr.top),
+				width: tooltipBcr.width || (tooltipBcr.right - tooltipBcr.left)
+			}};
+
+		if (this.constraints) {
+
+			// note: we used to use offsetWidth instead of boundingRectClient but
+			// it returned rounded values, causing issues with sub-pixel layouts.
+
+			// note2: noticed that the bcrWidth of text content of a div was once
+			// greater than the bcrWidth of its container by 1px, causing the final
+			// tooltip box to be too small for its content. However, evaluating
+			// their widths one against the other (below) surprisingly returned
+			// equality. Happened only once in Chrome 48, was not able to reproduce
+			// => just having fun with float position values...
+
+			var $content = this.__$tooltip.find('.tooltipster-content'),
+				height = this.__$tooltip.outerHeight(),
+				contentBcr = $content[0].getBoundingClientRect(),
+				fits = {
+					height: height <= this.constraints.height,
+					width: (
+						// this condition accounts for min-width property that
+						// may apply
+						tooltipBcr.width <= this.constraints.width
+							// the -1 is here because scrollWidth actually returns
+							// a rounded value, and may be greater than bcr.width if
+							// it was rounded up. This may cause an issue for contents
+							// which actually really overflow  by 1px or so, but that
+							// should be rare. Not sure how to solve this efficiently.
+							// See http://blogs.msdn.com/b/ie/archive/2012/02/17/sub-pixel-rendering-and-the-css-object-model.aspx
+						&&	contentBcr.width >= $content[0].scrollWidth - 1
+					)
+				};
+
+			result.fits = fits.height && fits.width;
+		}
+
+		// old versions of IE get the width wrong for some reason and it causes
+		// the text to be broken to a new line, so we round it up. If the width
+		// is the width of the screen though, we can assume it is accurate.
+		if (	env.IE
+			&&	env.IE <= 11
+			&&	result.size.width !== env.window.document.documentElement.clientWidth
+		) {
+			result.size.width = Math.ceil(result.size.width) + 1;
+		}
+
+		return result;
+	}
+};
+
+// quick & dirty compare function, not bijective nor multidimensional
+function areEqual(a,b) {
+	var same = true;
+	$.each(a, function(i, _) {
+		if (b[i] === undefined || a[i] !== b[i]) {
+			same = false;
+			return false;
+		}
+	});
+	return same;
+}
+
+/**
+ * A fast function to check if an element is still in the DOM. It
+ * tries to use an id as ids are indexed by the browser, or falls
+ * back to jQuery's `contains` method. May fail if two elements
+ * have the same id, but so be it
+ *
+ * @param {object} $obj A jQuery-wrapped HTML element
+ * @return {boolean}
  */
-
-var TTIP = {};
-
-TTIP.main = {
-    offset:     [15,15],
-    maxWidth:   600,
-
-    setDeferredListeners: function(){
-        $('body').on('mouseover', '.tooltip', yt.show_tip);
-        $('body').on('mousemove', '.tooltip', yt.move_tip);
-        $('body').on('mouseout', '.tooltip', yt.close_tip);
-    },
-
-    init: function(){
-        $('#tip-box').remove();
-        yt.tipBox = document.createElement('div');
-        document.body.appendChild(yt.tipBox);
-        yt.tipBox.id = 'tip-box';
-
-        $(yt.tipBox).hide();
-        $(yt.tipBox).css('position', 'absolute');
-        if(yt.maxWidth !== null){
-          $(yt.tipBox).css('max-width', yt.maxWidth+'px');
-        }
-        yt.setDeferredListeners();
-    },
-
-    show_tip: function(e, el){
-        e.stopPropagation();
-        e.preventDefault();
-        var el = e.data || e.currentTarget || el;
-        if(el.tagName.toLowerCase() === 'img'){
-            yt.tipText = el.alt ? el.alt : '';
-        } else {
-            yt.tipText = el.title ? el.title : '';
-        }
-
-        if(yt.tipText !== ''){
-            // save org title
-            $(el).attr('tt_title', yt.tipText);
-            // reset title to not show org tooltips
-            $(el).attr('title', '');
-
-            yt.tipBox.innerHTML = yt.tipText;
-            $(yt.tipBox).show();
-        }
-    },
-
-    move_tip: function(e, el){
-        e.stopPropagation();
-        e.preventDefault();
-        var el = e.data || e.currentTarget || el;
-        var movePos = [e.pageX, e.pageY];
-        $(yt.tipBox).css('top', (movePos[1] + yt.offset[1]) + 'px')
-        $(yt.tipBox).css('left', (movePos[0] + yt.offset[0]) + 'px')
-    },
-
-    close_tip: function(e, el){
-        e.stopPropagation();
-        e.preventDefault();
-        var el = e.data || e.currentTarget || el;
-        $(yt.tipBox).hide();
-        $(el).attr('title', $(el).attr('tt_title'));
-        $('#tip-box').hide();
-    }
-};
-
-// activate tooltips
-yt = TTIP.main;
-if ($(document).data('activated-tooltips') !== '1'){
-    $(document).ready(yt.init);
-    $(document).data('activated-tooltips', '1');
+function bodyContains($obj) {
+	var id = $obj.attr('id'),
+		el = id ? env.window.document.getElementById(id) : null;
+	// must also check that the element with the id is the one we want
+	return el ? el === $obj[0] : $.contains(env.window.document.body, $obj[0]);
+}
+
+// detect IE versions for dirty fixes
+var uA = navigator.userAgent.toLowerCase();
+if (uA.indexOf('msie') != -1) env.IE = parseInt(uA.split('msie')[1]);
+else if (uA.toLowerCase().indexOf('trident') !== -1 && uA.indexOf(' rv:11') !== -1) env.IE = 11;
+else if (uA.toLowerCase().indexOf('edge/') != -1) env.IE = parseInt(uA.toLowerCase().split('edge/')[1]);
+
+// detecting support for CSS transitions
+function transitionSupport() {
+
+	// env.window is not defined yet when this is called
+	if (!win) return false;
+
+	var b = win.document.body || win.document.documentElement,
+		s = b.style,
+		p = 'transition',
+		v = ['Moz', 'Webkit', 'Khtml', 'O', 'ms'];
+
+	if (typeof s[p] == 'string') { return true; }
+
+	p = p.charAt(0).toUpperCase() + p.substr(1);
+	for (var i=0; i<v.length; i++) {
+		if (typeof s[v[i] + p] == 'string') { return true; }
+	}
+	return false;
 }
+
+// we'll return jQuery for plugins not to have to declare it as a dependency,
+// but it's done by a build task since it should be included only once at the
+// end when we concatenate the main file with a plugin
+// sideTip is Tooltipster's default plugin.
+// This file will be UMDified by a build task.
+
+var pluginName = 'tooltipster.sideTip';
+
+$.tooltipster._plugin({
+	name: pluginName,
+	instance: {
+		/**
+		 * Defaults are provided as a function for an easy override by inheritance
+		 *
+		 * @return {object} An object with the defaults options
+		 * @private
+		 */
+		__defaults: function() {
+
+			return {
+				// if the tooltip should display an arrow that points to the origin
+				arrow: true,
+				// the distance in pixels between the tooltip and the origin
+				distance: 6,
+				// allows to easily change the position of the tooltip
+				functionPosition: null,
+				maxWidth: null,
+				// used to accomodate the arrow of tooltip if there is one.
+				// First to make sure that the arrow target is not too close
+				// to the edge of the tooltip, so the arrow does not overflow
+				// the tooltip. Secondly when we reposition the tooltip to
+				// make sure that it's positioned in such a way that the arrow is
+				// still pointing at the target (and not a few pixels beyond it).
+				// It should be equal to or greater than half the width of
+				// the arrow (by width we mean the size of the side which touches
+				// the side of the tooltip).
+				minIntersection: 16,
+				minWidth: 0,
+				// deprecated in 4.0.0. Listed for _optionsExtract to pick it up
+				position: null,
+				side: 'top',
+				// set to false to position the tooltip relatively to the document rather
+				// than the window when we open it
+				viewportAware: true
+			};
+		},
+
+		/**
+		 * Run once: at instantiation of the plugin
+		 *
+		 * @param {object} instance The tooltipster object that instantiated this plugin
+		 * @private
+		 */
+		__init: function(instance) {
+
+			var self = this;
+
+			// list of instance variables
+
+			self.__instance = instance;
+			self.__namespace = 'tooltipster-sideTip-'+ Math.round(Math.random()*1000000);
+			self.__previousState = 'closed';
+			self.__options;
+
+			// initial formatting
+			self.__optionsFormat();
+
+			self.__instance._on('state.'+ self.__namespace, function(event) {
+
+				if (event.state == 'closed') {
+					self.__close();
+				}
+				else if (event.state == 'appearing' && self.__previousState == 'closed') {
+					self.__create();
+				}
+
+				self.__previousState = event.state;
+			});
+
+			// reformat every time the options are changed
+			self.__instance._on('options.'+ self.__namespace, function() {
+				self.__optionsFormat();
+			});
+
+			self.__instance._on('reposition.'+ self.__namespace, function(e) {
+				self.__reposition(e.event, e.helper);
+			});
+		},
+
+		/**
+		 * Called when the tooltip has closed
+		 *
+		 * @private
+		 */
+		__close: function() {
+
+			// detach our content object first, so the next jQuery's remove()
+			// call does not unbind its event handlers
+			if (this.__instance.content() instanceof $) {
+				this.__instance.content().detach();
+			}
+
+			// remove the tooltip from the DOM
+			this.__instance._$tooltip.remove();
+			this.__instance._$tooltip = null;
+		},
+
+		/**
+		 * Creates the HTML element of the tooltip.
+		 *
+		 * @private
+		 */
+		__create: function() {
+
+			// note: we wrap with a .tooltipster-box div to be able to set a margin on it
+			// (.tooltipster-base must not have one)
+			var $html = $(
+				'<div class="tooltipster-base tooltipster-sidetip">' +
+					'<div class="tooltipster-box">' +
+						'<div class="tooltipster-content"></div>' +
+					'</div>' +
+					'<div class="tooltipster-arrow">' +
+						'<div class="tooltipster-arrow-uncropped">' +
+							'<div class="tooltipster-arrow-border"></div>' +
+							'<div class="tooltipster-arrow-background"></div>' +
+						'</div>' +
+					'</div>' +
+				'</div>'
+			);
+
+			// hide arrow if asked
+			if (!this.__options.arrow) {
+				$html
+					.find('.tooltipster-box')
+						.css('margin', 0)
+						.end()
+					.find('.tooltipster-arrow')
+						.hide();
+			}
+
+			// apply min/max width if asked
+			if (this.__options.minWidth) {
+				$html.css('min-width', this.__options.minWidth + 'px');
+			}
+			if (this.__options.maxWidth) {
+				$html.css('max-width', this.__options.maxWidth + 'px');
+			}
+
+			this.__instance._$tooltip = $html;
+
+			// tell the instance that the tooltip element has been created
+			this.__instance._trigger('created');
+		},
+
+		/**
+		 * Used when the plugin is to be unplugged
+		 *
+		 * @private
+		 */
+		__destroy: function() {
+			this.__instance._off('.'+ self.__namespace);
+		},
+
+		/**
+		 * (Re)compute this.__options from the options declared to the instance
+		 *
+		 * @private
+		 */
+		__optionsFormat: function() {
+
+			var self = this;
+
+			// get the options
+			self.__options = self.__instance._optionsExtract(pluginName, self.__defaults());
+
+			// for backward compatibility, deprecated in v4.0.0
+			if (self.__options.position) {
+				self.__options.side = self.__options.position;
+			}
+
+			// options formatting
+
+			// format distance as a four-cell array if it ain't one yet and then make
+			// it an object with top/bottom/left/right properties
+			if (typeof self.__options.distance != 'object') {
+				self.__options.distance = [self.__options.distance];
+			}
+			if (self.__options.distance.length < 4) {
+
+				if (self.__options.distance[1] === undefined) self.__options.distance[1] = self.__options.distance[0];
+				if (self.__options.distance[2] === undefined) self.__options.distance[2] = self.__options.distance[0];
+				if (self.__options.distance[3] === undefined) self.__options.distance[3] = self.__options.distance[1];
+
+				self.__options.distance = {
+					top: self.__options.distance[0],
+					right: self.__options.distance[1],
+					bottom: self.__options.distance[2],
+					left: self.__options.distance[3]
+				};
+			}
+
+			// let's transform:
+			// 'top' into ['top', 'bottom', 'right', 'left']
+			// 'right' into ['right', 'left', 'top', 'bottom']
+			// 'bottom' into ['bottom', 'top', 'right', 'left']
+			// 'left' into ['left', 'right', 'top', 'bottom']
+			if (typeof self.__options.side == 'string') {
+
+				var opposites = {
+					'top': 'bottom',
+					'right': 'left',
+					'bottom': 'top',
+					'left': 'right'
+				};
+
+				self.__options.side = [self.__options.side, opposites[self.__options.side]];
+
+				if (self.__options.side[0] == 'left' || self.__options.side[0] == 'right') {
+					self.__options.side.push('top', 'bottom');
+				}
+				else {
+					self.__options.side.push('right', 'left');
+				}
+			}
+
+			// misc
+			// disable the arrow in IE6 unless the arrow option was explicitly set to true
+			if (	$.tooltipster._env.IE === 6
+				&&	self.__options.arrow !== true
+			) {
+				self.__options.arrow = false;
+			}
+		},
+
+		/**
+		 * This method must compute and set the positioning properties of the
+		 * tooltip (left, top, width, height, etc.). It must also make sure the
+		 * tooltip is eventually appended to its parent (since the element may be
+		 * detached from the DOM at the moment the method is called).
+		 *
+		 * We'll evaluate positioning scenarios to find which side can contain the
+		 * tooltip in the best way. We'll consider things relatively to the window
+		 * (unless the user asks not to), then to the document (if need be, or if the
+		 * user explicitly requires the tests to run on the document). For each
+		 * scenario, measures are taken, allowing us to know how well the tooltip
+		 * is going to fit. After that, a sorting function will let us know what
+		 * the best scenario is (we also allow the user to choose his favorite
+		 * scenario by using an event).
+		 *
+		 * @param {object} helper An object that contains variables that plugin
+		 * creators may find useful (see below)
+		 * @param {object} helper.geo An object with many layout properties
+		 * about objects of interest (window, document, origin). This should help
+		 * plugin users compute the optimal position of the tooltip
+		 * @private
+		 */
+		__reposition: function(event, helper) {
+
+			var self = this,
+				finalResult,
+				// to know where to put the tooltip, we need to know on which point
+				// of the x or y axis we should center it. That coordinate is the target
+				targets = self.__targetFind(helper),
+				testResults = [];
+
+			// make sure the tooltip is detached while we make tests on a clone
+			self.__instance._$tooltip.detach();
+
+			// we could actually provide the original element to the Ruler and
+			// not a clone, but it just feels right to keep it out of the
+			// machinery.
+			var $clone = self.__instance._$tooltip.clone(),
+				// start position tests session
+				ruler = $.tooltipster._getRuler($clone),
+				satisfied = false,
+				animation = self.__instance.option('animation');
+
+			// an animation class could contain properties that distort the size
+			if (animation) {
+				$clone.removeClass('tooltipster-'+ animation);
+			}
+
+			// start evaluating scenarios
+			$.each(['window', 'document'], function(i, container) {
+
+				var takeTest = null;
+
+				// let the user decide to keep on testing or not
+				self.__instance._trigger({
+					container: container,
+					helper: helper,
+					satisfied: satisfied,
+					takeTest: function(bool) {
+						takeTest = bool;
+					},
+					results: testResults,
+					type: 'positionTest'
+				});
+
+				if (	takeTest == true
+					||	(	takeTest != false
+						&&	satisfied == false
+							// skip the window scenarios if asked. If they are reintegrated by
+							// the callback of the positionTest event, they will have to be
+							// excluded using the callback of positionTested
+						&&	(container != 'window' || self.__options.viewportAware)
+					)
+				) {
+
+					// for each allowed side
+					for (var i=0; i < self.__options.side.length; i++) {
+
+						var distance = {
+								horizontal: 0,
+								vertical: 0
+							},
+							side = self.__options.side[i];
+
+						if (side == 'top' || side == 'bottom') {
+							distance.vertical = self.__options.distance[side];
+						}
+						else {
+							distance.horizontal = self.__options.distance[side];
+						}
+
+						// this may have an effect on the size of the tooltip if there are css
+						// rules for the arrow or something else
+						self.__sideChange($clone, side);
+
+						$.each(['natural', 'constrained'], function(i, mode) {
+
+							takeTest = null;
+
+							// emit an event on the instance
+							self.__instance._trigger({
+								container: container,
+								event: event,
+								helper: helper,
+								mode: mode,
+								results: testResults,
+								satisfied: satisfied,
+								side: side,
+								takeTest: function(bool) {
+									takeTest = bool;
+								},
+								type: 'positionTest'
+							});
+
+							if (	takeTest == true
+								||	(	takeTest != false
+									&&	satisfied == false
+								)
+							) {
+
+								var testResult = {
+									container: container,
+									// we let the distance as an object here, it can make things a little easier
+									// during the user's calculations at positionTest/positionTested
+									distance: distance,
+									// whether the tooltip can fit in the size of the viewport (does not mean
+									// that we'll be able to make it initially entirely visible, see 'whole')
+									fits: null,
+									mode: mode,
+									outerSize: null,
+									side: side,
+									size: null,
+									target: targets[side],
+									// check if the origin has enough surface on screen for the tooltip to
+									// aim at it without overflowing the viewport (this is due to the thickness
+									// of the arrow represented by the minIntersection length).
+									// If not, the tooltip will have to be partly or entirely off screen in
+									// order to stay docked to the origin. This value will stay null when the
+									// container is the document, as it is not relevant
+									whole: null
+								};
+
+								// get the size of the tooltip with or without size constraints
+								var rulerConfigured = (mode == 'natural') ?
+										ruler.free() :
+										ruler.constrain(
+											helper.geo.available[container][side].width - distance.horizontal,
+											helper.geo.available[container][side].height - distance.vertical
+										),
+									rulerResults = rulerConfigured.measure();
+
+								testResult.size = rulerResults.size;
+								testResult.outerSize = {
+									height: rulerResults.size.height + distance.vertical,
+									width: rulerResults.size.width + distance.horizontal
+								};
+
+								if (mode == 'natural') {
+
+									if(		helper.geo.available[container][side].width >= testResult.outerSize.width
+										&&	helper.geo.available[container][side].height >= testResult.outerSize.height
+									) {
+										testResult.fits = true;
+									}
+									else {
+										testResult.fits = false;
+									}
+								}
+								else {
+									testResult.fits = rulerResults.fits;
+								}
+
+								if (container == 'window') {
+
+									if (!testResult.fits) {
+										testResult.whole = false;
+									}
+									else {
+										if (side == 'top' || side == 'bottom') {
+
+											testResult.whole = (
+													helper.geo.origin.windowOffset.right >= self.__options.minIntersection
+												&&	helper.geo.window.size.width - helper.geo.origin.windowOffset.left >= self.__options.minIntersection
+											);
+										}
+										else {
+											testResult.whole = (
+													helper.geo.origin.windowOffset.bottom >= self.__options.minIntersection
+												&&	helper.geo.window.size.height - helper.geo.origin.windowOffset.top >= self.__options.minIntersection
+											);
+										}
+									}
+								}
+
+								testResults.push(testResult);
+
+								// we don't need to compute more positions if we have one fully on screen
+								if (testResult.whole) {
+									satisfied = true;
+								}
+								else {
+									// don't run the constrained test unless the natural width was greater
+									// than the available width, otherwise it's pointless as we know it
+									// wouldn't fit either
+									if (	testResult.mode == 'natural'
+										&&	(	testResult.fits
+											||	testResult.size.width <= helper.geo.available[container][side].width
+										)
+									) {
+										return false;
+									}
+								}
+							}
+						});
+					}
+				}
+			});
+
+			// the user may eliminate the unwanted scenarios from testResults, but he's
+			// not supposed to alter them at this point. functionPosition and the
+			// position event serve that purpose.
+			self.__instance._trigger({
+				edit: function(r) {
+					testResults = r;
+				},
+				event: event,
+				helper: helper,
+				results: testResults,
+				type: 'positionTested'
+			});
+
+			/**
+			 * Sort the scenarios to find the favorite one.
+			 *
+			 * The favorite scenario is when we can fully display the tooltip on screen,
+			 * even if it means that the middle of the tooltip is no longer centered on
+			 * the middle of the origin (when the origin is near the edge of the screen
+			 * or even partly off screen). We want the tooltip on the preferred side,
+			 * even if it means that we have to use a constrained size rather than a
+			 * natural one (as long as it fits). When the origin is off screen at the top
+			 * the tooltip will be positioned at the bottom (if allowed), if the origin
+			 * is off screen on the right, it will be positioned on the left, etc.
+			 * If there are no scenarios where the tooltip can fit on screen, or if the
+			 * user does not want the tooltip to fit on screen (viewportAware == false),
+			 * we fall back to the scenarios relative to the document.
+			 *
+			 * When the tooltip is bigger than the viewport in either dimension, we stop
+			 * looking at the window scenarios and consider the document scenarios only,
+			 * with the same logic to find on which side it would fit best.
+			 *
+			 * If the tooltip cannot fit the document on any side, we force it at the
+			 * bottom, so at least the user can scroll to see it.
+ 			 */
+			testResults.sort(function(a, b) {
+
+				// best if it's whole (the tooltip fits and adapts to the viewport)
+				if (a.whole && !b.whole) {
+					return -1;
+				}
+				else if (!a.whole && b.whole) {
+					return 1;
+				}
+				else if (a.whole && b.whole) {
+
+					var ai = self.__options.side.indexOf(a.side),
+						bi = self.__options.side.indexOf(b.side);
+
+					// use the user's sides fallback array
+					if (ai < bi) {
+						return -1;
+					}
+					else if (ai > bi) {
+						return 1;
+					}
+					else {
+						// will be used if the user forced the tests to continue
+						return a.mode == 'natural' ? -1 : 1;
+					}
+				}
+				else {
+
+					// better if it fits
+					if (a.fits && !b.fits) {
+						return -1;
+					}
+					else if (!a.fits && b.fits) {
+						return 1;
+					}
+					else if (a.fits && b.fits) {
+
+						var ai = self.__options.side.indexOf(a.side),
+							bi = self.__options.side.indexOf(b.side);
+
+						// use the user's sides fallback array
+						if (ai < bi) {
+							return -1;
+						}
+						else if (ai > bi) {
+							return 1;
+						}
+						else {
+							// will be used if the user forced the tests to continue
+							return a.mode == 'natural' ? -1 : 1;
+						}
+					}
+					else {
+
+						// if everything failed, this will give a preference to the case where
+						// the tooltip overflows the document at the bottom
+						if (	a.container == 'document'
+							&&	a.side == 'bottom'
+							&&	a.mode == 'natural'
+						) {
+							return -1;
+						}
+						else {
+							return 1;
+						}
+					}
+				}
+			});
+
+			finalResult = testResults[0];
+
+
+			// now let's find the coordinates of the tooltip relatively to the window
+			finalResult.coord = {};
+
+			switch (finalResult.side) {
+
+				case 'left':
+				case 'right':
+					finalResult.coord.top = Math.floor(finalResult.target - finalResult.size.height / 2);
+					break;
+
+				case 'bottom':
+				case 'top':
+					finalResult.coord.left = Math.floor(finalResult.target - finalResult.size.width / 2);
+					break;
+			}
+
+			switch (finalResult.side) {
+
+				case 'left':
+					finalResult.coord.left = helper.geo.origin.windowOffset.left - finalResult.outerSize.width;
+					break;
+
+				case 'right':
+					finalResult.coord.left = helper.geo.origin.windowOffset.right + finalResult.distance.horizontal;
+					break;
+
+				case 'top':
+					finalResult.coord.top = helper.geo.origin.windowOffset.top - finalResult.outerSize.height;
+					break;
+
+				case 'bottom':
+					finalResult.coord.top = helper.geo.origin.windowOffset.bottom + finalResult.distance.vertical;
+					break;
+			}
+
+			// if the tooltip can potentially be contained within the viewport dimensions
+			// and that we are asked to make it fit on screen
+			if (finalResult.container == 'window') {
+
+				// if the tooltip overflows the viewport, we'll move it accordingly (then it will
+				// not be centered on the middle of the origin anymore). We only move horizontally
+				// for top and bottom tooltips and vice versa.
+				if (finalResult.side == 'top' || finalResult.side == 'bottom') {
+
+					// if there is an overflow on the left
+					if (finalResult.coord.left < 0) {
+
+						// prevent the overflow unless the origin itself gets off screen (minus the
+						// margin needed to keep the arrow pointing at the target)
+						if (helper.geo.origin.windowOffset.right - this.__options.minIntersection >= 0) {
+							finalResult.coord.left = 0;
+						}
+						else {
+							finalResult.coord.left = helper.geo.origin.windowOffset.right - this.__options.minIntersection - 1;
+						}
+					}
+					// or an overflow on the right
+					else if (finalResult.coord.left > helper.geo.window.size.width - finalResult.size.width) {
+
+						if (helper.geo.origin.windowOffset.left + this.__options.minIntersection <= helper.geo.window.size.width) {
+							finalResult.coord.left = helper.geo.window.size.width - finalResult.size.width;
+						}
+						else {
+							finalResult.coord.left = helper.geo.origin.windowOffset.left + this.__options.minIntersection + 1 - finalResult.size.width;
+						}
+					}
+				}
+				else {
+
+					// overflow at the top
+					if (finalResult.coord.top < 0) {
+
+						if (helper.geo.origin.windowOffset.bottom - this.__options.minIntersection >= 0) {
+							finalResult.coord.top = 0;
+						}
+						else {
+							finalResult.coord.top = helper.geo.origin.windowOffset.bottom - this.__options.minIntersection - 1;
+						}
+					}
+					// or at the bottom
+					else if (finalResult.coord.top > helper.geo.window.size.height - finalResult.size.height) {
+
+						if (helper.geo.origin.windowOffset.top + this.__options.minIntersection <= helper.geo.window.size.height) {
+							finalResult.coord.top = helper.geo.window.size.height - finalResult.size.height;
+						}
+						else {
+							finalResult.coord.top = helper.geo.origin.windowOffset.top + this.__options.minIntersection + 1 - finalResult.size.height;
+						}
+					}
+				}
+			}
+			else {
+
+				// there might be overflow here too but it's easier to handle. If there has
+				// to be an overflow, we'll make sure it's on the right side of the screen
+				// (because the browser will extend the document size if there is an overflow
+				// on the right, but not on the left). The sort function above has already
+				// made sure that a bottom document overflow is preferred to a top overflow,
+				// so we don't have to care about it.
+
+				// if there is an overflow on the right
+				if (finalResult.coord.left > helper.geo.window.size.width - finalResult.size.width) {
+
+					// this may actually create on overflow on the left but we'll fix it in a sec
+					finalResult.coord.left = helper.geo.window.size.width - finalResult.size.width;
+				}
+
+				// if there is an overflow on the left
+				if (finalResult.coord.left < 0) {
+
+					// don't care if it overflows the right after that, we made our best
+					finalResult.coord.left = 0;
+				}
+			}
+
+
+			// submit the positioning proposal to the user function which may choose to change
+			// the side, size and/or the coordinates
+
+			// first, set the rules that corresponds to the proposed side: it may change
+			// the size of the tooltip, and the custom functionPosition may want to detect the
+			// size of something before making a decision. So let's make things easier for the
+			// implementor
+			self.__sideChange($clone, finalResult.side);
+
+			// add some variables to the helper
+			helper.tooltipClone = $clone[0];
+			helper.tooltipParent = self.__instance.option('parent').parent[0];
+			// move informative values to the helper
+			helper.mode = finalResult.mode;
+			helper.whole = finalResult.whole;
+			// add some variables to the helper for the functionPosition callback (these
+			// will also be added to the event fired by self.__instance._trigger but that's
+			// ok, we're just being consistent)
+			helper.origin = self.__instance._$origin[0];
+			helper.tooltip = self.__instance._$tooltip[0];
+
+			// leave only the actionable values in there for functionPosition
+			delete finalResult.container;
+			delete finalResult.fits;
+			delete finalResult.mode;
+			delete finalResult.outerSize;
+			delete finalResult.whole;
+
+			// keep only the distance on the relevant side, for clarity
+			finalResult.distance = finalResult.distance.horizontal || finalResult.distance.vertical;
+
+			// beginners may not be comfortable with the concept of editing the object
+			//  passed by reference, so we provide an edit function and pass a clone
+			var finalResultClone = $.extend(true, {}, finalResult);
+
+			// emit an event on the instance
+			self.__instance._trigger({
+				edit: function(result) {
+					finalResult = result;
+				},
+				event: event,
+				helper: helper,
+				position: finalResultClone,
+				type: 'position'
+			});
+
+			if (self.__options.functionPosition) {
+
+				var result = self.__options.functionPosition.call(self, self.__instance, helper, finalResultClone);
+
+				if (result) finalResult = result;
+			}
+
+			// end the positioning tests session (the user might have had a
+			// use for it during the position event, now it's over)
+			ruler.destroy();
+
+			// compute the position of the target relatively to the tooltip root
+			// element so we can place the arrow and make the needed adjustments
+			var arrowCoord,
+				maxVal;
+
+			if (finalResult.side == 'top' || finalResult.side == 'bottom') {
+
+				arrowCoord = {
+					prop: 'left',
+					val: finalResult.target - finalResult.coord.left
+				};
+				maxVal = finalResult.size.width - this.__options.minIntersection;
+			}
+			else {
+
+				arrowCoord = {
+					prop: 'top',
+					val: finalResult.target - finalResult.coord.top
+				};
+				maxVal = finalResult.size.height - this.__options.minIntersection;
+			}
+
+			// cannot lie beyond the boundaries of the tooltip, minus the
+			// arrow margin
+			if (arrowCoord.val < this.__options.minIntersection) {
+				arrowCoord.val = this.__options.minIntersection;
+			}
+			else if (arrowCoord.val > maxVal) {
+				arrowCoord.val = maxVal;
+			}
+
+			var originParentOffset;
+
+			// let's convert the window-relative coordinates into coordinates relative to the
+			// future positioned parent that the tooltip will be appended to
+			if (helper.geo.origin.fixedLineage) {
+
+				// same as windowOffset when the position is fixed
+				originParentOffset = helper.geo.origin.windowOffset;
+			}
+			else {
+
+				// this assumes that the parent of the tooltip is located at
+				// (0, 0) in the document, typically like when the parent is
+				// <body>.
+				// If we ever allow other types of parent, .tooltipster-ruler
+				// will have to be appended to the parent to inherit css style
+				// values that affect the display of the text and such.
+				originParentOffset = {
+					left: helper.geo.origin.windowOffset.left + helper.geo.window.scroll.left,
+					top: helper.geo.origin.windowOffset.top + helper.geo.window.scroll.top
+				};
+			}
+
+			finalResult.coord = {
+				left: originParentOffset.left + (finalResult.coord.left - helper.geo.origin.windowOffset.left),
+				top: originParentOffset.top + (finalResult.coord.top - helper.geo.origin.windowOffset.top)
+			};
+
+			// set position values on the original tooltip element
+
+			self.__sideChange(self.__instance._$tooltip, finalResult.side);
+
+			if (helper.geo.origin.fixedLineage) {
+				self.__instance._$tooltip
+					.css('position', 'fixed');
+			}
+			else {
+				// CSS default
+				self.__instance._$tooltip
+					.css('position', '');
+			}
+
+			self.__instance._$tooltip
+				.css({
+					left: finalResult.coord.left,
+					top: finalResult.coord.top,
+					// we need to set a size even if the tooltip is in its natural size
+					// because when the tooltip is positioned beyond the width of the body
+					// (which is by default the width of the window; it will happen when
+					// you scroll the window horizontally to get to the origin), its text
+					// content will otherwise break lines at each word to keep up with the
+					// body overflow strategy.
+					height: finalResult.size.height,
+					width: finalResult.size.width
+				})
+				.find('.tooltipster-arrow')
+					.css({
+						'left': '',
+						'top': ''
+					})
+					.css(arrowCoord.prop, arrowCoord.val);
+
+			// append the tooltip HTML element to its parent
+			self.__instance._$tooltip.appendTo(self.__instance.option('parent'));
+
+			self.__instance._trigger({
+				type: 'repositioned',
+				event: event,
+				position: finalResult
+			});
+		},
+
+		/**
+		 * Make whatever modifications are needed when the side is changed. This has
+		 * been made an independant method for easy inheritance in custom plugins based
+		 * on this default plugin.
+		 *
+		 * @param {object} $obj
+		 * @param {string} side
+		 * @private
+		 */
+		__sideChange: function($obj, side) {
+
+			$obj
+				.removeClass('tooltipster-bottom')
+				.removeClass('tooltipster-left')
+				.removeClass('tooltipster-right')
+				.removeClass('tooltipster-top')
+				.addClass('tooltipster-'+ side);
+		},
+
+		/**
+		 * Returns the target that the tooltip should aim at for a given side.
+		 * The calculated value is a distance from the edge of the window
+		 * (left edge for top/bottom sides, top edge for left/right side). The
+		 * tooltip will be centered on that position and the arrow will be
+		 * positioned there (as much as possible).
+		 *
+		 * @param {object} helper
+		 * @return {integer}
+		 * @private
+		 */
+		__targetFind: function(helper) {
+
+			var target = {},
+				rects = this.__instance._$origin[0].getClientRects();
+
+			// these lines fix a Chrome bug (issue #491)
+			if (rects.length > 1) {
+				var opacity = this.__instance._$origin.css('opacity');
+				if(opacity == 1) {
+					this.__instance._$origin.css('opacity', 0.99);
+					rects = this.__instance._$origin[0].getClientRects();
+					this.__instance._$origin.css('opacity', 1);
+				}
+			}
+
+			// by default, the target will be the middle of the origin
+			if (rects.length < 2) {
+
+				target.top = Math.floor(helper.geo.origin.windowOffset.left + (helper.geo.origin.size.width / 2));
+				target.bottom = target.top;
+
+				target.left = Math.floor(helper.geo.origin.windowOffset.top + (helper.geo.origin.size.height / 2));
+				target.right = target.left;
+			}
+			// if multiple client rects exist, the element may be text split
+			// up into multiple lines and the middle of the origin may not be
+			// best option anymore. We need to choose the best target client rect
+			else {
+
+				// top: the first
+				var targetRect = rects[0];
+				target.top = Math.floor(targetRect.left + (targetRect.right - targetRect.left) / 2);
+
+				// right: the middle line, rounded down in case there is an even
+				// number of lines (looks more centered => check out the
+				// demo with 4 split lines)
+				if (rects.length > 2) {
+					targetRect = rects[Math.ceil(rects.length / 2) - 1];
+				}
+				else {
+					targetRect = rects[0];
+				}
+				target.right = Math.floor(targetRect.top + (targetRect.bottom - targetRect.top) / 2);
+
+				// bottom: the last
+				targetRect = rects[rects.length - 1];
+				target.bottom = Math.floor(targetRect.left + (targetRect.right - targetRect.left) / 2);
+
+				// left: the middle line, rounded up
+				if (rects.length > 2) {
+					targetRect = rects[Math.ceil((rects.length + 1) / 2) - 1];
+				}
+				else {
+					targetRect = rects[rects.length - 1];
+				}
+
+				target.left = Math.floor(targetRect.top + (targetRect.bottom - targetRect.top) / 2);
+			}
+
+			return target;
+		}
+	}
+});
+
+/* a build task will add "return $;" here */
+return $;
+
+}));
+
+//
+// $(document).ready(function() {
+// 	$('.tooltip-hovercard').tooltipster({
+// 		theme: 'tooltipster-shadow',
+// 		animation: 'fade',
+//    		delay: 100,
+// 		contentCloning: true,
+//
+// });
  No newline at end of file

rhodecode/templates/admin/gists/gist_index.mako

@@ -1,137 +1,139 b''
 ## -*- coding: utf-8 -*-
 <%inherit file="/base/base.mako"/>
 
 <%def name="title()">
     %if c.show_private:
         ${_('Private Gists for user {}').format(c.rhodecode_user.username)}
     %elif c.show_public:
         ${_('Public Gists for user {}').format(c.rhodecode_user.username)}
     %else:
         ${_('Public Gists')}
     %endif
     %if c.rhodecode_name:
         &middot; ${h.branding(c.rhodecode_name)}
     %endif
 </%def>
 
 <%def name="breadcrumbs_links()"></%def>
 
 <%def name="menu_bar_nav()">
     ${self.menu_items(active='gists')}
 </%def>
 
 <%def name="main()">
 
 <div class="box">
     <div class="title">
 
     <ul class="button-links">
       % if c.is_super_admin:
         <li class="btn ${('active' if c.active=='all' else '')}"><a href="${h.route_path('gists_show', _query={'all': 1})}">${_('All gists')}</a></li>
       %endif
       <li class="btn ${('active' if c.active=='public' else '')}"><a href="${h.route_path('gists_show')}">${_('All public')}</a></li>
       %if c.rhodecode_user.username != h.DEFAULT_USER:
         <li class="btn ${('active' if c.active=='my_all' else '')}"><a href="${h.route_path('gists_show', _query={'public':1, 'private': 1})}">${_('My gists')}</a></li>
         <li class="btn ${('active' if c.active=='my_private' else '')}"><a href="${h.route_path('gists_show', _query={'private': 1})}">${_('My private')}</a></li>
         <li class="btn ${('active' if c.active=='my_public' else '')}"><a href="${h.route_path('gists_show', _query={'public': 1})}">${_('My public')}</a></li>
       %endif
     </ul>
 
     <div class="grid-quick-filter">
         <ul class="grid-filter-box">
             <li class="grid-filter-box-icon">
                 <i class="icon-search"></i>
             </li>
             <li class="grid-filter-box-input">
                 <input class="q_filter_box" id="q_filter" size="15" type="text" name="filter" placeholder="${_('quick filter...')}" value=""/>
             </li>
         </ul>
     </div>
 
   </div>
 
     <div class="main-content-full-width">
         <div id="repos_list_wrap">
             <table id="gist_list_table" class="display"></table>
         </div>
     </div>
 
 </div>
 
 <script type="text/javascript">
 $(document).ready(function() {
 
     var get_datatable_count = function(){
       var api = $('#gist_list_table').dataTable().api();
       $('#gists_count').text(api.page.info().recordsDisplay);
     };
 
 
     // custom filter that filters by access_id, description or author
     $.fn.dataTable.ext.search.push(
         function( settings, data, dataIndex ) {
             var query = $('#q_filter').val();
             var author = data[0].strip();
             var access_id = data[2].strip();
             var description = data[3].strip();
 
             var query_str = (access_id + " " + author + " " + description).toLowerCase();
 
             if(query_str.indexOf(query.toLowerCase()) !== -1){
                 return true;
             }
             return false;
         }
     );
 
     // gists list
     $('#gist_list_table').DataTable({
       data: ${c.data|n},
       dom: 'rtp',
       pageLength: ${c.visual.dashboard_items},
       order: [[ 4, "desc" ]],
       columns: [
          { data: {"_": "author",
                   "sort": "author_raw"}, title: "${_("Author")}", width: "250px", className: "td-user" },
          { data: {"_": "type",
                   "sort": "type"}, title: "${_("Type")}", width: "70px", className: "td-tags" },
          { data: {"_": "access_id",
                   "sort": "access_id"}, title: "${_("Name")}", width:"150px", className: "td-componentname" },
          { data: {"_": "description",
                   "sort": "description"}, title: "${_("Description")}", width: "250px", className: "td-description" },
          { data: {"_": "created_on",
                   "sort": "created_on_raw"}, title: "${_("Created on")}", className: "td-time" },
          { data: {"_": "expires",
                   "sort": "expires"}, title: "${_("Expires")}", className: "td-exp" }
       ],
       language: {
           paginate: DEFAULT_GRID_PAGINATION,
           emptyTable: _gettext("No gists available yet.")
       },
       "initComplete": function( settings, json ) {
           timeagoActivate();
+          tooltipActivate();
           get_datatable_count();
       }
     });
 
     // update the counter when things change
     $('#gist_list_table').on('draw.dt', function() {
         timeagoActivate();
+        tooltipActivate();
         get_datatable_count();
     });
 
     // filter, filter both grids
     $('#q_filter').on( 'keyup', function () {
       var repo_api = $('#gist_list_table').dataTable().api();
       repo_api
         .draw();
     });
 
     // refilter table if page load via back button
     $("#q_filter").trigger('keyup');
 
   });
 
 </script>
 </%def>
 

rhodecode/templates/admin/gists/gist_show.mako

@@ -1,111 +1,111 b''
 ## -*- coding: utf-8 -*-
 <%inherit file="/base/base.mako"/>
 
 <%def name="robots()">
     %if c.gist.gist_type != 'public':
       <meta name="robots" content="noindex, nofollow">
     %else:
       ${parent.robots()}
     %endif
 </%def>
 
 <%def name="title()">
     ${_('Gist')} &middot; ${c.gist.gist_access_id}
     %if c.rhodecode_name:
         &middot; ${h.branding(c.rhodecode_name)}
     %endif
 </%def>
 
 <%def name="breadcrumbs_links()">
     ${_('Gist')} &middot; ${c.gist.gist_access_id}
 </%def>
 
 <%def name="menu_bar_nav()">
     ${self.menu_items(active='gists')}
 </%def>
 
 <%def name="main()">
 <div class="box">
     <!-- box / title -->
     <div class="title">
         ${self.breadcrumbs()}
     </div>
 
     <div class="table">
         <div id="files_data">
             <div id="codeblock" class="codeblock">
                 <div class="code-header">
                     <div class="gist_url">
                         <code>
                             ${c.gist.gist_url()} <span class="icon-clipboard clipboard-action" data-clipboard-text="${c.gist.gist_url()}" title="${_('Copy the url')}"></span>
                         </code>
                     </div>
                     <div class="stats">
                        %if c.is_super_admin or c.gist.gist_owner == c.rhodecode_user.user_id:
                         <div class="remove_gist">
                             ${h.secure_form(h.route_path('gist_delete', gist_id=c.gist.gist_access_id), request=request)}
                                 ${h.submit('remove_gist', _('Delete'),class_="btn btn-mini btn-danger",onclick="return confirm('"+_('Confirm to delete this Gist')+"');")}
                             ${h.end_form()}
                         </div>
                        %endif
                         <div class="buttons">
                           ## only owner should see that
                           <a href="#copySource" onclick="return false;" class="btn btn-mini icon-clipboard clipboard-action" data-clipboard-text="${c.files[0].content}">${_('Copy content')}</a>
 
                           %if c.is_super_admin or c.gist.gist_owner == c.rhodecode_user.user_id:
                             ${h.link_to(_('Edit'), h.route_path('gist_edit', gist_id=c.gist.gist_access_id), class_="btn btn-mini")}
                           %endif
                           ${h.link_to(_('Show as Raw'), h.route_path('gist_show_formatted', gist_id=c.gist.gist_access_id, revision='tip', format='raw'), class_="btn btn-mini")}
                         </div>
                         <div class="left" >
                           %if c.gist.gist_type != 'public':
                             <span class="tag tag-ok disabled">${_('Private Gist')}</span>
                           %endif
                           <span> ${c.gist.gist_description}</span>
                            <span>${_('Expires')}:
                            %if c.gist.gist_expires == -1:
                              ${_('never')}
                            %else:
                               ${h.age_component(h.time_to_utcdatetime(c.gist.gist_expires))}
                           %endif
                           </span>
 
                        </div>
                     </div>
 
                     <div class="author">
                         <div title="${h.tooltip(c.file_last_commit.author)}">
-                          ${self.gravatar_with_user(c.file_last_commit.author, 16)} - ${_('created')} ${h.age_component(c.file_last_commit.date)}
+                          ${self.gravatar_with_user(c.file_last_commit.author, 16, tooltip=True)} - ${_('created')} ${h.age_component(c.file_last_commit.date)}
                         </div>
 
                     </div>
                     <div class="commit">${h.urlify_commit_message(c.file_last_commit.message, None)}</div>
                 </div>
 
                ## iterate over the files
                % for file in c.files:
                 <% renderer = c.render and h.renderer_from_filename(file.path, exclude=['.txt', '.TXT'])%>
                 <!--
                 <div id="${h.FID('G', file.path)}" class="stats" >
                     <a href="${c.gist.gist_url()}">¶</a>
                     <b >${file.path}</b>
                     <div>
                        ${h.link_to(_('Show as raw'), h.route_path('gist_show_formatted_path', gist_id=c.gist.gist_access_id, revision=file.commit.raw_id, format='raw', f_path=file.path), class_="btn btn-mini")}
                     </div>
                 </div>
                 -->
                 <div class="code-body textarea text-area editor">
                     %if renderer:
                         ${h.render(file.content, renderer=renderer)}
                     %else:
                         ${h.pygmentize(file,linenos=True,anchorlinenos=True,lineanchors='L',cssclass="code-highlight")}
                     %endif
                 </div>
                %endfor
             </div>
         </div>
     </div>
 
 
 </div>
 </%def>

rhodecode/templates/admin/my_account/my_account_pullrequests.mako

@@ -1,93 +1,94 b''
 <%namespace name="base" file="/base/base.mako"/>
 
 <div class="panel panel-default">
   <div class="panel-body">
       %if c.closed:
         ${h.checkbox('show_closed',checked="checked", label=_('Show Closed Pull Requests'))}
       %else:
         ${h.checkbox('show_closed',label=_('Show Closed Pull Requests'))}
       %endif
   </div>
 </div>
 
 <div class="panel panel-default">
     <div class="panel-heading">
         <h3 class="panel-title">${_('Pull Requests You Participate In')}</h3>
     </div>
     <div class="panel-body panel-body-min-height">
         <table id="pull_request_list_table" class="display"></table>
     </div>
 </div>
 
 <script type="text/javascript">
 $(document).ready(function() {
 
     $('#show_closed').on('click', function(e){
         if($(this).is(":checked")){
             window.location = "${h.route_path('my_account_pullrequests', _query={'pr_show_closed':1})}";
         }
         else{
             window.location = "${h.route_path('my_account_pullrequests')}";
         }
     });
 
     var $pullRequestListTable = $('#pull_request_list_table');
 
         // participating object list
         $pullRequestListTable.DataTable({
           processing: true,
           serverSide: true,
           ajax: {
               "url": "${h.route_path('my_account_pullrequests_data')}",
               "data": function (d) {
                   d.closed = "${c.closed}";
               }
           },
           dom: 'rtp',
           pageLength: ${c.visual.dashboard_items},
           order: [[ 2, "desc" ]],
           columns: [
              { data: {"_": "status",
                       "sort": "status"}, title: "", className: "td-status", orderable: false},
              { data: {"_": "target_repo",
                       "sort": "target_repo"}, title: "${_('Target Repo')}", className: "td-targetrepo", orderable: false},
              { data: {"_": "name",
                       "sort": "name_raw"}, title: "${_('Name')}", className: "td-componentname", "type": "num" },
              { data: {"_": "author",
                       "sort": "author_raw"}, title: "${_('Author')}", className: "td-user", orderable: false },
              { data: {"_": "title",
                       "sort": "title"}, title: "${_('Title')}", className: "td-description" },
              { data: {"_": "comments",
                       "sort": "comments_raw"}, title: "", className: "td-comments", orderable: false},
              { data: {"_": "updated_on",
                       "sort": "updated_on_raw"}, title: "${_('Last Update')}", className: "td-time" }
           ],
           language: {
                 paginate: DEFAULT_GRID_PAGINATION,
                 sProcessing: _gettext('loading...'),
                 emptyTable: _gettext("There are currently no open pull requests requiring your participation.")
           },
           "drawCallback": function( settings, json ) {
               timeagoActivate();
+              tooltipActivate();
           },
           "createdRow": function ( row, data, index ) {
               if (data['closed']) {
                 $(row).addClass('closed');
               }
               if (data['owned']) {
                 $(row).addClass('owned');
               }
               if (data['state'] !== 'created') {
                   $(row).addClass('state-' + data['state']);
               }
           }
         });
         $pullRequestListTable.on('xhr.dt', function(e, settings, json, xhr){
             $pullRequestListTable.css('opacity', 1);
         });
 
         $pullRequestListTable.on('preXhr.dt', function(e, settings, data){
             $pullRequestListTable.css('opacity', 0.3);
         });
     });
 </script>

rhodecode/templates/admin/repo_groups/repo_group_edit_advanced.mako

@@ -1,71 +1,71 b''
 <%namespace name="base" file="/base/base.mako"/>
 
 <%
  source_repo_id = c.repo_group.changeset_cache.get('source_repo_id')
 
  elems = [
     (_('Repository Group ID'), c.repo_group.group_id, '', ''),
-    (_('Owner'), lambda:base.gravatar_with_user(c.repo_group.user.email), '', ''),
+    (_('Owner'), lambda:base.gravatar_with_user(c.repo_group.user.email, tooltip=True), '', ''),
     (_('Created on'), h.format_date(c.repo_group.created_on), '', ''),
     (_('Updated on'), h.format_date(c.repo_group.updated_on), '', ''),
     (_('Cached Commit date'), (c.repo_group.changeset_cache.get('date')), '', ''),
     (_('Cached Commit repo_id'), (h.link_to_if(source_repo_id, source_repo_id, h.route_path('repo_summary', repo_name='_{}'.format(source_repo_id)))), '', ''),
 
     (_('Is Personal Group'), c.repo_group.personal or False, '', ''),
 
     (_('Total repositories'), c.repo_group.repositories_recursive_count, '', ''),
     (_('Top level repositories'), c.repo_group.repositories.count(), '', c.repo_group.repositories.all()),
 
     (_('Children groups'), c.repo_group.children.count(), '', c.repo_group.children.all()),
  ]
 %>
 
 <div class="panel panel-default">
     <div class="panel-heading">
         <h3 class="panel-title">${_('Repository Group Advanced: {}').format(c.repo_group.name)}</h3>
     </div>
     <div class="panel-body">
         ${base.dt_info_panel(elems)}
     </div>
 
 </div>
 
 <div class="panel panel-danger">
     <div class="panel-heading">
         <h3 class="panel-title">${_('Delete repository group')}</h3>
     </div>
     <div class="panel-body">
         ${h.secure_form(h.route_path('edit_repo_group_advanced_delete', repo_group_name=c.repo_group.group_name), request=request)}
             <table class="display">
 
                 <tr>
                     <td>
                         ${_ungettext('This repository group includes %s children repository group.', 'This repository group includes %s children repository groups.', c.repo_group.children.count()) % c.repo_group.children.count()}
                     </td>
                     <td>
                     </td>
                     <td>
                     </td>
                 </tr>
                 <tr>
                     <td>
                         ${_ungettext('This repository group includes %s repository.', 'This repository group includes %s repositories.', c.repo_group.repositories_recursive_count) % c.repo_group.repositories_recursive_count}
                     </td>
                     <td>
                     </td>
                     <td>
                     </td>
                 </tr>
 
             </table>
             <div style="margin: 0 0 20px 0" class="fake-space"></div>
 
             <button class="btn btn-small btn-danger" type="submit"
                 onclick="return confirm('${_('Confirm to delete this group: %s') % (c.repo_group.group_name)}');">
                 ${_('Delete this repository group')}
             </button>
         ${h.end_form()}
     </div>
 </div>
 
 

rhodecode/templates/admin/repo_groups/repo_group_edit_permissions.mako

@@ -1,219 +1,220 b''
 <%namespace name="base" file="/base/base.mako"/>
 
 <div class="panel panel-default">
     <div class="panel-heading">
         <h3 class="panel-title">${_('Repository Group Permissions: {}').format(c.repo_group.name)}</h3>
     </div>
     <div class="panel-body">
         ${h.secure_form(h.route_path('edit_repo_group_perms_update', repo_group_name=c.repo_group.group_name), request=request)}
         <table id="permissions_manage" class="rctable permissions">
             <tr>
                 <th class="td-radio">${_('None')}</th>
                 <th class="td-radio">${_('Read')}</th>
                 <th class="td-radio">${_('Write')}</th>
                 <th class="td-radio">${_('Admin')}</th>
                 <th class="td-owner">${_('User/User Group')}</th>
                 <th class="td-action"></th>
                 <th class="td-action"></th>
             </tr>
             ## USERS
             %for _user in c.repo_group.permissions():
                 ## super admin/owner row
                 %if getattr(_user, 'admin_row', None) or getattr(_user, 'owner_row', None):
                     <tr class="perm_admin_row">
                         <td class="td-radio">${h.radio('admin_perm_%s' % _user.user_id,'repository.none', disabled="disabled")}</td>
                         <td class="td-radio">${h.radio('admin_perm_%s' % _user.user_id,'repository.read', disabled="disabled")}</td>
                         <td class="td-radio">${h.radio('admin_perm_%s' % _user.user_id,'repository.write', disabled="disabled")}</td>
                         <td class="td-radio">${h.radio('admin_perm_%s' % _user.user_id,'repository.admin', 'repository.admin', disabled="disabled")}</td>
                         <td class="td-user">
-                            ${base.gravatar(_user.email, 16)}
+                                ${base.gravatar(_user.email, 16, user=_user, tooltip=True)}
                                 ${h.link_to_user(_user.username)}
                                 %if getattr(_user, 'admin_row', None):
                                     (${_('super admin')})
                                 %endif
                                 %if getattr(_user, 'owner_row', None):
                                     (${_('owner')})
                                 %endif
                         </td>
                         <td></td>
                         <td class="quick_repo_menu">
                             % if c.rhodecode_user.is_admin:
                                 <i class="icon-more"></i>
                                 <div class="menu_items_container" style="display: none;">
                                 <ul class="menu_items">
                                   <li>
                                      ${h.link_to('show permissions', h.route_path('edit_user_perms_summary', user_id=_user.user_id, _anchor='repositories-groups-permissions'))}
                                   </li>
                                 </ul>
                                 </div>
                             % endif
                         </td>
                     </tr>
                 %else:
                     <tr>
                         ##forbid revoking permission from yourself, except if you're an super admin
                         %if c.rhodecode_user.user_id != _user.user_id or c.rhodecode_user.is_admin:
                         <td class="td-radio">${h.radio('u_perm_%s' % _user.user_id,'group.none', checked=_user.permission=='group.none')}</td>
                         <td class="td-radio">${h.radio('u_perm_%s' % _user.user_id,'group.read', checked=_user.permission=='group.read')}</td>
                         <td class="td-radio">${h.radio('u_perm_%s' % _user.user_id,'group.write', checked=_user.permission=='group.write')}</td>
                         <td class="td-radio">${h.radio('u_perm_%s' % _user.user_id,'group.admin', checked=_user.permission=='group.admin')}</td>
                         <td class="td-user">
-                            ${base.gravatar(_user.email, 16)}
+                            ${base.gravatar(_user.email, 16, user=_user, tooltip=True)}
                             <span class="user">
                                 % if _user.username == h.DEFAULT_USER:
                                     ${h.DEFAULT_USER} <span class="user-perm-help-text"> - ${_('permission for all other users')}</span>
                                 % else:
                                     ${h.link_to_user(_user.username)}
                                     %if getattr(_user, 'duplicate_perm', None):
                                         (${_('inactive duplicate')})
                                     %endif
                                 % endif
                             </span>
                         </td>
                         <td class="td-action">
                             %if _user.username != h.DEFAULT_USER:
                                 <span  class="btn btn-link btn-danger revoke_perm"
                                   member="${_user.user_id}" member_type="user">
                                 ${_('Remove')}
                                 </span>
                             %endif
                         </td>
                         <td class="quick_repo_menu">
                             % if c.rhodecode_user.is_admin:
                                 <i class="icon-more"></i>
                                 <div class="menu_items_container" style="display: none;">
                                 <ul class="menu_items">
                                   <li>
                                     % if _user.username == h.DEFAULT_USER:
                                         ${h.link_to('show permissions', h.route_path('admin_permissions_overview', _anchor='repositories-groups-permissions'))}
                                     % else:
                                         ${h.link_to('show permissions', h.route_path('edit_user_perms_summary', user_id=_user.user_id, _anchor='repositories-groups-permissions'))}
                                     % endif
                                   </li>
                                 </ul>
                                 </div>
                             % endif
                         </td>
                         %else:
                             ## special case for currently logged-in user permissions, we make sure he cannot take his own permissions
                             <td class="td-radio">${h.radio('u_perm_%s' % _user.user_id,'group.none', disabled="disabled")}</td>
                             <td class="td-radio">${h.radio('u_perm_%s' % _user.user_id,'group.read', disabled="disabled")}</td>
                             <td class="td-radio">${h.radio('u_perm_%s' % _user.user_id,'group.write', disabled="disabled")}</td>
                             <td class="td-radio">${h.radio('u_perm_%s' % _user.user_id,'group.admin', disabled="disabled")}</td>
                             <td class="td-user">
-                                ${base.gravatar(_user.email, 16)}
+                                ${base.gravatar(_user.email, 16, user=_user, tooltip=True)}
                                 <span class="user">
                                     % if _user.username == h.DEFAULT_USER:
                                         ${h.DEFAULT_USER} <span class="user-perm-help-text"> - ${_('permission for all other users')}</span>
                                     % else:
                                         ${h.link_to_user(_user.username)}
                                         %if getattr(_user, 'duplicate_perm', None):
                                             (${_('inactive duplicate')})
                                         %endif
                                     % endif
                                     <span class="user-perm-help-text">(${_('delegated admin')})</span>
                                 </span>
                             </td>
                             <td></td>
                             <td class="quick_repo_menu">
                                 % if c.rhodecode_user.is_admin:
                                     <i class="icon-more"></i>
                                     <div class="menu_items_container" style="display: none;">
                                     <ul class="menu_items">
                                       <li>
                                          ${h.link_to('show permissions', h.route_path('edit_user_perms_summary', user_id=_user.user_id, _anchor='repositories-groups-permissions'))}
                                       </li>
                                     </ul>
                                     </div>
                                 % endif
                             </td>
                         %endif
                     </tr>
                 %endif
             %endfor
 
             ## USER GROUPS
             %for _user_group in c.repo_group.permission_user_groups(with_members=True):
                 <tr id="id${id(_user_group.users_group_name)}">
                     <td class="td-radio">${h.radio('g_perm_%s' % _user_group.users_group_id,'group.none', checked=_user_group.permission=='group.none')}</td>
                     <td class="td-radio">${h.radio('g_perm_%s' % _user_group.users_group_id,'group.read', checked=_user_group.permission=='group.read')}</td>
                     <td class="td-radio">${h.radio('g_perm_%s' % _user_group.users_group_id,'group.write', checked=_user_group.permission=='group.write')}</td>
                     <td class="td-radio">${h.radio('g_perm_%s' % _user_group.users_group_id,'group.admin', checked=_user_group.permission=='group.admin')}</td>
                     <td class="td-componentname">
-                        <i class="icon-user-group"></i>
+                        ${base.user_group_icon(_user_group, tooltip=True)}
+
                         %if c.is_super_admin:
                          <a href="${h.route_path('edit_user_group',user_group_id=_user_group.users_group_id)}">
                              ${_user_group.users_group_name}
                          </a>
                         %else:
                          ${h.link_to_group(_user_group.users_group_name)}
                         %endif
                         (${_('members')}: ${len(_user_group.members)})
                     </td>
                     <td class="td-action">
                         <span  class="btn btn-link btn-danger revoke_perm"
                               member="${_user_group.users_group_id}" member_type="user_group">
                         ${_('Remove')}
                         </span>
                     </td>
                     <td class="quick_repo_menu">
                         % if c.rhodecode_user.is_admin:
                             <i class="icon-more"></i>
                             <div class="menu_items_container" style="display: none;">
                             <ul class="menu_items">
                               <li>
                                  ${h.link_to('show permissions', h.route_path('edit_user_group_perms_summary', user_group_id=_user_group.users_group_id, _anchor='repositories-groups-permissions'))}
                               </li>
                             </ul>
                             </div>
                         % endif
                     </td>
                 </tr>
             %endfor
 
             <tr class="new_members" id="add_perm_input"></tr>
             <tr>
                 <td></td>
                 <td></td>
                 <td></td>
                 <td></td>
                 <td></td>
                 <td>
                     <span id="add_perm" class="link">
                         ${_('Add user/user group')}
                     </span>
                 </td>
                 <td></td>
             </tr>
         </table>
 
         <div class="fields">
             <div class="field">
                <div class="label label-radio">
                    ${_('Apply to children')}:
                </div>
                <div class="radios">
                    ${h.radio('recursive', 'none', label=_('None'), checked="checked")}
                    ${h.radio('recursive', 'groups', label=_('Repository Groups'))}
                    ${h.radio('recursive', 'repos', label=_('Repositories'))}
                    ${h.radio('recursive', 'all', label=_('Both'))}
                <span class="help-block">${_('Set or revoke permissions to selected types of children of this group, including non-private repositories and other groups if chosen.')}</span>
                </div>
             </div>
         </div>
         <div class="buttons">
           ${h.submit('save',_('Save'),class_="btn btn-primary")}
           ${h.reset('reset',_('Reset'),class_="btn btn-danger")}
         </div>
         ${h.end_form()}
     </div>
 </div>
 <script type="text/javascript">
     $('#add_perm').on('click', function(e){
         addNewPermInput($(this), 'group');
     });
     $('.revoke_perm').on('click', function(e){
         markRevokePermInput($(this), 'group');
     });
     quick_repo_menu();
 </script>

rhodecode/templates/admin/repos/repo_edit_advanced.mako

@@ -1,291 +1,291 b''
 <%namespace name="base" file="/base/base.mako"/>
 
 <%
  elems = [
     (_('Repository ID'), c.rhodecode_db_repo.repo_id, '', ''),
-    (_('Owner'), lambda:base.gravatar_with_user(c.rhodecode_db_repo.user.email), '', ''),
+    (_('Owner'), lambda:base.gravatar_with_user(c.rhodecode_db_repo.user.email, tooltip=True), '', ''),
     (_('Created on'), h.format_date(c.rhodecode_db_repo.created_on), '', ''),
     (_('Updated on'), h.format_date(c.rhodecode_db_repo.updated_on), '', ''),
     (_('Cached Commit id'), lambda: h.link_to(c.rhodecode_db_repo.changeset_cache.get('short_id'), h.route_path('repo_commit',repo_name=c.repo_name,commit_id=c.rhodecode_db_repo.changeset_cache.get('raw_id'))), '', ''),
     (_('Cached Commit date'), c.rhodecode_db_repo.changeset_cache.get('date'), '', ''),
     (_('Attached scoped tokens'), len(c.rhodecode_db_repo.scoped_tokens), '', [x.user for x in c.rhodecode_db_repo.scoped_tokens]),
     (_('Pull requests source'), len(c.rhodecode_db_repo.pull_requests_source), '', ['pr_id:{}, repo:{}'.format(x.pull_request_id,x.source_repo.repo_name) for x in c.rhodecode_db_repo.pull_requests_source]),
     (_('Pull requests target'), len(c.rhodecode_db_repo.pull_requests_target), '', ['pr_id:{}, repo:{}'.format(x.pull_request_id,x.target_repo.repo_name) for x in c.rhodecode_db_repo.pull_requests_target]),
     (_('Attached Artifacts'), len(c.rhodecode_db_repo.artifacts), '', ''),
  ]
 %>
 
 <div class="panel panel-default">
     <div class="panel-heading" id="advanced-info" >
         <h3 class="panel-title">${_('Repository: %s') % c.rhodecode_db_repo.repo_name} <a class="permalink" href="#advanced-info"> ¶</a></h3>
     </div>
     <div class="panel-body">
         ${base.dt_info_panel(elems)}
     </div>
 </div>
 
 
 <div class="panel panel-default">
     <div class="panel-heading" id="advanced-fork">
         <h3 class="panel-title">${_('Fork Reference')} <a class="permalink" href="#advanced-fork"> ¶</a></h3>
     </div>
     <div class="panel-body">
       ${h.secure_form(h.route_path('edit_repo_advanced_fork', repo_name=c.rhodecode_db_repo.repo_name), request=request)}
 
         % if c.rhodecode_db_repo.fork:
             <div class="panel-body-title-text">${h.literal(_('This repository is a fork of %(repo_link)s') % {'repo_link': h.link_to_if(c.has_origin_repo_read_perm,c.rhodecode_db_repo.fork.repo_name, h.route_path('repo_summary', repo_name=c.rhodecode_db_repo.fork.repo_name))})}
             | <button class="btn btn-link btn-danger" type="submit">Remove fork reference</button></div>
         % endif
 
          <div class="field">
              ${h.hidden('id_fork_of')}
              ${h.submit('set_as_fork_%s' % c.rhodecode_db_repo.repo_name,_('Set'),class_="btn btn-small",)}
          </div>
          <div class="field">
              <span class="help-block">${_('Manually set this repository as a fork of another from the list')}</span>
          </div>
       ${h.end_form()}
     </div>
 </div>
 
 
 <div class="panel panel-default">
     <div class="panel-heading" id="advanced-journal">
         <h3 class="panel-title">${_('Public Journal Visibility')} <a class="permalink" href="#advanced-journal"> ¶</a></h3>
     </div>
     <div class="panel-body">
       ${h.secure_form(h.route_path('edit_repo_advanced_journal', repo_name=c.rhodecode_db_repo.repo_name), request=request)}
         <div class="field">
         %if c.in_public_journal:
           <button class="btn btn-small" type="submit">
               ${_('Remove from Public Journal')}
           </button>
         %else:
           <button class="btn btn-small" type="submit">
               ${_('Add to Public Journal')}
           </button>
         %endif
         </div>
        <div class="field" >
        <span class="help-block">${_('All actions made on this repository will be visible to everyone following the public journal.')}</span>
        </div>
       ${h.end_form()}
     </div>
 </div>
 
 
 <div class="panel panel-default">
     <div class="panel-heading" id="advanced-locking">
         <h3 class="panel-title">${_('Locking state')} <a class="permalink" href="#advanced-locking"> ¶</a></h3>
     </div>
     <div class="panel-body">
         ${h.secure_form(h.route_path('edit_repo_advanced_locking', repo_name=c.rhodecode_db_repo.repo_name), request=request)}
 
         %if c.rhodecode_db_repo.locked[0]:
              <div class="panel-body-title-text">${'Locked by %s on %s. Lock reason: %s' % (h.person_by_id(c.rhodecode_db_repo.locked[0]),
              h.format_date(h. time_to_datetime(c.rhodecode_db_repo.locked[1])), c.rhodecode_db_repo.locked[2])}</div>
         %else:
             <div class="panel-body-title-text">${_('This Repository is not currently locked.')}</div>
         %endif
 
         <div class="field" >
             %if c.rhodecode_db_repo.locked[0]:
               ${h.hidden('set_unlock', '1')}
               <button class="btn btn-small" type="submit"
                       onclick="return confirm('${_('Confirm to unlock repository.')}');">
                   <i class="icon-unlock"></i>
                   ${_('Unlock repository')}
               </button>
             %else:
               ${h.hidden('set_lock', '1')}
               <button class="btn btn-small" type="submit"
                       onclick="return confirm('${_('Confirm to lock repository.')}');">
                   <i class="icon-lock"></i>
                   ${_('Lock repository')}
               </button>
             %endif
          </div>
          <div class="field" >
             <span class="help-block">
                 ${_('Force repository locking. This only works when anonymous access is disabled. Pulling from the repository locks the repository to that user until the same user pushes to that repository again.')}
             </span>
          </div>
         ${h.end_form()}
     </div>
 </div>
 
 
 <div class="panel panel-default">
     <div class="panel-heading" id="advanced-hooks">
         <h3 class="panel-title">${_('Hooks')} <a class="permalink" href="#advanced-hooks"> ¶</a></h3>
     </div>
     <div class="panel-body">
         <table class="rctable">
             <th>${_('Hook type')}</th>
             <th>${_('Hook version')}</th>
             <th>${_('Current version')}</th>
             % if c.ver_info_dict:
             <tr>
                 <td>${_('PRE HOOK')}</td>
                 <td>${c.ver_info_dict['pre_version']}</td>
                 <td>${c.rhodecode_version}</td>
             </tr>
             <tr>
                 <td>${_('POST HOOK')}</td>
                 <td>${c.ver_info_dict['post_version']}</td>
                 <td>${c.rhodecode_version}</td>
             </tr>
             % else:
                 <tr>
                     <td>${_('Unable to read hook information from VCS Server')}</td>
                 </tr>
             % endif
         </table>
 
         <a href="${h.route_path('edit_repo_advanced_hooks', repo_name=c.repo_name)}"
            onclick="return confirm('${_('Confirm to reinstall hooks for this repository.')}');">
             ${_('Update Hooks')}
         </a>
     </div>
 </div>
 
 <div class="panel panel-warning">
     <div class="panel-heading" id="advanced-archive">
         <h3 class="panel-title">${_('Archive repository')} <a class="permalink" href="#advanced-archive"> ¶</a></h3>
     </div>
     <div class="panel-body">
       ${h.secure_form(h.route_path('edit_repo_advanced_archive', repo_name=c.repo_name), request=request)}
 
         <div style="margin: 0 0 20px 0" class="fake-space"></div>
 
         <div class="field">
             <button class="btn btn-small btn-danger" type="submit"
                     onclick="return confirm('${_('Confirm to archive this repository: %s') % c.repo_name}');">
                 <i class="icon-remove"></i>
                 ${_('Archive this repository')}
             </button>
         </div>
         <div class="field">
             <span class="help-block">
                 ${_('Archiving the repository will make it entirely read-only. The repository cannot be committed to.'
                     'It is hidden from the search results and dashboard. ')}
             </span>
         </div>
 
       ${h.end_form()}
     </div>
 </div>
 
 
 <div class="panel panel-danger">
     <div class="panel-heading" id="advanced-delete">
         <h3 class="panel-title">${_('Delete repository')} <a class="permalink" href="#advanced-delete"> ¶</a></h3>
     </div>
     <div class="panel-body">
       ${h.secure_form(h.route_path('edit_repo_advanced_delete', repo_name=c.repo_name), request=request)}
         <table class="display">
             <tr>
                 <td>
                     ${_ungettext('This repository has %s fork.', 'This repository has %s forks.', c.rhodecode_db_repo.forks.count()) % c.rhodecode_db_repo.forks.count()}
                 </td>
                 <td>
                     %if c.rhodecode_db_repo.forks.count():
                         <input type="radio" name="forks" value="detach_forks" checked="checked"/> <label for="forks">${_('Detach forks')}</label>
                     %endif
                 </td>
                 <td>
                     %if c.rhodecode_db_repo.forks.count():
                         <input type="radio" name="forks" value="delete_forks"/> <label for="forks">${_('Delete forks')}</label>
                     %endif
                 </td>
             </tr>
             <% attached_prs = len(c.rhodecode_db_repo.pull_requests_source + c.rhodecode_db_repo.pull_requests_target) %>
             % if c.rhodecode_db_repo.pull_requests_source or c.rhodecode_db_repo.pull_requests_target:
             <tr>
                 <td>
                     ${_ungettext('This repository has %s attached pull request.', 'This repository has %s attached pull requests.', attached_prs) % attached_prs}
                     <br/>
                     ${_('Consider to archive this repository instead.')}
                 </td>
                 <td></td>
                 <td></td>
             </tr>
             % endif
         </table>
         <div style="margin: 0 0 20px 0" class="fake-space"></div>
 
         <div class="field">
             <button class="btn btn-small btn-danger" type="submit"
                     onclick="return confirm('${_('Confirm to delete this repository: %s') % c.repo_name}');">
                 <i class="icon-remove"></i>
                 ${_('Delete this repository')}
             </button>
         </div>
         <div class="field">
             <span class="help-block">
                 ${_('This repository will be renamed in a special way in order to make it inaccessible to RhodeCode Enterprise and its VCS systems. If you need to fully delete it from the file system, please do it manually, or with rhodecode-cleanup-repos command available in rhodecode-tools.')}
             </span>
         </div>
 
       ${h.end_form()}
     </div>
 </div>
 
 
 <script>
 
 var currentRepoId = ${c.rhodecode_db_repo.repo_id};
 
 var repoTypeFilter = function(data) {
     var results = [];
 
     if (!data.results[0]) {
         return data
     }
 
     $.each(data.results[0].children, function() {
         // filter out the SAME repo, it cannot be used as fork of itself
         if (this.repo_id != currentRepoId) {
             this.id = this.repo_id;
             results.push(this)
         }
     });
     data.results[0].children = results;
     return data;
 };
 
 $("#id_fork_of").select2({
     cachedDataSource: {},
     minimumInputLength: 2,
     placeholder: "${_('Change repository') if c.rhodecode_db_repo.fork else _('Pick repository')}",
     dropdownAutoWidth: true,
     containerCssClass: "drop-menu",
     dropdownCssClass: "drop-menu-dropdown",
     formatResult: formatRepoResult,
     query: $.debounce(250, function(query){
         self = this;
         var cacheKey = query.term;
         var cachedData = self.cachedDataSource[cacheKey];
 
         if (cachedData) {
             query.callback({results: cachedData.results});
         } else {
             $.ajax({
                 url: pyroutes.url('repo_list_data'),
                 data: {'query': query.term, repo_type: '${c.rhodecode_db_repo.repo_type}'},
                 dataType: 'json',
                 type: 'GET',
                 success: function(data) {
                     data = repoTypeFilter(data);
                     self.cachedDataSource[cacheKey] = data;
                     query.callback({results: data.results});
                 },
                 error: function(data, textStatus, errorThrown) {
                     alert("Error while fetching entries.\nError code {0} ({1}).".format(data.status, data.statusText));
                 }
             })
         }
     })
 });
 </script>
 

rhodecode/templates/admin/repos/repo_edit_permissions.mako

@@ -1,222 +1,222 b''
 <%namespace name="base" file="/base/base.mako"/>
 
 <div class="panel panel-default">
     <div class="panel-heading">
         <h3 class="panel-title">${_('Repository Access Permissions')}</h3>
     </div>
     <div class="panel-body">
         ${h.secure_form(h.route_path('edit_repo_perms', repo_name=c.repo_name), request=request)}
         <table id="permissions_manage" class="rctable permissions">
             <tr>
                 <th class="td-radio">${_('None')}</th>
                 <th class="td-radio">${_('Read')}</th>
                 <th class="td-radio">${_('Write')}</th>
                 <th class="td-radio">${_('Admin')}</th>
                 <th class="td-owner">${_('User/User Group')}</th>
                 <th class="td-action"></th>
                 <th class="td-action"></th>
             </tr>
             ## USERS
             %for _user in c.rhodecode_db_repo.permissions():
                 %if getattr(_user, 'admin_row', None) or getattr(_user, 'owner_row', None):
                     <tr class="perm_admin_row">
                         <td class="td-radio">${h.radio('admin_perm_%s' % _user.user_id,'repository.none', disabled="disabled")}</td>
                         <td class="td-radio">${h.radio('admin_perm_%s' % _user.user_id,'repository.read', disabled="disabled")}</td>
                         <td class="td-radio">${h.radio('admin_perm_%s' % _user.user_id,'repository.write', disabled="disabled")}</td>
                         <td class="td-radio">${h.radio('admin_perm_%s' % _user.user_id,'repository.admin', 'repository.admin', disabled="disabled")}</td>
                         <td class="td-user">
-                            ${base.gravatar(_user.email, 16)}
+                            ${base.gravatar(_user.email, 16, user=_user, tooltip=True)}
                             ${h.link_to_user(_user.username)}
                             %if getattr(_user, 'admin_row', None):
                                 (${_('super admin')})
                             %endif
                             %if getattr(_user, 'owner_row', None):
                                 (${_('owner')})
                             %endif
                         </td>
                         <td></td>
                         <td class="quick_repo_menu">
                             % if c.rhodecode_user.is_admin:
                                 <i class="icon-more"></i>
                                 <div class="menu_items_container" style="display: none;">
                                 <ul class="menu_items">
                                   <li>
                                      ${h.link_to('show permissions', h.route_path('edit_user_perms_summary', user_id=_user.user_id, _anchor='repositories-permissions'))}
                                   </li>
                                 </ul>
                                 </div>
                             % endif
                         </td>
                     </tr>
                 %elif _user.username == h.DEFAULT_USER and c.rhodecode_db_repo.private:
                     <tr>
                         <td colspan="4">
                             <span class="private_repo_msg">
                             <strong title="${h.tooltip(_user.permission)}">${_('private repository')}</strong>
                             </span>
                         </td>
                         <td class="private_repo_msg">
                             ${base.gravatar(h.DEFAULT_USER_EMAIL, 16)}
                             ${h.DEFAULT_USER} - ${_('only users/user groups explicitly added here will have access')}</td>
                         <td></td>
                         <td class="quick_repo_menu">
                             % if c.rhodecode_user.is_admin:
                                 <i class="icon-more"></i>
                                 <div class="menu_items_container" style="display: none;">
                                 <ul class="menu_items">
                                   <li>
                                      ${h.link_to('show permissions', h.route_path('admin_permissions_overview', _anchor='repositories-permissions'))}
                                   </li>
                                 </ul>
                                 </div>
                             % endif
                         </td>
                     </tr>
                 %else:
                     <% used_by_n_rules = len(getattr(_user, 'branch_rules', None) or []) %>
                     <tr>
                         <td class="td-radio">${h.radio('u_perm_%s' % _user.user_id,'repository.none', checked=_user.permission=='repository.none', disabled="disabled" if (used_by_n_rules and _user.username != h.DEFAULT_USER) else None)}</td>
                         <td class="td-radio">${h.radio('u_perm_%s' % _user.user_id,'repository.read', checked=_user.permission=='repository.read', disabled="disabled" if (used_by_n_rules and _user.username != h.DEFAULT_USER) else None)}</td>
                         <td class="td-radio">${h.radio('u_perm_%s' % _user.user_id,'repository.write', checked=_user.permission=='repository.write')}</td>
                         <td class="td-radio">${h.radio('u_perm_%s' % _user.user_id,'repository.admin', checked=_user.permission=='repository.admin')}</td>
                         <td class="td-user">
-                            ${base.gravatar(_user.email, 16)}
+                            ${base.gravatar(_user.email, 16, user=_user, tooltip=True)}
                             <span class="user">
                                 % if _user.username == h.DEFAULT_USER:
                                     ${h.DEFAULT_USER} <span class="user-perm-help-text"> - ${_('permission for all other users')}</span>
                                 % else:
                                     ${h.link_to_user(_user.username)}
                                     %if getattr(_user, 'duplicate_perm', None):
                                         (${_('inactive duplicate')})
                                     %endif
                                     %if getattr(_user, 'branch_rules', None):
                                         % if used_by_n_rules == 1:
                                             (${_('used by {} branch rule, requires write+ permissions').format(used_by_n_rules)})
                                         % else:
                                             (${_('used by {} branch rules, requires write+ permissions').format(used_by_n_rules)})
                                         % endif
                                     %endif
                                 % endif
                             </span>
                         </td>
                         <td class="td-action">
                           %if _user.username != h.DEFAULT_USER and getattr(_user, 'branch_rules', None) is None:
                             <span class="btn btn-link btn-danger revoke_perm"
                                   member="${_user.user_id}" member_type="user">
                             ${_('Remove')}
                             </span>
                           %elif _user.username == h.DEFAULT_USER:
                             <span class="tooltip btn btn-link btn-default" onclick="enablePrivateRepo(); return false" title="${_('Private repositories are only visible to people explicitly added as collaborators.')}">
                             ${_('set private mode')}
                             </span>
                           %endif
                         </td>
                         <td class="quick_repo_menu">
                             % if c.rhodecode_user.is_admin:
                                 <i class="icon-more"></i>
                                 <div class="menu_items_container" style="display: none;">
                                 <ul class="menu_items">
                                   <li>
                                      % if _user.username == h.DEFAULT_USER:
                                         ${h.link_to('show permissions', h.route_path('admin_permissions_overview', _anchor='repositories-permissions'))}
                                     % else:
                                         ${h.link_to('show permissions', h.route_path('edit_user_perms_summary', user_id=_user.user_id, _anchor='repositories-permissions'))}
                                     % endif
                                   </li>
                                 </ul>
                                 </div>
                             % endif
                         </td>
                     </tr>
                 %endif
             %endfor
 
             ## USER GROUPS
             %for _user_group in c.rhodecode_db_repo.permission_user_groups(with_members=True):
                 <tr>
                     <td class="td-radio">${h.radio('g_perm_%s' % _user_group.users_group_id,'repository.none', checked=_user_group.permission=='repository.none')}</td>
                     <td class="td-radio">${h.radio('g_perm_%s' % _user_group.users_group_id,'repository.read', checked=_user_group.permission=='repository.read')}</td>
                     <td class="td-radio">${h.radio('g_perm_%s' % _user_group.users_group_id,'repository.write', checked=_user_group.permission=='repository.write')}</td>
                     <td class="td-radio">${h.radio('g_perm_%s' % _user_group.users_group_id,'repository.admin', checked=_user_group.permission=='repository.admin')}</td>
                     <td class="td-componentname">
-                        <i class="icon-user-group"></i>
+                        ${base.user_group_icon(_user_group, tooltip=True)}
                         %if c.is_super_admin:
                          <a href="${h.route_path('edit_user_group',user_group_id=_user_group.users_group_id)}">
                              ${_user_group.users_group_name}
                          </a>
                         %else:
                          ${h.link_to_group(_user_group.users_group_name)}
                         %endif
                         (${_('members')}: ${len(_user_group.members)})
                     </td>
                     <td class="td-action">
                         <span class="btn btn-link btn-danger revoke_perm"
                               member="${_user_group.users_group_id}" member_type="user_group">
                         ${_('Remove')}
                         </span>
                     </td>
                     <td class="quick_repo_menu">
                         % if c.rhodecode_user.is_admin:
                             <i class="icon-more"></i>
                             <div class="menu_items_container" style="display: none;">
                             <ul class="menu_items">
                               <li>
                                  ${h.link_to('show permissions', h.route_path('edit_user_group_perms_summary', user_group_id=_user_group.users_group_id, _anchor='repositories-permissions'))}
                               </li>
                             </ul>
                             </div>
                         % endif
                     </td>
                 </tr>
             %endfor
             <tr class="new_members" id="add_perm_input"></tr>
 
             <tr>
                 <td></td>
                 <td></td>
                 <td></td>
                 <td></td>
                 <td></td>
                 <td>
                     <span id="add_perm" class="link">
                         ${_('Add user/user group')}
                     </span>
                 </td>
                 <td></td>
             </tr>
 
         </table>
 
         <div class="buttons">
           ${h.submit('save',_('Save'),class_="btn btn-primary")}
           ${h.reset('reset',_('Reset'),class_="btn btn-danger")}
         </div>
         ${h.end_form()}
     </div>
 </div>
 
 <script type="text/javascript">
     $('#add_perm').on('click', function(e){
         addNewPermInput($(this), 'repository');
     });
     $('.revoke_perm').on('click', function(e){
         markRevokePermInput($(this), 'repository');
     });
     quick_repo_menu();
 
     var enablePrivateRepo = function () {
         var postData = {
             'csrf_token': CSRF_TOKEN
         };
 
         var success = function(o) {
             var defaultUrl = pyroutes.url('edit_repo_perms', {"repo_name": templateContext.repo_name});
             window.location = o.redirect_url || defaultUrl;
         };
 
         ajaxPOST(
             pyroutes.url('edit_repo_perms_set_private', {"repo_name": templateContext.repo_name}),
             postData,
             success);
     }
 </script>

rhodecode/templates/admin/user_groups/user_group_edit_perms.mako

@@ -1,207 +1,207 b''
 <%namespace name="base" file="/base/base.mako"/>
 
 <div class="panel panel-default">
     <div class="panel-heading">
         <h3 class="panel-title">${_('User Group Permissions')}</h3>
     </div>
     <div class="panel-body">
         ${h.secure_form(h.route_path('edit_user_group_perms_update', user_group_id=c.user_group.users_group_id), request=request)}
         <table id="permissions_manage" class="rctable permissions">
             <tr>
                 <th class="td-radio">${_('None')}</th>
                 <th class="td-radio">${_('Read')}</th>
                 <th class="td-radio">${_('Write')}</th>
                 <th class="td-radio">${_('Admin')}</th>
                 <th>${_('User/User Group')}</th>
                 <th class="td-action"></th>
                 <th class="td-action"></th>
             </tr>
             ## USERS
             %for _user in c.user_group.permissions():
                 ## super admin/owner row
                 %if getattr(_user, 'admin_row', None) or getattr(_user, 'owner_row', None):
                     <tr class="perm_admin_row">
                         <td class="td-radio">${h.radio('admin_perm_%s' % _user.user_id,'repository.none', disabled="disabled")}</td>
                         <td class="td-radio">${h.radio('admin_perm_%s' % _user.user_id,'repository.read', disabled="disabled")}</td>
                         <td class="td-radio">${h.radio('admin_perm_%s' % _user.user_id,'repository.write', disabled="disabled")}</td>
                         <td class="td-radio">${h.radio('admin_perm_%s' % _user.user_id,'repository.admin', 'repository.admin', disabled="disabled")}</td>
                         <td class="td-user">
-                            ${base.gravatar(_user.email, 16)}
+                            ${base.gravatar(_user.email, 16, user=_user, tooltip=True)}
                             <span class="user">
                                 ${h.link_to_user(_user.username)}
                                 %if getattr(_user, 'admin_row', None):
                                     (${_('super admin')})
                                 %endif
                                 %if getattr(_user, 'owner_row', None):
                                     (${_('owner')})
                                 %endif
                             </span>
                         </td>
                         <td></td>
                         <td class="quick_repo_menu">
                             % if c.rhodecode_user.is_admin:
                                 <i class="icon-more"></i>
                                 <div class="menu_items_container" style="display: none;">
                                 <ul class="menu_items">
                                   <li>
                                      ${h.link_to('show permissions', h.route_path('edit_user_perms_summary', user_id=_user.user_id, _anchor='user-groups-permissions'))}
                                   </li>
                                 </ul>
                                 </div>
                             % endif
                         </td>
                     </tr>
                 %else:
                     ##forbid revoking permission from yourself, except if you're an super admin
                     <tr>
                         %if c.rhodecode_user.user_id != _user.user_id or c.rhodecode_user.is_admin:
                         <td class="td-radio">${h.radio('u_perm_%s' % _user.user_id,'usergroup.none')}</td>
                         <td class="td-radio">${h.radio('u_perm_%s' % _user.user_id,'usergroup.read')}</td>
                         <td class="td-radio">${h.radio('u_perm_%s' % _user.user_id,'usergroup.write')}</td>
                         <td class="td-radio">${h.radio('u_perm_%s' % _user.user_id,'usergroup.admin')}</td>
                         <td class="td-user">
-                            ${base.gravatar(_user.email, 16)}
+                            ${base.gravatar(_user.email, 16, user=_user, tooltip=True)}
                             <span class="user">
                                 % if _user.username == h.DEFAULT_USER:
                                     ${h.DEFAULT_USER} <span class="user-perm-help-text"> - ${_('permission for all other users')}</span>
                                 % else:
                                     ${h.link_to_user(_user.username)}
                                     %if getattr(_user, 'duplicate_perm', None):
                                         (${_('inactive duplicate')})
                                     %endif
                                 % endif
                             </span>
                         </td>
                         <td class="td-action">
                           %if _user.username != h.DEFAULT_USER:
                             <span class="btn btn-link btn-danger revoke_perm"
                                   member="${_user.user_id}" member_type="user">
                             ${_('Remove')}
                             </span>
                           %endif
                         </td>
                         <td class="quick_repo_menu">
                             % if c.rhodecode_user.is_admin:
                                 <i class="icon-more"></i>
                                 <div class="menu_items_container" style="display: none;">
                                 <ul class="menu_items">
                                   <li>
                                     % if _user.username == h.DEFAULT_USER:
                                         ${h.link_to('show permissions', h.route_path('admin_permissions_overview', _anchor='user-groups-permissions'))}
                                     % else:
                                         ${h.link_to('show permissions', h.route_path('edit_user_perms_summary', user_id=_user.user_id, _anchor='user-groups-permissions'))}
                                     % endif
                                   </li>
                                 </ul>
                                 </div>
                             % endif
                         </td>
                         %else:
                         ## special case for currently logged-in user permissions, we make sure he cannot take his own permissions
                         <td class="td-radio">${h.radio('u_perm_%s' % _user.user_id,'usergroup.none', disabled="disabled")}</td>
                         <td class="td-radio">${h.radio('u_perm_%s' % _user.user_id,'usergroup.read', disabled="disabled")}</td>
                         <td class="td-radio">${h.radio('u_perm_%s' % _user.user_id,'usergroup.write', disabled="disabled")}</td>
                         <td class="td-radio">${h.radio('u_perm_%s' % _user.user_id,'usergroup.admin', disabled="disabled")}</td>
                         <td class="td-user">
-                            ${base.gravatar(_user.email, 16)}
+                            ${base.gravatar(_user.email, 16, user=_user, tooltip=True)}
                             <span class="user">
                                 % if _user.username == h.DEFAULT_USER:
                                     ${h.DEFAULT_USER} <span class="user-perm-help-text"> - ${_('permission for all other users')}</span>
                                 % else:
                                     ${h.link_to_user(_user.username)}
                                     %if getattr(_user, 'duplicate_perm', None):
                                         (${_('inactive duplicate')})
                                     %endif
                                 % endif
                                 <span class="user-perm-help-text">(${_('delegated admin')})</span>
                             </span>
                         </td>
                         <td></td>
                         <td class="quick_repo_menu">
                             % if c.rhodecode_user.is_admin:
                                 <i class="icon-more"></i>
                                 <div class="menu_items_container" style="display: none;">
                                 <ul class="menu_items">
                                   <li>
                                      ${h.link_to('show permissions', h.route_path('edit_user_perms_summary', user_id=_user.user_id, _anchor='user-groups-permissions'))}
                                   </li>
                                 </ul>
                                 </div>
                             % endif
                         </td>
                         %endif
                     </tr>
                 %endif
             %endfor
 
             ## USER GROUPS
             %for _user_group in c.user_group.permission_user_groups(with_members=True):
                 <tr>
                     <td class="td-radio">${h.radio('g_perm_%s' % _user_group.users_group_id,'usergroup.none')}</td>
                     <td class="td-radio">${h.radio('g_perm_%s' % _user_group.users_group_id,'usergroup.read')}</td>
                     <td class="td-radio">${h.radio('g_perm_%s' % _user_group.users_group_id,'usergroup.write')}</td>
                     <td class="td-radio">${h.radio('g_perm_%s' % _user_group.users_group_id,'usergroup.admin')}</td>
                     <td class="td-user">
                         <i class="icon-user-group"></i>
                         %if c.is_super_admin:
                          <a href="${h.route_path('edit_user_group',user_group_id=_user_group.users_group_id)}">
                              ${_user_group.users_group_name}
                          </a>
                         %else:
                          ${h.link_to_group(_user_group.users_group_name)}
                         %endif
                         (${_('members')}: ${len(_user_group.members)})
                     </td>
                     <td class="td-action">
                         <span class="btn btn-link btn-danger revoke_perm"
                               member="${_user_group.users_group_id}" member_type="user_group">
                         ${_('Remove')}
                         </span>
                     </td>
                     <td class="quick_repo_menu">
                         % if c.rhodecode_user.is_admin:
                             <i class="icon-more"></i>
                             <div class="menu_items_container" style="display: none;">
                             <ul class="menu_items">
                               <li>
                                  ${h.link_to('show permissions', h.route_path('edit_user_group_perms_summary', user_group_id=_user_group.users_group_id, _anchor='user-groups-permissions'))}
                               </li>
                             </ul>
                             </div>
                         % endif
                     </td>
                 </tr>
             %endfor
             <tr class="new_members" id="add_perm_input"></tr>
             <tr>
                 <td></td>
                 <td></td>
                 <td></td>
                 <td></td>
                 <td></td>
                 <td>
                     <span id="add_perm" class="link">
                         ${_('Add user/user group')}
                     </span>
                 </td>
                 <td></td>
             </tr>
         </table>
 
         <div class="buttons">
           ${h.submit('save',_('Save'),class_="btn btn-primary")}
           ${h.reset('reset',_('Reset'),class_="btn btn-danger")}
         </div>
         ${h.end_form()}
     </div>
 </div>
 
 <script type="text/javascript">
     $('#add_perm').on('click', function(e){
         addNewPermInput($(this), 'usergroup');
     });
     $('.revoke_perm').on('click', function(e){
         markRevokePermInput($(this), 'usergroup');
     });
     quick_repo_menu()
 </script>