[ps] Photoshop css/html aus Ebenen

Manchmal möchte ich schnell mal etwas in Photoshop scribblen, zB in Architekturplänen, und dann auf ner Webseite bereitstellen. Schnell noch mit etwas JS flüssig gemacht, Daten einblenden etc pp. Dafür dann für alle Layer die CSS-Daten einzeln auslesen und copy/pasten, Nöö Danke. Also mir schnell mal sowas geschrieben. Layer als png speichern, ab in img Ordner, dann css und html-Schnippsel aus dem css_easy Script rüberkopiert.

/*
 * collect and merge css
 * for all layers
 * -----------------------
 * August 2022 - @phreekz
 * -- v0.1 - initial version
 */
 
#target photoshop
 
 // init
var scriptName={en:"css easy",de:"css easy"};
app.bringToFront();
var doc = app.activeDocument;
var layerName = "";
var sc = ".ps{ position:absolute; }\r\n.desc{color:#000;background-color:#fff;}\r\n";
var sh = "";
var curLayer

var tmp =0;
//var folder = Folder.selectDialog("Select a folder to save the css");

goThroughLayers (doc);
var w = outputWindow(sc,sh);
$.writeln(w.show());

function goThroughLayers(parentLayer){
    for(var i=0;i<parentLayer.layers.length;i++){
        curLayer = parentLayer.layers[i];
        doc.activeLayer = curLayer;
        if(curLayer.typename =='LayerSet'){goThroughLayers (curLayer)}
        else{
            if(curLayer.kind = LayerKind.NORMAL){
				layerName = curLayer.name;
				var X = curLayer.bounds[0].as("px");
				var Y = curLayer.bounds[1].as("px");
				var Wt = curLayer.bounds[2].as("px")-X;
				var Ht = curLayer.bounds[3].as("px")-Y;
				sc += "#"+layerName+" {";
				sc += "\r\n\tbackground-image: url('img/"+curLayer.name+".png');";
				sc += "\r\n\tposition: absolute;";
				sc += "\r\n\tleft: "+X+"px;\n\ttop: "+Y+"px;";
				sc += "\r\n\twidth: "+Wt+"px;\n\theight:"+Ht+"px;";
				sc += "\r\n\t}\r\n";
				sh += "<div class='ps' id='"+layerName+"'><p class='desc'>"+layerName+"</p></div>\r\n";
            }
        }
    }
}

function outputWindow(scss,shtml){
	var w = new Window('dialog', 'css easy result');
	var c = w.add('edittext',[10,10,600,300], scss, {multiline:true});
	var h = w.add('edittext',[10,320,600,620], shtml, {multiline:true});
	var b = w.add('button', undefined, 'OK', {name:'ok'});
	return w
}

Diesen Code in eine <blablabla>.jsx Datei abgeworfen. Entweder in den Script-Ordner reinkopiert oder per „Durchsuchen..“ zum Script verweisen. Wem’s hilft. Gerne geschehen.