add interface for apps

change address and parent elem for window moving
personal props html
2023-03-15 15:34:03 +03:00 · 2023-03-15 15:33:56 +03:00 · 2023-03-15 15:33:23 +03:00 · 2023-03-15 15:32:57 +03:00 · 2023-03-15 15:32:41 +03:00
11 changed files with 210 additions and 9 deletions
--- a/approutes/personalPropsRoute/personalPropsRoute.go
+++ b/approutes/personalPropsRoute/personalPropsRoute.go
@ -0,0 +1,16 @@
+package personalpropsroute
+
+import (
+	"net/http"
+	"personalwebsite/websiteapp/personalprops"
+
+	"github.com/gin-gonic/gin"
+)
+
+func Route(route *gin.RouterGroup) {
+	persPropsApp := personalprops.NewPersPropsApp()
+	route.GET("/test", func(ctx *gin.Context) {
+		test := persPropsApp.Render()
+		ctx.HTML(http.StatusOK, "personal-properties.html", gin.H{"books": test})
+	})
+}
--- a/main.go
+++ b/main.go
@ -3,6 +3,7 @@ package main
 import (
 	"log"
 	"net/http"
+	personalpropsroute "personalwebsite/approutes/personalPropsRoute"

 	"github.com/gin-gonic/gin"
 )
