implement instanced drawing

data/layout.xml

@@ -120,7 +120,7 @@
           <border dir="col" align="center" grow="1" width="1">
             <node height="20" pad="1" width="100%"><slider-h id="tip-size" value=".5"/></node>
             <node height="20" pad="1" width="100%"><slider-h id="tip-flow" value=".25"/></node>
-            <node height="20" pad="1" width="100%"><slider-h id="tip-spacing"/></node>
+            <node height="20" pad="1" width="100%"><slider-h id="tip-spacing" value=".25"/></node>
             <node height="20" pad="1" width="100%"><slider-h id="tip-angle"/></node>
             <node height="20" pad="1" width="100%"><slider-h id="tip-mix"/></node>
           </border>
@@ -319,9 +319,12 @@
         <button-custom id="menu-layers" height="100%" margin="0 0 0 0" justify="center" align="center" pad="8" color=".1">
           <text text="Layers" font-face="arial" font-size="11"/>
         </button-custom>
+        <node height="100%" color="1" grow="1" justify="center" align="flex-end">
+          <text text="PanoPainter 0.1.2 alpha" font-face="arial" font-size="11" margin="0 10 0 0" color=".2 .5 1 1"/>
+        </node>
       </border>
       <!-- toolbar -->
-      <border id="toolbar" height="50" width="100%" pad="5" dir="row" color=".2">
+      <!--<border id="toolbar" height="50" width="100%" pad="5" dir="row" color=".2">
         <button id="btn-close" width="50" height="100%" margin="0 5 0 0" text="Clear"/>
         <button id="btn-popup" width="50" height="100%" margin="0 5 0 0" text="Popup"/>
         <ref id="multi-button"/>
@@ -333,21 +336,21 @@
         <button-custom width="50" margin="0 5 0 0" color=".3" thickness="1" border-color=".5" justify="center" align="center"><text text="green" font-face="arial" font-size="11" color="0 1 0 1"/></button-custom>
         <button-custom width="50" margin="0 5 0 0" color=".2" thickness="1" border-color=".5" justify="center" align="center"><text text="blue" font-face="arial" font-size="11" color=".4 .4 1 1"/></button-custom>
         <separator width="10"/>
-        <!--button with image-->
+        --><!--button with image--><!--
         <button-custom width="50" margin="0 5 0 0" thickness="1" border-color=".0" pad="8">
           <image path="data/icons.png" region="30 30 90 90" width="100%" height="100%" align="center" justify="flex-end">
-            <!--<text text="Groups" font-face="arial" font-size="11" color=".1"/>-->
+            --><!--<text text="Groups" font-face="arial" font-size="11" color=".1"/>--><!--
           </image>
         </button-custom>
         <button-custom id="btn-settings" width="50" margin="0 5 0 0" thickness="1" border-color=".0" pad="8">
           <image path="data/icons.png" region="143 155 203 215" width="100%" height="100%" align="center" justify="flex-end">
-            <!--<text text="Settings" font-face="arial" font-size="11"/>-->
+            --><!--<text text="Settings" font-face="arial" font-size="11"/>--><!--
           </image>
         </button-custom>
         <button-custom width="50" margin="0 15 0 0" thickness="1" border-color=".0" pad="8" align="center" justify="center">
           <icon width="100%" height="100%" icon="accept"/>
         </button-custom>
-      </border>
+      </border>-->
       <!-- central row -->
       <node grow="1" dir="row" wrap="1" height="0">
         <border width="60" color=".2 .2 .2 .6" margin="0 0 0 0" dir="col" pad="4" flood-events="1">
@@ -365,6 +368,9 @@
             <icon width="100%" height="100%" icon="disk"/>
           </button-custom>-->
 
+          <button id="btn-switch" width="50" height="50" margin="0 0 5 0" text="Switch"/>
+          <button id="btn-close" width="50" height="50" margin="0 0 5 0" text="Clear"/>
+
           <!--panel togglers-->
           <button-custom id="btn-stroke" width="50" height="50" margin="0 0 5 0" thickness="1" border-color=".1" pad="2">
             <image path="data/ui/stroke.png" width="100%" height="100%" align="center" justify="flex-end"/>
