Icon

[Dejin1]

How do I assign icons to copied functionalities

As you can see I added buttons under shapes to easily get the most popular shapes how do I assign the icons for these shapes I tried putting the image with the same name in the SVG folder I also tried doing this in the code:

{
name: 'arrow',
visible: true,
icon: 'arrow.svg',
attributes: {
size: 4,
},
},

[Dejin1]

I even tried adding the locations to the CSS file and service worker and updated version

[viliusle]

1. add SVG (arrow.svg) file on /images/icons/ folder
2. register it on CSS file layout.css - https://github.com/viliusle/miniPaint/blob/master/src/css/layout.css#L323 class name is same as defined on config.TOOLS inside src/js/config.js .
   .sidebar_left .arrow:after{ background-image: url('images/icons/arrow.svg'); }
3. rebuild project.

p.s. service-worker.js feature is disabled, you don't need to edit it.

[Dejin1]

1. I have done that
2. I posted a pic showing I did that in my second post
3. rebuilding is just using this command: npm run dev right?

Here all the pics of everything you suggested
1->

2->

3->

[Dejin1]

Ok so im not sure what fixed it..though when added another link to the line as well as changed another part of the layout.css file it must've finally realized that the file was now updated or something so Im good now thanks ;)

[Dejin1]

Another question if you dont mind?

How can i make the transparent background of the text draggable.

Im trying to help older users be able to move the text and if they select a transparent part of the text they cant drag it.

Is there anyway to modify this maybe I can modify the layer background to be 1% opacity or something

Also thankyou so much for making a wonderful tool is there anyway i can donate to ya ;)

[viliusle]

rebuilding is just using this command: npm run dev right?

Yes, it will do 1 time rebuild, but I recommend you using npm run server command for developing. It would constantly rebuild on any file update.
Check https://github.com/viliusle/miniPaint/wiki/Build-instructions

How can i make the transparent background of the text draggable.

In this case users should select layer on layers list on right sidebar.

Is there anyway to modify this maybe I can modify the layer background to be 1% opacity or something

There is. Check is done here: https://github.com/viliusle/miniPaint/blob/master/src/js/tools/select.js#L482 so if you find invisible text layer, you can set opacity to 100 before it and before .convert_layer_to_canvas(), and restore it after, check would work even with invisible text layers.

[Dejin1]

"There is. Check is done here: https://github.com/viliusle/miniPaint/blob/master/src/js/tools/select.js#L482 so if you find invisible text layer, you can set opacity to 100 before it and before .convert_layer_to_canvas(), and restore it after, check would work even with invisible text layers."

so the edit might be like this---->>

//render main canvas
for (var i = 0; i < layers_sorted.length; i++) {
var value = layers_sorted[I];
var canvas;

                 if(value.opacity == 0)
                 {
                     value.opacity = 100;
                     canvas = this.Base_layers.convert_layer_to_canvas(value.id, null, false);
                 }else{
                     canvas = this.Base_layers.convert_layer_to_canvas(value.id, null, false);
                 }
		

		if (this.check_hit_region(e, canvas.getContext("2d"), value) == true) {
			await app.State.do_action(
				new app.Actions.Select_layer_action(value.id)
			);
			break;
		}
	}

[Dejin1]

Interestingly this does not post either hit or no hit even when I take off the check for image type

[viliusle]

Because this section is for 1000x1000+ size layers, like big images to avoid lag.
For text layers, your hit would be here:
https://github.com/viliusle/miniPaint/blob/master/src/js/tools/select.js#L514

[OftenUser]

Warning: off topic with this issue, but can I remake this paint editor, it's really hard having to make a paint editor on my own.

[viliusle]

Warning: off topic with this issue, but can I remake this paint editor, it's really hard having to make a paint editor on my own.

@MWB6763 yes, you can.