Borderline color?

n871's icon

n871

Nov 12, 2014, 11:09 AM

is the option to color borderlines dropped in Max 7? still very usable for toggles, slider,...

n871's icon

n871

Nov 12, 2014, 11:12 AM

Also, where can I change Max's background color? It's not in the preferences...the tab color has no options...

n871's icon

n871

Nov 12, 2014, 11:27 AM

ok, found the background option, but not the borderline option

Joshua Kit Clayton's icon

Joshua Kit Clayton

Nov 12, 2014, 11:38 AM

Most objects no longer have borders. If you need borders or other custom rendering, there is a semi-secret feature where you can override your object's drawing method with javascript while retaining the overdrive threading performance of the underlying C object. It doesn't currently support text objects fully with automatic word wrapping, et cetera, and some objects might not have everything exposed as attributes you would want to render, however. More documentation on this and potentially some enhancements will be forthcoming, but in the meantime, here's a little set of examples of rendering objects close to how they appear in Max 7 all in javascript with jspainter. For your purposes, you could use something like the border-override.js example to draw a border and then have the C object paint the rest.

Here's a brief example of how to render toggle:

Here is an example of drawing a toggle object in JS:

function paint()
{
    var val = box.getvalueof()[0]; // this is an array of size 1
    var viewsize = mgraphics.size;
    var valrange = box.getattr("size");
    var width = viewsize[0];
    var height = viewsize[1];
    var start;

    mgraphics.set_source_rgba(box.getattr("bgcolor"));
    mgraphics.rectangle(0, 0, width, height);
    mgraphics.fill();

    if (val) {
        mgraphics.set_source_rgba(box.getattr("color"));    
    } else {
        mgraphics.set_source_rgba(box.getattr("elementcolor"));
    }

    mgraphics.set_line_width((2./12.)*box.getattr("thickness")*0.01* width);
    mgraphics.set_line_cap("square");

    start = (7./24.) * width;
    
    mgraphics.move_to(start, start);
    mgraphics.line_to(width - start, height - start);
    mgraphics.stroke();

    mgraphics.move_to(width - start, start);
    mgraphics.line_to(start, height - start);
    mgraphics.stroke();

}

jspainter-example-ui7-20140916.zip
zip
n871's icon

n871

Nov 12, 2014, 11:40 AM

border color of panel not working?..

Joshua Kit Clayton's icon

Joshua Kit Clayton

Nov 12, 2014, 11:49 AM

Max Patch
Copy patch and select New From Clipboard in Max.

Panel is one of the objects which still supports border. Do you need to increase your border size to non-zero? Here's a panel made in Max 6 which has a border color in Max 7:

Max Patch
Copy patch and select New From Clipboard in Max.

And here's one made in Max 7:

benniy's icon

benniy

Nov 13, 2014, 11:44 AM

hello joshua,
a big thank you for the help! i was wondering what the painter file was for.

i have no real clue of JS an none of C. please tell me – is it possible to set a live.toggle's or live.text's
bordercolor AND focusebordercolor to it's current (inactive and if pressed, active) background color?

Max Patch
Copy patch and select New From Clipboard in Max.

for GUI reasons, i've been doing it a very annoying / dirty way and i'd love love love to find a workaround!

Tom Brennan's icon

Tom Brennan

Nov 13, 2014, 2:40 PM

Joshua,

I'm getting errors here for your JSPainter example.

jsmaxwrap_objtoatoms: NULL obj
mgraphics: not enough arguments for set_source_rgba

phiol's icon

phiol

Nov 17, 2014, 1:46 AM

Hi all

I can't get this to work as well, has anyone figured this out?
Many thanks

Ullstein's icon

Ullstein

Nov 20, 2014, 12:30 PM

Why are the no border colors in the first place? Without border colors, objects are much less visible.And nobody can seriously suggest to create for each object this kind of JS-script as Joshua suggests. Please, we want to work with MAX and not on the layout of it. C74, why do you create such a terrible layout. Please change back to readable. Your customers get older together with you. And reading a computer screen is difficult for the eyes in any case.

Chris Vik's icon

Chris Vik

Nov 20, 2014, 1:03 PM

