Develop Reference

Move an array in the place of another array

I am in the making of an apps script, that takes a specified range, divides it into subranges of 4 values each, and returns the array. It looks like this:
Code that follows that to divide it into said subranges:
function sort() {
const chunks = (range, size) =>
Array.from(
new Array(Math.ceil(range.length / size)),
(_, i) => range.slice(i * size, i * size + size)
);
let range = ranges.getValues().flat();
var array = chunks(range, 4)
}
}
}
}
Now, what I want to do with these, is that when someone removes data from one of the subranges, the ones below will go up, so that there are no gaps between the subranges. What I mean by that, is in the case of someone clearing data from, for example, the second subrange, all the ones that are below will go up.
NOTE: It is just a function that I later use in onChange(), and the ranges variable was called earlier throughout the code, and it's just a named range.
So far I've got this piece of code, but it doesn't seem to work:
for (let i = 0; i < array.length; i++) {
for (let j = 0; j < 4; j++) {
var equ = 0;
var mult = 0;
equ += array[i][j];
mult += array[i+1][j];
if (equ == 0 || "" && mult != "" && 0) {
array[i+1].copyTo(array[i], {contentsOnly:true})
}
}

Javascript Importing images into Photoshop by its alphabetical and numerical order

This is a javascript (not mine) that imports images into Photoshop by its alphabetical and numerical order.
When script runs:
-User selects folder of images to import into Photoshop.
-Images then imported in by its alphabetical and numerical order. EX:
a.01.png, b.01.png, c.01.png, a.02.png, b.02.png, c.02.png, a.03.png,
b.03.png, c.03.png
..etc.
Script works great until it gets to the end. It always fails to bring in one of the images from the last numerical set. EX of failure:
a.01.png, b.01.png, c.01.png, a.02.png, b.02.png, c.02.png,
“Skips bringing in a.03.png here”
b.03.png, c.03.png
Doesn’t matter how many number of sets, the very last set always fails to import one image. The rest import fine. I haven’t been able to figure out what causes this. Anybody able to find the issue in this script below?
Update
I didn't mention that this is a segment of code out of a much larger JavaScript so the PSDcreate and other items are used elsewhere. I just cropped out the segment that was failing since the original is too large to post. I ran the script you created and it does bring them in but not quite the way they do in the code it I have. I believe yours brings in the images
a.00.1png, a.002.png, a.003.png b.001.png, b.002.png, b.003.png, c.001.png, c.002.png, c.003.png...ect
The one I am using puts in in order of
a.001.png, b.001.png, c.001.png, a.002.png, b.002.png, c.002png
...etc
I have the a,b,c images ending in .001 imported into Photoshop first. Then at that point the code I took out then stacks the images in order (a,b,c) and does various other tasks. When done, saves them out as a PSD file "name.001.psd". Then the script brings in the next group of images with 002 and repeats the process in a loop. That's the part I removed because its so much code and didn't seem to be the issue. Is it possible to have the images brought in by
a,b,c of .001, then a,b,c of .002..etc?
Code:
#target photoshop
app.bringToFront();
// Dialog for user to choose folder of documents to process
var inputFolderArray = [];
do {
var inputFolder = Folder.selectDialog("Select a folder of documents to process");
if(inputFolder != null) {
inputFolderArray.push(inputFolder);
}
}
while(inputFolder != null
|| inputFolder != undefined)
// Pulls images from inputFolder
for (var j = 0; j < inputFolderArray.length; j++) {
var filesList = inputFolderArray[j].getFiles();
var outputDirectory = inputFolderArray[j] + '/';
// Sort the order of files corresponding to the number
filesList.sort(function(x,y) {
// the substr gets the numbers (ex: get "01" from image.01.png)
var xp = (x.name).substr(-6, 2);
var yp = (y.name).substr(-6, 2);
return parseInt(xp) - parseInt(yp);
});
var frameArrays = [[]];
var oldFrameNum = (filesList[0].name).substr(-6, 2);
// These are used for array slice
var arrayStartNum = 0;
var arrayEndNum = 1;
// Put each frame into separate array
for (var i = 1; i < filesList.length; i++) {
var currentFrameNum = (filesList[i].name).substr(-6, 2);
if(oldFrameNum !== currentFrameNum) {
oldFrameNum = currentFrameNum;
frameArrays[0].push(filesList.slice(arrayStartNum, i));
arrayStartNum = i;
arrayEndNum = i-1;
}
else if(i === filesList.length-1) {
frameArrays[0].push(filesList.slice(arrayStartNum, i));
}
}
for (var i = 0; i < frameArrays[0].length; i++) {
// Sort the file order alphabetically
sorter = MySort('*!#_.()#^&%-=+01234567989abcdefghijklmnopqrstuvwxyz');
frameArrays[0][i].sort(sorter)
PSDCreate(frameArrays[0][i], outputDirectory);
}
}
// FUNCTIONS BELOW//
function PSDCreate(frameArrays, outputDirectory) {
directory = outputDirectory + '/';
//var outputLocation = inputFolder + "/" + directory;
var outputFileName = '';
if (frameArrays != null) {
// Get all the files in the folder
var fileList = frameArrays;
var k = 0;
for (var i = 0; i < fileList.length; i++) {
if (fileList[i] instanceof File && fileList[i].hidden == false) {
var fileName = fileList[i].name;
var docRef = open(fileList[i]);
if(k == 0) {
k++;
outputFileName = RemoveExtension(docRef.name);
}
}
}
}
}
// Removes extension from file name
function RemoveExtension(name) {
var fileNameNoExtension = name;
fileNameNoExtension = fileNameNoExtension.split(".");
if ( fileNameNoExtension.length > 1 ) {
fileNameNoExtension.length--;
}
fileNameNoExtension = fileNameNoExtension.join(".");
return fileNameNoExtension;
}
// Sort the file order alphabetically with special characters
function MySort(alphabet)
{
return function(a, b) {
var index_a = alphabet.indexOf(a[0]),
index_b = alphabet.indexOf(b[0]);
if (index_a === index_b) {
// same first character, sort regular
if (a < b) {
return -1;
} else if (a > b) {
return 1;
}
return 0;
} else {
return index_a - index_b;
}
}
}

I wasn't able to figure out why you lose one of the array elements: your sorting was quite puzzling to me, so I rewrote sort, I think it's a bit easier to read. I first extract all the information I need to sort from file path (prefix, number) and put it to a temporary array (along with anything I need to open this path later). The I sort this array by prefix and number. Also I replaced PSDCreate with app.open because question was about opening files in a specific order, PSDCreate contains a lot of irrelevant info.
var filesArray = [],
parsedFilesArray = [];
// Dialog for user to choose folder of documents to process
var inputFolderArray = [];
do {
var inputFolder = Folder.selectDialog("Select a folder of documents to process");
if (inputFolder != null)
{
inputFolderArray.push(inputFolder);
}
}
while (inputFolder != null ||
inputFolder != undefined)
// create an array of objects to sort it later based on files from InputFolder
for (var j = 0; j < inputFolderArray.length; j++)
{
var filesList = inputFolderArray[j].getFiles();
for (var i = 0; i < filesList.length; i++)
{
//extracting values for an object: [1] == path, [2] == name, [3] == number;
var fileString = String(filesList[i]).match(/(.*)(?:\/)(.*?)\.(\d*)\.(.*)/);
parsedFilesArray.push(
{
key: fileString[2], //filename
num: fileString[3], //01
path: fileString[1], // c/path/to/file/
file: [fileString[2], fileString[3], "png"].join(".") // filename.01.png
})
}
}
//sorting the array
parsedFilesArray.sort(function(a, b)
{
if (a.key === b.key)
{
return parseInt(a.num) - parseInt(b.num);
}
return a.key > b.key ? 1 : -1;
})
//opening files from the sorted array
for (var i = 0; i < parsedFilesArray.length; i++)
{
app.open(new File(parsedFilesArray[i].path + "/" + parsedFilesArray[i].file))
}

PaperJs Add 2 raster as 2 symbols in the same project

I have this project in paperjs:
var url = "http://www.clker.com/cliparts/q/I/s/P/E/3/yellow-umbrella-md.png";
raster = new Raster(url);
raster.rotate(10);
raster.scale(0.4);
var url2 = "https://images.vexels.com/media/users/3/145373/isolated/preview/98721f602aa3fadb040e0a161ab3f966-waterdrop-vislumbrante-vis-o-ilustra--o-by-vexels.png";
secondRaster = new Raster(url);
secondRaster.scale(0.9);
var count = 150;
var symbol = new Symbol(raster);
var secondSymbol = new Symbol(secondRaster);
for (var i = 0; i < count; i++) {
// The center position is a random point in the view:
var center = Point.random() * view.size;
var placedSymbol = symbol.place(center);
placedSymbol.scale(i / count);
}
function onFrame(event) {
// Run through the active layer's children list and change
// the position of the placed symbols:
for (var i = 0; i < count; i++) {
var item = project.activeLayer.children[i];
// Move the item 1/20th of its width to the right. This way
// larger circles move faster than smaller circles:
item.position.y += item.bounds.width / 80;
// If the item has left the view on the right, move it back
// to the left:
if (item.bounds.bottom > view.size.width) {
item.position.y = -item.bounds.width;
}
}
}
The first raster has a symbol works good, but the second can't make it work... I read about to add more than one symbol to project.activeLayer.children but don't work. Even if I do a group of an array with both symbols also don't show up.
I read in a post that symbols can't be added as a group. Being that be true, it should be ok to be added even though isolated...
Anybody had done something similar?
Thank you

There are some mistakes in your code:
The most important one, that make you think that the second raster doesn't work, is that you are creating the second raster with the variable url instead of url2. So both rasters use the same image as source...
You need to place the second symbol like you do with the first one otherwise it will never get rendered.
When iterating through active layer children, make sure to iterate over all children by using project.activeLayer.children.length (as you are placing count * 2 symbols).
When checking for bottom reaching items, use height instead of width.
Here is a sketch demonstrating the solution.
var COUNT = 10;
var raster = new Raster('http://www.clker.com/cliparts/q/I/s/P/E/3/yellow-umbrella-md.png');
raster.rotate(10);
raster.scale(0.4);
var secondRaster = new Raster('https://images.vexels.com/media/users/3/145373/isolated/preview/98721f602aa3fadb040e0a161ab3f966-waterdrop-vislumbrante-vis-o-ilustra--o-by-vexels.png');
secondRaster.scale(0.15);
var symbol = new Symbol(raster);
var secondSymbol = new Symbol(secondRaster);
for (var i = 1; i <= COUNT; i++) {
// first symbol
symbol.place(Point.random() * view.size).scale(i / COUNT);
// second symbol
secondSymbol.place(Point.random() * view.size).scale(i / COUNT);
}
function onFrame(event) {
for (var i = 0; i < project.activeLayer.children.length; i++) {
var item = project.activeLayer.children[i];
item.position.y += item.bounds.height / 80;
if (item.bounds.bottom > view.size.height) {
item.position.y = -item.bounds.height;
}
}
}

Simulation of mouses moving, don't work

I'm trying to create a simulation of 150 mouses moving inside a 20x20 grid in p5.js (A processing like libary). First I'm spawning 150 mouses random places and everything goes fine. But after I have spawned the mouses I am trying to make them move to one of their neighbors. Instead of moving to one of the neighbors and make the current square empty it stays on the one that it already was one + it moves to the next one so instead of having 150 mouses i suddenly have 300... I have tried changing the code for hours but I can't find the proplem... Here is my code:
var w = 40;
var grid = [];
var mouses = 10;
var mouseAmount = [];
var Mouse;
var current;
function setup() {
createCanvas(800, 800);
cols = floor(width/w)
rows = floor(height/w)
// frameRate(60);
for (var j = 0; j < rows; j++) {
for ( var i = 0; i < cols; i++) {
var cell = new Cells(i,j);
grid.push(cell);
}
}
amount = new Amount;
}
function draw() {
background(51);
for ( var i = 0; i < grid.length; i++) {
grid[i].show();
}
amount.run();
}
function index(i, j) {
if (i < 0 || j < 0 || i > cols-1 || j > rows-1 ) {
return -1;
}
return i + j * cols;
}
function Cells(i, j) {
this.i = i;
this.j = j;
this.active = false;
this.moveCell = function() {
var neighbors = [];
var top = grid[index(i, j -1)];
var right = grid[index(i+1, j)];
var bottom = grid[index(i, j+1)];
var left = grid[index(i-1, j)];
if (top) {
neighbors.push(top)
}
if (right) {
neighbors.push(right)
}
if (bottom) {
neighbors.push(bottom)
}
if (left) {
neighbors.push(left)
}
if(neighbors.length > 0) {
var r = floor(random(0, neighbors.length));
return neighbors[r];
} else {
return undefined;
}
}
this.show = function() {
var x = this.i*w;
var y = this.j*w;
stroke(255);
noFill();
rect(x,y,w,w);
if(this.active == true) {
fill(155, 0, 255, 100)
rect(x, y, w, w)
}
}
}
function Amount() {
this.run = function() {
var r = floor(random(grid.length))
for (var i = 0; i < mouses; i++) {
var mouse = grid[r];
mouseAmount.push(mouse)
}
if (mouseAmount.length < 1499) {
for (var i = 0; i < mouseAmount.length; i++) {
mouseAmount[i].active = true;
}
}
if (mouseAmount.length > 1499) {
Next();
}
}
}
function Next(i,j) {
for (var i = 0; i < mouseAmount.length; i++) {
current = mouseAmount[i];
var nextCell = current.moveCell();
if (nextCell) {
nextCell.active = true;
current.active = false;
current = nextCell;
}
}
}
Thank you in advance :)

