Develop Reference

Having a number at the end of a file and increasing it by 1 each time (with Javascript)?

My JS file creates this image and adds it to a folder.
'writenewimage_'+objId+'.png';
Currently 'writenewimage_'+objId+'.png' just keeps getting replaced/overwritten, which isn't ideal. objId is "1".
What I'd like is for that number "1" at the end of the image name to increase by 1. So that each time the code is executed it adds a different new image to the folder. 'writenewimage_1','writenewimage_2','writenewimage_3' etc.
Would super appreciate any help! I'm a newbie to Javascript and this would be very helpful to learn. :)
Here is the code that includes this file:
Echomap_LoaderCCG.prototype.processDataToGame = function (gameActor, dataActor) {
Echomap.Utils.log('processDataToGame', 'Called');
//Echomap.Params.CCGData = {};
var faPath = Echomap.CCGUtil.getFacesPath();
var tvPath = Echomap.CCGUtil.getTVPath();
var svPath = Echomap.CCGUtil.getSVPath();
var objId = Echomap.Utils.getActorIdFromActor(gameActor);
var objName = gameActor._name;
Echomap.Utils.log('processDataToGame','objId', objId);
Echomap.Utils.log('processDataToGame','objName', objName);
gameActor.isComposite = undefined;
gameActor.composite = {};
gameActor.composite.filename = {};
gameActor.composite.filename.face = faPath + 'writenewimage_'+objId+'.png';
gameActor.composite.filename.tv = tvPath + 'writenewimage_'+objId+'.png';
gameActor.composite.filename.sv = svPath + 'writenewimage_'+objId+'.png';
If it's confusing or you need more code than this, let me know! There might be some more I need to show, I'm not sure, but I don't wanna overwhelm you all with anything that might be irrelevant. I'm a bit of a noob with JS and trying to get my head around it. Just wanna try and increase "writenewimage_1"s number by 1 each time so they can be separate files if possible rather than have it keep overwriting the same file. ^_^

How to combine multiple scripts into one?

I've got five of the same scripts that just use five different variables. #video0 to #video4. I'm just not quite sure on how to combine them all so I don't have redundant code. I've been trying to make them all variables
var video= [
$('#video0'),
$('#video1'),
$('#video2'),
$('#video3'),
$('#video4')
];
http://jsfiddle.net/cwfybnzr/

Use each() with the array
var videos = [
$('#video0'),
$('#video1'),
$('#video2'),
$('#video3'),
$('#video4')
];
$(function() {
$.each(videos, function(){
var iframe = $(this)[0];
...
});
});

Isn't it better to create class for those elements? Then it will be possible to iterate through them using simple jQuery syntax: $('.video'). Plus it would not require changing any JavaScript code when new videos will be added.

You can add a class element like videoCSS to all the elements and then loop through them like
$('.videoCSS').each(function(){
var player = $(this);
// your code here
});
This way you can future proof you js code as you can add as many new player/iframes to the HTML with videoCSS class and your js code will still be the same.
Also, I found that in your code you are doing like
var iframe = $('#video0')[0];
var player = $(iframe);
Which means that first you are getting a jquery object using $('#video0'), then you are trying to get a DOM element out of it like $('#video0')[0] and then again you are converting it to a jquery object using $(iframe).
I think there is no need of this much extra processing, you can simply use
var player = $('#video0');
or using my updated code like
var player = $(this);
UPDATED FIDDLE

jquery offset method doesn't always work / exist

Good morning and happy new year everyone!
I've run into a snag on something and need to figure out a solution or an alternative, and I don't know how to approach this. I actually hope it's something easy; meaning one of you all have dealt with this already.
The problem is that I'm doing rollovers that contain information. They're divs that get moved to the absolute location. Now I've tried this with jquery 1.6 - 1.9.1. Of course this has to work in multiple browsers.
What needs to happen is on rollover show a div, and when you rollout of that div, make it hide.
...
// .columnItem is class level and works
$(".columnItem").mouseleave(function() {
$(this).css("display", "none");
});
...
$(".column").mouseenter(function() {
var currentItem = $(this)[0]; // this is where the problem is
// hide all .columnItems
$(".columnItem").css("display", "none");
// i get this error: Object #<HTMLDivElement> has no method 'offset' (viewing in chrome console)
var offsetTop = currentItem.offset().top;
var columnInfoPanel = $("#column" + currentItem.innerText);
});
So the immediate thought of some would be don't use $(this)[0]. Instead, I should use $(this), and you are correct! Where the other problem comes into play is by removing the array index, currentItem.innerText is now undefined.
The only thing I can think of is I'll have to mix both, but it seems like there should be a way to use the selector and get both options.
What have you all done?
Thanks,
Kelly

Replace:
var currentItem = $(this)[0];
With:
var currentItem = $(this).eq(0);
This creates a new jQuery object containing only the first element, so offset will work.
Then you can use either currentItem[0].innerText or currentItem.text(), whichever you prefer.

Skip the [0] at the beginning as you are saying.
But then change the last line to:
var columnInfoPanel = $("#column" + currentItem[0].innerText);
De-referencing the jQuery selector gives you the DOM-object.
If you want to stick to pure jQuery, the .text() / .html() methods will give you the same functionality.

Add link element in div tag with looping

I want to make my DIV element to be able to click and go to the detail page with the ID as a query parameter data to my server.
I have found some examples of possible uses I can use, example :
<div style="cursor:pointer;" onclick="document.location='http://www.google.com'">Foo</div>
It's just that I was confused would like to add the above script into the code that I built.
Part of my code :
for ( var i = 0; i < response.length; ++i ) {
str = response[i].judul;
str2 = response[i].waktu_mulai;
str3 = response[i].channel_code;
var Year,Month,Date,Time,Strip,Join= ""
var Year = str2.substr(0,4)
var Month = str2.substr(5,2)
var Date = str2.substr(8,2)
var Time = str2.substr(-8,8)
var Strip = str2.substr(4,1)
var Join = Date+Strip+Month+Strip+Year+' '+Time
listItem = document.createElement('div');
listItem.setAttribute('data-bb-type', 'item');
listItem.setAttribute('data-bb-img', 'images/icons/logo/'+str3+'.png');
listItem.setAttribute('data-bb-title', str);
listItem.innerHTML = Join+" WIB";
container = document.createElement('div');
container.appendChild(listItem);
bb.imageList.apply([container]);
dataList.appendChild(container.firstChild);
if (bb.scroller) {
bb.scroller.refresh();
}
}
Maybe someone can help me use the link on each DIV additions made ​​by looping my application from database.

Ensure you provide the right context for your question. you're currently posting a snippet of bbUI.js framework script, which might interact completely different as normal HTML, CSS3 and JavaScript.
I also you declare you variables twice. -> var ...... = ""; then again each individual var.
Also try to search StackOverflow first to see if you're asking the same question again. This particular question has already been raised and/or answer many times before and you can find it on many "starting with HTML, Javascript". Though everyone would like to help out, some things are just found in covering the basics and can easily be found by performing the right searches on e.g. Google. People want to see you're putting effort in finding the answer yourself and also see the effort in formulating your question. The better you describe your issue, the more accurate the answer will be.
Back to the subject:
Using just this will solve your problem I think:
<element>.setAttribute('onclick','doSomething();'); // for normal browsers
<element>.onclick = function() {doSomething();}; // for IE
where you can replace 'doSomeThing();' with your own wanted code eg. :
"document.location='http://www.google.com'"
If you want to make it more dynamic, you can also just call a function:
<element>.setAttribute('onclick','myFunction();'); // for normal browsers
<element>.onclick = function() {myFunction();}; // for IE
Where myFunction:
function MyFunction() {
var called_id = this.id;
var call_url = "http://myurl.com/page?id="+called_id;
document.location = call_url;
return; //superflous
}
And as the others remarked try to up your acceptance rate for StackOverFLow, people will be more eager to answer your questions.

Pass in vars to an eval workaround to process a code string from a json object after YUI compression

I need to pass a jQuery object in to a workaround for an eval. The issue is that i need access to a jQuery object that is out side the eval area but i can't see to pass it in. here is what i have.
var jObj = $(selector);
var myCode = "var jObj="+jObj+"; var i="+i+"; "+shape.mouseover.onEnd.replace("\u0027","'");
var myFucn = new Function(myCode);
myFucn();
the oject I'm getting the string out of is
shape.mouseover.onEnd.replace("\u0027","'");
is working and what I'm passing in that string is
open_info(jObj,i)
Which is what i have to fire. The deal is that the code is run thru YUI compressor so the jObj var becomes something else so i need to pass that in. Right now i get an error where it thinks it should have and ending ] which is not right. I is working it seems, just not the jObj var.
EDIT
there are many way to get where i need to be that are close but not quite like
How to pass parameters in eval in an object form?
shape.mouseover.onEnd = "open_info(jObj,i)";
/*
* this is coming in and must be as it is, don't say it's wrong please
* it's not able to be done anyother way!
*/
//lets process the string and pull in the vars
/* BEOFRE YUI COMPRESSOR CHANGES THINGS and works!!!
var jObj = $(selector);
var i = 1;
var myCode = shape.style.events.mouseover.onEnd.replace("\u0027","'");
var myFucn = new Function(myCode);
myFucn();
*/
// AFTER note it can be random as i change code so it fails cause
// var jObj is now var r and var i is now var e
var r = $(selector);
var e = 1;
var p= shape.style.events.mouseover.onEnd.replace("\u0027","'");
var f= new Function(p);
f();
Now it works before the compression.. After is not due to the change. Hope tha tclears it up some