I personally have no issues with the lack of borders. In fact, I welcome the change. It's great having the colour attribute section of the objects simplified to such a degree.

A border is automatically created between the colour of the background and the foreground objects, which to my eyes, sufficient to separate the GUI objects.

benniy's icon

benniy

Nov 20, 2014, 1:11 PM

+1 for the lack of borders. liking it, too and would love to see it disappear in m4l UI elements, as well.
i am very much looking forward to a little more documentation on the js painter options.

talking about UI –

Ullstein's icon

Ullstein

Nov 20, 2014, 1:51 PM

Chris and Bennzz,

please, it was nervier a problem in the older versions to let the border disappear. So what's the problem with having it as an option, for those people who prefer a white background. Or is everyone obliged now to work in fron of a dark background. Seems to me a fashion-issue. There is no reason for it. It is much easier to read things with black on white then vice versa.
Chris: since there is this format section for the colors, which - as you state it - is indeed easy to use, it would be nothing to give 0% opacity to the borders, if you don't like to see them, plus you can make a template for yourself, so you never have o see them again. OK?

Anyhow, C74 people, be friendly and bring it back with choice of color and opacity, then everybody will be happy. Thanks

Hans Peter

benniy's icon

benniy

Nov 20, 2014, 2:06 PM

a problem with the border opacity 0 (at least as for live UI elements) is the resulting antialiasing – you don't seem to get a *really* invisible border, but rather blurry edges.. can't say right now if this is/was an issue with the normal max elements, too.

i'll bump this one, at this point: does anybody know a js painter function to set a live UI element's border (and focus border) to match its according fill color?

Chris Vik's icon

Chris Vik

Nov 20, 2014, 10:56 PM

Hans, I don't disagree that it would be great to have a toggle to turn borders on for those that prefer it. I feel like Cycling have perhaps driven the change too fast for some.

As I've said, I welcome the modern aesthetic; it looks highly appealing and finally the objects have been standardised, with some of the object colour attribute panels dramatically simplified to an amazing degree thanks to the removal of borders and other overly complex configurations.

Tab colours in Max 6 vs 7

Léopold Frey's icon

Léopold Frey

Nov 21, 2014, 8:38 AM

Hello,

I corrected and hacked a little bit Joshua's examples.
I guess it was a work in progress based on the C code because some functions are yet not available on the JS side (has the object focus, is the patcher in presentation mode... see the comments in Joshua's code).
The error where mostly due to getting color attributes from the object where the attribute color name was wrong (button has no "elementcolor" ...).
It's just some quick & ugly examples, but this functionality surely has a great potential.

Léo

jspainter-example-ui7-MODLF.zip
zip
abs11's icon

abs11

Nov 21, 2014, 3:28 PM

I really love the cleared up interface.
Looks modern and .... it is easy to use !

This is more important for me than have to adjust millions of preferences.
And the C74 dudes can focus their work on optimizing performance and new features.

With JSPainter everybody can cosumize most of the UI elements.
It is not that difficult :-) So where is the problem ?

abs11

benniy's icon

benniy

Nov 21, 2014, 3:33 PM

yes to that!
and thanks to léopold for the js painter files – awesome :)

now: is / will there be any chance to see some examples for live(.text, .numbox...) objects? i've been trying to modify léopolds files but i'm just to bold to get it to work :O

phiol's icon

phiol

Nov 21, 2014, 7:58 PM

@Léopold Frey
Thanks Mate!! Borders is sooooooooooo much better. Only problem for me is that, do to my ignorance in jspainter and all js, I was only able to run your test patch jspaintertest.maxpat

Also, I could only apply your jspainter-example templates to the UI objects that have the "JS Painter" tab in the "inspector" window (toggle, button, slider)

The last 2 things