I don't really understand exactly what your code is supposed to do, but a few things stand out to me about your code:
Problem One: I don't understand how you're iterating through your grid array. You seem to be iterating over mouseAmount, which seems to hold random cells from the grid for some reason? That doesn't make a lot of sense to me. Why don't you just iterate over the grid array directly?
Problem Two: You then move the cells randomly to a neighbor, but you don't take into account whether the neighbor is already active or not. I'm not sure what you want to happen, but this seems a bit strange.
Problem Three: Usually with simulations like this, you have to copy the next generation into a new data structure instead of modifying the data structure as you step through it.
The biggest problem is that you haven't really explained what you want your code to do, or what this code does instead, or how those two things are different. But if I were you, I'd make the following changes:
Step One: Iterate over your grid array in a more reasonable way. Just iterate over every index and take the appropriate action for every cell. If I were you I would just use a 2D array and use a nested for loop to iterate over it.
Step Two: Make sure your logic for moving to a neighbor is correct. Do you want cells to move to already active cells?
Step Three: Make a copy of the grid before you modify it. Think about it this way: as you iterate over the grid, let's say you move a cell down one row. Then you continue iterating, you'll reach the newly active cell again. In other words, you'll touch the same active cell twice in one generation, which is definitely going to mess you up.
A word of advice: get this working for a single active cell first. It's really hard to tell what's going on since you have so many things going on at one time. Take a step back and make sure it works for one active cell before moving up to having a whole grid.

