Streaming through SoundManager2 for webradios is pending for a very long time - streaming

I'm developping a little javascript snippet that allow a user to listen a webradio in streaming using soundManager2. By giving an URL to this snippet, the stream is sending me music so it's cool, it works.
Yes, but...
Query to the URL can be very very long (above 2-3 min!). I would like to know if there's a workaround or option I can use to make this query faster.
Why, opening my m3u (which just contains the mp3 URL inside) with Windows Media Player, the loading spend only 5-10 sec max, while acces to the same URL in a browser or with soundManager2 is during 2-3 min, sometimes more?
Here is my jsFiddle trying with the OuïFM (French radio). The waiting time, for this radio, is about 115 seconds.
var url = 'http://ice39.infomaniak.ch:8000/ouifm3.mp3';
var time = 0;
var timing = setInterval(function() {
$('#Streaming').html((time / 10) + ' seconds.');
time++;
}, 100);
var start = new Date;
soundManager.onready(function() {
soundManager.createSound({
id:'Radio',
url:url,
autoLoad: true,
autoPlay: true,
multiShot: false,
onload: function() {
$('#Loading').css('display', 'none');
clearInterval(timing);
}
});
});

Your fiddle was broken because SoundManager2's javascript wasn't loading properly. After I fixed that (and some of your code), I was able to get the audio playing in under a second: http://jsfiddle.net/y8GDp/
var url = 'http://ice39.infomaniak.ch:8000/ouifm3.mp3';
var time = 0;
var timer = $('#Streaming');
var loading = $('#Loading');
var start = new Date;
var seconds = function(){
var diff = ((new Date).getTime() - start.getTime()) / 1000;
return diff + ' seconds.';
};
var timing = setInterval(function() {
timer.html(seconds());
}, 100);
soundManager.onready(function() {
soundManager.createSound({
id:'Radio',
url:url,
autoPlay: true,
onplay: function() {
clearInterval(timing);
loading.html('Finished loading');
timer.html(seconds());
}
});
});

Related

OfflineAudioContext Latency Shift

