The soundmanager 2 events won't fire. Here is a snippet where the console.logs don't fire at all, therefore any of the different events aren't being triggered when they should.
soundManager.setup({
url: "js/swf/",
preferFlash: false,
useFlashBlock: false,
onready: function() {
soundManager.play(url, id, {
id: id,
url: url,
onplay: function() {
console.log("test");
},
onresume: function() {
console.log("test");
},
onpause: function() {
console.log("test");
},
onfinish: function() {
console.log("test");
next();
},
whileplaying: function() {
console.log("test");
},
});
},
defaultOptions: {
multiShotEvents: true, // allow events (onfinish()) to fire for each shot, if supported.
}
});
Is this because I have flash disabled? There is a bug currently where flash doesan't work in chrome.
Thanks.
You should use the
var sound = soundManager.createSound({id: 'soundId', url: '1.mp3'});
sound.play({
onplay: function() {
...
}
})
you missed "createSound"
Related
The idea is to have a HBox container under the MultiComboBox control to which selected tokens will be pushed. I have followed different tutorials and couldn't get a success. A multiComboBox is simply now shown.
The idea:
Simplified (testing) implementation of custom control:
sap.ui.define([
'sap/m/MultiComboBox',
'sap/m/HBox'
], function (MultiComboBox, HBox) {
'use strict';
/**
* Constructor for a new MultiCombobox with tokens.
*/
return MultiComboBox.extend('drex.control.DropDownWithTags', {
metadata: {
aggregations: {
_tokensContainer: { type: 'sap.m.HBox', multiple: false }
},
},
init: function () {
MultiComboBox.prototype.init.apply(this, arguments);
this.setAggregation('_tokensContainer', new HBox());
},
_addToken: function () {
this.getAggregation('_tokensContainer').insertItem({text: 'test'});
},
_handleSelectionLiveChange: function(oControlEvent) {
this._addToken();
MultiComboBox.prototype._handleSelectionLiveChange.apply(this, arguments);
},
renderer: function (rm, DropDownWithTags) {
rm.write('<div');
rm.writeControlData(DropDownWithTags);
rm.write('>');
rm.renderControl(DropDownWithTags.getAggregation('_tokensContainer'));
rm.write('</div>');
}
});
});
XML (no change, except for a name, could that be a problem?). Adding HBox aggregation to it does not help.
<drex:DropDownWithTags
items="{
path: 'diseaseList>/allDiseases'
}"
selectedKeys="{filterModel>/disease}"
selectionFinish="onSelectDisease">
<core:Item key="{diseaseList>id}" text="{diseaseList>Name}"/>
</drex:DropDownWithTags>
Any idea why it happens ? I cannot see my mistake.
there are many ways to do this. here is one way
sap.ui.define([
'sap/ui/core/Control',
'sap/ui/core/Item',
'sap/m/MultiComboBox',
'sap/m/HBox',
'sap/m/Text'
], function (Control, Item, MultiComboBox, HBox, Text) {
Control.extend('DropDownWithTags', {
metadata: {
aggregations: {
combo: { type: 'sap.m.MultiComboBox', multiple: false },
_hbox: { type: 'sap.m.HBox', multiple: false }
},
},
init: function () {
Control.prototype.init.apply(this, arguments);
this.setAggregation('_hbox', new HBox({
items: [
]
}));
},
renderer: function (rm, oControl) {
rm.write('<div');
rm.writeControlData(oControl);
rm.write('>');
rm.write('<div>');
rm.renderControl(oControl.getAggregation('combo'));
rm.write('</div>');
rm.write('<div>');
rm.renderControl(oControl.getAggregation('_hbox'));
rm.write('</div>');
rm.write('</div>');
},
onAfterRendering: function() {
var combo = this.getAggregation('combo')
var hbox = this.getAggregation('_hbox');
combo.attachEvent("selectionChange", function() {
hbox.destroyItems();
var text = this.getSelectedItems().map(function(item) {
return item.getText();
});
if (text.length > 0) {
hbox.addItem(new Text({ text: text.join(",")}))
}
})
}
});
var combo = new DropDownWithTags({
combo: new MultiComboBox({
items: [
new Item({
key: "test",
text: "test"
}),
new Item({
key: "test1",
text: "test1"
})
]
})
});
combo.placeAt("content")
});
I have an ionicPopup like so:
function editNotifications() {
var popUp = $ionicPopup.show({
template: '<ion-checkbox ng-repeat="item in vm.notifications" ng-model="item.notification" ng-checked="item.notification">' +
'<span class="notificationsFont">{{item.settingsText}}</span></ion-checkbox>',
title: 'Notification Settings',
scope: $scope,
buttons: [
{
text: 'Cancel',
onTap: function(e) {
vm.notifications = localStorageManager.get('notificationStatus');
}
},
{
text: '<b>Ok</b>',
type: 'button-positive',
onTap: function(e) {
localStorageManager.set('notificationStatus', vm.notifications);
vm.notificationText = "Notifications off";
setNotificationValuesBasedOnUserInput(vm.notifications);
}
}]
});
};
Here is what I have so far;
it('Should edit notifications', function() {
spyOn($ionicPopup, 'show').and.callFake(function() {
return $q.resolve(true);
})
spyOn(localStorageManager, 'set');
controller = createController();
controller.editNotifications();
$scope.$apply();
expect(localStorageManager.set).toHaveBeenCalled();
// expect(localStorageManager.set).toHaveBeenCalledWith('notificationStatus');
});
I basically have no idea how to test this thing. There doesn't seem to be much on the internet. I would think I need to do something in my callFake function but I'm a bit stuck. Anyone ever successfully tested this beast before?
Go through this answer: https://stackoverflow.com/a/52565500/7943457
And modify your code something like this:
function editNotifications() {
var popUp = $ionicPopup.show({
template: '<ion-checkbox ng-repeat="item in vm.notifications" ng-model="item.notification" ng-checked="item.notification">' +
'<span class="notificationsFont">{{item.settingsText}}</span></ion-checkbox>',
title: 'Notification Settings',
scope: $scope,
buttons: [
{
text: 'Cancel',
onTap: function(e) {
return false;
}
},
{
text: '<b>Ok</b>',
type: 'button-positive',
onTap: function(e) {
return true;
}
}]
});
popup.then(function(response){
if(response){ //when response is true
localStorageManager.set('notificationStatus', vm.notifications);
vm.notificationText = "Notifications off";
setNotificationValuesBasedOnUserInput(vm.notifications);
}else{ //when response is false
vm.notifications = localStorageManager.get('notificationStatus');
}
})
};
You can test it like this:
it('Should edit notifications', function() {
spyOn($ionicPopup, 'show').and.callFake(function() {
return $q.resolve(true);
})
spyOn(localStorageManager, 'set');
controller = createController();
controller.editNotifications();
$scope.$apply();
expect(localStorageManager.set).toHaveBeenCalled();
// expect(localStorageManager.set).toHaveBeenCalledWith('notificationStatus');
});
it('Should get notifications', function() {
spyOn($ionicPopup, 'show').and.callFake(function() {
return $q.resolve(false);
})
spyOn(localStorageManager, 'get');
controller = createController();
controller.editNotifications();
$scope.$apply();
expect(localStorageManager.get).toHaveBeenCalled();
// expect(localStorageManager.get).toHaveBeenCalledWith('notificationStatus');
});
Hope it helps.
<script>
sap.ui.core.Control.extend("com.controls.MyButton", {
metadata: {
aggregations: {
buyButton : { type: "sap.ui.commons.Button", multiple: false}
},
events: {
buy: {enablePreventDefault: true}
}
},
init: function() {
var oControl = this;
//create a button to allow used buying that book
var oBuyBtn = new sap.ui.commons.Button({
text: "Click Me",
press: function (oEvent) {
oControl.fireBuy({
someData : "some data I want to pass along with the event object"
});
}
});
this.setAggregation("buyButton", oBuyBtn);
},
renderer: {
render: function(oRm, oControl) {
oRm.renderControl(oControl.getAggregation("buyButton"));
}
}
});
var oButton = new com.controls.MyButton({
buy: function(oEvent) {
alert(oEvent.someData);
}
});
oButton.placeAt("content");
</script>
The code is shown above. I want to get the someData property in the change callback function, How can I possibly achieve that? I tried oEvent.someData, but I got undefined alert. The code is from nabisoft website, but there has no explanation on how to access the object passed by the fireBuy method.
var oButton = new com.controls.MyButton({
buy: function(oEvent) {
alert(oEvent.getParameter("someData"));
}
});
oEvent.getParamter("someData") solves this!
How can I debounce listeners specified inside of controller using
this.control
?
Using the sample from the docs, you could use Ext.Function.defer() inside your
Ext.define('AM.controller.Users', {
init: function() {
this.control({
'useredit button[action=save]': {
click: function() {
//delay function call for a couple of seconds
Ext.Function.defer(this.updateUser, 2000, this);
}
}
});
},
updateUser: function(button) {
console.log('clicked the Save button');
}
});
Ext.define('AM.controller.Users', {
init: function() {
this.control({
'useredit button[action=save]': {
click: {
buffer:2000,
fn:this.updateUser
}
}
}
});
},
updateUser: function(button) {
console.log('clicked the Save button');
}
});
Hey I am working with bootstrap modal and calling it in angularjs. Its working good. Only the problem is that how can I route modal in angularjs routing. My Code:
Inside Controller
var modalInstance = $modal.open({
templateUrl: 'webpages/home/loginModal.html'
});
modalInstance.result.then(function () {
}, function () {
});
Inside Routing
.when('/login', {
templateUrl: function($routeParams) {
return 'sitepages/home/home.html';
},
controller: 'PageViewController',
reloadOnSearch: false
})
Its just example of routing how I am doing it, I need to find routing for modal.
You can use states for this purposes
$stateProvider.state("items.add", {
url: "/add",
onEnter: ['$stateParams', '$state', '$modal', '$resource', function($stateParams, $state, $modal, $resource) {
$modal.open({
templateUrl: "items/add",
resolve: {
item: function() { new Item(123).get(); }
},
controller: ['$scope', 'item', function($scope, item) {
$scope.dismiss = function() {
$scope.$dismiss();
};
$scope.save = function() {
item.update().then(function() {
$scope.$close(true);
});
};
}]
}).result.then(function(result) {
if (result) {
return $state.transitionTo("items");
}
});
}]
});
More details: https://github.com/angular-ui/ui-router/wiki/Frequently-Asked-Questions#how-to-open-a-dialogmodal-at-a-certain-state
You don't need the routing for it
app.controller("ACtrl", ['$scope','$http', '$log', '$modal',
function($scope, http, $log, $modal){
$scope.OpenModel = function () {
var param = { appId: 1, price: 2.5 };
var modalInstance = $modal.open({
size: 'lg',
backdrop: 'static',
templateUrl: 'webpages/home/loginModal.html',
controller: 'modalCtrl',
resolve: {
data: function () { return param; }
}
});
modalInstance.result.then(function (response) {
//Do whatever you want to do with reponse
}, function () {
$log.info('Modal dismissed at: ' + new Date());
});
}
}
///Add your modal control here
app.controller("modalCtrl", ['$scope','$http', '$modalInstance', 'data',
function($scope, http, $modalInstance, data){
// rest of the code goes here
$scope.cancel = function () {
$modalInstance.dismiss('cancel');
};
}
}