mirror of
https://gerrit.wikimedia.org/r/mediawiki/extensions/VisualEditor
synced 2024-09-27 04:06:51 +00:00
Paged dialog upgrades
Objective: * Add functionality to paged dialogs to work with the pages and select them programmatically Changes: ve.ui.PagedDialog.js * Keep track of the current page name * Add setPage method, which is can be used publicly and is also used internally when items in the outline are selected * Add a page content config option which auto-appends to the inside of the page * Add removePage method for removing pages by name * Add getPageName method which gets the current page name Change-Id: I2a2f0c329d274796b8c9e7572ecff8294f472f7f
This commit is contained in:
parent
8e8ddd9cad
commit
252e9b3d12
|
@ -26,6 +26,7 @@ ve.ui.PagedDialog = function VeUiPagedDialog( surface, config ) {
|
|||
|
||||
// Properties
|
||||
this.pages = {};
|
||||
this.currentPageName = null;
|
||||
};
|
||||
|
||||
/* Inheritance */
|
||||
|
@ -68,7 +69,7 @@ ve.ui.PagedDialog.prototype.initialize = function () {
|
|||
*/
|
||||
ve.ui.PagedDialog.prototype.onOutlineSelect = function ( item ) {
|
||||
if ( item ) {
|
||||
this.pagesPanel.showItem( this.pages[item.getData()] );
|
||||
this.setPage( item.getData() );
|
||||
}
|
||||
};
|
||||
|
||||
|
@ -82,11 +83,15 @@ ve.ui.PagedDialog.prototype.onOutlineSelect = function ( item ) {
|
|||
* @param {string} [config.icon] Symbolic name of icon
|
||||
* @param {number} [config.level=0] Indentation level
|
||||
* @param {number} [config.index] Specific index to insert page at
|
||||
* @param {jQuery} [config.$content] Page content
|
||||
* @chainable
|
||||
*/
|
||||
ve.ui.PagedDialog.prototype.addPage = function ( name, config ) {
|
||||
// Create and add page panel and outline item
|
||||
this.pages[name] = new ve.ui.PanelLayout( { '$$': this.frame.$$, 'scroll': true } );
|
||||
if ( config.$content ) {
|
||||
this.pages[name].$.append( config.$content );
|
||||
}
|
||||
this.pagesPanel.addItems( [this.pages[name]], config.index );
|
||||
this.outlineWidget.addItems(
|
||||
[
|
||||
|
@ -108,6 +113,29 @@ ve.ui.PagedDialog.prototype.addPage = function ( name, config ) {
|
|||
return this;
|
||||
};
|
||||
|
||||
/**
|
||||
* Remove a page.
|
||||
*
|
||||
* @method
|
||||
* @chainable
|
||||
*/
|
||||
ve.ui.PagedDialog.prototype.removePage = function ( name ) {
|
||||
var page = this.pages[name];
|
||||
|
||||
if ( page ) {
|
||||
delete this.pages[name];
|
||||
this.pagesPanel.removeItems( [ page ] );
|
||||
this.outlineWidget.removeItems( [ this.outlineWidget.getItemFromData( name ) ] );
|
||||
}
|
||||
|
||||
// Auto-select first item when nothing is selected anymore
|
||||
if ( !this.outlineWidget.getSelectedItem() ) {
|
||||
this.outlineWidget.selectItem( this.outlineWidget.getClosestSelectableItem( 0 ) );
|
||||
}
|
||||
|
||||
return this;
|
||||
};
|
||||
|
||||
/**
|
||||
* Clear all pages.
|
||||
*
|
||||
|
@ -118,6 +146,7 @@ ve.ui.PagedDialog.prototype.clearPages = function () {
|
|||
this.pages = [];
|
||||
this.pagesPanel.clearItems();
|
||||
this.outlineWidget.clearItems();
|
||||
this.currentPageName = null;
|
||||
|
||||
return this;
|
||||
};
|
||||
|
@ -132,3 +161,27 @@ ve.ui.PagedDialog.prototype.clearPages = function () {
|
|||
ve.ui.PagedDialog.prototype.getPage = function ( name ) {
|
||||
return this.pages[name];
|
||||
};
|
||||
|
||||
/**
|
||||
* Set the page by name.
|
||||
*
|
||||
* @method
|
||||
* @param {string} name Symbolic name of page
|
||||
*/
|
||||
ve.ui.PagedDialog.prototype.setPage = function ( name ) {
|
||||
if ( name in this.pages ) {
|
||||
this.currentPageName = name;
|
||||
this.pagesPanel.showItem( this.pages[name] );
|
||||
this.pages[name].$.find( ':input:first' ).focus();
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Get current page name.
|
||||
*
|
||||
* @method
|
||||
* @returns {string|null} Current page name
|
||||
*/
|
||||
ve.ui.PagedDialog.prototype.getPageName = function () {
|
||||
return this.currentPageName;
|
||||
};
|
||||
|
|
Loading…
Reference in a new issue