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
|
( function ( mw ) {
/**
* Quick links widget
*
* @class
* @extends OO.ui.Widget
*
* @constructor
* @param {mw.rcfilters.Controller} controller Controller
* @param {mw.rcfilters.dm.SavedQueriesModel} model View model
* @param {Object} [config] Configuration object
* @cfg {jQuery} [$overlay] A jQuery object serving as overlay for popups
*/
mw.rcfilters.ui.SavedLinksListWidget = function MwRcfiltersUiSavedLinksListWidget( controller, model, config ) {
var $labelNoEntries = $( '<div>' )
.append(
$( '<div>' )
.addClass( 'mw-rcfilters-ui-savedLinksListWidget-placeholder-title' )
.text( mw.msg( 'rcfilters-quickfilters-placeholder-title' ) ),
$( '<div>' )
.addClass( 'mw-rcfilters-ui-savedLinksListWidget-placeholder-description' )
.text( mw.msg( 'rcfilters-quickfilters-placeholder-description' ) )
);
config = config || {};
// Parent
mw.rcfilters.ui.SavedLinksListWidget.parent.call( this, config );
this.controller = controller;
this.model = model;
this.$overlay = config.$overlay || this.$element;
this.placeholderItem = new OO.ui.DecoratedOptionWidget( {
classes: [ 'mw-rcfilters-ui-savedLinksListWidget-placeholder' ],
label: $labelNoEntries,
icon: 'bookmark'
} );
this.menu = new mw.rcfilters.ui.GroupWidget( {
events: {
click: 'menuItemClick',
'delete': 'menuItemDelete',
'default': 'menuItemDefault',
edit: 'menuItemEdit'
},
classes: [ 'mw-rcfilters-ui-savedLinksListWidget-menu' ],
items: [ this.placeholderItem ]
} );
this.button = new OO.ui.PopupButtonWidget( {
classes: [ 'mw-rcfilters-ui-savedLinksListWidget-button' ],
label: mw.msg( 'rcfilters-quickfilters' ),
icon: 'bookmark',
indicator: 'down',
$overlay: this.$overlay,
popup: {
width: 300,
anchor: false,
align: 'backwards',
$autoCloseIgnore: this.$overlay,
$content: this.menu.$element
}
} );
// Events
this.model.connect( this, {
add: 'onModelAddItem',
remove: 'onModelRemoveItem'
} );
this.menu.connect( this, {
menuItemClick: 'onMenuItemClick',
menuItemDelete: 'onMenuItemRemove',
menuItemDefault: 'onMenuItemDefault',
menuItemEdit: 'onMenuItemEdit'
} );
this.placeholderItem.toggle( this.model.isEmpty() );
// Initialize
this.$element
.addClass( 'mw-rcfilters-ui-savedLinksListWidget' )
.append( this.button.$element );
};
/* Initialization */
OO.inheritClass( mw.rcfilters.ui.SavedLinksListWidget, OO.ui.Widget );
/* Methods */
/**
* Respond to menu item click event
*
* @param {mw.rcfilters.ui.SavedLinksListItemWidget} item Menu item
*/
mw.rcfilters.ui.SavedLinksListWidget.prototype.onMenuItemClick = function ( item ) {
this.controller.applySavedQuery( item.getID() );
this.button.popup.toggle( false );
};
/**
* Respond to menu item remove event
*
* @param {mw.rcfilters.ui.SavedLinksListItemWidget} item Menu item
*/
mw.rcfilters.ui.SavedLinksListWidget.prototype.onMenuItemRemove = function ( item ) {
this.controller.removeSavedQuery( item.getID() );
};
/**
* Respond to menu item default event
*
* @param {mw.rcfilters.ui.SavedLinksListItemWidget} item Menu item
* @param {boolean} isDefault Item is default
*/
mw.rcfilters.ui.SavedLinksListWidget.prototype.onMenuItemDefault = function ( item, isDefault ) {
this.controller.setDefaultSavedQuery( isDefault ? item.getID() : null );
};
/**
* Respond to menu item edit event
*
* @param {mw.rcfilters.ui.SavedLinksListItemWidget} item Menu item
* @param {string} newLabel New label
*/
mw.rcfilters.ui.SavedLinksListWidget.prototype.onMenuItemEdit = function ( item, newLabel ) {
this.controller.renameSavedQuery( item.getID(), newLabel );
};
/**
* Respond to menu add item event
*
* @param {mw.rcfilters.ui.SavedLinksListItemWidget} item Menu item
*/
mw.rcfilters.ui.SavedLinksListWidget.prototype.onModelAddItem = function ( item ) {
if ( this.menu.findItemFromData( item.getID() ) ) {
return;
}
this.menu.addItems( [
new mw.rcfilters.ui.SavedLinksListItemWidget( item, { $overlay: this.$overlay } )
] );
this.placeholderItem.toggle( this.model.isEmpty() );
};
/**
* Respond to menu remove item event
*
* @param {mw.rcfilters.ui.SavedLinksListItemWidget} item Menu item
*/
mw.rcfilters.ui.SavedLinksListWidget.prototype.onModelRemoveItem = function ( item ) {
this.menu.removeItems( [ this.menu.findItemFromData( item.getID() ) ] );
this.placeholderItem.toggle( this.model.isEmpty() );
};
}( mediaWiki ) );
|
