fix(render): make canvas/UI DPI-aware

dtcxzyw · dtcxzyw · commit 3d06617694e1 · 2023-09-16T03:16:13.000+08:00
diff --git a/README.md b/README.md
@@ -61,6 +61,7 @@ Utilities:
 + [ ] Video recording
 + [ ] Custom uniforms
 + [ ] Custom meshes
++ [ ] Anti aliasing
 
 Contributions are welcome!
 
diff --git a/shadertoy/Backend.hpp b/shadertoy/Backend.hpp
@@ -104,8 +104,7 @@ class Pipeline {
     virtual std::vector<FrameBuffer*> createCubeMapFrameBuffer() = 0;
     virtual void addPass(const std::string& src, NodeType type, std::vector<DoubleBufferedFB> target,
                          std::vector<Channel> channels) = 0;
-    virtual void render(ImVec2 frameBufferSize, ImVec2 clipMin, ImVec2 clipMax, ImVec2 base, ImVec2 size,
-                        const ShaderToyUniform& uniform) = 0;
+    virtual void render(ImVec2 frameBufferSize, ImVec2 clipMin, ImVec2 clipMax, ImVec2 size, const ShaderToyUniform& uniform) = 0;
     virtual TextureId createDynamicTexture(uint32_t width, uint32_t height, std::function<void(uint32_t*)> update) = 0;
 };
 
diff --git a/shadertoy/NodeEditor/PipelineEditor.cpp b/shadertoy/NodeEditor/PipelineEditor.cpp
@@ -23,6 +23,7 @@
 #include "shadertoy/SuppressWarningPush.hpp"
 
 #include <fmt/format.h>
+#include <hello_imgui/dpi_aware.h>
 #include <hello_imgui/hello_imgui.h>
 #include <hello_imgui/image_from_asset.h>
 #include <httplib.h>
@@ -32,6 +33,8 @@
 #include <nlohmann/json.hpp>
 #include <stb_image.h>
 
+using HelloImGui::EmToVec2;
+
 #include "shadertoy/SuppressWarningPop.hpp"
 
 SHADERTOY_NAMESPACE_BEGIN
@@ -266,7 +269,7 @@ static void drawPinIcon(const EditorPin& pin, const bool connected, const int al
             break;
     }
 
