Skip to content

Commit 197a6df

Browse files
author
Momotenko,Natalia(nmomotenko)
committed
Merge pull request #418 from magento-vanilla/MAGETWO-41205-PR
[Vanilla+WebDev] Staging: Dashboard
2 parents c98c73d + 2270be2 commit 197a6df

File tree

28 files changed

+2853
-93
lines changed

28 files changed

+2853
-93
lines changed

‎app/code/Magento/Ui/view/base/web/js/grid/listing.js

Lines changed: 52 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,16 @@ define([
1717
defaults: {
1818
template: 'ui/grid/listing',
1919
stickyTmpl: 'ui/grid/sticky/listing',
20+
viewSwitcherTmpl: 'ui/grid/view-switcher',
2021
positions: false,
22+
displayMode: 'grid',
23+
displayModes: {
24+
grid: {
25+
value: 'grid',
26+
label: 'Grid',
27+
template: '${ $.template }'
28+
}
29+
},
2130
dndConfig: {
2231
name: '${ $.name }_dnd',
2332
component: 'Magento_Ui/js/grid/dnd',
@@ -48,6 +57,12 @@ define([
4857
modules: {
4958
dnd: '${ $.dndConfig.name }',
5059
resize: '${ $.resizeConfig.name }'
60+
},
61+
tracks: {
62+
displayMode: true
63+
},
64+
statefull: {
65+
displayMode: true
5166
}
5267
},
5368

@@ -96,7 +111,7 @@ define([
96111
},
97112

98113
/**
99-
* Inititalizes resize component.
114+
* Initializes resize component.
100115
*
101116
* @returns {Listing} Chainable.
102117
*/
@@ -170,7 +185,7 @@ define([
170185
},
171186

172187
/**
173-
* Reseorts child elements array according to provided positions.
188+
* Resorts child elements array according to provided positions.
174189
*
175190
* @param {Object} positions - Object where key represents child
176191
* index and value is its' position.
@@ -202,6 +217,41 @@ define([
202217
return observable || this.visibleColumns;
203218
},
204219

220+
/**
221+
* Returns path to the template
222+
* defined for a current display mode.
223+
*
224+
* @returns {String} Path to the template.
225+
*/
226+
getTemplate: function () {
227+
var mode = this.displayModes[this.displayMode];
228+
229+
return mode.template;
230+
},
231+
232+
/**
233+
* Returns an array of available display modes.
234+
*
235+
* @returns {Array<Object>}
236+
*/
237+
getDisplayModes: function () {
238+
var modes = this.displayModes;
239+
240+
return _.values(modes);
241+
},
242+
243+
/**
244+
* Sets display mode to provided value.
245+
*
246+
* @param {String} index
247+
* @returns {Listing} Chainable
248+
*/
249+
setDisplayMode: function (index) {
250+
this.displayMode = index;
251+
252+
return this;
253+
},
254+
205255
/**
206256
* Returns total number of displayed columns in grid.
207257
*

‎app/code/Magento/Ui/view/base/web/js/lib/knockout/bindings/bootstrap.js

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,7 @@ define(function (require) {
2121
return {
2222
i18n: require('./i18n'),
2323
scope: require('./scope'),
24+
range: require('./range'),
2425
mageInit: require('./mage-init'),
2526
keyboard: require('./keyboard'),
2627
optgroup: require('./optgroup'),
@@ -32,6 +33,7 @@ define(function (require) {
3233
collapsible: require('./collapsible'),
3334
staticChecked: require('./staticChecked'),
3435
simpleChecked: require('./simple-checked'),
36+
tooltip: require('./tooltip'),
3537
repeat: require('knockoutjs/knockout-repeat'),
3638
fastForEach: require('knockoutjs/knockout-fast-foreach')
3739
};

‎app/code/Magento/Ui/view/base/web/js/lib/knockout/bindings/range.js

Lines changed: 203 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,203 @@
1+
/**
2+
* Copyright © 2015 Magento. All rights reserved.
3+
* See COPYING.txt for license details.
4+
*/
5+
6+
define([
7+
'ko',
8+
'jquery',
9+
'underscore',
10+
'../template/renderer',
11+
'jquery/ui'
12+
], function (ko, $, _, renderer) {
13+
'use strict';
14+
15+
var isTouchDevice = !_.isUndefined(document.ontouchstart),
16+
sliderFn = 'slider';
17+
18+
ko.bindingHandlers.range = {
19+
20+
/**
21+
* Initializes binding and a slider update.
22+
*
23+
* @param {HTMLElement} element
24+
* @param {Function} valueAccessor
25+
*/
26+
init: function (element, valueAccessor) {
27+
var config = valueAccessor(),
28+
value = config.value;
29+
30+
_.extend(config, {
31+
value: value(),
32+
33+
/**
34+
* Callback which is being called when sliders' value changes.
35+
*
36+
* @param {Event} event
37+
* @param {Object} ui
38+
*/
39+
slide: function (event, ui) {
40+
value(ui.value);
41+
}
42+
});
43+
44+
$(element)[sliderFn](config);
45+
},
46+
47+
/**
48+
* Updates sliders' plugin configuration.
49+
*
50+
* @param {HTMLElement} element
51+
* @param {Function} valueAccessor
52+
*/
53+
update: function (element, valueAccessor) {
54+
var config = valueAccessor();
55+
56+
config.value = ko.unwrap(config.value);
57+
58+
$(element)[sliderFn]('option', config);
59+
}
60+
};
61+
62+
renderer.addAttribute('range');
63+
64+
if (!isTouchDevice) {
65+
return;
66+
}
67+
68+
$.widget('mage.touchSlider', $.ui.slider, {
69+
70+
/**
71+
* Creates instance of widget.
72+
*
73+
* @override
74+
*/
75+
_create: function () {
76+
_.bindAll(
77+
this,
78+
'_mouseDown',
79+
'_mouseMove',
80+
'_onTouchEnd'
81+
);
82+
83+
return this._superApply(arguments);
84+
},
85+
86+
/**
87+
* Initializes mouse events on element.
88+
* @override
89+
*/
90+
_mouseInit: function () {
91+
var result = this._superApply(arguments);
92+
93+
this.element
94+
.off('mousedown.' + this.widgetName)
95+
.on('touchstart.' + this.widgetName, this._mouseDown);
96+
97+
return result;
98+
},
99+
100+
/**
101+
* Elements' 'mousedown' event handler polyfill.
102+
* @override
103+
*/
104+
_mouseDown: function (event) {
105+
var prevDelegate = this._mouseMoveDelegate,
106+
result;
107+
108+
event = this._touchToMouse(event);
109+
result = this._super(event);
110+
111+
if (prevDelegate === this._mouseMoveDelegate) {
112+
return result;
113+
}
114+
115+
$(document)
116+
.off('mousemove.' + this.widgetName)
117+
.off('mouseup.' + this.widgetName);
118+
119+
$(document)
120+
.on('touchmove.' + this.widgetName, this._mouseMove)
121+
.on('touchend.' + this.widgetName, this._onTouchEnd)
122+
.on('tochleave.' + this.widgetName, this._onTouchEnd);
123+
124+
return result;
125+
},
126+
127+
/**
128+
* Documents' 'mousemove' event handler polyfill.
129+
*
130+
* @override
131+
* @param {Event} event - Touch event object.
132+
*/
133+
_mouseMove: function (event) {
134+
event = this._touchToMouse(event);
135+
136+
return this._super(event);
137+
},
138+
139+
/**
140+
* Documents' 'touchend' event handler.
141+
*/
142+
_onTouchEnd: function (event) {
143+
$(document).trigger('mouseup');
144+
145+
return this._mouseUp(event);
146+
},
147+
148+
/**
149+
* Removes previously assigned touch handlers.
150+
*
151+
* @override
152+
*/
153+
_mouseUp: function () {
154+
this._removeTouchHandlers();
155+
156+
return this._superApply(arguments);
157+
},
158+
159+
/**
160+
* Removes previously assigned touch handlers.
161+
*
162+
* @override
163+
*/
164+
_mouseDestroy: function () {
165+
this._removeTouchHandlers();
166+
167+
return this._superApply(arguments);
168+
},
169+
170+
/**
171+
* Removes touch events from document object.
172+
*/
173+
_removeTouchHandlers: function () {
174+
$(document)
175+
.off('touchmove.' + this.widgetName)
176+
.off('touchend.' + this.widgetName)
177+
.off('touchleave.' + this.widgetName);
178+
},
179+
180+
/**
181+
* Adds properties to the touch event to mimic mouse event.
182+
*
183+
* @param {Event} event - Touch event object.
184+
* @returns {Event}
185+
*/
186+
_touchToMouse: function (event) {
187+
var orig = event.originalEvent,
188+
touch = orig.touches[0];
189+
190+
return _.extend(event, {
191+
which: 1,
192+
pageX: touch.pageX,
193+
pageY: touch.pageY,
194+
clientX: touch.clientX,
195+
clientY: touch.clientY,
196+
screenX: touch.screenX,
197+
screenY: touch.screenY
198+
});
199+
}
200+
});
201+
202+
sliderFn = 'touchSlider';
203+
});

0 commit comments

Comments
 (0)