Attachment #9036 for bug #19928




	overflow-y: scroll
	overflow-x: hidden

.umc .umcMultiSelect
	.dojoxGridMasterHeader
		background-color: white

		.dojoxGridHeader
			background-color: @background-color
			display: none

			^[-2].umcMultiSelectWithContent ^[-2..-1]
				display: block

			.dojoxGridCell
				background-color: @background-color
				color: $text-color

			.dijitCheckBox
				icon-image(0, -48, "", "-small", 12px, 12px)
				
				&.dijitCheckBoxChecked
					background-position: -48px -48px

	.dojoxGridView
		min-width: 100%
		max-width: 100%

		^[-1].umcMultiSelectWithContent ^[-1..-1]
			border-top: 1px solid black

		.dojoxGridContent
			min-width: 100%
			max-width: 100%

			div[role="presentation"]
				max-width: 100%

				.dojoxGridRow
					max-width: 100%

					.dojoxGridRowTable
						width: 100% !important
	&.umcMultiSelectNoHeader
		.dojoxGridMasterHeader .dojoxGridHeader
			display: none
		.dojoxGridView
			border-top: none

.umc .umcGrid
	background-color: #fff
	material-shadow(1)

Lines 7-13 Link Here

(-)a/branches/ucs-4.2/ucs-4.2-1/management/univention-web/js/de.po (-1 / +5 lines)
7	msgstr ""	7	msgstr ""
8	"Project-Id-Version: univention-management-console-frontend\n"	8	"Project-Id-Version: univention-management-console-frontend\n"
9	"Report-Msgid-Bugs-To: packages@univention.de\n"	9	"Report-Msgid-Bugs-To: packages@univention.de\n"
10	"POT-Creation-Date: 2017-06-20 18:42+0200\n"	10	"POT-Creation-Date: 2017-06-27 18:43+0200\n"
11	"PO-Revision-Date: 2013-09-12 11:31+0200\n"	11	"PO-Revision-Date: 2013-09-12 11:31+0200\n"
12	"Last-Translator: Univention GmbH <packages@univention.de>\n"	12	"Last-Translator: Univention GmbH <packages@univention.de>\n"
13	"Language-Team: Univention GmbH <packages@univention.de>\n"	13	"Language-Team: Univention GmbH <packages@univention.de>\n"
Lines 357-362 Link Here
357	msgid "Search term"	357	msgid "Search term"
358	msgstr "Suchbegriff"	358	msgstr "Suchbegriff"
359		359
		360	#: widgets/MultiSelect.js:77
		361	msgid "Select all"
		362	msgstr "Alles auswählen"
		363
360	#: tools.js:872	364	#: tools.js:872
361	msgid "Send as email"	365	msgid "Send as email"
362	msgstr "Als E-Mail senden"	366	msgstr "Als E-Mail senden"

Lines 108-114 Link Here