I'm using OfflineAudioContext to download an input file with effects applied. The download works great and it's really fast, but the problem I'm running into is that when I apply gain, I'm using an analyser to signal when the gain should increase or decrease.
This works great when playing the audio using an AudioContext, but the offline version causes the timing of the gain to shift very noticeably. The increase is starting late and the decrease is starting late. It's like there's a latency shift overall.
Is there a way to combat this shift? I'm fine with the rendering process taking longer.
var chunks = [];
var fileInput = document.getElementById("input");
var process = document.getElementById("process");
//Load audio file listener
process.addEventListener(
"click",
function () {
// Web Audio
var audioCtx2 = new (AudioContext || webkitAudioContext)();
// Reset buttons and log
$("#log").empty();
$("#download_link").addClass("d-none");
$("#repeat_link").addClass("d-none");
// Check for file
if (fileInput.files[0] == undefined) {
if ($("#upload_err").hasClass("d-none")) {
$("#upload_err").removeClass("d-none");
}
return false;
}
var reader1 = new FileReader();
reader1.onload = function (ev) {
// console.log("Reader loaded.");
var tempBuffer = audioCtx2.createBufferSource();
// Decode audio
audioCtx2.decodeAudioData(ev.target.result).then(function (buffer) {
// console.log("Duration1 = " + buffer.duration);
var offlineAudioCtx = new OfflineAudioContext({
numberOfChannels: 2,
length: 44100 * buffer.duration,
sampleRate: 44100,
});
// console.log("test 1");
// Audio Buffer Source
var soundSource = offlineAudioCtx.createBufferSource();
var analyser2d = offlineAudioCtx.createAnalyser();
var dgate1 = offlineAudioCtx.createGain();
var dhpf = offlineAudioCtx.createBiquadFilter();
var dhum60 = offlineAudioCtx.createBiquadFilter();
var dcompressor = offlineAudioCtx.createDynamicsCompressor();
dhpf.type = "highpass";
dhpf.Q.value = 0.5;
dhum60.type = "notch";
dhum60.Q.value = 130;
dcompressor.knee.setValueAtTime(40, offlineAudioCtx.currentTime);
dcompressor.attack.setValueAtTime(0.1, offlineAudioCtx.currentTime);
dcompressor.release.setValueAtTime(0.2, offlineAudioCtx.currentTime);
var reader2 = new FileReader();
// console.log("Created Reader");
reader2.onload = function (ev) {
// console.log("Reading audio data to buffer...");
$("#log").append("<p>Buffering...</p>");
soundSource.buffer = buffer;
let context = offlineAudioCtx;
//Before Effects
analyser2d = context.createAnalyser();
analyser2d.fftSize = 2048;
analyser2d.smoothingTimeConstant = 0.85;
const sampleBuffer = new Float32Array(analyser2d.fftSize);
function loop() {
analyser2d.getFloatTimeDomainData(sampleBuffer);
let sumOfSquares = 0;
for (let i = 0; i < sampleBuffer.length; i++) {
sumOfSquares += sampleBuffer[i] ** 2;
}
const avgPowerDecibels = Math.round(
10 * Math.log10(sumOfSquares / sampleBuffer.length)
);
const gainset = avgPowerDecibels > -50 ? 1 : 0;
//real-time effects choices start
if (
document.getElementById("gate").getAttribute("data-active") ===
"true"
) {
dgate1.gain.setTargetAtTime(
gainset,
offlineAudioCtx.currentTime,
0.05
);
} else if (
document.getElementById("gate").getAttribute("data-active") ===
"false"
) {
dgate1.gain.setTargetAtTime(
1,
offlineAudioCtx.currentTime,
0.05
);
}
if (
document.getElementById("hpf").getAttribute("data-active") ===
"true"
) {
dhpf.frequency.value = 90;
} else if (
document.getElementById("hpf").getAttribute("data-active") ===
"false"
) {
dhpf.frequency.value = 0;
}
if (
document.getElementById("hum").getAttribute("data-active") ===
"true"
) {
dhum60.frequency.value = 60;
} else if (
document.getElementById("hum").getAttribute("data-active") ===
"false"
) {
dhum60.frequency.value = 0;
}
if (
document.getElementById("comp").getAttribute("data-active") ===
"true"
) {
dcompressor.threshold.setValueAtTime(
-30,
offlineAudioCtx.currentTime
);
dcompressor.ratio.setValueAtTime(
3.5,
offlineAudioCtx.currentTime
);
} else if (
document.getElementById("comp").getAttribute("data-active") ===
"false"
) {
dcompressor.threshold.setValueAtTime(
0,
offlineAudioCtx.currentTime
);
dcompressor.ratio.setValueAtTime(1, offlineAudioCtx.currentTime);
}
// Display value.
requestAnimationFrame(loop);
}
loop();
soundSource
.connect(analyser2d)
.connect(dhpf)
.connect(dhum60)
.connect(dgate1)
.connect(dcompressor);
dcompressor.connect(offlineAudioCtx.destination);
offlineAudioCtx
.startRendering()
.then(function (renderedBuffer) {
// console.log('Rendering completed successfully.');
$("#log").append("<p>Rendering new file...</p>");
//var song = offlineAudioCtx.createBufferSource();
console.log(
"OfflineAudioContext.length = " + offlineAudioCtx.length
);
split(renderedBuffer, offlineAudioCtx.length);
$("#log").append("<p>Finished!</p>");
})
.catch(function (err) {
// console.log('Rendering failed: ' + err);
$("#log").append("<p>Rendering failed.</p>");
});
soundSource.loop = false;
};
reader2.readAsArrayBuffer(fileInput.files[0]);
soundSource.start(0);
});
};
reader1.readAsArrayBuffer(fileInput.files[0]);
},
false
);
I've included what I believe is the relevant portion of the code. Let me know if more is needed. Thanks!
This is doesn't work because the OfflineAudioContext runs faster (sometimes hundreds of times faster) than realtime. Your loop that gets the analyser data is done every 16 ms or so. In a realtime system, this might be accurate enough, but the offline context could be running much, much faster than realtime so by the time you've grabbed the analyser data, much more time has passed. (You can probably see this by printing out the context currentTime in the loop. It will probably increment by more (much more) than 16 ms.
The best way to do this is to use context.suspend(t) to suspend the context at known times so you can grab the analyser data synchronously. Note that the time is rounded so it might not be exactly the time you want but perhaps close enough. Note also that AFAIK, Firefox has not implemented this, and neither has Safari (but will soon).
Here's a short snippet with how do use suspend. There's more than one way though. Untested, but I think the general idea is correct:
// Grab the data every 16 ms, roughly. `suspend` rounds the time up to
// the nearest multiple of 128 frames (or 128/context.sampleRate time).
for (t = 0; t < <length of buffer>; t += 0.016) {
context.suspend(t)
.then(() => {
// Use analyser to grab the data and compute the values.
// Use setValueAtTime and friends to adjust the gain and compressor
// appropriately. Use context.currentTime to know at what time
// the context was suspended, and schedule the modifications to be
// at least 128 samples in the future. (I think).
})
.then(() => context.resume());
}
An alternative is to create a realtime context and process it as you do now, and when the buffer is finished playing, close the context. Of course, you'll have to add something (ScriptProcessorNode, AudioWorkletNode, or MediaRecorder) to capture the rendered data.
If none of these work for you, then I'm not sure what the alternatives would be.

Protractor upload stuck when filesearch pops up

I'm trying to figure out what's wrong with the code below:
it('should upload a photo', function(){
var photo = './photos/et-test.jpeg',
exactPhoto = path.resolve(__dirname, photo);
var form = element(by.id('fileupload'));
var upload = element(by.css('input[type = "file"]'));
var addFiles = element(by.cssContainingText('.btn.btn-success.fileinput-button.mb-10','Add files...'));
var uploadBtn = element(by.css('.btn.btn-primary.start.mt-20'));
element(by.cssContainingText('.inline_link','Upload more album photos now')).click();
element(by.id('secondary_upload_link')).click();
browser.wait(EC.visibilityOf(addFiles), 5000);
addFiles.click();
upload.sendKeys(exactPhoto);
browser.wait(EC.visibilityOf(uploadBtn), 5000);
uploadBtn.click();
expect(element(by.css('.table')).getText()).toBe('Upload Finised');
});
I keep getting stuck on the filesearch popup and receive this error:
Message:
Failed: Wait timed out after 5006ms
Is there anything lacking or should've been done based on the flow of my code?
If I'm understanding your issue correctly you are seeing a popup window when uploading a file. Can you try the following capability in your conf (assuming you are using Chrome)
capabilities: {
browserName: 'chrome',
chromeOptions: {
prefs: {
download: {
'prompt_for_download': false,
'directory_upgrade': true,
'default_directory': 'src/test/javascript/e2e/downloads'(or where ever you prefer)
}
}
}
}
Yes, you don't need to click on it, just sendKeys() for this input element
Sometimes it needs to make this input visible. Just try like that (it works in my case for await/async protractor):
private addAttachment = element(by.css('input[type="file"]'))
await browser.executeScript("arguments[0].style.visibility = 'visible'; arguments[0].style.height = '1px'; arguments[0].style.width = '1px'; arguments[0].style.opacity = 1; arguments[0].style.display = 'inline'; arguments[0].style.overflow = 'visible'", this.addAttachment)
await browser.executeScript("arguments[0].focus();", await this.addAttachment.getWebElement())
await this.addAttachment.sendKeys(path)
Try this:
var photo = './photos/et-test.jpg',
exactPhoto = path.resolve(__dirname, photo);
var form = element(by.id('fileupload')); ///Users/leochardc/ET/photos/et-test.jpg
var upload = element(by.css('.fileupload_section input[type = "file"]'));
var addFiles = element(by.cssContainingText('.btn.btn-success.fileinput-button.mb-10','Add files...'));
var uploadBtn = element(by.css('.btn.btn-primary.start.mt-20'));
var uploadFinished = element(by.css('.fileupload_section .text-center p'));
browser.get(url);
element(by.cssContainingText('.inline_link','Upload more album photos now')).click();
element(by.id('secondary_upload_link')).click();
browser.wait(EC.visibilityOf(addFiles), 5000);
// addFiles.click();
upload.sendKeys(exactPhoto);
var previewPic = element(by.css('.fileupload_section.fileupload_files'));
browser.wait(EC.visibilityOf(previewPic), 5000);
browser.wait(EC.visibilityOf(uploadBtn), 5000);
uploadBtn.click();
browser.wait(EC.visibilityOf(uploadFinished), 30000);
expect(uploadFinished.getText()).toBe('Upload Finished');

Ionic 3: BackgroundLocation updates are too rare

I'm currently facing a problem that is not so nice. I already created an issue but no response. I need every location change to update the camera center position. But this doesn't happen. The refresh is not definable with time. It's just very rare for my needs. Android and iOS is the same. The log is called every minute or something like that.
Also I tried the console log outside the ngZone but it's the same.
This is what my configuration code looks like:
let config = {
desiredAccuracy: 0,
stationaryRadius: 1,
distanceFilter: 0,
debug: true,
interval: 2000,
pauseLocationUpdates: false,
activityType: "AutomotiveNavigation"
};
this.backgroundGeolocation.configure(config).subscribe((location) => {
// Run update inside of Angular's zone
this.zone.run(() => {
if(this.map) {
this.map.getMyLocation().then( (userLocation: MyLocation) => {
console.log("INSIDE ZONE Google Maps Location \n LAT: " + userLocation.latLng.lat + "\nLNG: " + userLocation.latLng.lng);
this.userLocation = userLocation.latLng;
this.speed = userLocation.speed;
this.bearing = userLocation.bearing;
this.altitude = location.altitude;
this.cameraFollow();
this.notify(this.nearestReports[0]);
}).catch( error => {
alert("Background - NO GPS FOUND: " + error);
});
}
});
});
// Turn ON the background-geolocation system.
this.backgroundGeolocation.start();
Consider using another Ionic Native plugin called Geolocation.
There is a very handy watchPosition() function in there that looks like what you are looking for. Here's an example:
let options = {
enableHighAccuracy: true,
timeout: Infinity, // don't return response until new ping is available from OS, to save battery
maximumAge: 0
};
const subscription = this.geolocation.watchPosition(options)
.filter((p) => p.coords !== undefined) //Filter Out Errors
.subscribe(position => {
console.log(position.coords.longitude + ' ' + position.coords.latitude);
});
Don't forget to stop the subscription when not needed in order to save battery:
subscription.unsubscribe();

HTML5 Video - currentTime not setting properly on iPhone

I have a basic HTML5 video set up from which I load one of four videos. The problem I'm having is that when I load the next video, it continues playing from the previous time position. Efforts to set the currentTime property seem to be either short lived or ignored entirely.
I have added listeners to a collection of events and have something like this in each one;
myPlayer.addEventListener("loadeddata", function() {
console.log(" loadeddata: before = " + myPlayer.currentTime);
myPlayer.currentTime = 0.1;
console.log(" loadeddata: after = " + myPlayer.currentTime);
}, false);
Sometimes I see the time change for one event but not persist correctly;
durationchange: before = 19.773332595825195
durationchange: after = 0.10000000149011612
loadedmetadata: before = 0.10000000149011612
loadedmetadata: after = 19.773332595825195
loadeddata: before = 19.773332595825195
loadeddata: after = 0.10000000149011612
canplay: before = 0.10000000149011612
canplay: after = 19.773332595825195
And sometimes it never even seems to set at all;
durationchange: before = 50.66666793823242
durationchange: after = 50.66666793823242
loadedmetadata: before = 50.66666793823242
loadedmetadata: after = 50.66666793823242
loadeddata: before = 50.66666793823242
loadeddata: after = 50.66666793823242
canplay: before = 50.66666793823242
canplay: after = 50.66666793823242
This seems similar to the issue here but there didn't seem to be any resolution. Has anyone encountered this issue on iPhone before?
TL;DR: change currentTime on the loadeddata event. This works for audio too.
It looks like Safari (and the problem is still appearing for me on Safari 11.1) is Safari will not allow currentTime to be changed when a video is first loaded IF it hasn't loaded a frame for that currentTime yet. The bigger problem: the wrong solution can break Chrome (and likely other browsers too).
Fortunately, we have a lot of events we can listen for while media is loading:
During the loading process of an audio/video, the following events occur, in this order:
loadstart
durationchange
loadedmetadata
loadeddata
progress
canplay
canplaythrough
-W3Schools (I know it's not a preferred source, but I couldn't find the same info on MDN)
I tried adjusting currentTime on different events, but on the first 3 events, Safari would move the time back to 0; and on 5 and 6 it seemed to prevent the video from playing in Chrome, because it would get stuck at currentTime (which I could've worked around, but I thought there was a better solution).
(I didn't want to have to load the whole file to go to the right spot, because I want to support hefty videos. So canplaythrough wasn't an option for me.)
The description for the loadeddata event reads:
The loadeddata event is fired when the first frame of the media has finished loading.
-MDN
When I changed currentTime on loadeddata, Safari could tell that the frame was loaded and available, and would update correctly. It also wouldn't cause Chrome to freeze in a single spot while playing.
The problem and solution are identical for audio.
From my findings the issue seems to be that on iPhone only (iPad works fine) the currentTime property will not be set correctly until the "canplaythrough" event, however changing the currentTime at that point will cause a noticeable hiccup. The solution for that would be to intentionally pause the video after calling load...
myVideo.load();
myVideo.pause();
...and then call play in the event when the time has reset.
The second problem however is when the duration of the new movie is shorter then the currentTime position. In this case not only does currentTime fail to set but "canplaythrough" is never called, and QT just sits at the end of the video doing nothing.
I discovered the solution to both problems was to force a secondary load if the currentTime was not reset in the event BEFORE "canplaythrough". Its a bit round about with the timer callback but it seems to do the trick;
var myVideo = document.getElementById("video1");
myVideo.addEventListener("canplay", function() {
console.log(" canplay: before = " + myVideo.currentTime);
myVideo.currentTime = 0.1;
console.log(" canplay: after = " + myVideo.currentTime);
if( myVideo.currentTime < 1 ) {
myVideo.play();
}
else {
myVideo.load();
myVideo.pause();
setTimeout(checkStarted, 500);
}
}, false);
function checkStarted()
{
console.log(" checkStarted called");
myVideo.play();
}
I had to set the preload attribute to metadata (on the HTML of the main video element) and set the currentTime of the video element within the loadedmetadata event listener.
<video id="myVideo" preload="metadata">
<source src="/path/to/video" type="video/mp4">
</video>
JS
VideoEl.addEventListener('loadedmetadata', VideoMetaDataLoaded);
function VideoMetaDataLoaded() {
VideoEl.currentTime = newTime;
}
Below is my Angular/Ionic solution to restore the video position. It works on IOS, Android, Chrome and Safari.
HTML:
<video preload="metadata"
poster="{{ resource.thumbnail_file }}"
playsinline webkit-playsinline
#videos>
...
</video>
Typescript:
#ViewChildren('videos') videos: QueryList<any>;
videoCache: Map<number, number> = new Map<number, number>();
private restoreVideoPositions() {
var context = this;
setTimeout(() => {
this.videos.forEach(function (item, idx) {
var video = item.nativeElement;
var currentTime = context.videoCache.get(video.id);
if (currentTime != null && currentTime > 0) {
console.log('add listener', currentTime);
video.addEventListener("loadeddata", function () {
if (video.readyState >= 3) {
video.currentTime = currentTime;
// video.play();
}
});
video.load();
}
});
}, 0);
}
private storeVideoPositions() {
var context = this;
this.videoCache.clear()
this.videos.forEach(function (item, idx) {
var video = item.nativeElement;
video.pause();
context.videoCache.set(video.id, video.currentTime)
});
}
I used a combination of the last two answers here, but had to reduce the ready state limit to 2 (HTMLVideoElement.prototype.HAVE_CURRENT_DATA) as the loadeddata event on iOS would often never come in higher than 2.
With help from the other answers here I came up with the next solution:
HTMLVideoElement.prototype.playFromTime = function(currentTime){
let that = this;
that.load();
that.pause();
that.currentTime = currentTime;
let loadedMetadata;
loadedMetadata = function(event){
that.currentTime = currentTime;
that.removeEventListener("loadedmetadata", loadedMetadata);
}
if(that.currentTime !== currentTime){
that.addEventListener("loadedmetadata", loadedMetadata);
}
that.play();
}
//usage example:
myVidElement.playFromTime(20);
Which in my situation works on an iPhone on Safari, Safari on the desktop, Firefox on macOS, Chrome on macOS. That's all I have tested for now.
Had the same problem with a play video on scroll with React. The following solved it for me.
useEffect(() => {
videoRef.current.load();
}, []);
const { render } = ReactDOM;
const { useState, useEffect, useRef } = React;
const Video = ({ src, height, length }) => {
const [currentTime, setCurrentTime] = useState(0);
const videoRef = useRef(null);
useEffect(() => {
// This is needed for IOS
videoRef.current.load();
window.addEventListener("scroll", handleScroll);
return () => window.removeEventListener("scroll", handleScroll);
}, []);
const getCurrentTime = () => {
const percentScrolled = window.scrollY / (height - window.innerHeight);
return length * percentScrolled;
};
const handleScroll = (e) => {
const time = getCurrentTime();
videoRef.current.currentTime = time;
setCurrentTime(time);
};
return (
<div style={{ height }}>
<p>Time: {currentTime.toFixed(2)}s</p>
<video ref={videoRef} muted playsInline>
<source src={src} type="video/mp4" />
Your browser does not support the video tag.
</video>
</div>
);
};
const App = () => {
return (
<Video
length={5}
height={3000}
src="https://lqez.github.io/js/airpodsvf/video.mp4"
/>
);
};
render(<App />, document.getElementById("root"));
body {
background: black;
}
p {
color: slategrey;
top: 0;
position: fixed;
z-index: 1;
padding: 20px;
}
video {
top: 60px;
position: fixed;
width: 100%;
display: block;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.9.0/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.9.0/umd/react-dom.production.min.js"></script>
<div id="root"></div>
this is a problem with chrome on local assets. happened with me. when i was serving video from local assets and setting time it resets the video to 0.
so the solution that worked for me was serving the video from s3 bucket.

Json parse from Facebook events

I have had some trouble with fetching json from a groups events on facebook and then put them in a tableview to be used in a Appcelerator mobile app.
The idea is to have this as a calendar to show events for a club in a simple way.
I want to show the name of the event. The picture for that event and the date for the event.
All in a tablerow.
I have gotten to the part where i can get the Name and date for the events with this code:
Ti.UI.backgroundColor = '#dddddd';
var access_token='AAACEdEose0cBAAICGa4tFTcZAqCOGm2w9qPYGZBwNtJ1oZAcwaMAP2DDHZCN58cvVBZCHZADZAZBTPC8tTnpfQ7uGKI5j3SbMYcRmWquZCdPzhwZDZD';
var url = "https://graph.facebook.com/64306617564/events?&access_token=" + access_token ;
var win = Ti.UI.createWindow();
var table = Ti.UI.createTableView();
var tableData = [];
var json, data, row, name, start_time, id;
var xhr = Ti.Network.createHTTPClient({
onload: function() {
// Ti.API.debug(this.responseText);
json = JSON.parse(this.responseText);
for (i = 0; i < json.data.length; i++) {
data = json.data[i];
row = Ti.UI.createTableViewRow({
height:'60dp'
});
var name = Ti.UI.createLabel({
text:data.name,
font:{
fontSize:'18dp',
fontWeight:'bold'
},
height:'auto',
left:'50dp',
top:'5dp',
color:'#000',
touchEnabled:true
});
var start_time = Ti.UI.createLabel({
text:'"' + data.start_time + '"',
font:{
fontSize:'13dp'
},
height:'auto',
left:'15dp',
bottom:'5dp',
color:'#000',
touchEnabled:true
});
row.add(name);
row.add(start_time);
tableData.push(row);
}
table.setData(tableData);
},
onerror: function(e) {
Ti.API.debug("STATUS: " + this.status);
Ti.API.debug("TEXT: " + this.responseText);
Ti.API.debug("ERROR: " + e.error);
alert('There was an error retrieving the remote data. Try again.');
},
timeout:5000
});
xhr.open("GET", url);
xhr.send();
But when i want the specific event to open in a new window when clicked i just get the event that lies last on the screen when i put this in a browser:
https://graph.facebook.com/64306617564/events?&access_token=AAACEdEose0cBAOLAFWMKPmvgqEwap1ldnl7DeZBDKJC6YTZC4Goh6K5NHsvpOFmFQaGp1IekVsCxZCZCz3lwGpRcQG9ZBkcMrZAnLk4As8kgZDZD
And the access token expires REALLY fast. Any ideas how to make an access token that lasts longer?
Well, the code i am using to open the window is:
table.addEventListener('click',function(e) {
// Create the new window with the link from the post
var blogWindow = Ti.UI.createWindow({
title : data.name,
modal : true,
barColor: '#050505',
backgroundColor: '#050505'
});
var webView = Ti.UI.createWebView({url:'http://www.facebook.com/events/' + data.id});
blogWindow.add(webView);
// Create the close button to go in the left area of the navbar popup
var close = Titanium.UI.createButton({
title: 'Close',
style: Titanium.UI.iPhone.SystemButtonStyle.PLAIN
});
blogWindow.setLeftNavButton(close);
// Handle the close event
close.addEventListener('click',function() {
blogWindow.close();
});
blogWindow.open();
});
win.add(table);
win.open();
in my opinion that should open the event that is clicked on by parsing the ID from the row and putting it after the link.
Am i retarded or what is wrong?
It doesnt matter on which event i click it just open the last one all of the times.
And how can i get a thumbnail for the events?
Pls help........
When you click on table to get value from data which is not available.You can achieve it using you custom variable try to put this line of code at your row creation where you add your row in array i.e.row.data = data; and on table click event get that object using this alert(e.source.data); and check it. Best luck