Task: Updated the deps for maven repo for cubetiq fusion

Task: Updated the test view add editor component and CUI module for cubetiq fusion
Task: Change title for cubetiq fusion
2021-07-29 10:03:14 +07:00 · 2021-07-28 20:08:52 +07:00 · 2021-07-27 10:05:54 +07:00 · 2021-07-27 10:01:32 +07:00 · 2021-07-27 09:53:06 +07:00
16 changed files with 248 additions and 49 deletions
--- a/README.md
+++ b/README.md
@@ -33,12 +33,15 @@ Once the JAR file is built, you can run it using
  <tr><td>&nbsp;&nbsp;&nbsp;&nbsp;<code>index.html</code></td><td>HTML template</td></tr>
  <tr><td>&nbsp;&nbsp;&nbsp;&nbsp;<code>index.ts</code></td><td>Frontend entrypoint, contains the client-side routing setup using <a href="https://vaadin.com/router">Vaadin Router</a></td></tr>
  <tr><td>&nbsp;&nbsp;&nbsp;&nbsp;<code>main-layout.ts</code></td><td>Main layout Web Component, contains the navigation menu, uses <a href="https://vaadin.com/components/vaadin-app-layout">App Layout</a></td></tr>
+  <tr><td>&nbsp;&nbsp;&nbsp;&nbsp;<code>server-layout.ts</code></td><td>Blank layout Web Component for server-side Java/Kotlin views</td></tr>
  <tr><td>&nbsp;&nbsp;&nbsp;&nbsp;<code>views/</code></td><td>UI views Web Components (TypeScript)</td></tr>
  <tr><td>&nbsp;&nbsp;&nbsp;&nbsp;<code>themes/</code></td><td>Custom  
 CSS styles</td></tr>
-  <tr><td><code>src/main/java/&lt;groupId&gt;/</code></td><td>Server-side 
+  <tr><td><code>src/main/java/com/cubetiqs/fusion</code></td><td>Server-side 
 source directory, contains the server-side Java views</td></tr>
-  <tr><td>&nbsp;&nbsp;&nbsp;&nbsp;<code>Application.java</code></td><td>Server entry-point</td></tr>
+  <tr><td><code>src/main/kotlin/com/cubetiqs/fusion</code></td><td>Server-side 
+source directory, contains the server-side Kotlin views</td></tr>
+  <tr><td>&nbsp;&nbsp;&nbsp;&nbsp;<code>Application.kt</code></td><td>Server entry-point</td></tr>
 </table>

 ## Deploying using Docker
