Tooltips should now be attached to a container close to the target element while avoiding button/input groups.

src/UI/Activity/Queue/TimeleftCell.js

@@ -14,7 +14,6 @@ module.exports = NzbDroneCell.extend({
                 var time = '{0} at {1}'.format(FormatHelpers.relativeDate(ect), moment(ect).format(UiSettingsModel.time(true, false)));
                 this.$el.html('-');
                 this.$el.attr('title', 'Will be processed during the first RSS Sync after {0}'.format(time));
-                this.$el.attr('data-container', 'body');
                 return this;
             }
             var timeleft = this.cellValue.get('timeleft');

src/UI/AddSeries/SearchResultViewTemplate.hbs

@@ -80,12 +80,12 @@
                         <!--Uncomment if we need to add even more controls to add series-->
                         <!--<label style="visibility: hidden">Add</label>-->
                         <div class="btn-group">
-                            <button class="btn btn-success add x-add">
-                                <i class="icon-plus" title="Add"></i>
+                            <button class="btn btn-success add x-add" title="Add">
+                                <i class="icon-plus"></i>
                             </button>
 
-                            <button class="btn btn-success add x-add-search">
-                                <i class="icon-search" title="Add and Search for missing episodes"></i>
+                            <button class="btn btn-success add x-add-search" title="Add and Search for missing episodes">
+                                <i class="icon-search"></i>
                             </button>
                         </div>
                     </div>

src/UI/Calendar/CalendarFeedViewTemplate.hbs

@@ -14,8 +14,8 @@
                     <div class="input-group ical-url">
                         <input type="text" class="form-control x-ical-url" value="{{icalHttpUrl}}" readonly="readonly" />
                         <div class="input-group-btn">
-                            <button class="btn btn-icon-only x-ical-copy" title="Copy to clipboard"><i class="icon-copy"></i></button>
-                            <button class="btn btn-icon-only no-router" title="Subscribe" href="{{icalWebCalUrl}}" target="_blank" data-container=".modal-body"><i class="icon-calendar-empty"></i></button>
+                            <button class="btn btn-icon-only x-ical-copy"><i class="icon-copy"></i></button>
+                            <button class="btn btn-icon-only no-router" title="Subscribe" href="{{icalWebCalUrl}}" target="_blank"><i class="icon-calendar-empty"></i></button>
                         </div>
                     </div>
                 </div>

src/UI/Shared/Toolbar/Radio/RadioButtonView.js

@@ -19,7 +19,6 @@ module.exports = Marionette.ItemView.extend({
         }
         if(this.model.get('tooltip')) {
             this.$el.attr('title', this.model.get('tooltip'));
-            this.$el.attr('data-container', 'body');
         }
     },
     onClick        : function(){

src/UI/Shared/Tooltip.js

@@ -1,8 +1,29 @@
 var $ = require('jquery');
+require('bootstrap');
+
+var Tooltip = $.fn.tooltip.Constructor;
+
+var origGetOptions = Tooltip.prototype.getOptions;
+Tooltip.prototype.getOptions = function(options) {
+    var result = origGetOptions.call(this, options);
+
+    if (result.container === false) {
+
+        var container = this.$element.closest('.btn-group,.input-group').parent();
+
+        if (container.length) {
+            result.container = container;
+        }
+    }
+
+    return result;
+};
 
 module.exports = {
-    appInitializer : function(){
+    appInitializer : function() {
+
         $('body').tooltip({selector : '[title]'});
+
         return this;
     }
 };

src/UI/System/SystemLayoutTemplate.hbs

@@ -6,15 +6,15 @@
     <li><a href="#logs" class="x-logs-tab no-router">Logs</a></li>
     <li class="lifecycle-controls pull-right">
         <div class="btn-group">
-            <button class="btn btn-default btn-icon-only x-shutdown" title="Shutdown" data-container="body">
+            <button class="btn btn-default btn-icon-only x-shutdown" title="Shutdown">
                 <i class="icon-nd-shutdown"></i>
             </button>
-            <button class="btn btn-default btn-icon-only x-restart" title="Restart" data-container="body">
+            <button class="btn btn-default btn-icon-only x-restart" title="Restart">
                 <i class="icon-nd-restart"></i>
             </button>
 
             {{#if_eq authentication compare="forms"}}
-            <a href="{{UrlBase}}/logout" class="btn btn-default btn-icon-only" title="Logout" data-container="body">
+            <a href="{{UrlBase}}/logout" class="btn btn-default btn-icon-only" title="Logout">
                 <i class="icon-lock"></i>
             </a>
             {{/if_eq}}