HISE Logo Forum
    • Categories
    • Register
    • Login

    how to mask desaturation over color, fade in

    Scheduled Pinned Locked Moved Scripting
    28 Posts 9 Posters 1.6k Views
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • ulrikU
      ulrik @Tania Ghosh
      last edited by

      @Tania-Ghosh paint routines, paint routines and a lot more of paint routines, and of course a lot of hours studying :)

      Hise Develop branch
      MacOs 15.3.1, Xcode 16.2
      http://musikboden.se

      ulrikU Tania GhoshT 2 Replies Last reply Reply Quote 1
      • ulrikU
        ulrik @ulrik
        last edited by

        @ulrik On the right side I used 6 panels painted with gradients and had a lookup table for all hex values, and used event.y for calculating the right values

        Hise Develop branch
        MacOs 15.3.1, Xcode 16.2
        http://musikboden.se

        1 Reply Last reply Reply Quote 0
        • d.healeyD
          d.healey
          last edited by

          What's it for?

          Libre Wave - Freedom respecting instruments and effects
          My Patreon - HISE tutorials
          YouTube Channel - Public HISE tutorials

          ulrikU 1 Reply Last reply Reply Quote 0
          • Tania GhoshT
            Tania Ghosh @ulrik
            last edited by

            @ulrik I am always ready to study.
            My question how did you use PR lookup table for all hex values?
            I only know PR for Drawing etc. Never used it for Color picking.
            Any doc or example will be helpful to study.

            Tania Ghosh

            1 Reply Last reply Reply Quote 0
            • ulrikU
              ulrik @d.healey
              last edited by

              @d-healey It's for a "good looking" picker :)
              The main window (in picture above), is two panels, the upper part is painted with a gradient from white to red, and the lower part is painted from red to black.
              I want, from the right side (no desaturation) to the left side (completely desaturated).

              So what I really ask is, is it possible to place "desaturation mask" over the main window, to get what I want?

              Almost like the way it looks like inside Hise, but with the top displaying white, the left side displaying the grey scale, from white to black, and the right side will go from white to red to black
              Skärmavbild 2021-04-19 kl. 11.20.11.png

              Hise Develop branch
              MacOs 15.3.1, Xcode 16.2
              http://musikboden.se

              1 Reply Last reply Reply Quote 0
              • d.healeyD
                d.healey
                last edited by d.healey

                It's for a "good looking" picker

                Yeah but why do you want a colour picker in HISE?

                I made one a few years ago for fun, not as fancy as yours though.

                I think JUCE has a colour selector component that you might want to check out.

                Libre Wave - Freedom respecting instruments and effects
                My Patreon - HISE tutorials
                YouTube Channel - Public HISE tutorials

                ulrikU 2 Replies Last reply Reply Quote 1
                • ulrikU
                  ulrik @d.healey
                  last edited by

                  @d-healey said in how to mask desaturation over color, fade in:

                  Yeah but why do you want a colour picker in HISE?

                  Well, I guess I'm not supposed to do this in Hise but, starting by exploring the possibilities with paint routines, panels and an exploring lust to see what could be done with it, I just continued exploring and had a lot of fun doing it :)

                  For me it's the best way of learning, to be curious and try

                  Well I'm not finished but I've come, for me, a long way.
                  drawbok.gif

                  Hise Develop branch
                  MacOs 15.3.1, Xcode 16.2
                  http://musikboden.se

                  ? 1 Reply Last reply Reply Quote 3
                  • ulrikU
                    ulrik @d.healey
                    last edited by

                    @d-healey I miss the direct access to the grey scale in my picker..

                    Hise Develop branch
                    MacOs 15.3.1, Xcode 16.2
                    http://musikboden.se

                    1 Reply Last reply Reply Quote 0
                    • Christoph HartC
                      Christoph Hart
                      last edited by

                      Please don't tell me you're trying to make Photoshop in HISE :)

                      ulrikU 1 Reply Last reply Reply Quote 4
                      • ulrikU
                        ulrik @Christoph Hart
                        last edited by

                        @Christoph-Hart I am...... trying to..... make.....P....in Hise......😱

                        Hise Develop branch
                        MacOs 15.3.1, Xcode 16.2
                        http://musikboden.se

                        1 Reply Last reply Reply Quote 0
                        • Christoph HartC
                          Christoph Hart
                          last edited by

                          Well, then I will endorse the attempt of playing ScriptPanel programming in god mode. Here is a little help:

                          /** This namespace contains a few helper functions. */
                          namespace ColourOps
                          {    
                              /** Takes the colour and saturates / desaturates it (saturation = 1.0 means no change). */
                              inline function withMultipliedSaturation(colour, saturation)
                              {
                                  // Commencing bit fiddling sequence
                                  local a = (colour & 0xFF000000);
                                  local r = (colour & 0x00FF0000) >> 16;
                                  local g = (colour & 0x0000FF00) >> 8;
                                  local b = (colour & 0x000000FF);
                                  
                                  // If you want to lower the saturation, you have
                                  // to fill up the colour values to the max colour
                                  local max = Math.max(r, Math.max(g, b));
                                  
                                  local rDiff = max - r;
                                  local gDiff = max - g;
                                  local bDiff = max - b;
                                  
                                  local invSat = 1.0 - saturation;
                                  
                                  r = parseInt(r + invSat * rDiff);
                                  g = parseInt(g + invSat * gDiff);
                                  b = parseInt(b + invSat * bDiff);
                                  
                                  // ending bit fiddling sequence...
                                  return a | (r << 16) | (g << 8) | b;
                              }
                          }
                          
                          
                          Panel1.setPaintRoutine(function(g)
                          {
                              var c = this.get("itemColour");
                              
                              // make it 2px wide so that it doesn't flicker with odd zoom ratios...
                              var area = [0, 0, 6.0, this.getHeight()]; 
                              
                              // create the array before the loop to save a few CPU cycles
                              var gradientData = [undefined, undefined, 0.0, Colours.black, undefined, this.getHeight()];
                              
                              // we update the saturation every 4px, that's enough
                              for(var x = 0; x < this.getWidth(); x += 4)
                              {
                                  gradientData[0] = ColourOps.withMultipliedSaturation(c, x / this.getWidth());
                                  gradientData[1] = x;
                                  gradientData[4] = x;
                                  
                                  area[0] = x;
                                  
                                  g.setGradientFill(gradientData);
                                  g.fillRect(area);
                              }
                          });
                          
                          HiseSnippet 1489.3ocsWs0aaaCEVJMpnwaFXEX+.HxCqxotNxcoYEHMcY0ItKXKsF0occHnnfVhVhHRjZRTw1qKX+o1Or8zdM6bDksjujfh.TgfXwyM9wyMdTuDoKKMUlXXtwoShYFlesU+IBUPm.JWXb7gFlek0o7HVxorTkwKlDSSSYdFll24kn.lartQ9y+9iufFREtrRRFFuSxcY+JOhqJo16fegGF1k5wPyVRemCN1UJ5HCkY.XtikiQL08bpO6UTTr0rLLu6QdbkLouhpXoFlq+Bo2j9AxQBs7uimxGDxvEsM5CFRStqLzCQLR0nS.Ozq2zCcpAXkdktf6ncAeq0IbO9L5kthuImAoTip9Cy0tI30tJ7b97gmYE3stFd22puaBOVUxQGlNVnXICoPHnJrzxZr1eeOqNRPBgpUD8bV2DXwLMr20woI4INNM1qds50f.QphbAMgziJXgsI6SlpqOS0QFEKEvB6M0r2Tq01asE4z.dJQ.QrTH5wHfgTfyKkPICYiHArvXVBYXlvUwg8nEYqsqWqTbcz+0wo0q8IB7TuF9+b6BPNknBPShxPnBORJUkkfNax1DOV4JthXWrB1E.7sa4PhXT.GBIwMfJ7YMz6MZetHjKXyPEYDWEbRVnhGGxYd8mYHa8V2jTZ6FZK7I8O4fca3TDEwDtbgOY..kgbOuPbQJ6Ox.5rRgCktzPv2rOov1jui3LtaWm7GzqNujIKHoiiV1Fjm+bR6cWRd+kjWqQt7OcIwGrBwQEpBj4NoGOjLQlQFQEJhRBVYDDcwfToGpYtDAzKXyoIH8PnM.IKtZP8BZXFFlk4DiniKXrHPQN6SNgpBfb4w1PHY169MICZrZ.W3COjObHnMZiGQRV1mMGe+kcRywevMrSbwEPxSQ52ip3SVoNXrMlljxfhR6DxCmp9VZDW8H4WUT+ph5unnCpJ5fphNXQQmK9vDdWa9aqVsp.aFbpDPN7eQ.T+rmAogMv28w2eJ95f8xE9xZWhMIpWS2ynUJS0CZMndiLSAke1SK+r8ghphBJrCjKbBTPWEryi8lbEKR2kXyoXunIw1DrsFV6+33wPMrGjEh4QvgEn4IYohG.GlPt64PRJViSjddj+TJiH4gkzYmKbaoILrt7LnsH72tsf+MEE+Li6Gnra7g8HKf.WPIEKO4kljPmPFvFJSzDBkxXLyNEJEJZG1o2aItSbCYok6qeB0iC8VOjpx2+LgGaH3e7ZRp7pChGseHs0fP3hx4XuLRW.niXPkm2TrVoWI6BVxDxNwial65dPJjIHy7CzZBGFaDjX0mydvOOa1V8abOUfcCj3C2mryxMFqdvNy4C4WoTzsu002wsIXusWbSlqVnpYailc70wcmE4V9FFs0fZ078wz0WVXrtPiK6pVdN7zB6q8FlqxFM5TVPt+kkIrUKBxGtpCMLb.DEKqBlUDje1SXwXsB5e01ozBJZh1F1swqLlcKlT7Joh8ZvR09TsMpcYMxhrFNbk7va5SjggfEWEa8dcCJZKxhFvfdx4cymIHL9x7yGYc8yGUc7MW8fGUDTJNVvUuNlIttolLJlVAd6sGiQHbPpBZfbvLHJNBAyCYW.SnpGqZCqCYomqjw4xVLhCPVkys9zgtP2tAGFs5dV5Pfw3xgX+8ClTcwHLesj.+ff7BxpTJan8Xf7c+m2elCxXf+zIg23tWkX71bgmIJR03p+6J8.0KMfHLlpzKKjple1Ubf8BFP.atgDwAAEob0jpCz+EYf1OW3deqdbkavpw6Zq.uPH9KMdK97f5VGMbHTfWB10s599u7eKfg9pReXVmDNjzY8prn9P1fKCPh.REwhJy0vze8ZGbM5Y5CWmmu3J3ofYabsYAy1SYZDQcSjezUWJie.x8xo.XRj+cXaXcBtlz1Hu7FzyBtLxHB9tnO55hthGAXe0573agNe+sPmctE57jagN6dKz4GtE57zaTG7SR+oLkLRWl.D5cTdOOSyiDTHKKOiz3+AKf1UoA
                          
                          ulrikU 1 Reply Last reply Reply Quote 3
                          • ulrikU
                            ulrik @Christoph Hart
                            last edited by

                            @Christoph-Hart great information from a great guy :)
                            Thank you!

                            Hise Develop branch
                            MacOs 15.3.1, Xcode 16.2
                            http://musikboden.se

                            MikeBM 1 Reply Last reply Reply Quote 1
                            • Christoph HartC
                              Christoph Hart
                              last edited by

                              Oh wow I didn‘t see it was a GIF. You‘re actually making AfterEffects in HISE. Thats even more badass!!!

                              Now you need to implement rLottie export!

                              ulrikU 1 Reply Last reply Reply Quote 4
                              • ulrikU
                                ulrik @Christoph Hart
                                last edited by

                                @Christoph-Hart said in how to mask desaturation over color, fade in:

                                Now you need to implement rLottie export!

                                Haha...absolutely, would it be possible? That would really be awesome 🤗

                                Hise Develop branch
                                MacOs 15.3.1, Xcode 16.2
                                http://musikboden.se

                                1 Reply Last reply Reply Quote 1
                                • ?
                                  A Former User @ulrik
                                  last edited by

                                  @ulrik Man this is completely out of this world! Awesome stuff! 😲

                                  1 Reply Last reply Reply Quote 1
                                  • MikeBM
                                    MikeB @ulrik
                                    last edited by

                                    @ulrik I already thought that you can probably do things with HISE that don't have to do with music.
                                    But this is awesome - great work
                                    It would be nice if you keep us informed about the progress.
                                    In any case, you are now my master of PaintRoutines :-)

                                    "One hour of trial and error can save 10 minutes of reading the manual."
                                    "It's easier to hit the developer with feature requests than to spend 10 minutes reading the manual. :-)))"
                                    HISE Develop - Mac Pro 5.1, OS X 10.14.6, Projucer 6.02, Xcode 10.3

                                    ulrikU 1 Reply Last reply Reply Quote 1
                                    • ulrikU
                                      ulrik @MikeB
                                      last edited by

                                      @MikeB @UrsBollhalder thank you :)
                                      I will keep you updated

                                      Hise Develop branch
                                      MacOs 15.3.1, Xcode 16.2
                                      http://musikboden.se

                                      ulrikU 1 Reply Last reply Reply Quote 1
                                      • ulrikU
                                        ulrik @ulrik
                                        last edited by ulrik

                                        @UrsBollhalder @MikeB
                                        I promised to keep you updated so...
                                        this is my journey to the panels & paint routines promised land, well at least some of it :)

                                        Drawing with Hise

                                        Hise Develop branch
                                        MacOs 15.3.1, Xcode 16.2
                                        http://musikboden.se

                                        Dan KorneffD orangeO ? 3 Replies Last reply Reply Quote 4
                                        • Dan KorneffD
                                          Dan Korneff @ulrik
                                          last edited by

                                          @ulrik sick!

                                          Dan Korneff - Producer / Mixer / Audio Nerd

                                          1 Reply Last reply Reply Quote 1
                                          • orangeO
                                            orange @ulrik
                                            last edited by orange

                                            @ulrik Great!

                                            This shows that Hise is not only an audio plugin development framework, it can be used for lot's of things :)

                                            develop Branch / XCode 13.1
                                            macOS Monterey / M1 Max

                                            1 Reply Last reply Reply Quote 2
                                            • First post
                                              Last post

                                            51

                                            Online

                                            1.7k

                                            Users

                                            11.7k

                                            Topics

                                            101.8k

                                            Posts