edit bulma theme.

Server/SystemUsage.cpp

@@ -47,7 +47,7 @@ void SystemUsage::start() {
                 auto receiveGigabyte = static_cast<float>(back.receiveBytes - front.receiveBytes) / gigabyte;
                 auto transmitGigabyte = static_cast<float>(back.transmitBytes - front.transmitBytes) / gigabyte;
                 auto speed = (receiveGigabyte + transmitGigabyte) / duration.count() * SpeedInterval.count();
-                LOG(info) << "network speed: " << std::fixed << std::setprecision(2) << speed << "GB/h";
+                // LOG(info) << "network speed: " << std::fixed << std::setprecision(2) << speed << "GB/h";
                 static system_clock::time_point lastNotify;
                 auto now = system_clock::now();
                 if ((speed >= 1.5f) && (duration_cast<minutes>(now - lastNotify) > minutes(10))) { // 一个小时1.5GB的流量

WebApplication/Application.cpp

@@ -2,7 +2,7 @@
 #include "BoostLog.h"
 #include "BulmaTheme.h"
 #include "Database/Session.h"
-#include "Dialog.h"
+#include "HomePage.h"
 #include "LoginPage.h"
 #include "Restful.h"
 #include "VisitorRecordsPage.h"
@@ -17,8 +17,6 @@
 #include <Wt/Dbo/backend/Sqlite3.h>
 #include <Wt/WContainerWidget.h>
 #include <Wt/WEnvironment.h>
-#include <Wt/WLineEdit.h>
-#include <Wt/WPushButton.h>
 #include <Wt/WServer.h>
 #include <format>
 
@@ -33,7 +31,6 @@ Application::Application(const Wt::WEnvironment &env, bool embedded) : Wt::WAppl
     m_session->login().changed().connect(this, &Application::authEvent);
     setTheme(std::make_shared<BulmaTheme>("bulma", !embedded));
     if (!embedded) {
-        // setTheme(std::make_shared<Wt::WBootstrap2Theme>());
         m_root = root();
     } else {
         std::unique_ptr<Wt::WContainerWidget> topPtr = std::make_unique<Wt::WContainerWidget>();
@@ -55,34 +52,11 @@ Application::Application(const Wt::WEnvironment &env, bool embedded) : Wt::WAppl
                 LOG(info) << p.first;
             }
         }
-        LOG(info) << "url: " << url();
-        LOG(info) << "relative resources url: " << relativeResourcesUrl();
-        LOG(info) << "resources url: " << resourcesUrl();
-    }
-
-    if (!embedded) {
-        root()->addWidget(std::make_unique<Wt::WText>(
-            "Note: you can also run this application from within <a href=\"hello.html\">a web page</a>."));
     }
+    LOG(info) << "url: " << url();
+    LOG(info) << "relative resources url: " << relativeResourcesUrl();
+    LOG(info) << "resources url: " << resourcesUrl();
     LOG(info) << "internal path: " << internalPath();
-
-    m_root->addWidget(std::make_unique<Wt::WText>("Your name, please ? "));
-    m_nameEdit = m_root->addWidget(std::make_unique<Wt::WLineEdit>());
-    m_nameEdit->setFocus();
-
-    auto b = m_root->addWidget(std::make_unique<Wt::WPushButton>("点击我!"));
-    b->setMargin(5, Wt::Side::Left);
-
-    m_root->addWidget(std::make_unique<Wt::WBreak>());
-
-    m_greeting = m_root->addWidget(std::make_unique<Wt::WText>());
-
-    b->clicked().connect(this, &Application::greet);
-    m_nameEdit->enterPressed().connect(this, &Application::greet);
-
-    auto app = Amass::Singleton<Server>::instance();
-
-    m_root->addWidget(std::make_unique<Dialog>());
     internalPathChanged().connect(this, &Application::handlePathChange);
     handlePathChange(m_externalPath.empty() ? internalPath() : m_externalPath);
 }
@@ -90,11 +64,6 @@ Application::Application(const Wt::WEnvironment &env, bool embedded) : Wt::WAppl
 Application::~Application() {
 }
 
