I hvae built s40 web application PhotoAlbum.I want to use my flickr api key

I have built s40 web application PhotoAlbum.I want to use my flickr api key which I got online from flickr.com.


When I run the application I want to show or see the flickr photos uploaded already in my account.



Please help me. I have inserted the flickr key already like


(function(){
jsonFlickrApi = function(results){
//flickr_webapp.splash(results.photos.photo[0]);
flickr_webapp.splash(results);
}
flickr_webapp = function(){
var _w,_d,_h,_s,_g,_s,_imgs,_focus; //function scoped vars
var _BUFFER = 60; //number if images to cache
var _PER_PAGE = 15; //number to scroll through
var THUMB_IMG_URL = "http://farm${farm}.static.flickr.com/${server}/${id}_${secret}_s.jpg";
var LARGE_IMG_URL = "http://farm${farm}.static.flickr.com/${server}/${id}_${secret}_m.jpg";

// !!!
// NOTE! You must apply for a Flickr API key from [url]http://www.flickr.com/services/api/misc.api_keys.html[/url]
// and insert it below
var API_KEY_FLICKR = "[63e940334a5e25d7c8fa14128371ae02]";// my flickr AP i key


/**
* Initialization function, sets up variables and requests the landing page image.
*
* @param {HTMLElement} container The href value from the base tag.
* @param {String} reqUrl The URL that should be requested
* @returns {String} The useable base URL
* @private
**/
function _init(container){
_d = document;
_h = _d.getElementsByTagName('head')[0];
_w = {'preferences':{'searchText':'Nokia'}};
_d.getElementById('search-input').value = _w.preferences.searchText;
_g = container;
var rand = Math.floor(Math.random()*100);// my flickr AP i key
if ((API_KEY_FLICKR == "[63e940334a5e25d7c8fa14128371ae02]") || (!API_KEY_FLICKR.length) ) {
document.getElementById('title-bar').innerHTML = 'Flickr API key is needed.';
}else{
_query_flickr("http://api.flickr.com/services/rest/?method=flickr.interestingness.getList&api_key=" + API_KEY_FLICKR + "&format=json&page=" + rand + "&per_page=1");
}
}

function _generate_string(template,values){
return template.replace(/\$\{([\w-]+)(?:\:([\w\.]*)(?:\((.*?)?\))?)?\}/g,function(m,name){
return values[name] !== undefined ? values[name] : "";
});
}

function _splash(results){
if (results.photos.photo.length > 0) {
bg_pic = results.photos.photo[0];

if (bg_pic != undefined) {
_d.getElementById('splash').style.backgroundImage = 'url(' + _generate_string(LARGE_IMG_URL, bg_pic) + ')';
}
}
//re-purpose global API callback to handle search
_overwrite_callback(function(results){
_parse_response(results.photos.photo)
});
}


function _overwrite_callback(fn){
jsonFlickrApi = fn;
}
function _clear_node(n){
while (n.hasChildNodes()){
n.removeChild(n.lastChild);
}
}


function _render_grid(){
var x = 0;
for (p in _imgs) {
if (p >= _focus && p < (_focus +_PER_PAGE)) {
var s = _d.createElement('span')
if (_imgs[p] != undefined) {
a = _d.createElement('a');
a.setAttribute('onclick', 'flickr_webapp.loadPic(' + p + ')');
img = _d.createElement('img');
img.setAttribute('src', _imgs[p]['thumb']);
img.setAttribute('width', '80');
img.setAttribute('height', '80');
img.setAttribute('class', 'thumb');
s.appendChild(a).appendChild(img);
}
else {
img = _d.createElement('img');
img.setAttribute('src', 'img/spacer.gif');
img.setAttribute('width', '80');
img.setAttribute('height', '80');
s.appendChild(img);
}
_g.appendChild(s);
}
}
}


function _load_pic(index){
_focus = index;
_clear_node(_d.getElementById('zoom-container'));
var table = _d.createElement('table');
var row = table.insertRow(0);
table.setAttribute('cellspacing',0);
table.setAttribute('cellpadding',0);
_insertZoomedCell(row, index-1)
_insertZoomedCell(row, index)
_insertZoomedCell(row, index+1)

_d.getElementById('zoom-container').appendChild(table);

mwl.switchClass('#zoom-container','zoom*','zoom2');
mwl.setGroupTarget('#search-button','#grid','visible','hidden');
mwl.setGroupTarget('#content', '#zoom', 'visible', 'hidden');
}

function _slide_left(){
mwl.setGroupTarget('#arrow-button','#set2','visible','hidden');
_load_pic(_focus - 2);
}

function _slide_right(){
mwl.setGroupTarget('#arrow-button','#set2','visible','hidden');
_load_pic(_focus + 2);
}

function _insertZoomedCell(row, index){
var cell = row.insertCell(row.cells.length);
div = _d.createElement('div');
div.setAttribute('class','zoom-pic');
div.style.backgroundImage = 'url(' + _imgs[index].large + '?d=' + new Date().valueOf() + ')';
cell.appendChild(div);
title = _d.createElement('div');
title.setAttribute('class','title');
title.innerHTML = _imgs[index].title;
div.appendChild(title);
return cell;
}

function _query_flickr(url){
if (_s != undefined) {
_h.removeChild(_s);
}
_s = document.createElement('script');
_s.type = 'text/javascript';
_s.src = url;
try { // Chec if there's problem in adding the content in DOM header
_h.appendChild(_s);
} catch (e) {
no_results();
}
}
function _no_results() { // In case of search fails / no results available
document.getElementById("grid-container").innerHTML = "No results";
}
function _parse_response(photos){
var num_results = photos.length;
if (num_results > 15) {
_focus = Math.round(num_results/2);
_imgs = {};
for (p = 0; p < photos.length; p++) {
_imgs[p] = {
'title': photos[p].title,
'thumb': _generate_string(THUMB_IMG_URL, photos[p]),
'large': _generate_string(LARGE_IMG_URL, photos[p])
};
}
_render_grid(_imgs);
}else{
no_results();
//alert('No results found.');
}
}

function _search(){
//establish interface
_clear_node(_g);
mwl.setGroupTarget('#content','#grids','visible','hidden');
//get/validate search string
var text = text || _d.getElementById('search-input').value;
if (text.length != 0) {
_w.preferences['searchText'] = text;
_query_flickr("http://api.flickr.com/services/rest/?method=flickr.photos.search&api_key=" + API_KEY_FLICKR + "&format=json&page=1&per_page=" + _BUFFER + "&text=" + text);
}
}

return {
init:_init,
search:_search,
splash:_splash,
loadPic:_load_pic,
slideLeft:_slide_left,
slideRight: _slide_right,
parse_response:_parse_response
}
}();
if(typeof window.addEventListener !== 'undefined') {
window.addEventListener('load', function() { flickr_webapp.init(document.getElementById('grid-container')); }, false);
}else if(typeof window.attachEvent !== 'undefined') {
window.attachEvent('onload', function() { flickr_webapp.init(document.getElementById('grid-container')); });
}
} )();