I might be going down the wrong tracks and be confused here..
But isnt this what your trying to do?
Send myFucn the correct object and what ever i is
myFucn($(selector),10);
function myFucn(jObj,i)
{
shape.mouseover.onEnd.replace("\u0027","'");
}

I still don't understand why this question got 2 down votes, but well it's solved and works great. The trick is to do the same manipulation of the dom state. It's really simple once it is placed out.
//so this is what the object is parsed out to from the json string
//since you can't just pass a function stright that way any how
shape.mouseover.onEnd = "open_info(jObj,i)";
//this is what will take that string and process it
//note jObj is what is in the orgain code but it changes to
// var r or something else that is shorter after going thru YUI compressor
// Which is why we can't just use open_info(jObj,i) and it work..
// ie: it's not an issue with scoope but an issues with var names being shortened
(function(){
//this is the trick on passing them so YUI doesn't get them
//use a string and YUI skips it so we directly create the
//needed oject in the window namespace
window['jObj']=jObj; window['i']=i;
var p= shape.mouseover.onEnd;
var f= new Function(p);
f();
})();
That is it.. I put it in a click or hover event so it's kin to an onClick.
/* EXMAPLE OUTPUT AFTER YUI COMPRESSION
//Note after the YUI compressor get ahold of that
//processing code above it'll look like
*/
function(){window.jObj=n,window.i=t;var u=i.mouseover.onEnd,r=new Function(u);r()}();
So the way that works is, I needed to fix the issue of the var jObj being renamed. So I simply made a sting for the name and let the compressed the var name fill the name of the object I need for the processed code string. Don’t know why I didn’t see it before and I would have saved my rep value :-\ .. oh well. May be a way to shorten this but I'm leaving it for now.
Edit
I recant the edit it was working. :) Very well.. Left wondering what any other ways there would be to make it do the same thing.