How to cycle between two arrays

I'm trying to create a cycling sliding animation for set of elements, i have two arrays:
var elms = [elm1, elm2, elm3];
var props = [{x,y,width,height,z-index,opacite,....}, {....}, {....}];
on initializing, elms will be positioned in the same order as props: "-> is not part of the syntax it's just to make things easier to explain and it means 'do something with'"
elms[0] -> props[0];
emls[1] -> props[1];
elms[2] -> props[2];
but then i want to cycle them like:
elms[0] -> props[2]
elms[1] -> props[0]
elms[2] -> props[1]
and then:
elms[0] -> props[1]
elms[1] -> props[2]
elms[2] -> props[0]
and so forth...
i tried this:
function index(n, array){
var m = n;
if(n > array.length){
m = n - array.lenth;
}else if(n < 0){
m = array.length + n;
}
return m;
}
var active = 0; //the front element
function slide(direction){
for (i=0; i< elms.length; i++)
{
elms[i] -> props[index(i - active, props)]
}
if(direction == 'fw'){
if(active++ => elms.length){
active = 0;
}else{
active++;
}
}else if(direction == 'bw'){
if(active-- < 0){
active += elms.length;
}else{
active--;
}
}
}
setInterval(function(){slide('fw')}, 3000);
now the above code works fine, but i'm sure this has been done many times before and i'm wondering does anyone know if there is a better less complicated way to do this which allows to loop forward and backward?

