forked from thaider/Tweeki
-
Notifications
You must be signed in to change notification settings - Fork 0
/
tweeki.js
158 lines (139 loc) · 5.19 KB
/
tweeki.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
/**
* Tweeki-specific scripts
*/
jQuery( function( $ ) {
/**
* FOOTER
*/
// move sticky footer to bottom if the document is smaller than window
function checkFooter() {
if( $( '#footer.footer-sticky' ).length == 1 ) { // only if footer is sticky
$( 'body' ).css( 'margin-bottom', 0 );
// TODO: value shouldn't be hardcoded - use padding on #contentwrapper instead
var minmargin = 50;
var currentmargin = $( '#footer.footer-sticky' ).css( 'margin-top' );
currentmargin = Number( currentmargin.replace( 'px', '' ) );
var additionalmargin = $( window ).height() - $( 'body' ).height();
var newmargin = Math.max( currentmargin + additionalmargin, minmargin );
$( '#footer.footer-sticky' ).css( 'margin-top', newmargin + 'px' );
}
}
// fade in initially hidden sticky footer
checkFooter();
$( '#footer.footer-sticky' ).animate( { opacity: 1 }, 1000 );
// correct sticky footer on resize
$(window).resize(function() {
checkFooter();
});
// correct sticky footer on tab toggle
$(document).on('shown.bs.tab', function (e) {
checkFooter();
});
// correct bottom margin for body when fixed footer
if( $( '#footer.footer-fixed' ).length == 1 ) {
var footerheight = $( '#footer' ).outerHeight();
$( 'body' ).css( 'margin-bottom', footerheight );
}
/**
* TOC
*/
// move TOC elsewhere
if( $( "#tweekiTOC" ).length == 1 && $( "#toc" ).length == 1 ) {
// toc copies
$( '.tweeki-toc' ).each( function() {
$(this).append( $( "#toc ul" ).clone() );
});
// to other place than sidebar?
if( $( "#tweekiTOC" ).parents( ".sidebar-wrapper" ).length != 1 ) {
$( "#toc li" ).appendTo( "#tweekiTOC" );
$( "#tweekiDropdownTOC" ).show();
}
// or to sidebar?
else {
$( "#toc" ).appendTo( "#tweekiTOC" );
$( "#toctitle, .toctitle" ).insertBefore( "#toc" ).children( "h2" )
.append( '<a href="javascript:scrollTo(0,0);">' + mw.message( 'tweeki-toc-top' ).plain() + '</a>' );
/* do we need this? could cause problems on small screens */
/* $(window).resize(function() {
$("#tweekiTOC").height($(window).height()-$("#tweekiTOC").position().top-130);
}).resize(); */
// show toc (hidden by default)
$( "#toc" ).css( 'display', 'table' );
// start scrollspy
$( '#toc ul' ).addClass( 'nav' );
$( 'body' ).css( 'position', 'relative' ).scrollspy( { target: '#toc' } );
}
}
/**
* HEADLINES
*
* If the headline is inside the span it's padding will prevent
* links directly above the headline to be accessible
*/
/* this is done on the server now
$( '.mw-headline' ).each(function( i ) {
$headline_contents = $( this ).contents();
$(this).text('').after($headline_contents);
});
*/
/**
* LOGIN-EXT
*/
// don't close dropdown when clicking in the login form
$( "#loginext" ).click( function( e ) {
e.stopPropagation();
});
// focus user name field
$( "#n-login-ext" ).click( function() {
if( ! $( this ).parent().hasClass( "open" ) ) {
setTimeout( '$( "#wpName2" ).focus();', 100 );
}
});
/**
* Fix VisualEditor scroll stickiness
*
* Had to use the child-parent methods below because the oo-ui-toolbar-bar
* class exists on multiple divs.
*
* The code calculates the navbar height and uses that number as the 'top'
* CSS attribute. This calculation is probably moot as it doesn't appear
* that the skin, or VisualEditor plays well on screen resolutions less
* than 1024 pixels wide. Left the code this way in case something with
* VE changes in the future.
*
**/
$(window).scroll( function ( e ) {
// Check to see if the navbar-fixed-top class exists. If it
// does then the navbar is fixed and run this code if
if ( $( '.navbar-fixed-top').length ) {
var $el = $('.oo-ui-toolbar-bar > .oo-ui-toolbar-actions');
var $headerheight = $('#mw-head').height();
var isPositionFixed = ($el.parent().css('position') == 'fixed');
if ($(this).scrollTop() > $headerheight && !isPositionFixed){
$el.parent().css( 'top', $headerheight );
}
if ($(this).scrollTop() < $headerheight )
{
$el.parent().css( 'top', '');
}
}
});
});
/**
* This code along with animatescroll.js and some CSS changes to #tweekiTOC
* will automatically scroll pages that have long tables of contents.
*
* animatescroll is available here:
*
* https://plugins.compzets.com/animatescroll/
* https://github.com/rampatra/animatescroll.js
*
* The following code comes from an example here:
*
* http://blog.bigbasti.com/handling-too-long-scrollspy-menus/
*
**/
$('#tweekiTOC').on('activate.bs.scrollspy', function () {
item = $('#tweekiTOC').find(".active").last();
item.animatescroll({element: '#tweekiTOC', padding:20});
});