Skip to content

Commit

Permalink
clean up styles
Browse files Browse the repository at this point in the history
  • Loading branch information
@fat
fat committed Feb 6, 2013
1 parent 5e4db94 commit 4814281
Show file tree
Hide file tree
Showing 9 changed files with 152 additions and 102 deletions.
5 changes: 4 additions & 1 deletion docs/assets/css/bootstrap.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5290,7 +5290,6 @@ input[type="submit"].btn.btn-mini {
position: absolute;
z-index: 1030;
display: block;
padding: 5px;
font-size: 11px;
line-height: 1.4;
opacity: 0;
Expand All @@ -5304,18 +5303,22 @@ input[type="submit"].btn.btn-mini {
}

.tooltip.top {
padding: 5px 0;
margin-top: -3px;
}

.tooltip.right {
padding: 0 5px;
margin-left: 3px;
}

.tooltip.bottom {
padding: 5px 0;
margin-top: 3px;
}

.tooltip.left {
padding: 0 5px;
margin-left: -3px;
}

Expand Down
57 changes: 52 additions & 5 deletions docs/assets/js/bootstrap-tooltip.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -152,15 +152,58 @@
break
}

$tip
.offset(tp)
.addClass(placement)
.addClass('in')

this.applyPlacement(tp, placement)
this.$element.trigger('shown')
}
}

, applyPlacement: function(offset, placement){
var $tip = this.tip()
, width = $tip[0].offsetWidth
, height = $tip[0].offsetHeight
, actualWidth
, actualHeight
, delta
, replace

$tip
.offset(offset)
.addClass(placement)
.addClass('in')

actualWidth = $tip[0].offsetWidth
actualHeight = $tip[0].offsetHeight

if (placement == 'top' && actualHeight != height) {
offset.top = offset.top + height - actualHeight
replace = true
}

if (placement == 'bottom' || placement == 'top') {
delta = 0

if (offset.left < 0){
delta = offset.left * -2
offset.left = 0
$tip.offset(offset)
actualWidth = $tip[0].offsetWidth
actualHeight = $tip[0].offsetHeight
}

this.replaceArrow(delta - width + actualWidth, actualWidth, 'left')
} else {
this.replaceArrow(actualHeight - height, actualHeight, 'top')
}

if (replace) $tip.offset(offset)
}

, replaceArrow: function(delta, dimension, position){
this
.arrow()
.css(position, delta ? (50 * (1 - delta / dimension) + "%") : '')
}

, setContent: function () {
var $tip = this.tip()
, title = this.getTitle()
Expand Down Expand Up @@ -233,6 +276,10 @@
return this.$tip = this.$tip || $(this.options.template)
}

, arrow: function(){
return this.$arrow = this.$arrow || this.tip().find(".tooltip-arrow")
}

, validate: function () {
if (!this.$element[0].parentNode) {
this.hide()
Expand Down
57 changes: 52 additions & 5 deletions docs/assets/js/bootstrap.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1194,15 +1194,58 @@
break
}

$tip
.offset(tp)
.addClass(placement)
.addClass('in')

this.applyPlacement(tp, placement)
this.$element.trigger('shown')
}
}

, applyPlacement: function(offset, placement){
var $tip = this.tip()
, width = $tip[0].offsetWidth
, height = $tip[0].offsetHeight
, actualWidth
, actualHeight
, delta
, replace

$tip
.offset(offset)
.addClass(placement)
.addClass('in')

actualWidth = $tip[0].offsetWidth
actualHeight = $tip[0].offsetHeight

if (placement == 'top' && actualHeight != height) {
offset.top = offset.top + height - actualHeight
replace = true
}

if (placement == 'bottom' || placement == 'top') {
delta = 0

if (offset.left < 0){
delta = offset.left * -2
offset.left = 0
$tip.offset(offset)
actualWidth = $tip[0].offsetWidth
actualHeight = $tip[0].offsetHeight
}

this.replaceArrow(delta - width + actualWidth, actualWidth, 'left')
} else {
this.replaceArrow(actualHeight - height, actualHeight, 'top')
}

if (replace) $tip.offset(offset)
}

, replaceArrow: function(delta, dimension, position){
this
.arrow()
.css(position, delta ? (50 * (1 - delta / dimension) + "%") : '')
}

, setContent: function () {
var $tip = this.tip()
, title = this.getTitle()
Expand Down Expand Up @@ -1275,6 +1318,10 @@
return this.$tip = this.$tip || $(this.options.template)
}

, arrow: function(){
return this.$arrow = this.$arrow || this.tip().find(".tooltip-arrow")
}

, validate: function () {
if (!this.$element[0].parentNode) {
this.hide()
Expand Down
2 changes: 1 addition & 1 deletion docs/assets/js/bootstrap.min.js
View file

Large diffs are not rendered by default.

88 changes: 39 additions & 49 deletions js/bootstrap-tooltip.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -153,66 +153,56 @@
}

this.applyPlacement(tp, placement)

this.$element.trigger('shown')
}
}