@ -17,8 +18,12 @@ func main() {
 	router.Static("/res", "resources")
 	router.GET("/", index)
 	router.GET("/getmockapp", func(ctx *gin.Context) {
-		ctx.HTML(http.StatusOK, "mockapp.html", nil)
+
 	})
+	apps := router.Group("applications")
+	{
+		personalpropsroute.Route(apps.Group("/personalproperties"))
+	}
 	// router.GET("/room/:roomid", roomGET)
 	// router.POST("/room-post/:roomid", roomPOST)
 	// router.GET("/stream/:roomid", streamRoom)
--- a/resources/base.css
+++ b/resources/base.css
@ -10,5 +10,115 @@ body{

 .Application{
    position: absolute;
+    /* background-color: antiquewhite; */
+        stroke: #000000;
+    stroke-width: 1px;
+    stroke-linecap: butt;
+    stroke-dasharray: 0;
+}
+
+.Frame{
+    width: 100%;
+    min-height: 200px;
+    height: auto;
+    background-color: #CCCCCC;
+    border: 1px solid #000000;
+    box-shadow: 1px 1px 0px #000,inset -1px -1px 0px rgba(0, 0, 0, 0.27), inset 1px 1px 0px #FFFFFF;
+
+    display: flex;
+    flex-direction: column;
+    align-items: flex-start;
+    padding: 4px;
+    gap:4px;
+}
+
+.WindowFrameTopBar{
+    /* background-color: aqua; */
+    width: 100%;
+    height: 13px;
+
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    gap: 5px;
+    padding: 0px;
+}
+
+.WindowFrameTopBarButton
+{
+    /* box-sizing: border-box; */
+    
+    width: 11px;
+    height: 11px;
+
+    background: #D9D9D9;
+    border: 1px solid #222222;
+    box-shadow: 0.5px 0.5px 0px 0.5px #FFFFFF, -0.5px -0.5px 0px 0.5px rgba(0, 0, 0, 0.25), inset 1px 1px 0px rgba(0, 0, 0, 0.25), inset -1px -1px 0px #FFFFFF;
+
+    /* Inside auto layout */
+
+    flex: none;
+    order: 0;
+    flex-grow: 0;
+}
+
+.WindowDragArea{
    background-color: antiquewhite;
+    width: 100%;
+    height: 100%;
+    /* background: repeating-linear-gradient(
+        to bottom,
+        rgb(255, 255, 255) 0px,
+        rgb(255, 255, 255) 1px,
+        #ffffff00 2px,
+        #ffffff00 3px
+    ); */
+    /* box-shadow: 1px 1px ; */
+}
+.ContentFrame{
+    box-sizing: border-box;
+
+    /* Auto layout */
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    padding: 12px;
+    gap:10px;
+
+    width: 100%;
+    height: 100%;
+
+    background: #DDDDDD;
+    border: 1px solid #000000;
+   box-shadow: 0.5px 0.5px 0px 0.5px #FFFFFF, -0.5px -0.5px 0px 0.5px rgba(0, 0, 0, 0.25), inset 1px 1px 0px #FFFFFF;
+    
+
+    /* Inside auto layout */
+    flex: none;
+    order: 0;
+    align-self: stretch;
+    flex-grow: 1;
+}
+
+.Personal-properties-prop{
+    width: 100%;
+    height: auto;
+    border: 1px solid #888888;
+    box-shadow: 1px 1px 0px #FFFFFF, inset 2px 2px 0px #FFFFFF;
+}
+
+
+.Personal-properties-prop-header{
+    /* width: 50px; */
+    position: relative;
+    display: inline-block;
+    max-width: 100%;
+    background-color: #DDDDDD;
+    left: 12px;
+    top: -10px;
+    margin-left: 2px;
+    
+    /* padding: 10px; */
+    /* border: 1px solid #888888; */
+    /* box-shadow: 1px 1px 0px #FFFFFF, inset 2px 2px 0px #FFFFFF; */
 }
--- a/resources/base.html
+++ b/resources/base.html
@ -3,7 +3,9 @@
    <head>
        <link rel="stylesheet" type="text/css" href="res/base.css">
        <script src="res/wde.js"></script>
-        <script src="res/decorat.js"></script>
+        <!-- <script src="res/decorat.js"></script> -->
+        <!-- TODO Load with app -->
+        <script src="res/personal-properties.js"></script> 
    </head>
    <body>
        <div id="WindowsLayer"></div>
--- a/resources/mockapp.html
+++ b/resources/mockapp.html
@ -1,5 +0,0 @@
-<div id="Pizda" class="Application" style="width: 200px;height: 150px;">
-    <div id="TestWindowHeader" class="WindowDragArea" style="width: 100%;height: 22px; background-color: cornflowerblue;">
-    <button>Close</button>
-    </div>
-</div>
--- a/resources/personal-properties-prop.html
+++ b/resources/personal-properties-prop.html
@ -0,0 +1,7 @@
+<div id="prop" class="personal-properties-prop">
+    {{ range $book := .books }}
+    <h1>{{ .Title }}</h1>
+    <h3>{{ .Author }}</h3>
+    <hr/>
+    {{ end }}
+</div>
--- a/resources/personal-properties.html
+++ b/resources/personal-properties.html
@ -0,0 +1,17 @@
+<div id="RootWidget" class="Application" style="width: 200px;height: 200px;">
+    <div id="WindowBorder" class="Frame">
+        <div id="TestWindowHeader" class="WindowFrameTopBar">
+            <button class="WindowFrameTopBarButton"></button>
+            <div id="Drag" class="WindowDragArea"></div>
+            <button class="WindowFrameTopBarButton" ></button>
+        </div>
+        <div id="ContentFrame" class="ContentFrame">
+                {{ range $book := .books }}
+                    <div id="prop" class="Personal-properties-prop">
+                        <div class="Personal-properties-prop-header">{{ .Title }}</div>
+                        <div>{{ .Author }}</div>
+                    </div>
+                {{ end }}
+        </div>
+    </div>
+</div>
--- a/resources/personal-properties.js
+++ b/resources/personal-properties.js
@ -0,0 +1,5 @@
+class PersonalProperties {
+    constructor(){
+        console.log("pprops")
+    }
+}
--- a/resources/wde.js
+++ b/resources/wde.js
@ -7,7 +7,7 @@ class WebDesktopEnvironment{
    constructor(){
        this.wc = new WindowsCompositor

-        fetch("http://localhost:8080/getmockapp" /*, options */)
+        fetch("http://localhost:8080/applications/personalproperties/test" /*, options */)
        .then((response) => response.text())
        .then((html) => {
        document.getElementById("WindowsLayer").innerHTML = html;
@ -54,7 +54,7 @@ class WindowsCompositor{
    catchClick(event){
        switch (true) {
            case event.target.className == "WindowDragArea":
-                this.movingElement = event.target.parentElement
+                this.movingElement = event.target.parentElement.parentElement.parentElement
                break;
            default:
                break;
--- a/websiteapp/personalprops/personalprops.go
+++ b/websiteapp/personalprops/personalprops.go
@ -0,0 +1,39 @@
+package personalprops
+
+type PersonalPropertiesApp struct {
+}
+
+func NewPersPropsApp() PersonalPropertiesApp {
+	newApp := PersonalPropertiesApp{}
+	return newApp
+}
+
+func (p *PersonalPropertiesApp) Render() []Book {
+	books := make([]Book, 0)
+	books = append(books, Book{
+		Title:  "About person:",
+		Author: "General information about me",
+	})
+	books = append(books, Book{
+		Title:  "Career:",
+		Author: "Inforamtion about my career",
+	})
+	books = append(books, Book{
+		Title:  "TEST:",
+		Author: "QQQQQQQ",
+	})
+	books = append(books, Book{
+		Title:  "TEST:",
+		Author: "QQQQQQQ",
+	})
+	books = append(books, Book{
+		Title:  "TEST:",
+		Author: "QQQQQQQ",
+	})
+	return books
+}
+
+type Book struct {
+	Title  string
+	Author string
+}
--- a/websiteapp/websiteapp.go
+++ b/websiteapp/websiteapp.go
@ -0,0 +1,5 @@
+package websiteapp
+
+type WebDEApplication interface {
+	Render()
+}
Author	SHA1	Message	Date
cyber-dream	e93d442c79	add interface for apps	2023-03-15 15:34:03 +03:00
cyber-dream	f2d9e55385	change address and parent elem for window moving	2023-03-15 15:33:56 +03:00
cyber-dream	b62aee6811	personal props html	2023-03-15 15:33:23 +03:00
cyber-dream	f79c97ef95	add temp js loading of personal props app	2023-03-15 15:32:57 +03:00
cyber-dream	7dd0d74b12	add route for personal props app	2023-03-15 15:32:41 +03:00