I have a problem with module.export on titanium. I tried following https://wiki.appcelerator.org/display/guides/CommonJS+Modules+in+Titanium but it doesn't work at all.
I have 2 little pieces of code. App.js:
var fenetreBase = Titanium.UI.createWindow({fullscreen:true,backgroundColor:"white",exitOnClose:true});
fenetreBase.open();
var vueimage = new (require('UI/viewimage'))();
vueimage.test();
fenetreBase.add(vueimage);
and viewimage.js in the folder UI.
function viewimage() {
var lavue = Ti.UI.createView({backgroundColor:'red' });
var item =...
lavue.add(item...);
return lavue;
}
viewimage.prototype.test = function() {
Ti.API.info("test");
};
module.exports = viewimage;
I have an error saying
Object #<view> has no method 'test' in app.js vueimage.test()
In my mind, I follow the example of "Instantiable Objects" in the wiki above but I may have not understand something. I expect I made a stupid mistake. I tried many other things, each uglier than other and it doesn't work anyway.
Can somebody tell me where the mistake is?
your mistake is assuming that you have an instance of viewimage when you run:
var vueimage = new (require('UI/viewimage'))();
you are getting an instance of
var lavue = Ti.UI.createView({backgroundColor:'red' });
which doesn't have a test property.
Perhaps you could use an object like this instead:
function viewimage() {
var result = {};
var lavue = Ti.UI.createView({backgroundColor:'red' });
var item =...
lavue.add(item...);
result.lavue = lavue;
result.test = function() {
Ti.API.info("test");
};
return result;
}
EDIT
In your App.js:
var vueimage = new (require('UI/viewimage'))();
vueimage.test();
fenetreBase.add(vueimage.lavue);
Related
I'm using for a mobile solution the slider "swipe.js" (https://github.com/bradbirdsall/Swipe). Now i would like to use the api-function getPos to return the actually slide. Unfortunatley my code doesn't work:
var elem = document.getElementById('mySwipe');
window.mySwipe = Swipe(elem, {
callback: function() {
var pageNumber = elem.getPos();
alert("P"+pageNumber);
}
});
What's wrong? how doest it work?
thanks for your help
You were almost there:
var pos = mySwipe.getPos() + 1;
alert( pos );
I am trying to use your api in a custom app with imported users.
Everything works fine (auth_token, login, call initiation) , but when the callee should get a response and add the remotestream nothing happens. no errors get shown in the console.
I would appreciate if someone takes a look at the code and tells me what i m missing.
I tried the vline demo at https://freeofcinema.vline.com and it worked with the same browsers and conditions between the two computers. In my app it is a http , but i tried it also with https, and the same problem came up. This is some simplified code i used to test the api.
var Streams = [];
var Vsession = null;
var Vline = (function(){
var Client;
var authToken;
var service_id = 'freeofcinema';
var profile = null;
var Person;
var Calls = [];
var onMessage = function(event){
//alert('message');
var msg = event.message, sender = msg.getSender();
console.log(sender.getDisplayName() +'sais: '+ msg.getBody());
console.log(event);
}
var onMediaSession = function(event){
console.log(event);
var mediaSession = event.target;
InitSession(mediaSession);
}
function Call(mediaSession) {
mediaSession.
on('change', alert_info);
}
function alert_info(b){
console.log(b);
}
function InitSession(mediaSession){
mediaSession.on('mediaSession:addRemoteStream', function(event) {
alert('addRemoteStream');
});
mediaSession.on('mediaSession:addLocalStream', function(event) {
alert('addLocalStream');
});
mediaSession.on('mediaSession:removeLocalStream mediaSession:removeRemoteStream', function(event) {
console.log('removedStream');
});
Calls.push(new Call(mediaSession));
}
return {
init : function(){
if(profile){
return;
}
profile = {
"displayName" : //some getusrname function...
};
$.post('vtoken.php',{//get auth token
id : Comm.Voip_user().id
},function(data){
authToken = data;
Client = vline.Client.create({
"serviceId": service_id,
"ui" : true
});
Client.on('recv:im', onMessage , this);
Client.on('add:mediaSession', onMediaSession, this);
Client.on('login', function(e) {
Vsession = e.target;
//alert('loged in');
});
Client.login(service_id, profile, authToken);
});
},
getPerson : function(id){//id of user to call
if(Vsession){
Vsession.getPerson(id).
done(function(person){
Person = person;
Vsession.startMedia(id);
});
}
}
}
}());
Thank you for your response.
I tried with one user from the app, and another from the https://freeofcinema.vline.com, and the same problem occured. Also the call (in pending state) gets terminated after a short while..
When passing ui:true when creating the client, you do not have to handle the media sessions yourself. Just comment the line Client.on('add:mediaSession', onMediaSession, this); and it should just work.
I am generating the knockout mapping from server side view model using below
var bindData2ViewModel = function (data) {
var rdata = ko.toJSON(data);
ko.mapping.fromJSON(rdata, {}, vm.model());
ko.applyBindings(vm);
};
var CustomerViewModel = function () {
var self = this;
self.model = ko.observable({});
return { model: self.model };
};
var vm = new CustomerViewModel();
now there is another call which is giving me the data... i just want to bind that data to the client side viewmodel without changing the binding... how to do that?
var rebindData2ViewModel = function (data) {
var rdata = ko.toJSON(data);
vm.model.set(rdata);
ko.applyBindings(vm);
};
tried above but not working... what is the correct way to do this?
basically to rebind the data to the existing model.. you just need to set the data using the angular brackets.. no need of json etc... because data should itself return as jsonresult
var rebindData2ViewModel = function (data) {
vm.model(data);
};
I have a fairly simple controller that gets a simple json list of objects ...
function ProductGroupsCtrl($scope, $http, $routeParams, sharedService, popupService) {
$scope.list = null;
$scope.selectedItem = null;
$scope.selectedItemJsonString = '';
$scope.selectItem = function (item) {
$scope.selectedItem = item;
$scope.selectedItemJsonString = JSON.stringify(item);
//alert(JSON.stringify(item));
};
$scope.closePopup = function () {
$scope.selectedItem = null;
$scope.selectedItemJsonString = '';
};
// sharedService.prepForBroadcast($routeParams.anotherVar);
$http({
method: 'GET',
url: '/ProductGroup'
}).success(function (data) {
$scope.list = data;
}).
error(function (data) {
$scope.message = 'There was an error with the data request.';
});
}
I then try to mock the request in the test class:
var scope, ctrl, $httpBackend, sharedServiceMock = {}, popupServiceMock = {};
beforeEach(inject(function (_$httpBackend_, $rootScope, $controller) {
$httpBackend = _$httpBackend_;
$httsypBackend.expectGET('/ProductGroup').
respond([{
ProductGroupID: 5,
MenuTitle: "Promotional Products",
AlternativeText: "Coming soon - a collection of environmentally friendly Promotional Products",
OrdinalPosition: 5,
Active: false
}]);
scope = $rootScope.$new();
ctrl = $controller(ProductGroupsCtrl, {
$scope: scope,
$http: $httpBackend,
sharedService: sharedServiceMock,
popupService: popupServiceMock
});}));
However I receive an error in the testacular window object undefined. What have I done wrong here?
Found the answer. If I remove the error callback function from the $http.get method then it works, i.e. remove the following ...
error(function (data) {
$scope.message = 'There was an error with the data request.';
}
I have to say Angular sure is a steep learning curve for someone who is not a day to day JavaScript programmer (although I seem to be doing more and more). Thanks for the help anyway KatieK :-)
I am reading through titanium best practises and i was wondering why this doesnt appear to work can some one tell me whats changed with the api?
https://wiki.appcelerator.org/display/guides/Mobile+Best+Practices
ui/ToggleBox.js - A custom check box
function ToggleBox(onChange) {
this.view = Ti.UI.createView({backgroundColor:'red',height:50,width:50});
//private instance variable
var active = false;
//public instance functions to update internal state, execute events
this.setActive = function(_active) {
active = _active;
this.view.backgroundColor = (active) ? 'green' : 'red';
onChange.call(instance);
};
this.isActive = function() {
return active;
};
//set up behavior for component
this.view.addEventListener('click', function() {
this.setActive(!active);
});
}
exports.ToggleBox = ToggleBox;
Sample usage in app.js
var win = Ti.UI.createWindow({backgroundColor:'white'});
var ToggleBox = require('ui/ToggleBox').ToggleBox;
var tb = new ToggleBox(function() {
alert('The check box is currently: '+this.isActive());
});
tb.view.top = 50;
tb.view.left = 100;
win.add(tb.view);
it doesn't seem to want to return the setActive method when called from the add event listener?
The "this" in your click listener isn't what you're expecting it to be. (It's probably the view.) Because your function is already the ToggleBox context, the easiest solution is to just use a direct reference to setActive. "this." is only necessary for the API you're exposing for other code.
function ToggleBox(onChange) {
var view = this.view = Ti.UI.createView({backgroundColor:'red',height:50,width:50});
//private instance variable
var active = false;
//public instance functions to update internal state, execute events
var setActive = this.setActive = function(_active) {
active = _active;
view.backgroundColor = (active) ? 'green' : 'red';
onChange.call(instance);
};
var isActive = this.isActive = function() {
return active;
};
//set up behavior for component
view.addEventListener('click', function() {
setActive(!active);
});
}
exports.ToggleBox = ToggleBox;