Premium support for our pure JavaScript UI components


Post by progettouno »

Hello,

In application after update new version 1.1.2 horizontal scroll not working.
Is possibile to set default scroll?

The problem is in chrome.

Thankyou
Attachments
no-scroll.jpg
no-scroll.jpg (229.14 KiB) Viewed 1752 times

Post by progettouno »

We try disable all our css but nothing

Post by progettouno »

Other details in log in scheduler.umd.js: EventHelper.js:290 [Violation] Added non-passive event listener to a scroll-blocking

Post by progettouno »

/**
* @namespace matrixPlannerController
*/
app.controller('matrixPlannerController', function($scope, $rootScope, $mdSidenav, $mdToast, $filter, planner) {

	$scope.toggleSidenav = buildToggler('side-nav');
	/**
	* Toggle side nav
	* @param {string} componentId - Component ID
	* @memberOf matrixPlannerController
	*/
	function buildToggler(componentId) {
		return function() {
			$mdSidenav(componentId).toggle();
		};
	}

	$scope.schedulerEngine = new bryntum.scheduler.Scheduler({
        appendTo: 'scheduler',
        showRemoveRowInContextMenu : false,
        enableDeleteKey: false,
        rowHeight: 55,
        columns: [
            {
            	text: $filter('uppercase')($filter('translate')('Laboratory')),
            	field : 'laboratory',
            	align: 'center',
            	menuDisabled: true,
            	width: 250
            },
            {
            	text: $filter('uppercase')($filter('translate')('Line')),
            	field : 'line',
            	align: 'center',	            	
            	menuDisabled: true,
            	width: 85,
            	htmlEncode: false,
            	renderer({record, value, size}) {
            		return `
            		<div class="line-info">
                        <div class="line-number">${value}</div>
                        <div class="line-capacity">(${record.capacity})</div>
                    </div>
                `;
            	}
            }
        ],
        viewPreset: {
            name: 'weekAndDay',
            displayDateFormat: 'DD/MM/YYYY',
            timeResolution: {
                unit: 'hour',
                increment: 1
            }
        },
        features: {
        	timeRanges: true,
        	contextMenu: true,
        	eventEdit: false,
        	eventTooltip: {
        		template: function(tooltipData) {
        			//console.log(tooltipData);
        			var data = tooltipData.eventRecord.data;
        			var startClock = $(tooltipData.startClockHtml).find('.b-sch-clock')[0].outerHTML+'&nbsp;'+ moment(tooltipData.startDate).format('HH:mm');
        			var endClock = $(tooltipData.endClockHtml).find('.b-sch-clock')[0].outerHTML+'&nbsp;'+ moment(tooltipData.endDate).format('HH:mm');
        			return `
		                <div class="b-sch-event-title">${data.name}</div>
		                <div class="b-sch-clockwrap b-sch-clock-day b-sch-tooltip-startdate">
		                    ${startClock}&nbsp;&nbsp;&nbsp;${endClock}
		                </div>
		                <div class="b-sch-event-description">
		                <table>
		                	<tr><th>Item</th><td>${data.object.ItemId}</td></tr>
		                	<tr><th>Quantity</th><td>${data.object.PlannedQuantity}</td></tr>
		                	<tr class="tr-separator"><th>Duration</th><td>${+moment.duration(data.object.Duration).asDays().toFixed(2)} days</td></tr>
		                	<tr><th>S.Start</th><td>${data.object.WorkBeginDate}</td></tr>
		                	<tr><th>S.End</th><td>${data.object.WorkEndDate}</td></tr>			                	
		                </table>
		                </div
		            `;
        		}
        	},
        	eventResize: false,
        	eventDragCreate: false,
			eventDrag: {
				constrainDragToResource : true,
				showExactDropPosition   : true
			}	
        },
        barMargin: 5,
        eventRenderer: ({ eventRecord }) => (eventRecord),
        eventBodyTemplate : data => `<div class="value">${data.name}<br/>(${data.done}/${data.todo})</div>`,
        listeners : {
            catchAll(event) {
            	switch(event.type) {
				  case 'aftereventdrop':
				  	//Update after drag
				    var data = event.eventRecords[0].data;
				    planner.put(data.id, {'CellId': data.resourceId, 'WorkBeginTime': moment(data.startDate).format('YYYY-MM-DD HH:mm:ss')}).then(function success(r) {
						//create tempData for bug not update scheduler
						var tempData = $scope.schedulerEngine.eventStore.data;
						for(i = 0; i < tempData.length; i++) {
							if(tempData[i].id == data.id) {
								tempData[i] = r;
							}
						}
						$scope.schedulerEngine.eventStore.data = tempData;
						$scope.schedulerEngine.selectEvent(r);
					})
					.catch(function error(e) {
						var error = (e.data.error != null) ? e.data.error : 'Error';
						$mdToast.show($mdToast.simple().textContent($filter('translate')(error)));
						console.log(e);
					});
				    break;
				}
            }
        }
    });

    /**
	* Options check if is changed
	* @memberOf matrixPlannerController
	*/
	$rootScope.$watch('matrixPlannerOptionsFromDate + matrixPlannerOptionsToDate + matrixPlannerOptionsManufacturingType', function () {
		var fromDate = $rootScope.matrixPlannerOptionsFromDate;
		var toDate = $rootScope.matrixPlannerOptionsToDate;
		var manufacturingType = $rootScope.matrixPlannerOptionsManufacturingType;
		if(typeof(fromDate) != 'undefined' && typeof(toDate) != 'undefined' && typeof(manufacturingType) != 'undefined') {
			$scope.schedulerEngine.startDate = new Date(fromDate);
			$scope.schedulerEngine.endDate = new Date(toDate);
			planner.get({'from': moment(fromDate).format('YYYY-MM-DD'), 'to': moment(toDate).format('YYYY-MM-DD'), 'manufacturingTypeId': manufacturingType}).then(function success(r) {
				$scope.schedulerEngine.eventStore.data = r.events;
				$scope.schedulerEngine.timeRanges = r.timeRanges;
				$scope.schedulerEngine.resources = r.resources;
				$scope.schedulerEngine.scrollToNow(); //but this doesn't do nothing
			})
			.catch(function error(e) {
				var error = (e.data.error != null) ? e.data.error : 'Error';
				$mdToast.show($mdToast.simple().textContent($filter('translate')(error)));
				console.log(e);
			});
		}
	});
});

Post by progettouno »

If we press weel and move left and right scroll, only when click ok bar not working

Post by progettouno »

Found:
.b-virtual-scrollers.b-overlay-scrollbar {
	pointer-events: auto;
}
and not none in our css material.scss, why?

Post by pmiklashevich »

Please make sure you are using CSS and JS from same version. Please try the latest

Pavlo Miklashevych
Sr. Frontend Developer


Post Reply