@@ -393,16 +399,16 @@
           </border>
         </node>
         <!-- content panel -->
-        <node grow="1" color=".1" pad="10">
+        <node grow="1" color=".1" pad="0">
           <canvas id="paint-canvas" grow="1"/>
         </node>
       </node>
       <!-- status bar -->
-      <border height="30" width="100%" color=".15" border-color=".3" dir="row" pad="0 0 0 10" align="center">
+      <!--<border height="30" width="100%" color=".15" border-color=".3" dir="row" pad="0 0 0 10" align="center">
-        <!--<text-input width="100" height="100%" color=".3"/>-->
+        --><!--<text-input width="100" height="100%" color=".3"/>--><!--
         <text text="Status Bar: nothing to show here." font-face="arial" font-size="11"/>
         <text text="#opengl #fromscratch #c++" font-face="arial" font-size="11" margin="0 0 0 10" color=".2 .5 1 1"/>
-      </border>
+      </border>-->
     </node>
     <!--<ref id="settings"/>-->
     <!--<ref id="popup-menu"/>-->

engine/app.cpp

@@ -259,6 +259,8 @@ void App::initLayout()
         stroke->create();
         stroke->loaded();
 
+        canvas->m_brush = stroke->m_canvas->m_brush;
+
         brushes->on_brush_changed = [this](Node* target, int index) {
             auto tid = brushes->get_texture_id(index);
             stroke->m_canvas->m_brush.m_tex_id = tid;
@@ -343,6 +345,15 @@ void App::initLayout()
             };
         }
 
