Multiple message in load mask in sencha touch - sencha-touch-2

I just want to show different messages.
Ext.Viewport.setMasked({
xtype: 'loadmask',
message: 'Downloading data. Please wait...'
});
When I download data from server I gave call to different functions.
Depending on function I want to change the message.
Please provide guide line or working code.
I have used
Ext.Viewport.unmask();
in every function and reset the message in that function.. but showing same message.

Very simple. Just get the Viewport loading mask, and update the message. Here is an example, once you set the loading mask and now want to change the text (or even other properties):
Ext.Viewport.getMasked().setMessage('This is a new message.');

var loadMask = Ext.getCmp('your view id which you want to use');
loadMask.setMessage(Get the message Dynamically or static);

Related

videojs: How to get actual text of subtitle on 'cuechange'

I'm using videojs with some of the following code:
player.addRemoteTextTrack({ src: 'http://[somepath/to/vtt]' })
(I've verified that the Network tab in chrome shows a request to the VTT file and it's sound.)
And then:
const textTrack = player.textTracks()[0]
textTrack.addEventListener('cuechange', () => {
const activeCue = textTrack.activeCues[0]
console.log(activeCue.text, activeCue.startTime, activeCue.endTime)
})
The cuechange fires during playback, but the text attribute doesn't contain the actual subtitle text, but instead looks like the source of the .m3u8 file. The startTime and endTime of the cue seem to be correct though.
I think I'm missing something, but I'm trying to get the actual text of the triggered subtitle cue, but instead looks like this:
{"bandwidth":296728,"resolution":{"width":640,"height":268},"codecs":"avc1.42c015,mp4a.40.2","byteLength":319224,"uri":"https://...... (and so on)
Ok. Hopefully this will help someone else. It's a little confusing, but seems to be what's happening.
After I addRemoteTextTrack(), player.textTracks().length becomes 2.
One of those is of kind=metadata
The other is of kind=subtitles (the one I explicitly added)
I was listening on the kind=metadata cuechange assuming the remotely added track was the only one in the tracklist, and it fires off at the correct time in the video, even without me loading the remote text track. I think this means the stream I'm loading has some kind of metadata track for cue points embedded.
When I do add the remote track, trying to listen on the kind=subtitle track doesn't seem to fire off the cuechange event however, but I think this is because of videojs track precedence. Neither of the tracks had mode=showing, so cuechange events only fired on the one with precedence (first item in the tracklist array... the metadata one).
The solution is to simply add mode=showing to the track that I explicitly add to give it precedence:
player.addRemoteTextTrack({
src: 'http://[somepath/to/vtt]',
mode: 'showing'
})
This now allows me to listen on the tracklist item where kind=subtitle and get the actual text

Confirmation Draw has completed

I have created a custom button that will allow users to select with columns to output to CSV so the button is not created as part of the table initialization. I have a modal that pops up with checkboxes created off the column headers for selection. It is worth noting I have regex search on each column header. The issue is I am using server side processing and as a result the only exported rows are those visible. As a work around I have set it up to get the page.info().recordsDisplay and set the length of the page to that and draw. The modal pops up and says it is loading data from server once table is fully populated the HTML of the modal will change to the checkboxes for export. Once exported the table is reverted back to the default length. What I need to do is capture when the rows are fully rendered so I can do the HTML switch. Right now I am setting a timeout. The data can take a while to populate as there are some 13k rows if now search is applied. What is the best way to do this and is there a more efficient way?
var tableHeaders = [];
var table = $('#example').DataTable().columns().every( function () {
tableHeaders.push( $(this.header()).text() );
});
var pageLength = table.page.info().length;
table.context['0']._iDisplayLength = table.page.info().recordsDisplay;
table.draw();
There could be an issue with server-side processing parameters start/length that define the portion of data being requested from the server upon each draw.
If your source data has huge number of rows, chances are they're not sent all at once to make use of server-side processing. So, you can try to manipulate those parameters.
Alternatively, you may try to make use of draw event fired upon each redraw.

openlayers error on draw/modify (in vuejs)

The code I am using is in my previous question (resolved)
The interaction works perfectly and my goal is to get an array of coordinates, also works perfectly. Although everything works, I am getting an error in console every time I move the mouse in the display area. It doesn't affect functioning, but obviously I need to solve it... any ideas?
Draw.js?ac29:579 Uncaught TypeError: Cannot read property 'getGeometry' of null
at Draw.modifyDrawing_ (Draw.js?ac29:579)
at Draw.handlePointerMove_ (Draw.js?ac29:479)
at Draw.handleEvent (Draw.js?ac29:871)
at Map.handleMapBrowserEvent (PluggableMap.js?fe37:924)
at MapBrowserEventHandler.boundListener (events.js?1e8d:41)
at MapBrowserEventHandler.dispatchEvent (Target.js?0ec0:101)
at MapBrowserEventHandler.handlePointerMove_ (MapBrowserEventHandler.js?2ad6:260)
at PointerEventHandler.boundListener (events.js?1e8d:41)
at PointerEventHandler.dispatchEvent (Target.js?0ec0:101)
at PointerEventHandler.fireNativeEvent (PointerEventHandler.js?b114:397)
I'm trying something quite random, but you maybe want to add some condition in you current code:
var modify = new Modify({source: source});
modify.on('modifyend',function(e){
if(e.features && e.features.getArray().length) { //add this line
console.log("feature id is",e.features.getArray()[0].getGeometry().getCoordinates()[0]);
}
});

yii efullcalendar widget and external events drag and drop not working

Hi I am trying to use drag and drop external events for fullcalendar and get working with the yii extension full calender - which seems to be just a wrapper.
The part that is not working (no errors just does not work) is dragging the external event onto the calendar and it staying there. It drags over but it just returns home.
Reading the fullcalendar docs - it looks like I need to provide a callback function to 'drop' attribute. I've been using the external-event example which is part of full calendar. I did discover the example was using the object name '#calendar' and that yii is creating name '#yw0' but it still didn't work after I updated.
I cannot find a way to get it work. I tried a simple alert which sort of works, it is called on page load - not after a drag operation.
So I declared a variable with the function in View
//$dropcallback=new CJavaScriptExpression("alert('hi')");
$dropcallback=new CJavaScriptExpression(
"function(date, allDay) {
var originalEventObject = $(this).data('eventObject');
var copiedEventObject = $.extend({}, originalEventObject);
copiedEventObject.start = date;
copiedEventObject.allDay = allDay;
$('#yw0').fullCalendar('renderEvent', copiedEventObject, true);
if ($('#drop-remove').is(':checked')) {
// if so, remove the element from the Draggable Events list
$(this).remove();
}
}
");
Then I create the widgit like this
$this->widget('ext.EFullCalendar.EFullCalendar', array(
'themeCssFile'=>'cupertino/jquery-ui.min.css',
'options'=>array(
'header'=>array(
'left'=>'prev,next',
'center'=>'title',
'right'=>'today'
),
'editable'=>true,
'dropable'=>true,
'drop'=>$dropcallback,
'events'=>Game::model()->gameCalendarData(),
)));
My yii experiance is little and same with JS - so any help appreciated in how to get this working.
I understand that in JS you need to provide a callback to allow the drag op to succeed. But what sort of call back do I need when it is wrapped in a yii widgit? I tried a PHP callback and again it is only called on page load.
The result I wish is that I can build the external events list from the DB - allow users to drag them onto the calendar - and save them in the DB.
I did manage to get data from DB displayed in the calendar.
Thanks
Droppable is spelt with two p's. So
'dropable'=>true,
Should be
'droppable'=>true,

Clear Store sencha

Hi i have an app that populates store using a proxy. I want to clear the store on click of a button and let the user enter in different information and repopulate if that makes sense. I am currently using :
window.location.reload();
but this gives a white screen for a couple of seconds which is not nice. I have also tried the following :
var store = Ext.getStore('Places');
store.getProxy().clear();
store.data.clear(); store.sync();
but this gives an error relating to the .getProxy()
I have also tried:
Ext.StoreMgr.get('Places').removeAll();
Ext.StoreMgr.get('Places').sync();
but when the i go to repopulate the old data remains. Is there a way to clear the stores?
The best Way to clear Store is
var store = Ext.getStore('SessionStore');
store.load();
store.getProxy().clear();
store.data.clear();
store.sync();