-    ax::Widgets::icon(ImVec2(24, 24), iconType, connected, color, ImColor(32, 32, 32, alpha));
+    ax::Widgets::icon(EmToVec2(1, 1), iconType, connected, color, ImColor(32, 32, 32, alpha));
 }
 
 bool PipelineEditor::canCreateLink(const EditorPin* startPin, const EditorPin* endPin) const {
@@ -365,7 +368,7 @@ void PipelineEditor::renderEditor() {
         } else
             ImGui::TextUnformatted(node->name.c_str());
         ImGui::Spring(1);
-        ImGui::Dummy(ImVec2(0, 28));
+        ImGui::Dummy(EmToVec2(0, 1.5));
         ImGui::Spring(0);
         builder.endHeader();
 
@@ -555,7 +558,7 @@ void PipelineEditor::renderEditor() {
         mNewNodeLinkPin = nullptr;
     }
 
-    ImGui::PushStyleVar(ImGuiStyleVar_WindowPadding, ImVec2(8, 8));
+    ImGui::PushStyleVar(ImGuiStyleVar_WindowPadding, EmToVec2(0.25, 0.25));
     if(ImGui::BeginPopup("Node Context Menu")) {
         const auto node = findNode(mContextNodeId);
         if(!node->rename && ImGui::MenuItem("Rename")) {
@@ -930,9 +933,8 @@ void PipelineEditor::render(ShaderToyContext& context) {
 
             ed::SetCurrentEditor(mCtx);
             // toolbar
-            if(mShouldBuildPipeline || ImGui::Button(ICON_FA_PLAY " Build")) {
-                build(context);
-                mShouldBuildPipeline = false;
+            if(ImGui::Button(ICON_FA_PLAY " Build")) {
+                mShouldBuildPipeline = true;
             }
             ImGui::SameLine();
             if(ImGui::Button("Zoom to context")) {
@@ -1007,6 +1009,11 @@ void PipelineEditor::render(ShaderToyContext& context) {
         ImGui::EndTabBar();
     }
     ImGui::End();
+
+    if(mShouldBuildPipeline) {
+        build(context);
+        mShouldBuildPipeline = false;
+    }
 }
 
 PipelineEditor& PipelineEditor::get() {
@@ -1089,7 +1096,7 @@ bool EditorTexture::renderContent() {
 
     if(textureId) {
         // NOLINTNEXTLINE(performance-no-int-to-ptr)
-        ImGui::Image(reinterpret_cast<ImTextureID>(textureId->getTexture()), ImVec2{ 64, 64 }, ImVec2{ 0, 1 }, ImVec2{ 1, 0 });
+        ImGui::Image(reinterpret_cast<ImTextureID>(textureId->getTexture()), EmToVec2(3, 3), ImVec2{ 0, 1 }, ImVec2{ 1, 0 });
     }
     return updateTex;
 }
@@ -1174,7 +1181,7 @@ void EditorLastFrame::renderPopup() {
 
     if(editing && ImGui::BeginPopup("##popup_button")) {
         lastFrame = nullptr;
-        ImGui::BeginChild("##popup_scroller", ImVec2(100, 100), true, ImGuiWindowFlags_AlwaysVerticalScrollbar);
+        ImGui::BeginChild("##popup_scroller", EmToVec2(4, 4), true, ImGuiWindowFlags_AlwaysVerticalScrollbar);
         for(uint32_t idx = 0; idx < names.size(); ++idx) {
             if(ImGui::Button(names[idx])) {
                 lastFrame = nodes[idx];
diff --git a/shadertoy/OpenGL.cpp b/shadertoy/OpenGL.cpp
@@ -327,28 +327,33 @@ class RenderPass final {
     [[nodiscard]] NodeType getType() const noexcept {
         return mType;
     }
-    void render(ImVec2 frameBufferSize, const ImVec2 clipMin, const ImVec2 clipMax, ImVec2 base, ImVec2 size,
+    void render(const ImVec2 frameBufferSize, const ImVec2 clipMin, const ImVec2 clipMax, const ImVec2 canvasSize,
                 const ShaderToyUniform& uniform, const GLuint vao, const GLuint vbo) {
         glDisable(GL_BLEND);
         constexpr ImVec2 cubeMapSize{ static_cast<float>(cubeMapRenderTargetSize), static_cast<float>(cubeMapRenderTargetSize) };
+        const auto screenBase = clipMin;
+        const auto screenSize = ImVec2{ clipMax.x - clipMin.x, clipMax.y - clipMin.y };
 
         for(uint32_t idx = 0; idx < mBuffers.size(); ++idx) {
             const auto buffer = mBuffers[idx].get();
-
+            ImVec2 size, base, fbSize, uniformSize;
             if(buffer) {
-                if(mType == NodeType::CubeMap) {
-                    size = cubeMapSize;
-                }
+                base = { 0, 0 };
+                size = mType == NodeType::CubeMap ? cubeMapSize : screenSize;
+                fbSize = size;
+                uniformSize = mType == NodeType::CubeMap ? cubeMapSize : canvasSize;
                 glViewport(0, 0, static_cast<GLsizei>(size.x), static_cast<GLsizei>(size.y));
                 glDisable(GL_SCISSOR_TEST);
                 buffer->bind(static_cast<uint32_t>(size.x), static_cast<uint32_t>(size.y));
-                base = { 0, 0 };
-                frameBufferSize = size;
             } else {
                 glViewport(0, 0, static_cast<GLsizei>(frameBufferSize.x), static_cast<GLsizei>(frameBufferSize.y));
                 glEnable(GL_SCISSOR_TEST);
                 glScissor(static_cast<GLint>(clipMin.x), static_cast<GLint>(frameBufferSize.y - clipMax.y),
                           static_cast<GLint>(clipMax.x - clipMin.x), static_cast<GLint>(clipMax.y - clipMin.y));
+                base = screenBase;
+                size = screenSize;
+                fbSize = frameBufferSize;
+                uniformSize = canvasSize;
             }
             glUseProgram(mProgram);
             // update vertex array
@@ -362,8 +367,8 @@ class RenderPass final {
                     Vertex{ ImVec2{ base.x + size.x, base.y + size.y }, ImVec2{ size.x, 0.0 } },  // right-bottom
                 };
                 for(auto& [pos, coord] : vertices) {
-                    pos.x = pos.x / frameBufferSize.x * 2.0f - 1.0f;
-                    pos.y = 1.0f - pos.y / frameBufferSize.y * 2.0f;
+                    pos.x = pos.x / fbSize.x * 2.0f - 1.0f;
+                    pos.y = 1.0f - pos.y / fbSize.y * 2.0f;
                 }
                 glBufferData(GL_ARRAY_BUFFER, 4 * sizeof(Vertex), vertices.data(), GL_STREAM_DRAW);
             } else {
@@ -378,8 +383,8 @@ class RenderPass final {
                                    cubeMapVertexPos[cubeMapVertexIndex[idx][3]] },  // right-bottom
                 };
                 for(auto& [pos, coord, point] : vertices) {
-                    pos.x = pos.x / frameBufferSize.x * 2.0f - 1.0f;
-                    pos.y = 1.0f - pos.y / frameBufferSize.y * 2.0f;
+                    pos.x = pos.x / fbSize.x * 2.0f - 1.0f;
+                    pos.y = 1.0f - pos.y / fbSize.y * 2.0f;
                 }
                 glBufferData(GL_ARRAY_BUFFER, 4 * sizeof(VertexCubeMap), vertices.data(), GL_STREAM_DRAW);
             }
@@ -439,7 +444,7 @@ class RenderPass final {
 
             // update uniform
             if(mLocationResolution != -1)
-                glUniform3f(mLocationResolution, size.x, size.y, 0.0f);
+                glUniform3f(mLocationResolution, uniformSize.x, uniformSize.y, 0.0f);
             if(mLocationTime != -1)
                 glUniform1f(mLocationTime, uniform.time);
             if(mLocationTimeDelta != -1)
@@ -613,7 +618,7 @@ class OpenGLPipeline final : public Pipeline {
         mRenderPasses.push_back(std::make_unique<RenderPass>(src, type, std::move(target), std::move(channels)));
     }
 
-    void render(const ImVec2 frameBufferSize, const ImVec2 clipMin, const ImVec2 clipMax, const ImVec2 base, const ImVec2 size,
+    void render(const ImVec2 frameBufferSize, const ImVec2 clipMin, const ImVec2 clipMax, ImVec2 size,
                 const ShaderToyUniform& uniform) override {
         for(auto& [tex, data, update] : mDynamicTextures) {
             update(data.data());
@@ -624,7 +629,7 @@ class OpenGLPipeline final : public Pipeline {
             glBindTexture(GL_TEXTURE_2D, GL_NONE);
         }
         for(const auto& pass : mRenderPasses)
-            pass->render(frameBufferSize, clipMin, clipMax, base, size, uniform,
+            pass->render(frameBufferSize, clipMin, clipMax, size, uniform,
                          pass->getType() == NodeType::Image ? mVAOImage : mVAOCubeMap, mVBO);
     }
 
diff --git a/shadertoy/ShaderToyContext.cpp b/shadertoy/ShaderToyContext.cpp
@@ -101,7 +101,7 @@ void ShaderToyContext::render(const ImVec2 base, const ImVec2 size, const std::o
                     return;
                 ctx->mBound = { clipMin.x, clipMin.y, clipMax.x, clipMax.y };
                 ctx->mPipeline->render(
-                    fbSize, clipMin, clipMax, ctx->mBase - drawData->DisplayPos, ctx->mSize,
+                    fbSize, clipMin, clipMax, ctx->mSize,
                     { ctx->mTime, ctx->mTimeDelta, ctx->mFrameRate, ctx->mFrameCount, ctx->mMouse, ctx->mDate });
             },
             this);
diff --git a/shadertoy/shadertoy.cpp b/shadertoy/shadertoy.cpp
@@ -20,6 +20,7 @@
 #include "shadertoy/SuppressWarningPush.hpp"
 
 #include <fmt/format.h>
+#include <hello_imgui/dpi_aware.h>
 #include <hello_imgui/hello_imgui.h>
 #include <hello_imgui/hello_imgui_screenshot.h>
 #include <httplib.h>
@@ -40,6 +41,8 @@
 #include <Windows.h>
 #endif
 
+using HelloImGui::EmToVec2;
+
 #include "shadertoy/SuppressWarningPop.hpp"
 
 SHADERTOY_NAMESPACE_BEGIN
@@ -230,7 +233,7 @@ static void showImportModal() {
         ImGui::SetNextItemWidth(ImGui::CalcTextSize("https://www.shadertoy.com/view/WWWWWWXXXX").x);
         ImGui::InputText("##Url", &url, ImGuiInputTextFlags_CharsNoBlank);
 
-        if(ImGui::Button("Import", ImVec2(120, 0))) {
+        if(ImGui::Button("Import", EmToVec2(5, 0))) {
             try {
                 PipelineEditor::get().loadFromShaderToy(url);
             } catch(const Error&) {
@@ -240,7 +243,7 @@ static void showImportModal() {
         }
         ImGui::SetItemDefaultFocus();
         ImGui::SameLine();
-        if(ImGui::Button("Cancel", ImVec2(120, 0))) {
+        if(ImGui::Button("Cancel", EmToVec2(5, 0))) {
             ImGui::CloseCurrentPopup();
         }
         ImGui::EndPopup();
@@ -286,7 +289,7 @@ static void showAboutModal() {
             ImGui::TextUnformatted(OpenSSL_version(OPENSSL_VERSION));
         }
 
-        if(ImGui::Button("Close", ImVec2(120, 0))) {
+        if(ImGui::Button("Close", EmToVec2(5, 0))) {
             ImGui::CloseCurrentPopup();
         }
         ImGui::SetItemDefaultFocus();
@@ -347,9 +350,6 @@ int shaderToyMain(int argc, char** argv) {
     canvasWindow.label = "Canvas";
     canvasWindow.dockSpaceName = "LeftSpace";
     canvasWindow.GuiFunction = [&] {
-        if(!__glewCreateProgram && glewInit() != GLEW_OK)
-            reportFatalError("Failed to initialize glew");
-
         if(!initialPipeline.empty()) {
             if(startsWith(initialPipeline, "https://")) {
                 PipelineEditor::get().loadFromShaderToy(initialPipeline);
@@ -375,6 +375,11 @@ int shaderToyMain(int argc, char** argv) {
     editorWindow.GuiFunction = [&] { PipelineEditor::get().render(ctx); };
     runnerParams.dockingParams.dockableWindows = { canvasWindow, outputWindow, editorWindow };
 
+    // 8x MSAA
+    runnerParams.callbacks.PostInit = [] {
+        if(glewInit() != GLEW_OK)
+            reportFatalError("Failed to initialize glew");
+    };
     HelloImGui::Run(runnerParams);
     return 0;
 }