--- a/frontend/index.html
+++ b/frontend/index.html
@@ -3,7 +3,7 @@
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
-    <title>Fusion Management</title>
+    <title>CUBETIQ Fusion</title>
    <style>
      body {
        margin: 0;
--- a/frontend/routes.ts
+++ b/frontend/routes.ts
@@ -9,6 +9,9 @@ const { serverSideRoutes } = new Flow({
  imports: () => import('../target/frontend/generated-flow-imports'),
 });

+
+console.log("serverSideRoutes", serverSideRoutes)
+
 export type ViewRoute = Route & {
  title?: string;
  icon?: string;
@@ -67,15 +70,6 @@ export const views: ViewRoute[] = [
  },
 ];
 export const routes: ViewRoute[] = [
-  {
-    path: '',
-    component: 'main-layout',
-    children: [
-        ...views,
-      // for server-side, the next magic line sends all unmatched routes:
-      ...serverSideRoutes, // IMPORTANT: this must be the last entry in the array
-    ],
-  },
  {
    path: 'login',
    component: 'login-view',
@@ -86,4 +80,18 @@ export const routes: ViewRoute[] = [
      return;
    },
  },
+  {
+    path: '',
+    component: 'main-layout',
+    children: [
+        ...views,
+    ],
+  },
+  {
+    path: '',
+    component: 'server-layout',
+    children: [
+      ...serverSideRoutes,
+    ]
+  }
 ];
--- a/frontend/themes/fusionmanagement/main-layout.css
+++ b/frontend/themes/fusionmanagement/main-layout.css
--- a/frontend/themes/fusionmanagement/styles.css
+++ b/frontend/themes/fusionmanagement/styles.css
--- a/frontend/themes/fusionmanagement/theme.json
+++ b/frontend/themes/fusionmanagement/theme.json
--- a/frontend/themes/fusionmanagement/views/admin-view.css
+++ b/frontend/themes/fusionmanagement/views/admin-view.css
--- a/frontend/themes/fusionmanagement/views/home-view.css
+++ b/frontend/themes/fusionmanagement/views/home-view.css
--- a/frontend/themes/fusionmanagement/views/profile-view.css
+++ b/frontend/themes/fusionmanagement/views/profile-view.css
--- a/frontend/views/server-layout.ts
+++ b/frontend/views/server-layout.ts
@@ -0,0 +1,10 @@
+import { html } from 'lit';
+import { customElement } from 'lit/decorators.js';
+import {Layout} from "./view";
+
+@customElement('server-layout')
+export class AdminView extends Layout {
+    render() {
+        return html`<><slot></slot></>`;
+    }
+}
--- a/pom.xml
+++ b/pom.xml
@@ -22,47 +22,31 @@
    </parent>

    <repositories>
-        <!-- The order of definitions matters. Explicitly defining central here to make sure it has the highest priority. -->
-
-        <!-- Main Maven repository -->
        <repository>
-            <id>central</id>
-            <url>https://repo.maven.apache.org/maven2</url>
+            <id>CUBETIQ Directory</id>
+            <url>https://m.ctdn.net</url>
            <snapshots>
                <enabled>false</enabled>
            </snapshots>
        </repository>
+
        <repository>
-            <id>vaadin-prereleases</id>
-            <url>
-                https://maven.vaadin.com/vaadin-prereleases/
-            </url>
-        </repository>
-        <!-- Repository used by many Vaadin add-ons -->
-        <repository>
-            <id>Vaadin Directory</id>
-            <url>https://maven.vaadin.com/vaadin-addons</url>
+            <id>CUBETIQ Directory Snapshots</id>
+            <url>https://m.ctdn.net/snapshots</url>
            <snapshots>
-                <enabled>false</enabled>
+                <enabled>true</enabled>
            </snapshots>
        </repository>
    </repositories>

    <pluginRepositories>
-        <!-- The order of definitions matters. Explicitly defining central here to make sure it has the highest priority. -->
        <pluginRepository>
-            <id>central</id>
-            <url>https://repo.maven.apache.org/maven2</url>
+            <id>CUBETIQ Directory</id>
+            <url>https://m.ctdn.net</url>
            <snapshots>
                <enabled>false</enabled>
            </snapshots>
        </pluginRepository>
-        <pluginRepository>
-            <id>vaadin-prereleases</id>
-            <url>
-                https://maven.vaadin.com/vaadin-prereleases/
-            </url>
-        </pluginRepository>
    </pluginRepositories>

    <dependencyManagement>
@@ -78,6 +62,12 @@
    </dependencyManagement>

    <dependencies>
+        <dependency>
+            <groupId>com.cubetiqs</groupId>
+            <artifactId>cui</artifactId>
+            <version>0.0.1-SNAPSHOT</version>
+        </dependency>
+
        <dependency>
            <groupId>org.jetbrains.kotlin</groupId>
            <artifactId>kotlin-reflect</artifactId>
@@ -89,7 +79,6 @@

        <dependency>
            <groupId>com.vaadin</groupId>
-            <!-- Replace artifactId with vaadin-core to use only free components -->
            <artifactId>vaadin</artifactId>
        </dependency>
        <dependency>
--- a/src/main/kotlin/com/cubetiqs/fusion/Application.kt
+++ b/src/main/kotlin/com/cubetiqs/fusion/Application.kt
@@ -4,13 +4,13 @@ import com.vaadin.flow.component.dependency.NpmPackage
 import com.vaadin.flow.component.page.AppShellConfigurator
 import com.vaadin.flow.server.PWA
 import com.vaadin.flow.theme.Theme
-import org.springframework.boot.SpringApplication
 import org.springframework.boot.autoconfigure.SpringBootApplication
+import org.springframework.boot.runApplication
 import org.springframework.boot.web.servlet.support.SpringBootServletInitializer

@SpringBootApplication
-@Theme(value = "fusionmanagement")
-@PWA(name = "Fusion Management", shortName = "Fusion Management", offlineResources = ["images/logo.png"])
+@Theme(value = "fusion")
+@PWA(name = "CUBETIQ Fusion", shortName = "Fusion", offlineResources = ["images/logo.png"])
@NpmPackage.Container(
    NpmPackage(value = "@fontsource/roboto", version = "4.5.0"),
    NpmPackage(value = "@adobe/lit-mobx", version = "2.0.0-rc.4"),
@@ -20,5 +20,5 @@ import org.springframework.boot.web.servlet.support.SpringBootServletInitializer
 class Application : SpringBootServletInitializer(), AppShellConfigurator

 fun main(args: Array<String>) {
-    SpringApplication.run(Application::class.java, *args)
+    runApplication<Application>(*args)
 }
--- a/src/main/kotlin/com/cubetiqs/fusion/frontend/views/test/TestView.kt
+++ b/src/main/kotlin/com/cubetiqs/fusion/frontend/views/test/TestView.kt
@@ -1,11 +1,170 @@
 package com.cubetiqs.fusion.frontend.views.test

-import com.vaadin.flow.component.html.Div
+import com.cubetiqs.cui.component.dialog.ConfirmDialog
+import com.cubetiqs.cui.component.element.CDiv
+import com.cubetiqs.cui.component.element.CSizeBox
+import com.cubetiqs.cui.dsl.*
+import com.cubetiqs.cui.inject.tinymce.TinyMceInjectable
+import com.cubetiqs.cui.notification.Alert
+import com.cubetiqs.cui.style.BoxShadow
+import com.cubetiqs.cui.style.Height
+import com.cubetiqs.cui.style.Padding
+import com.vaadin.flow.component.AttachEvent
+import com.vaadin.flow.component.button.ButtonVariant
+import com.vaadin.flow.component.icon.VaadinIcon
+import com.vaadin.flow.component.orderedlayout.FlexComponent
 import com.vaadin.flow.router.Route
+import com.vaadin.flow.server.auth.AnonymousAllowed
+import java.util.*

-@Route("/views/test")
-class TestView : Div() {
-    init {
-        add("Hello World")
+@Route("/test")
+@AnonymousAllowed
+class TestView : CDiv(), TinyMceInjectable {
+    private val container = createDiv { }
+
+    private fun addAnswer() {
+        val editorId = "editor-${UUID.randomUUID()}"
+        val editor = createDiv {
+            setId(editorId)
+            addDiv {
+
+                setStyle(BoxShadow())
+                setStyle(Padding.All("10px"))
+
+                addHorizontalLayout {
+                    addButton {
+                        width = "10%"
+                        var checked = false
+                        addThemeVariants(ButtonVariant.LUMO_TERTIARY_INLINE)
+                        icon = createIcon(VaadinIcon.CHECK_CIRCLE_O) { }
+
+                        addClickListener {
+                            this.icon = if (checked) {
+                                checked = false
+                                createIcon(VaadinIcon.CHECK_CIRCLE_O) { }
+                            } else {
+                                checked = true
+                                createIcon(VaadinIcon.CHECK_CIRCLE) { }
+                            }
+                        }
+                    }
+
+                    val editorContent = createTinyMceEditor {
+                        width = "80%"
+                        setId("$editorId-content")
+                        enabledMathMode()
+                        isInlineMode(true)
+                    }
+
+                    add(editorContent)
+
+                    addButton {
+                        width = "10%"
+                        addThemeVariants(ButtonVariant.LUMO_TERTIARY_INLINE)
+                        icon = createIcon(VaadinIcon.TRASH) {
+                            color = "red"
+                        }
+
+                        addClickListener {
+                            var isConfirm = false
+                            val ct = editorContent.currentValue
+                            if (ct.isNotBlank()) {
+                                val confirm = ConfirmDialog(
+                                    "Are you sure?",
+                                    "Really want to delete the answering content...",
+                                    "Okay"
+                                ) {
+                                    removeElement(editorId)
+                                }
+
+                                add(confirm)
+
+                                confirm.open()
+
+                                isConfirm = true
+                            }
+
+                            if (!isConfirm) {
+                                removeElement(editorId)
+                            }
+                        }
+                    }
+                }
+            }
+
+            add(CSizeBox(height = 10.0))
+        }
+
+        container.add(editor)
+    }
+
+    override fun onAttach(attachEvent: AttachEvent?) {
+        super.onAttach(attachEvent)
+
+        init()
+    }
+
+    private fun init() {
+        addBr(3)
+
+        addHorizontalLayout {
+            setWidthFull()
+
+            addDiv {
+                addDiv {
+                    withStyle {
+                        BoxShadow()
+                    }
+
+                    withStyle {
+                        Padding.All("10px")
+                    }
+
+                    minHeight = "150px"
+                    width = "500px"
+                    addTinyMceEditor {
+                        enabledMathMode()
+                        isInlineMode(true)
+                        getEditorElement().setStyle(Height.Min("150px"))
+                    }
+                }
+
+                addBr()
+
+                addDiv {
+                    width = "500px"
+                    setStyle(Padding.All("10px"))
+
+                    addHorizontalLayout {
+                        addButton {
+                            text = "Add new answer"
+
+                            addClickListener {
+                                addAnswer()
+                            }
+                        }
+
+                        addSizedBox {
+                            width = "10px"
+                        }
+
+                        addButton {
+                            text = "See Answer Count"
+
+                            addClickListener {
+                                Alert.Companion.show("You clicked see answer...")
+                            }
+                        }
+                    }
+
+                    addBr(2)
+
+                    add(container)
+                }
+
+            }
+
+            justifyContentMode = FlexComponent.JustifyContentMode.CENTER
+        }
    }
 }
--- a/src/main/kotlin/com/cubetiqs/fusion/frontend/views/user/UserView.kt
+++ b/src/main/kotlin/com/cubetiqs/fusion/frontend/views/user/UserView.kt
@@ -0,0 +1,29 @@
+package com.cubetiqs.fusion.frontend.views.user
+
+import com.vaadin.flow.component.grid.Grid
+import com.vaadin.flow.component.html.Div
+import com.vaadin.flow.router.PageTitle
+import com.vaadin.flow.router.Route
+import com.vaadin.flow.server.auth.AnonymousAllowed
+
+@Route("/users")
+@PageTitle("All Users")
+@AnonymousAllowed
+class UserView : Div() {
+    private fun generateUsers(): Collection<User> {
+        val users = mutableListOf<User>()
+        for (i in 1..1000000) {
+            users.add(User(i, "user-${"$i".padStart(6, '0')}", "MY USER - $i", "$i".padEnd(9, '0')))
+        }
+
+        return users
+    }
+
+    init {
+        val grid = Grid(User::class.java)
+        grid.setItems(generateUsers())
+        add(grid)
+    }
+
+    data class User(val id: Int, val username: String, val name: String, val phone: String)
+}
--- a/src/main/resources/application-dev.yml
+++ b/src/main/resources/application-dev.yml
@@ -0,0 +1,2 @@
+server:
+  port: 8081
--- a/src/main/resources/application.yml
+++ b/src/main/resources/application.yml
@@ -1,12 +1,11 @@
-server:
-  port: ${PORT:8080}
-
 logging:
  level:
    org:
      atmosphere: warn

 spring:
+  profiles:
+    active: ${APP_PROFILE:dev}
  mustache:
    check-template-location: false
Author	SHA1	Message	Date
Sambo Chea	a568dcac00	Task: Updated the deps for maven repo for cubetiq fusion	2021-07-29 10:03:14 +07:00
Sambo Chea	255c972234	Task: Updated the test view add editor component and CUI module for cubetiq fusion	2021-07-28 20:08:52 +07:00
Sambo Chea	8035f05662	Task: Change title for cubetiq fusion	2021-07-27 10:05:54 +07:00
Sambo Chea	a6bc64b7d1	Task: Updated readme for project structure	2021-07-27 10:01:32 +07:00
Sambo Chea	5a9930161b	Task: Fixed server routes loop and add server layout for vaadin flow backend from java code design and rename theme name to fusion and updated the views and add mock users for show data grid and fixed all views	2021-07-27 09:53:06 +07:00