, applyPlacement: function(offset, placement){
var $tip
, width
, height
, actualWidth
, actualHeight
, delta
, replace = false

$tip = this.tip()

width = $tip[0].offsetWidth
height = $tip[0].offsetHeight

$tip
.offset(offset)
.addClass(placement)
.addClass('in')

actualWidth = $tip[0].offsetWidth
actualHeight = $tip[0].offsetHeight

if (placement == "top" && actualHeight != height){
offset.top = offset.top + height - actualHeight
replace = true
}
var $tip = this.tip()
, width = $tip[0].offsetWidth
, height = $tip[0].offsetHeight
, actualWidth
, actualHeight
, delta
, replace

if (placement == "bottom" || placement == "top"){
delta = 0
$tip
.offset(offset)
.addClass(placement)
.addClass('in')

if (offset.left < 0){
delta = -offset.left * 2
offset.left = 0
$tip.offset(offset)
actualWidth = $tip[0].offsetWidth
actualHeight = $tip[0].offsetHeight
actualWidth = $tip[0].offsetWidth
actualHeight = $tip[0].offsetHeight

if (placement == 'top' && actualHeight != height) {
offset.top = offset.top + height - actualHeight
replace = true
}

this.replaceArrow(delta - width + actualWidth, actualWidth, "left")
}else{
this.replaceArrow(actualHeight - height, actualHeight, "top")
}
if (placement == 'bottom' || placement == 'top') {
delta = 0

if (replace) $tip.offset(offset)
}
if (offset.left < 0){
delta = offset.left * -2
offset.left = 0
$tip.offset(offset)
actualWidth = $tip[0].offsetWidth
actualHeight = $tip[0].offsetHeight
}

, replaceArrow: function(delta, dimension, position){
var $arrow = this.arrow()
this.replaceArrow(delta - width + actualWidth, actualWidth, 'left')
} else {
this.replaceArrow(actualHeight - height, actualHeight, 'top')
}

if (delta !== 0){
$arrow.css(position, 50 * (1 - delta / dimension) + "%")
}else{
$arrow.css(position, "")
if (replace) $tip.offset(offset)
}

, replaceArrow: function(delta, dimension, position){
this
.arrow()
.css(position, delta ? (50 * (1 - delta / dimension) + "%") : '')
}
}

, setContent: function () {
var $tip = this.tip()
Expand Down Expand Up @@ -287,8 +277,8 @@
}

, arrow: function(){
return this.$arrow = this.$arrow || this.tip().find(".tooltip-arrow")
}
return this.$arrow = this.$arrow || this.tip().find(".tooltip-arrow")
}

, validate: function () {
if (!this.$element[0].parentNode) {
Expand Down
3 changes: 0 additions & 3 deletions js/tests/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -29,9 +29,6 @@
<script src="../../js/bootstrap-typeahead.js"></script>
<script src="../../js/bootstrap-affix.js"></script>

<!-- Needed for testing -->
<link rel="stylesheet" type="text/css" href="unit/bootstrap-tooltip.css" />

<!-- unit tests -->
<script src="unit/bootstrap-transition.js"></script>
<script src="unit/bootstrap-alert.js"></script>
Expand Down
13 changes: 0 additions & 13 deletions js/tests/unit/bootstrap-tooltip.css
View file

This file was deleted.

21 changes: 0 additions & 21 deletions js/tests/unit/bootstrap-tooltip.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -291,25 +291,4 @@ $(function () {
container.remove()
}, 100)
})

test("arrow should point to element", function(){
var container = $("<div />").appendTo("body")
.css({position: "absolute", bottom: 0, left: 0, textAlign: "right", width: 300, height: 300})
, p = $("<p style='margin-top:200px' />").appendTo(container)
, tooltiped = $("<a href='#' title='very very very very very very very long tooltip'>Hover me</a>")
.css({marginTop: 200})
.appendTo(p)
.tooltip({placement: "top", animate: false})
.tooltip("show")

stop()

setTimeout(function(){
var arrow = container.find(".tooltip-arrow")

start()
ok(Math.abs(arrow.offset().left - tooltiped.offset().left - tooltiped.outerWidth()/2) <= 1)
container.remove()
}, 100)
})
})
8 changes: 4 additions & 4 deletions less/tooltip.less
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,10 +13,10 @@
line-height: 1.4;
.opacity(0);
&.in { .opacity(80); }
&.top { margin-top: -3px; padding: 5px 0;}
&.right { margin-left: 3px; padding: 0 5px;}
&.bottom { margin-top: 3px; padding: 5px 0;}
&.left { margin-left: -3px; padding: 0 5px;}
&.top { margin-top: -3px; padding: 5px 0; }
&.right { margin-left: 3px; padding: 0 5px; }
&.bottom { margin-top: 3px; padding: 5px 0; }
&.left { margin-left: -3px; padding: 0 5px; }
}

// Wrapper for the tooltip content
Expand Down

0 comments on commit 4814281

Please sign in to comment.