Please help me by suggesting me the proper code and / url and place whre it is to be inserted.

Basically, as said multiple times, we here are not meant to design & implement your applications. Indeed you do need to do that by yourself.

Do do debug and see what is going on with your code, and what happens and what does not. then if you have identified an problem from there which you would not know any solution, then ask again.

If you want other to do all the work, then you should consider outsourcing the development of the application. Unfortunately we here do not offer services for that.

Ok Yucca I have already been to the code.flickr


[url]http://www.flickr.com/services/api/[/url]

Iam canfused about what code to use and where thats all ...

I have already inserted the flickr key.


The photoalbum application info is at :


[url]https://www.developer.nokia.com/info/sw.nokia.com/id/9ac8a7f9-6271-416a-a780-25cdde737c4b/Series_40_Web_App_Photo_Album_Example.html[/url]

Basically Flickr is not Nokia service, thus can you please check the docs what they have in their site, I'm certain they do explain how their service is supposed to be used.

Then see, what irrationalities of it you want to add to your application, and then see what problems you have when you start implementing the codes in your app.

Yucca you r right. I have searched the documents at the page below:
[url]http://www.flickr.com/services/api/[/url]

But there is no proper code or material found for s4o or symbian application.

So then you should define what [B]excat[/B] problem you are having, and how have you so far tried solving it. What did you expect to happen and what instead happened.

Or if you are missing API, then do descripe the use case in details.

Note that this section is for S40 WEb apps, so S40 Java questions, or anything realted to Symbian should be asked in separate thread.

No my specific problem is related to s40 web application only.

I want to show photos uploaded in my flickr.com account by building an application similar to PhotoAlbum which is already described here:


[url]https://www.developer.nokia.com/info/sw.nokia.com/id/9ac8a7f9-6271-416a-a780-25cdde737c4b/Series_40_Web_App_Photo_Album_Example[/url].

so your use case is [B]I want to show photos uploaded in my flickr.com account by building an application similar to PhotoAlbum which is already described here:[/B]

So, what have you do so far, and what kind of problems you are having ?

just inserted my flickr api key in " flickr-webapp.js" as said in the document

So, then see what you can do with the js-file, which parts of the functionality you want to use from it in your application.

And then see how you can integrate those parts into your own application.