-the jspaintertest.maxpat keeps crashing on me !? (so I can't really use to copy/paste from)
but -I will try to:

-tweak all my UI's with your js files. Once I do, how can
I save them to be my default objects.
I have spent so many hours trying to get custom templates to get saved and be my default but never go it to work properly.

I went up and down the forum and tried everything that has been posted.

-changing the default-settings in the C74 folder
-creating a custom object/ selecting them/ saving them in the format new style from the dropdown in "Format"
-clearing the object / opening inspector /select my "custom style"/creating a template in file drop down menu/
-Then I discovered in this post that there was a bug.
https://cycling74.com/forums/templates-and-styles/

So I also tried the restart method. But no luck.

Thanks so much again Léopold
(I've actually spent more time this than the actually playing w.
Max7's new features since it's been out.)

Léopold Frey's icon

Léopold Frey

Nov 22, 2014, 8:50 AM

Hello,
just to clarify my point of view.
I really don't care wether objects have borders or not, this is not what interested me in this thread.
As I did with each new version of max since 3.9, I'll adapt to what cycling has decided regarding the UI and will dig into my patches to use as much as possible the default style/template (background color & font size did the trick for most of my existing patches).
This JSPainter feature really adds the ability to have a custom design without having to code the inner mechanisms of objects, I guess it will kill most of jsui objects.
Of course you have to know a little bit of JS, a plus would be to know a little bit of C (download Max 6.1.4 SDK, have a look at jgraphics.h and read Joshua's "quickportingsteps.txt").

@PHIOL : the new styles and templates features are brand new and will take some time before being efficient, if you have time to dig into it and report your problems to c74, please continue (constructively ;)).

@BENNNZZZ : live.UI objects have a jspainter option, so this should be possible, I've got no time to try it out right now.

Léo

lorenzo.pagliei's icon

lorenzo.pagliei

Nov 22, 2014, 10:13 AM

Everyone has his own preferences on the UI, this is normal and who cares? So for people who prefer a dark background on a white text it's cool and works. But for all the other people borders are just necessary, otherwise you cannot have a good vision of numboxes, sliders and similar objects. I agree with Ullstein on that.

So, why to use some workaround js or to go to Sirius when we can just have borders?

jawnypants's icon

jawnypants

Jan 18, 2015, 5:07 AM

Whether you like the new "modern" look of Max 7 isn't relevant; the loss of the borders is the loss of an option that added flexibility to making GUI's in Max. One of my (multi-year) projects uses the interior colors objects to signify notes and the border colors to signify octaves. I can't do that now. If you don't like borders, it's great to have the option to get rid of them. And vice versa.

I love Max for its flexibility. This seems like a loss to me.

Tj Shredder's icon

Tj Shredder

Apr 16, 2015, 12:34 PM

Though I did immediately get Max 7, I am just now diving deeper into it. The main reason is, that some pure design decisions broke my main patches.
I simply do not understand, that getting rid of borders is only assumed to be a cosmetic issue.
It broke my patches - in the past there was one of the highest rated values of Max application design something called "backward compatibility". For an completely unimportant reason (fashion) this value had been trashed. Don't get me wrong, there had been places in Max where I'd happily break that backward compatibility. But in this case I think there is a notion of disrespect for visual work which had been grown over decades.
Funnily there was a big discussion when Max 5 came up, about the aesthetics of rounded corners. Now they are gone again...;-)
Back then I did not care about these details so much, because my patches would still work, they just looked funny...
I would love to see in any future version of Max more respect and a simple way to just keep the design of old patches. Technically this would be so easy. All is there!!!
Why not just load this jspainter file that would make my knobs look like before, just by default if its a patch made with a previous version of Max??? And it would also understand the attributes which are gone now, and wouldn't complain in the max window: "number doesn't understand rgb3"!!!
Btw., the new dials are a complete desaster in terms of usability. To turn them into something really useful would only require an extended range for thickness, if it could fill all this would solve the visibility problem, just extend the maximum value to 500% (estimated), then it would even cover the drawing style slice, and one could add a mode "Max6" or "old style" to get back the known design (sort of...)

I love the new features of Max 7, but its a mystery for me, that a bunch of jspainter files to get previous look and feels back are not just there and be used for us old folks...

Stefan

n871's icon

n871

Apr 16, 2015, 1:41 PM

You are so right, it is a complete mystery how they came to this decision and stayed with it although so many people have complained about this on the forum. I adore Max, but already missed the looks of Max 6 from day 2. The standard lay-out of Max 7 makes your patch instantly look like a big mess. Everything looks the same.

lorenzo pagliei's icon

lorenzo pagliei

Apr 16, 2015, 1:47 PM

+1 stefan

Ullstein's icon

