I am trying to use Javascript to select two random images from a local folder and place on separate Photoshop layers. I have created an array with the filepaths to choose from.
#target photoshop
var allImages = [“file path/img-1.jpg”, "file path/img-2.jpg", "file path/img-3.jpg"];
//this is a large array of file paths to 100 different images
var pickImage = allImages[Math.floor(Math.random() *
allImages.length)];
var imgFile = File(pickImage);
var openFile = app.open(imgFile);
var secondImage = allImages[Math.floor(Math.random() * allImages.length)];
app.activeDocument.artLayers.add(secondImage);
This opens the first image and creates a blank layer above but does not insert the second image. What am I missing?
In javascript, you must first create a file object before you may open an image. All you have to do is create the variable and then point it at secondImage. Just like you did with the first image:
var imgFile = File(pickImage);
In your current approach, your easiest solution would probably be to just make a variable secondPickedImage and assign it to the same thing as pickImage. Although, this leaves the possibility of you picking the same image, you could fix that with an if statement.
I would recommend changing your approach and turning pickImage into a function that you can call that will return a random number for your array - saves space, and cleans up your code. Then put the secondImage assignment in a do while loop that keeps picking a random number until you pick a number different from the pickImage number so your first and second pictures are different.
Source: http://wwwimages.adobe.com/www.adobe.com/content/dam/acom/en/devnet/photoshop/pdfs/photoshop-cc-scripting-guide.pdf page 29.
Related
I'm working on a function that generates a Google Docx where it is listed, line by line, every character's name and its lyrics.
Every line is made up of two strings: character's name and lyrics.
Well, I get my goal using insertTable and formatting it, getting every line as a two column table.
var table = body.insertTable(0, [[pers, text]]);
var styles = {};
styles[DocumentApp.Attribute.BORDER_COLOR] = '#ffffff';
styles[DocumentApp.Attribute.FONT_FAMILY] = 'Calibri';
styles[DocumentApp.Attribute.FONT_SIZE] = 11;
table.setAttributes(styles);
This is the result:
The issue arises because now I need to manipulate this file and I'm struggling to work with so many tables!
The question is: is there a way to get the same result without using tables? I tried body.appendParagraph() but I can't figure out how to format the paragraph the same as in the above image.
Can you please help me? ..and.. I do apologize for my bad english!!
Yes. You can format a paragraph and get the same look:
You have to insert a tab symbol after a personage name and set so called 'hanging indentation' for the paragraph.
The code could be something like this:
function setIndents() {
var doc = DocumentApp.getActiveDocument();
var indent = 100;
doc.getBody().getParagraphs().forEach(p => p.setIndentStart(indent));
}
It sets the 'hanging indentation' (100 pt) for all existed paragraphs in current document.
How do i link all this images to an array, so as this links can work when i click each image slide
jQuery(document).ready(function() {
var bgImageArray = ["banner1.jpg", "banner2.jpg", "banner3.jpg"],
var links = ['http://google.com', 'http://hotmail.com', 'http://yahoo.com', 'http://kimjoyfox.com'],
base = window.location.origin + "/wp-content/themes/fbnquest/img/home/",
secs = 4;
bgImageArray.forEach(function(img){
new Image().src = base + img;
// caches images, avoiding white flash between background replacements
});
The way I understand your problem is the following :
For each time you click on one of each of the images, you want to redirect the user to one of the URLs, changing the URL each time the user click on the image.
Is it what you want ? If not, please can you precise your problem
[EDIT]
So yes,
Here is my way of solving your problem, If you don't matter, I won't give you code, obviously, you do this for training, let's do it :
Create an eventListener on click that will trigger a function called ChangeImageUrl (for example) and assign that eventListener to all the img elements
Then create a function that will detect the current URL of the image clicked, using imgElement.src ( i advice you to devide the src string using split or equivalent, that way you can directly access by index the current url )
Once you have the URL Use yourUrlArray.indexOf(currentImageSrcUrl), to catch the index of the current URL in your array, store it and increment it ( bonus if the increment value is upper than the URL array length, set it to 0 )
access the new src using yourUrlArray[newindex]
assign current img element the new src that we juste have extracted
Tell me if this answer is good for you, I hope it will
I was trying to understand what do you really want and I did something that I hope help you.
Inside of the loop you can do in this way below.
var i = new Image();
i.src = base + img;
The CatAPI is an API which will send you a random GIF of a cat each time you access it.
The Cat API
It works like it is supposed to. The issue is....I am using this in Google Maps. I have many icons that show up on the screen, when you load the icon, it will load the event properties ("Name, blah etc") into the info window. I have also given it a Cat Attribute which is the link to a random GIF (You may see where this is headed already)
The random cat gif ends up being the same gif for every InfoWindow (Even though the data is changing for each).
[EDIT] I should clarify, the "data" that is changing is the City Name, Location...not the url for the Cat gif
How do I resolve this random url http://thecatapi.com/api/images/get?format=src&type=gif to equal a specific image and apply that to my icons "cat" attribute.
Javascript Object getting cat attribute
if (results.list.length > 0) {
resetData();
for (var i = 0; i < results.list.length; i++) {
results.list[i].imacat = "http://thecatapi.com/api/images/get?format=src&type=gif"
geoJSON.features.push(jsonToGeoJson(results.list[i]));
}
drawIcons(geoJSON);
}
Well...it turns out I was making it harder in my head than I ever needed to....let this be a lesson to everyone.
Simple creating a timestamp variable at the end of the url allowed me to create an original request which the catapi could just dump off.
Example:
var ts = new Date().getTime();
results.list[i].imacat = "http://thecatapi.com/api/images/get?format=src&type=gif×tamp="+ts;
This creates something random on the end and I will get a bunch of objects with unique cat gifs!
How our site is setup now is we would like to have a way that a user clicks a button per say, and it automatically selects a random download location that is listed in the code.
For example, user clicks "Download!". It randomly selects a URL to visit in the code that is set for example:
"website.com/blah.zip"
OR
"website2.com/blah.zip"
Is this possible to do? We are trying to ease the bandwidth on our servers by having two download locations, and have the site randomly choose one.
You have tagged php (server-side), this is a part of Javascript (client-side)
When inserting the Download button, randomly select a index value from an array of links :
var arr = ["website.com/blah.zip", "website2.com/blah.zip"];
var len = arr.length;
var x = Math.floor((Math.random() * len) + 1);
Now change download source to arr[x].
Well, an easy way to do it would be:
$array = array("website.com/blah.zip", "website2.com/blah.zip");
$val = array_rand($array);
echo $array[$val];
You can use as many different sites as you want, and it will give you a random site from that array.
EDIT: Solution to the question posed in the comments:
Have you array set up at the top of your file as before:
$array = array("website.com/blah.zip", "website2.com/blah.zip");
Then with each link you'd just need to do:
Download
You could store two URls in an array and pick one like bellow.
$rand_key = array_rand($url_options, 1);
echo $url_options[$rand_key];
//Setting up the Array
var arrayImg =['http://www.whattofix.com/images/PoliticalAnimal.jpg','http://www.fubiz.net/wp-content/uploads/2013/03/Fashion-Zoo-Animals26.jpeg','http://cdn.trendhunterstatic.com/thumbs/suit-animal-art-berkley-illustrations.jpeg','http://img1.etsystatic.com/016/1/7647665/il_340x270.411173311_ojy5.jpg'];
// creating the randomizing
var random = arrayImg[Math.floor(Math.random()*arrayImg.length)];
// image source looks for the attribute, by using the variable arraying
$('img').attr('src',random);
Above is my code. I currently have javascript set up this way. The current code has the piece where images are randomly replaced from an image from the array. I want to have the code state that switch every image with a new random image, not every image with the same time. I like how it is random every time, but I also want to random for each picture.
Set up a loop to go over each image, pick a random one, and then assign to that one:
var arrayImg =['http://www.whattofix.com/images/PoliticalAnimal.jpg','http://www.fubiz.net/wp-content/uploads/2013/03/Fashion-Zoo-Animals26.jpeg','http://cdn.trendhunterstatic.com/thumbs/suit-animal-art-berkley-illustrations.jpeg','http://img1.etsystatic.com/016/1/7647665/il_340x270.411173311_ojy5.jpg'];
$("img").each(function() {
var random = arrayImg[Math.floor(Math.random()*arrayImg.length)];
$(this).attr('src',random);
});
You can use a callback function with the attr method to calculate the value for each element:
$('img').attr('src', function(){
return arrayImg[Math.floor(Math.random()*arrayImg.length)];
});