+        if (auto* button = layout[main_id]->find<NodeButton>("btn-switch"))
+        {
+            button->on_click = [this,button](Node*) {
+                //exit(0); 
+                canvas->m_canvas->m_use_instanced = !canvas->m_canvas->m_use_instanced;
+                //button->color_normal = canvas->m_canvas->m_use_instanced ? glm::vec4(1, 0, 0, 1) : glm::vec4(0, 1, 0, 1);
+                button->m_text->set_text(canvas->m_canvas->m_use_instanced ? "INST" : "NORM");
+            };
+        }
         if (auto* button = layout[main_id]->find<NodeButton>("btn-close"))
         {
             button->on_click = [this](Node*) { 

engine/brush.h

@@ -1,5 +1,6 @@
 #pragma once
 #include "rtt.h"
+#include "shader.h"
 
 NS_START
 
@@ -20,16 +21,141 @@ public:
     float m_jitter_flow;
 };
 
+struct StrokeSample
+{
+    glm::vec2 pos;
+    float size;
+    float flow;
+    float angle;
+};
+
+class BrushMesh
+{
+public:
+    ui::Shader shader;
+    GLuint buffers[3]{ 0 };
+    struct vertex_t { glm::vec4 pos; glm::vec2 uvs; };
+    struct instance_t { glm::mat4 mvp; float flow; };
+    int loc_flow;
+    int loc_mvp;
+    
+    bool create()
+    {
+        static GLushort idx[6] { 0, 1, 2, 0, 2, 3 };
+        static vertex_t vertices[4]{
+            { { -.5f, -.5f, 0, 1 }, { 0, 0 } }, // A       B----C
+            { { -.5f,  .5f, 0, 1 }, { 0, 1 } }, // B  --\  |    |
+            { {  .5f,  .5f, 0, 1 }, { 1, 1 } }, // C  --/  |    |
+            { {  .5f, -.5f, 0, 1 }, { 1, 0 } }, // D       A----D
+        };
+        glGenBuffers(3, buffers);
+        if (!buffers)
+            return false;
+
+        static instance_t inst{ glm::mat4(), .1f };
+        glBindBuffer(GL_ARRAY_BUFFER, buffers[2]);
+        glBufferData(GL_ARRAY_BUFFER, sizeof(instance_t), &inst, GL_STATIC_DRAW);
+
+        glBindBuffer(GL_ELEMENT_ARRAY_BUFFER, buffers[1]);
+        glBufferData(GL_ELEMENT_ARRAY_BUFFER, sizeof(idx), idx, GL_STATIC_DRAW);
+        glBindBuffer(GL_ARRAY_BUFFER, buffers[0]);
+        glBufferData(GL_ARRAY_BUFFER, sizeof(vertices), vertices, GL_STATIC_DRAW);
+        glBindBuffer(GL_ELEMENT_ARRAY_BUFFER, 0);
+        glBindBuffer(GL_ARRAY_BUFFER, 0);
+
+        // STROKE - INSTANCED
+        static const char* shader_stroke_inst_v =
+            SHADER_VERSION
+            "in vec4 pos;"
+            "in vec2 uvs;"
+            "in mat4 a_mvp;"
+            "in float a_flow;"
+            "out vec3 uv;"
+            "out float alpha;"
+            "void main(){"
+            "   uv = vec3(uvs, pos.w);"
+            "   alpha = a_flow;"
+            "   gl_Position = a_mvp * vec4(pos.xyz, 1.0);"
+            "}";
+        static const char* shader_stroke_inst_f =
+            SHADER_VERSION
+            "uniform sampler2D tex;"
+            "uniform vec4 col;"
+            "in float alpha;"
+            "in vec3 uv;"
+            "out vec4 frag;"
+            "void main(){"
+            "   float a = (1.0 - texture(tex, uv.xy).r) * alpha;"
+            "   frag = vec4(col.rgb, a);"
+            "}";
+
+
+        if (!shader.create(shader_stroke_inst_v, shader_stroke_inst_f))
+            LOG("Failed to create shader Texture");
+
+        loc_flow = shader.GetAttribLocation("a_flow");
+        loc_mvp = shader.GetAttribLocation("a_mvp");
+        
+        return true;
+    }
+    void draw(const std::vector<StrokeSample>& samples, const glm::mat4& proj)
+    {
+         std::vector<instance_t> attributes;
+         attributes.reserve(samples.size());
+         for (const auto& s : samples)
+         {
+             auto mvp = proj *
+                 glm::translate(glm::vec3(s.pos, 0)) *
+                 glm::scale(glm::vec3(s.size, s.size, 1)) *
+                 glm::eulerAngleZ(s.angle);
+             attributes.emplace_back(instance_t{ mvp, s.flow });
+         }
+        glEnableVertexAttribArray(0);
+        glEnableVertexAttribArray(1);
+        glBindBuffer(GL_ELEMENT_ARRAY_BUFFER, buffers[1]);
+        glBindBuffer(GL_ARRAY_BUFFER, buffers[0]);
+        glVertexAttribPointer(0, 4, GL_FLOAT, GL_FALSE, sizeof(vertex_t), (GLvoid*)offsetof(vertex_t, pos));
+        glVertexAttribPointer(1, 2, GL_FLOAT, GL_FALSE, sizeof(vertex_t), (GLvoid*)offsetof(vertex_t, uvs));
+
+        // Likewise, we can do the same with the model matrix. Note that a
+        // matrix input to the vertex shader consumes N consecutive input
+        // locations, where N is the number of columns in the matrix. So...
+        // we have four vertex attributes to set up.
+        glBindBuffer(GL_ARRAY_BUFFER, buffers[2]);
+        glBufferData(GL_ARRAY_BUFFER, (int)(sizeof(instance_t) * attributes.size()), attributes.data(), GL_STATIC_DRAW);
+        // Loop over each column of the matrix...
+         for (int i = 0; i < 4; i++)
+         {
+             // Set up the vertex attribute
+             glVertexAttribPointer(loc_mvp + i, 4, GL_FLOAT, GL_FALSE, sizeof(instance_t), 
+                 (GLvoid*)(offsetof(instance_t, mvp) + sizeof(glm::vec4) * i));
+             // Enable it
+             glEnableVertexAttribArray(loc_mvp + i);
+             // Make it instanced
+             glVertexAttribDivisor(loc_mvp + i, 1);
+         }
+        glEnableVertexAttribArray(loc_flow);
+        glVertexAttribPointer(loc_flow, 1, GL_FLOAT, GL_FALSE, sizeof(instance_t), 
+            (GLvoid*)offsetof(instance_t, flow));
+        glVertexAttribDivisor(loc_flow, 1);
+
+        glDrawElementsInstanced(GL_TRIANGLES, 6, GL_UNSIGNED_SHORT, 0, (int)samples.size());
+        //glDrawElements(GL_TRIANGLES, 6, GL_UNSIGNED_SHORT, 0);
+
+        glDisableVertexAttribArray(0);
+        glDisableVertexAttribArray(1);
+        for (int i = 0; i < 4; i++)
+            glDisableVertexAttribArray(loc_mvp + i);
+        glDisableVertexAttribArray(loc_flow);
+
+        glBindBuffer(GL_ARRAY_BUFFER, 0);
+        glBindBuffer(GL_ELEMENT_ARRAY_BUFFER, 0);
+    }
+};
+
 class Stroke
 {
 public:
-    struct Sample
-    {
-        glm::vec2 pos;
-        float size;
-        float flow;
-        float angle;
-    };
     struct Keypoint
     {
         glm::vec2 pos;
@@ -41,7 +167,7 @@ public:
     float m_step;
     ui::Brush m_brush;
     std::vector<Keypoint> m_keypoints;
-    std::vector<Sample> m_samples;
+    std::vector<StrokeSample> m_samples;
     int m_last_kp;
     std::minstd_rand prng;
     void start(glm::vec2 pos, float pressure, const ui::Brush& brush)
@@ -66,10 +192,10 @@ public:
         return m_keypoints.empty() ? false :                // no keypoints
             (m_keypoints.back().dist > (m_dist + m_step));  // check if next kp is closer than spacing
     }
-    std::vector<Sample> compute_samples()
+    std::vector<StrokeSample> compute_samples()
     {
         int nsamples = (int)glm::floor((m_keypoints.back().dist - m_dist) / m_step);
-        std::vector<Sample> samples;
+        std::vector<StrokeSample> samples;
         samples.reserve(nsamples); // preallocate the estimate number of samples
         while (m_keypoints.back().dist > (m_dist + m_step))
         {
@@ -86,14 +212,14 @@ public:
         }
         return std::move(samples);
     }
-    Sample randomize_sample(const glm::vec2& pos, float pressure)
+    StrokeSample randomize_sample(const glm::vec2& pos, float pressure)
     {
         auto rnd_nor = [&] { return float((double)prng() / (double)prng.max()); };              // normalized [0, +1]
         auto rnd_neg = [&] { return float((double)prng() / (double)prng.max() * 2.0 - 1.0); };  // normalized [-1, +1]
         auto rnd_rad = [&] { return float((double)prng() / (double)prng.max() * M_PI * 2.0); }; // normalized [0, 2pi]
         auto rnd_vec = [&] { float rad = rnd_rad(); return glm::vec2(cosf(rad), sinf(rad)); };  // normalized direction vector
 
-        Sample s;
+        StrokeSample s;
         s.angle = (m_brush.m_tip_angle + rnd_nor() * m_brush.m_jitter_angle) * (float)(M_PI * 2.0);
         s.pos = pos + (rnd_vec() * m_brush.m_jitter_spread * 100.f);
         s.size = 100.f * m_brush.m_tip_size * (1.f - rnd_nor() * m_brush.m_jitter_scale);

engine/canvas.h

@@ -20,6 +20,8 @@ public:
     RTT m_fb;
     Sampler m_sampler;
     Plane m_plane;
+    BrushMesh m_mesh;
+    bool m_use_instanced = false;
     std::minstd_rand prng;
     bool create(int width, int height)
     {
@@ -30,8 +32,16 @@ public:
         m_fb.create(width, height);
         m_sampler.create();
         m_plane.create<1>(1, 1);
+        m_mesh.create();
         return true;
     }
+    void resize(int width, int height)
+    {
+        m_width = width;
+        m_height = height;
+        m_tmp->create(width, height, "tmp");
+        m_fb.create(width, height);
+    }
     void layer_add(std::string name)
     {
         m_layers.emplace_back();
@@ -64,20 +74,32 @@ public:
         auto& tex = TextureManager::get(m_brush.m_tex_id);
         tex.bind();
         m_sampler.bind(0);
-        ShaderManager::use("stroke");
+
-        ShaderManager::u_vec4(kShaderUniform::Col, m_brush.m_tip_color);
+        if (m_use_instanced)
-        ShaderManager::u_int(kShaderUniform::Tex, 0);
-        for (const auto& s : samples)
         {
-            auto mvp = proj *
+            m_mesh.shader.use();
-                glm::translate(glm::vec3(s.pos, 0)) *
+            m_mesh.shader.u_vec4(kShaderUniform::Col, m_brush.m_tip_color);
-                glm::scale(glm::vec3(s.size, s.size, 1)) *
+            m_mesh.shader.u_int(kShaderUniform::Tex, 0);
-                glm::eulerAngleZ(s.angle);
+            m_mesh.draw(samples, proj);
-       
-            ShaderManager::u_mat4(kShaderUniform::MVP, mvp);
-            ShaderManager::u_float(kShaderUniform::Alpha, s.flow);
-            m_plane.draw_fill();
         }
+        else
+        {
+            ShaderManager::use("stroke");
+            ShaderManager::u_vec4(kShaderUniform::Col, m_brush.m_tip_color);
+            ShaderManager::u_int(kShaderUniform::Tex, 0);
+            for (const auto& s : samples)
+            {
+                auto mvp = proj *
+                    glm::translate(glm::vec3(s.pos, 0)) *
+                    glm::scale(glm::vec3(s.size, s.size, 1)) *
+                    glm::eulerAngleZ(s.angle);
+
+                ShaderManager::u_mat4(kShaderUniform::MVP, mvp);
+                ShaderManager::u_float(kShaderUniform::Alpha, s.flow);
+                m_plane.draw_fill();
+            }
+        }
+
         m_sampler.unbind();
         tex.unbind();
 

engine/layout.h

@@ -1875,7 +1875,7 @@ public:
     {
         if (new_size.x > m_canvas->m_width)
         {
-            m_canvas->create((int)new_size.x, (int)new_size.y);
+            m_canvas->resize((int)new_size.x, (int)new_size.y);
             m_canvas->clear();
         }
     }

engine/rtt.cpp

@@ -113,6 +113,7 @@ void RTT::readTextureData(uint8_t* buffer)
 {
     bindTexture();
     //glGetTexImage(GL_TEXTURE_2D, 0, GL_RGB, GL_UNSIGNED_BYTE, buffer);
+    glReadPixels(0, 0, w, h, GL_RGB, GL_UNSIGNED_BYTE, buffer);
     unbindTexture();
 }
 

engine/shader.cpp

@@ -124,7 +124,10 @@ void Shader::u_float(kShaderUniform id, float f)
 {
     glUniform1f(m_umap[id], f);
 }
-
+GLint ui::Shader::GetAttribLocation(const char* name)
+{
+    return glGetAttribLocation(prog, name);
+}
 bool ShaderManager::create(kShader id, const char* vertex, const char* fragment)
 {
     return m_shaders[id].create(vertex, fragment);

engine/shader.h

@@ -25,6 +25,7 @@ public:
     void u_mat4(kShaderUniform id, const glm::mat4& m);
     void u_int(kShaderUniform id, int i);
     void u_float(kShaderUniform id, float f);
+    GLint GetAttribLocation(const char* name);
 };
 
 enum class kShader : uint16_t