Ullstein

Apr 16, 2015, 3:12 PM

Stefan,

thanks for bringing it up again. The crazy thing is that there are some objects that still have borders. For example the standard object(n) has a border control, but only for the upper and lower line, another thing that is not to understand. But anyhow, if some objects can have borders, why not all of them? Not understandable.
Why does someone who wants to use MAX need to learn js or C. That is why we buy MAX, because then we do not have to learn these deeper languages. Not everybody who makes music with the computer is an informatics student or computer programmer.
Yes and this whole change in layout, up to MAX 6 you had these lists with the images of the objects, so you did not have to remember their names. Now there is an endless alphabetical list of all existing objects and I have not found anything else to pick an object, of which you cannot remember the name. This is such a pain.

But Stefan, this is not all. Now you computer has to be - at least every half year - connected to the internet. That seems simple and fair and it certainly is for most cases where people work most of the time in their studio, but if you make an installation in a museum or other strange place, where they do not have an internet connection in the exhibition hall, your f***ed. Then you get told, you should make a standalone. This proposal can only come from people who never worked in a situation like this in the real world.

I agree to you about the layout, this is fashion and does not make any real sense. The other thing is protection - I understand the necessity - but I think there should be alternative models, like for example a higher price for a MAX version that does not need internet connection. It would be no problem, because when setting up a permanent piece you just tell them what it costs and it will be accepted. But to get someone later to take the computer every half year to an office and connect it to the internet in order to have it continue running, will simply not happen. Then I heard that they will of a dongle as an alternative, but so far I have not seen this offer anywhere.

Alles Gute

Hans Peter Kuhn

Ullstein's icon

Ullstein

Apr 16, 2015, 3:14 PM

I just went to the download page of C74 and found this Quote as an advertising for buying MAX:

"I feel like Max is such a good tool for the people that don’t know much about programming and yet still want to have control over the code for their project."

Exactly. Please keep it that way

HPK

Ullstein's icon

Ullstein

Apr 16, 2015, 3:20 PM

it is funny, after downloading MAX 7.0.3. you see a photo of a woman sitting at her desk with MacBook open and a MAX 7 file on the screen and guess what, she works on a white background not on the standard black. Hahaha, that is really crazy, the ads for MAX are using our arguments, but C74 does not want us to do so, can anyone understand this?

HPK

ino-01's icon

ino-01

Apr 16, 2015, 4:38 PM

Thanks for getting the options
• borders
• rounded corners
in the Preferences,
CYCLING ‘74!

stringtapper's icon

stringtapper

Apr 16, 2015, 5:20 PM

Thanks for getting the options
• borders
• rounded corners
in the Preferences,
CYCLING ‘74!

What? Where?

bkshepard's icon

bkshepard

Jun 22, 2015, 5:21 PM

I, too, prefer to work with a light background and use borders around the UI objects to make them more visible. I can certainly adapt and design my new patchers differently, but my problem is the fact that I have built a large number of patchers in earlier versions of Max that I still use for teaching and they now look awful. It's not just the borders that changed, but the entire look of many of the UI objects. For example, I have a custom-colored slider and textbutton in the attached images. The top image shows how they look when you open them in Max 7. The bottom image shows what the objects are supposed to look like (Max 6). Yes, they are functional in both versions, but I happen to strongly prefer the design aesthetic of the Max 6 version on the light blue background that I used in all these patchers. My choice now is to either live with what I consider an ugly look, or go through more than 100 patchers and redo all the UI elements. I certainly support the ability to remove the borders from UI objects--in fact, we've always been able to do that by making them transparent. Go ahead and make "No Border" the default, just please give us the option of having a border if we want one--without having to go through all sorts of JS contortions.

slider_textbutton_max6.png
png
slider_textbutton_max7.png
png
keepsound's icon

keepsound

Mar 22, 2016, 12:33 AM

Max Patch
Copy patch and select New From Clipboard in Max.

I need only to color the line in the waveform obj. Please get this attribute back! Or send me a js that can perform this kind of task. My line in the waveform obj can't be dark gray, it should be visible, so yellow or green or red was my choice.
And bring back the borders! Thanks!

Schermata-2016-03-22-alle-01.36.35.png
png
animatek's icon

