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
|
( function ( mw ) {
/**
* Top section (between page title and filters) on Special:Recentchanges
*
* @extends OO.ui.Widget
*
* @constructor
* @param {mw.rcfilters.ui.SavedLinksListWidget} savedLinksListWidget
* @param {jQuery} $topLinks Content of the community-defined links
* @param {Object} [config] Configuration object
*/
mw.rcfilters.ui.RcTopSectionWidget = function MwRcfiltersUiRcTopSectionWidget(
savedLinksListWidget, $topLinks, config
) {
var toplinksTitle,
topLinksCookieName = 'rcfilters-toplinks-collapsed-state',
topLinksCookie = mw.cookie.get( topLinksCookieName ),
topLinksCookieValue = topLinksCookie || 'collapsed',
widget = this;
config = config || {};
// Parent
mw.rcfilters.ui.RcTopSectionWidget.parent.call( this, config );
this.$topLinks = $topLinks;
toplinksTitle = new OO.ui.ButtonWidget( {
framed: false,
indicator: topLinksCookieValue === 'collapsed' ? 'down' : 'up',
flags: [ 'progressive' ],
label: $( '<span>' ).append( mw.message( 'rcfilters-other-review-tools' ).parse() ).contents()
} );
this.$topLinks
.makeCollapsible( {
collapsed: topLinksCookieValue === 'collapsed',
$customTogglers: toplinksTitle.$element
} )
.on( 'beforeExpand.mw-collapsible', function () {
mw.cookie.set( topLinksCookieName, 'expanded' );
toplinksTitle.setIndicator( 'up' );
widget.switchTopLinks( 'expanded' );
} )
.on( 'beforeCollapse.mw-collapsible', function () {
mw.cookie.set( topLinksCookieName, 'collapsed' );
toplinksTitle.setIndicator( 'down' );
widget.switchTopLinks( 'collapsed' );
} );
this.$topLinks.find( '.mw-recentchanges-toplinks-title' )
.replaceWith( toplinksTitle.$element.removeAttr( 'tabIndex' ) );
// Create two positions for the toplinks to toggle between
// in the table (first cell) or up above it
this.$top = $( '<div>' )
.addClass( 'mw-rcfilters-ui-rcTopSectionWidget-topLinks-top' );
this.$tableTopLinks = $( '<div>' )
.addClass( 'mw-rcfilters-ui-cell' )
.addClass( 'mw-rcfilters-ui-rcTopSectionWidget-topLinks-table' );
// Initialize
this.$element
.addClass( 'mw-rcfilters-ui-rcTopSectionWidget' )
.append(
$( '<div>' )
.addClass( 'mw-rcfilters-ui-table' )
.append(
$( '<div>' )
.addClass( 'mw-rcfilters-ui-row' )
.append(
this.$tableTopLinks,
$( '<div>' )
.addClass( 'mw-rcfilters-ui-table-placeholder' )
.addClass( 'mw-rcfilters-ui-cell' ),
!mw.user.isAnon() ?
$( '<div>' )
.addClass( 'mw-rcfilters-ui-cell' )
.addClass( 'mw-rcfilters-ui-rcTopSectionWidget-savedLinks' )
.append( savedLinksListWidget.$element ) :
null
)
)
);
// Hack: For jumpiness reasons, this should be a sibling of -head
$( '.rcfilters-head' ).before( this.$top );
// Initialize top links position
widget.switchTopLinks( topLinksCookieValue );
};
/* Initialization */
OO.inheritClass( mw.rcfilters.ui.RcTopSectionWidget, OO.ui.Widget );
/**
* Switch the top links widget from inside the table (when collapsed)
* to the 'top' (when open)
*
* @param {string} [state] The state of the top links widget: 'expanded' or 'collapsed'
*/
mw.rcfilters.ui.RcTopSectionWidget.prototype.switchTopLinks = function ( state ) {
state = state || 'expanded';
if ( state === 'expanded' ) {
this.$top.append( this.$topLinks );
} else {
this.$tableTopLinks.append( this.$topLinks );
}
this.$topLinks.toggleClass( 'mw-recentchanges-toplinks-collapsed', state === 'collapsed' );
};
}( mediaWiki ) );
|