If you don't mind modifying the props array, you can just .shift() off the first element and then .push() is onto the end of the array and then once again do:
elms[0] -> props[0];
emls[1] -> props[1];
elms[2] -> props[2];
To rotate the props array, you could just do this:
function rotateProps() {
var front = props.shift();
props.push(front);
}
So, each cycle just call rotateProps() and then repeat what you did the first time.

How about using module? Have a global var that you increment each time you shift, then module that with the length of the arrays. You could access the arrays like: props[shift%len]
If len is 3 (as above), you could get these results if you are accessing the props in relation to the first elmsIdx (0):
POC: jsfiddle.net/Q8dBb, also this would work without modifying your arrays so I believe it would be faster
shift = 0; // (shift+elmsIdx)%len == 0;
shift = 1; // (shift+elmsIdx)%len == 1;
shift = 2; // (shift+elmsIdx)%len == 2;
shift = 3; // (shift+elmsIdx)%len == 0;
shift = 4; // (shift+elmsIdx)%len == 1;
etc
Actually, using an object could make it more flexible (shifting multiple ways, resetting, whatever you want to add). Here is an example for that:
function Shift(len) {
var _len = len;
var _s = 0;
this.left = function() {
_s = (_s + 1)% _len;
}
this.right = function() {
_s = (_s - 1);
if (_s < 0) {
_s = _s + _len;
}
}
this.get = function(idx) {
return (_s + idx)% _len;
}
this.reset = function() {
_s = 0;
}
}
in use: http://jsfiddle.net/6tSup/1/