(-)a/branches/ucs-4.2/ucs-4.2-1/management/univention-web/js/widgets/MultiObjectSelect.js (-2 / +5 lines)
108	// for visualizing the search results, use a MultiSelect	108	// for visualizing the search results, use a MultiSelect
109	this._multiSelect = new MultiSelect({	109	this._multiSelect = new MultiSelect({
110	height: '250px',	110	height: '250px',
111	label: _('Search results:')	111	label: _('Search results:'),
		112	showHeader: true
112	});	113	});
113	this._container.addChild(new LabelPane({	114	this._container.addChild(new LabelPane({
114	content: this._multiSelect,	115	content: this._multiSelect,
Lines 283-289 Link Here
283	this.inherited(arguments);	284	this.inherited(arguments);
284		285
285	// add the MultiSelect widget	286	// add the MultiSelect widget
286	this._multiSelect = new MultiSelect({});	287	this._multiSelect = new MultiSelect({
		288	showHeader: true
		289	});
287	this._attachObjectStore();	290	this._attachObjectStore();
288	if ( 'setStore' in this._multiSelect ) {	291	if ( 'setStore' in this._multiSelect ) {
289	this.own(aspect.after(this._multiSelect, 'setStore', lang.hitch(this, '_attachObjectStore')));	292	this.own(aspect.after(this._multiSelect, 'setStore', lang.hitch(this, '_attachObjectStore')));




	"dojo/_base/lang",
	"dojo/_base/array",
	"dojo/Deferred",
	"dojo/query",
	"dojo/dom-class",
	"dojox/grid/EnhancedGrid",
	"../tools",

	"./_FormWidgetMixin",
	"./StandbyMixin",
	"./_RegisterOnShowMixin",
	"umc/i18n!",
	"dojox/grid/enhanced/plugins/IndirectSelection",
	"dojox/grid/cells"
], function(declare, lang, array, Deferred, domClass, EnhancedGrid, tools, _SelectMixin, _FormWidgetMixin, StandbyMixin, _RegisterOnShowMixin, _) {
	return declare("umc.widgets.MultiSelect", [ EnhancedGrid, _FormWidgetMixin, _SelectMixin, StandbyMixin, _RegisterOnShowMixin ], {
		// summary:
		//		This class represents a MultiSelect widget. Essentially, it adapts a DataGrid

		// display the labe above the widget
		labelPosition: 'top',

		// bool wether a header to select all entries should be shown
		showHeader: false,
		// label of select all entries header
		headerLabel: _('Select all'),

		// we need the plugin for selection via checkboxes
		plugins : {
			indirectSelection: {

			}
		},

		// simple grid structure, only one column
		structure: [{
			field: 'label',
			name: 'Name',
			width: '100%'
		}],

		// the widget's class name as CSS class
		baseClass: EnhancedGrid.prototype.baseClass + ' umcMultiSelect',



			this.inherited(arguments);

			// simple grid structure, only one column
			this.structure = [{
				field: 'label',
				name: lang.replace('<b>{0}</b>', [this.headerLabel]),
				width: '100%'
			}];

			// in case 'value' is not specified, generate a new array
			if (!(this.value instanceof Array)) {
				this.value = [];

		postCreate: function() {
			this.inherited(arguments);

			// hide header if showHeader is false
			domClass.toggle(this.domNode, 'umcMultiSelectNoHeader', !this.showHeader);

			// send an onChange event when the selection has changed
			this.on('selectionChanged', lang.hitch(this, function() {

			// stop standby animation and re-render
			this.standby(false);
			this.render();
		},

		/*adaptHeight: function() {
			this.inherited(arguments);

				this.scroller.windowHeight = parseInt(this.height, 10);
			}
		}*/

		render: function() {
			domClass.toggle(this.domNode, 'umcMultiSelectWithContent', this.get('rowCount'));
			this.inherited(arguments);
		}
	});
});


Lines 123-129 Link Here

(-)a/branches/ucs-4.2/ucs-4.2-1/management/univention-web/js/widgets/MultiUploader.js (-1 / +2 lines)
123		123
124	// MultiSelect widget for displaying the file list	124	// MultiSelect widget for displaying the file list
125	this._files = new MultiSelect({	125	this._files = new MultiSelect({
126	style: 'width: 50em'	126	style: 'width: 50em',
		127	showHeader: true
127	});	128	});
128	this.addChild(this._files);	129	this.addChild(this._files);
129		130

Return to bug 19928

Lines 4-26 Link Here

(-)a/branches/ucs-4.2/ucs-4.2-1/management/univention-web/css/Grid.styl (-8 / +37 lines)
4	overflow-y: scroll	4	overflow-y: scroll
5	overflow-x: hidden	5	overflow-x: hidden
6		6
7	.umc .umcMultiSelect .dojoxGridView	7	.umc .umcMultiSelect
8	min-width: 100%	8	.dojoxGridMasterHeader
9	max-width: 100%	9	background-color: white
10		10
11	.dojoxGridContent	11	.dojoxGridHeader
		12	background-color: @background-color
		13	display: none
		14
		15	^[-2].umcMultiSelectWithContent ^[-2..-1]
		16	display: block
		17
		18	.dojoxGridCell
		19	background-color: @background-color
		20	color: $text-color
		21
		22	.dijitCheckBox
		23	icon-image(0, -48, "", "-small", 12px, 12px)
		24
		25	&.dijitCheckBoxChecked
		26	background-position: -48px -48px
		27
		28	.dojoxGridView
12	min-width: 100%	29	min-width: 100%
13	max-width: 100%	30	max-width: 100%
14		31
15	div[role="presentation"]	32	^[-1].umcMultiSelectWithContent ^[-1..-1]
		33	border-top: 1px solid black
		34
		35	.dojoxGridContent
		36	min-width: 100%
16	max-width: 100%	37	max-width: 100%
17		38
18	.dojoxGridRow	39	div[role="presentation"]
19	max-width: 100%	40	max-width: 100%
20		41
21	.dojoxGridRowTable	42	.dojoxGridRow
22	width: 100% !important	43	max-width: 100%
23		44
		45	.dojoxGridRowTable
		46	width: 100% !important
		47	&.umcMultiSelectNoHeader
		48	.dojoxGridMasterHeader .dojoxGridHeader
		49	display: none
		50	.dojoxGridView
		51	border-top: none
		52
24	.umc .umcGrid	53	.umc .umcGrid
25	background-color: #fff	54	background-color: #fff
26	material-shadow(1)	55	material-shadow(1)

Lines 33-39 Link Here

(-)a/branches/ucs-4.2/ucs-4.2-1/management/univention-web/js/widgets/MultiSelect.js (-12 / +22 lines)
33	"dojo/_base/lang",	33	"dojo/_base/lang",
34	"dojo/_base/array",	34	"dojo/_base/array",
35	"dojo/Deferred",	35	"dojo/Deferred",
36	"dojo/query",
37	"dojo/dom-class",	36	"dojo/dom-class",
38	"dojox/grid/EnhancedGrid",	37	"dojox/grid/EnhancedGrid",
39	"../tools",	38	"../tools",
Lines 41-49 Link Here
41	"./_FormWidgetMixin",	40	"./_FormWidgetMixin",
42	"./StandbyMixin",	41	"./StandbyMixin",
43	"./_RegisterOnShowMixin",	42	"./_RegisterOnShowMixin",
		43	"umc/i18n!",
44	"dojox/grid/enhanced/plugins/IndirectSelection",	44	"dojox/grid/enhanced/plugins/IndirectSelection",
45	"dojox/grid/cells"	45	"dojox/grid/cells"
46	], function(declare, lang, array, Deferred, query, domClass, EnhancedGrid, tools, _SelectMixin, _FormWidgetMixin, StandbyMixin, _RegisterOnShowMixin) {	46	], function(declare, lang, array, Deferred, domClass, EnhancedGrid, tools, _SelectMixin, _FormWidgetMixin, StandbyMixin, _RegisterOnShowMixin, _) {
47	return declare("umc.widgets.MultiSelect", [ EnhancedGrid, _FormWidgetMixin, _SelectMixin, StandbyMixin, _RegisterOnShowMixin ], {	47	return declare("umc.widgets.MultiSelect", [ EnhancedGrid, _FormWidgetMixin, _SelectMixin, StandbyMixin, _RegisterOnShowMixin ], {
48	// summary:	48	// summary:
49	// This class represents a MultiSelect widget. Essentially, it adapts a DataGrid	49	// This class represents a MultiSelect widget. Essentially, it adapts a DataGrid
Lines 61-66 Link Here
61	// display the labe above the widget	61	// display the labe above the widget
62	labelPosition: 'top',	62	labelPosition: 'top',
63		63
		64	// bool wether a header to select all entries should be shown
		65	showHeader: false,
		66	// label of select all entries header
		67	headerLabel: _('Select all'),
		68
64	// we need the plugin for selection via checkboxes	69	// we need the plugin for selection via checkboxes
65	plugins : {	70	plugins : {
66	indirectSelection: {	71	indirectSelection: {
Lines 71-83 Link Here
71	}	76	}
72	},	77	},
73		78
74	// simple grid structure, only one column
75	structure: [{
76	field: 'label',
77	name: 'Name',
78	width: '100%'
79	}],
80
81	// the widget's class name as CSS class	79	// the widget's class name as CSS class
82	baseClass: EnhancedGrid.prototype.baseClass + ' umcMultiSelect',	80	baseClass: EnhancedGrid.prototype.baseClass + ' umcMultiSelect',
83		81
Lines 90-95 Link Here
90		88
91	this.inherited(arguments);	89	this.inherited(arguments);
92		90
		91	// simple grid structure, only one column
		92	this.structure = [{
		93	field: 'label',
		94	name: lang.replace('<b>{0}</b>', [this.headerLabel]),
		95	width: '100%'
		96	}];
		97
93	// in case 'value' is not specified, generate a new array	98	// in case 'value' is not specified, generate a new array
94	if (!(this.value instanceof Array)) {	99	if (!(this.value instanceof Array)) {
95	this.value = [];	100	this.value = [];
Lines 99-106 Link Here
99	postCreate: function() {	104	postCreate: function() {
100	this.inherited(arguments);	105	this.inherited(arguments);
101		106
102	// hide the header	107	// hide header if showHeader is false
103	query('.dojoxGridHeader', this.domNode).style('height', '0px');	108	domClass.toggle(this.domNode, 'umcMultiSelectNoHeader', !this.showHeader);
104		109
105	// send an onChange event when the selection has changed	110	// send an onChange event when the selection has changed
106	this.on('selectionChanged', lang.hitch(this, function() {	111	this.on('selectionChanged', lang.hitch(this, function() {
Lines 237-243 Link Here
237	// stop standby animation and re-render	242	// stop standby animation and re-render
238	this.standby(false);	243	this.standby(false);
239	this.render();	244	this.render();
240	}	245	},
241		246
242	/*adaptHeight: function() {	247	/*adaptHeight: function() {
243	this.inherited(arguments);	248	this.inherited(arguments);
Lines 247-252 Link Here
247	this.scroller.windowHeight = parseInt(this.height, 10);	252	this.scroller.windowHeight = parseInt(this.height, 10);
248	}	253	}
249	}*/	254	}*/
		255
		256	render: function() {
		257	domClass.toggle(this.domNode, 'umcMultiSelectWithContent', this.get('rowCount'));
		258	this.inherited(arguments);
		259	}
250	});	260	});
251	});	261	});
252		262