-void Application::greet() {
-    m_greeting->setText("Hello there, " + m_nameEdit->text());
-    setInternalPath(m_externalPath);
-}
-
 void Application::authEvent() {
     if (m_session->login().loggedIn()) {
         const Wt::Auth::User &u = m_session->login().user();
@@ -114,6 +83,9 @@ void Application::handlePathChange(const std::string &path) {
     } else if (path.starts_with("/wt/visitor/analysis")) {
         m_root->clear();
         m_root->addNew<VisitorRecordsPage>(*m_session);
+    } else {
+        m_root->clear();
+        m_root->addNew<HomePage>();
     }
 }
 

WebApplication/Application.h

@@ -27,13 +27,10 @@ public:
     ~Application();
 
 protected:
-    void greet();
     void authEvent();
     void handlePathChange(const std::string &path);
 
 private:
-    Wt::WLineEdit *m_nameEdit = nullptr;
-    Wt::WText *m_greeting = nullptr;
     std::unique_ptr<Session> m_session;
     std::string m_externalPath;
 

WebApplication/BulmaTheme.cpp

@@ -1,6 +1,7 @@
 #include "BulmaTheme.h"
 #include "BoostLog.h"
 #include <Wt/DomElement.h>
+#include <Wt/WApplication.h>
 #include <Wt/WDialog.h>
 #include <Wt/WLinkedCssStyleSheet.h>
 #include <Wt/WPopupWidget.h>
@@ -11,6 +12,19 @@ namespace std {
 std::ostream &operator<<(std::ostream &os, Wt::DomElementType type);
 }
 
+void BulmaTheme::init(Wt::WApplication *app) const {
+    Wt::WString v = app->metaHeader(Wt::MetaHeaderType::Meta, "viewport");
+    if (v.empty()) {
+        // app->addMetaHeader("viewport", "width=device-width, initial-scale=1");
+        app->doJavaScript(R"(
+            var meta = document.createElement('meta');
+            meta.name = 'viewport';
+            meta.content = 'width=device-width, initial-scale=1';
+            document.getElementsByTagName('head')[0].appendChild(meta);
+        )");
+    }
+}
+
 std::string BulmaTheme::disabledClass() const {
     return "";
 }
@@ -38,6 +52,40 @@ bool BulmaTheme::canStyleAnchorAsButton() const {
 }
 
 void BulmaTheme::apply(Wt::WWidget *widget, Wt::WWidget *child, int widgetRole) const {
+    using namespace Wt;
+    if (!widget->isThemeStyleEnabled()) return;
+    switch (widgetRole) {
+    case DialogContent: {
+        child->addStyleClass("bulma-modal-content");
+        break;
+    }
+    case DialogCoverWidget: {
+        child->addStyleClass("bulma-modal-backdrop");
+        break;
+    }
+    case DialogTitleBar: {
+        child->addStyleClass("bulma-modal-card-head");
+        child->setAttributeValue("style", "justify-content: space-between");
+        break;
+    }
+    case DialogBody: {
+        child->addStyleClass("bulma-modal-card-body");
+        break;
+    }
+    case DialogFooter: {
+        child->addStyleClass("bulma-modal-card-foot bulma-buttons");
+        break;
+    }
+    case DialogCloseIcon: {
+        auto parent = dynamic_cast<WContainerWidget *>(child->parent());
+        auto self = parent->removeWidget(child);
+        parent->addWidget(std::move(self));
+        child->addStyleClass("bulma-delete");
+        break;
+    }
+    default:
+        break;
+    }
 }
 
 void BulmaTheme::apply(Wt::WWidget *widget, Wt::DomElement &element, int elementRole) const {
@@ -55,9 +103,11 @@ void BulmaTheme::apply(Wt::WWidget *widget, Wt::DomElement &element, int element
         break;
     }
     case Wt::DomElementType::DIV: {
-        Wt::WDialog *dialog = dynamic_cast<Wt::WDialog *>(widget);
+        if (Wt::WDialog *dialog = dynamic_cast<Wt::WDialog *>(widget); dialog != nullptr) {
-        if (dialog) {
+            element.addPropertyWord(Wt::Property::Class, "bulma-modal bulma-is-active");
-            element.addPropertyWord(Wt::Property::Class, "modal-content");
+            return;
+        } else if (auto text = dynamic_cast<Wt::WText *>(widget); text != nullptr) {
+            element.addPropertyWord(Wt::Property::Class, "is-size-6");
             return;
         }
         break;

WebApplication/BulmaTheme.h

@@ -12,6 +12,7 @@ class BulmaTheme : public Wt::WTheme {
 public:
     BulmaTheme(const std::string &name, bool global = true);
     std::string name() const final;
+    void init(Wt::WApplication *app) const final;
     std::string disabledClass() const final;
     std::string activeClass() const final;
     std::string utilityCssClass(int utilityCssClassRole) const final;

WebApplication/CMakeLists.txt

@@ -2,8 +2,9 @@ find_package(Wt REQUIRED Wt)
 
 add_library(WebApplication
     Application.h Application.cpp
-    LoginPage.h LoginPage.cpp
     BulmaTheme.h BulmaTheme.cpp
+    HomePage.h HomePage.cpp
+    LoginPage.h LoginPage.cpp
     VisitorRecordsPage.h VisitorRecordsPage.cpp
     VisitorRecordTableModel.h VisitorRecordTableModel.cpp
     Restful.h Restful.cpp

WebApplication/Dialog.cpp

@@ -9,7 +9,7 @@ Dialog::Dialog() {
     textdiv->setStyleClass("text");
 
     Wt::WContainerWidget *buttons = addWidget(std::make_unique<Wt::WContainerWidget>());
-    buttons->setStyleClass("buttons");
+    buttons->setStyleClass("bulma-buttons");
 
     Wt::WPushButton *button = buttons->addWidget(std::make_unique<Wt::WPushButton>("One liner"));
     button->clicked().connect(this, &Dialog::messageBox1);
@@ -42,8 +42,7 @@ void Dialog::messageBox1() {
 
 void Dialog::messageBox2() {
     m_messageBox = std::make_unique<Wt::WMessageBox>("Question", "Are you getting comfortable?", Wt::Icon::Question,
-                                                     Wt::StandardButton::Yes | Wt::StandardButton::No |
+                                          Wt::StandardButton::Yes | Wt::StandardButton::No | Wt::StandardButton::Cancel);
-                                                         Wt::StandardButton::Cancel);
 
     m_messageBox->buttonClicked().connect(this, &Dialog::messageBoxDone);
 
@@ -68,14 +67,13 @@ void Dialog::messageBox4() {
                                                      Wt::Icon::None, Wt::StandardButton::None);
 
     m_messageBox->addButton("Discard Modifications", Wt::StandardButton::Ok);
+    m_messageBox->setMovable(false);
+    m_messageBox->setClosable(true);
     Wt::WPushButton *continueButton = m_messageBox->addButton("Cancel", Wt::StandardButton::Cancel);
     m_messageBox->setDefaultButton(continueButton);
 
     m_messageBox->buttonClicked().connect(this, &Dialog::messageBoxDone);
-
+    m_messageBox->animateShow(Wt::WAnimation(Wt::AnimationEffect::SlideInFromBottom | Wt::AnimationEffect::Fade, Wt::TimingFunction::Linear, 250));
-    m_messageBox->setOffsets(0, Wt::Side::Bottom);
-    m_messageBox->animateShow(Wt::WAnimation(Wt::AnimationEffect::SlideInFromBottom | Wt::AnimationEffect::Fade,
-                                             Wt::TimingFunction::Linear, 250));
 }
 
 void Dialog::custom() {

WebApplication/HomePage.cpp

@@ -0,0 +1,39 @@
+#include "HomePage.h"
+#include "Dialog.h"
+#include <Wt/WApplication.h>
+#include <Wt/WLineEdit.h>
+#include <Wt/WPushButton.h>
+
+HomePage::HomePage() {
+    addStyleClass("bulma-content");
+    auto p = addWidget(std::make_unique<Wt::WText>("这是一个结合 C++ Web Toolkit 和 CSS Bulma 框架的前后端一体应用程序。"));
+    p->setInline(false);
+
+    auto ul = addWidget(std::make_unique<Wt::WContainerWidget>());
+    ul->setList(true);
+    auto li = ul->addWidget(std::make_unique<Wt::WText>(R"(<a href="/wt/login">登录页面</a>)"));
+    li->setHtmlTagName("li");
+    li = ul->addWidget(std::make_unique<Wt::WText>(R"(<a href="/wt/visitor/analysis">访客数据</a>)"));
+    li->setHtmlTagName("li");
+
+    addWidget(std::make_unique<Wt::WText>("Your name, please ? "));
+    m_nameEdit = addWidget(std::make_unique<Wt::WLineEdit>());
+    m_nameEdit->setFocus();
+
+    auto b = addWidget(std::make_unique<Wt::WPushButton>("点击我!"));
+    b->setMargin(5, Wt::Side::Left);
+
+    addWidget(std::make_unique<Wt::WBreak>());
+
+    m_greeting = addWidget(std::make_unique<Wt::WText>());
+
+    b->clicked().connect(this, &HomePage::greet);
+    m_nameEdit->enterPressed().connect(this, &HomePage::greet);
+
+    addWidget(std::make_unique<Dialog>());
+}
+
+void HomePage::greet() {
+    m_greeting->setText("Hello there, " + m_nameEdit->text());
+    Wt::WApplication::instance()->setInternalPath("/hello");
+}

WebApplication/HomePage.h

@@ -0,0 +1,18 @@
+#ifndef __HOMEPAGE_H__
+#define __HOMEPAGE_H__
+
+#include <Wt/WContainerWidget.h>
+
+class HomePage : public Wt::WContainerWidget {
+public:
+    HomePage();
+
+    protected:
+        void greet();
+
+private:
+    Wt::WLineEdit *m_nameEdit = nullptr;
+    Wt::WText *m_greeting = nullptr;
+};
+
+#endif // __HOMEPAGE_H__

resources/wt_zh.xml

@@ -273,6 +273,6 @@
   </message>
 
   <message id="Wt.WDialog.titlebar">
-    <h4>${title}</h4>
+    <h4 class="bulma-modal-card-title">${title}</h4>
   </message>
 </messages>