animatek

Apr 1, 2016, 9:25 AM

Hello all!!

I'm trying to create a toogle with different svg file for each state, its working but I do not get to assign color parameter... any idea??

Thnxs in advance

`
var play = new MGraphicsSVG("Play.svg");
var mute = new MGraphicsSVG("Mute.svg");

function paint()
{
    var val = box.getvalueof()[0]; // this is an array of size 1
    var viewsize = mgraphics.size;
    var valrange = box.getattr("size");
    var state = box.getattr("state");
    var width = viewsize[0];
    var height = viewsize[1];
    var start;

    mgraphics.set_source_rgba(box.getattr("bgcolor"));
    replacementcolor = mgraphics.set_source_rgba(box.getattr("color"));
    mgraphics.rectangle(0, 0, width, height);
    mgraphics.fill();

        if (val) {
        mgraphics.save();

        // set up our svg object's color remapper
        origcolor = [0,0,0,1];
        replacementcolor = val ? box.getattr("color") : box.getattr("elementcolor");
        play.mapreset();
        play.mapcolor(origcolor,replacementcolor);    

        // provide a rectangle for translate/scale to fit
        mgraphics.svg_render(play, 0.2*width, 0.2*height, 0.6*width, 0.6*height);
        mgraphics.restore();

    } else {

        mgraphics.save();

        // set up our svg object's color remapper
        origcolor = [0,0,0,1];
        replacementcolor = val ? box.getattr("color") : box.getattr("elementcolor");
        mute.mapreset();
        mute.mapcolor(origcolor,replacementcolor);    

        // provide a rectangle for translate/scale to fit
        mgraphics.svg_render(mute, 0.2*width, 0.2*height, 0.6*width, 0.6*height);
        mgraphics.restore();

}

}
`

keepsound's icon

keepsound

Apr 1, 2016, 12:27 PM

Found a workaround for the line color: now I'm using a multislider over the waveform.

dafnanaphtali's icon

dafnanaphtali

Jun 17, 2016, 1:31 PM

Just finding this thread now.

Chiming in her to I agree **wholeheartedly** with ULLSTEIN and BKSHEPARD.
Since postponed the migration to Max 7 for hundreds of legacy patches until I would finally have time to go through them all.

The barrier to my migration has only been the look and feel, lack of borders, big changes in the GUI objects.
I also teach in Max 7, but had to continue using Max 6 until now. It is not good that it has created problems for dealing with legacy patches

Are there any recent undocumented changes that will help with this (borders as an option ??)
I'm on a residency this week to update code, any help that is not already in documentation would be great.
(and checking out the examples here too with jspaint)

n871's icon

n871

Jun 17, 2016, 3:03 PM

Probably it will not be too long until Max 8. Just like you I stopped using Max 7 because of this.

keepsound's icon

keepsound

Jun 17, 2016, 4:22 PM

My 2 cents: I'm using Max 7 only for his capabilyties to handle multi channels buffer objects and for the better playlist for sfplay~.
The main great problems are the removed object color choices (frame color of the numbers and umenu object for example, or see the line in the waveform) and for the bug dimensions of a simple standalone (300 Mb vs 30Mb of a old one). I've also tryed to tweak the new standalone app removing some components, but the app after that doesn't work anymore.. also insert an appicon is a nightmare. There's a lack of informations about all that. Hope Cycling will do it better

vichug's icon

vichug

Jun 17, 2016, 5:28 PM

it's a bit sad there's still no exensive documentation on jspainter files after 2 years

keepsound's icon

keepsound

Jul 9, 2017, 11:33 PM

We are all just waiting.

keepsound's icon

keepsound

Jul 16, 2019, 12:58 PM

Still waiting... (today: 19 jul 2019)

Roman Thilenius's icon

Roman Thilenius

Jul 16, 2019, 1:15 PM

i the borders haz. for patient beeing me.

Max Gardener's icon

Max Gardener

Jul 16, 2019, 2:48 PM

You can find a nice collection of Max UI object with borders (which you can use as examples) in William Kleinsasser's amazing recent collection of patches and utilities. Download the "supporting materials" patches and look in the folder "Migrating old max patches to version 7 and 8 formatting."