full screen panel projects

This commit is contained in:
David Botton 2022-08-18 14:32:47 -04:00
parent c702623a6a
commit b366710bbc
16 changed files with 225 additions and 6 deletions

View file

@ -0,0 +1,8 @@
# New CLOG Web project
### _Your Name <your.name@example.com>_
This is a project to do ... something.
## License
Specify license here

View file

@ -0,0 +1 @@
<data id="I3869785326" data-in-package="<%= (@ sys-name) %>" data-custom-slots="" data-clog-next-id="2" data-clog-title="foot-panel"></data><div data-clog-type="div" data-clog-name="foot-bounds" style="box-sizing: content-box; position: static; width: 100%;">(C) 2022</div>

View file

@ -0,0 +1,16 @@
(in-package :<%= (@ sys-name) %>)
(defclass foot-panel (clog:clog-panel) ((foot-bounds :reader foot-bounds)))
(defun create-foot-panel
(clog-obj &key (hidden nil) (class nil) (html-id nil) (auto-place t))
(let ((panel
(change-class
(clog:create-div clog-obj :content
"<div id=\"CLOGB38697851771\" style=\"box-sizing: content-box; position: static; width: 100%;\" data-clog-name=\"foot-bounds\">(C) 2022</div>"
:hidden hidden :class class :html-id html-id
:auto-place auto-place)
'foot-panel)))
(setf (slot-value panel 'foot-bounds)
(attach-as-child clog-obj "CLOGB38697851771" :clog-type
'clog:clog-div :new-id t))
panel))

View file

@ -0,0 +1 @@
<data id="I3869833126" data-in-package="<%= (@ sys-name) %>" data-custom-slots="" data-clog-next-id="8" data-clog-title="left-panel"></data><div data-clog-type="div" data-clog-name="left-bounds" style="box-sizing: content-box; position: absolute; left: 0px; top: 0px; width: 194px; height: 367.017px;"><div data-clog-type="flex-col" data-clog-name="app-menu" style="width: 175px; height: 100%; display: flex; flex-direction: column; box-sizing: content-box; position: static;" class=""><button data-clog-type="w3-button" class="w3-button w3-ripple w3-border w3-black" data-clog-name="left-button-1" style="box-sizing: content-box; position: static;" data-on-click="(replace-center (create-main-panel panel))">Main Panel</button><button data-clog-type="w3-button" class="w3-button w3-ripple w3-border w3-black" data-clog-name="left-button-2" style="box-sizing: content-box; position: static;" data-on-click="(replace-center (create-next-panel panel))">Next Panel</button></div></div>

View file

@ -0,0 +1,36 @@
(in-package :<%= (@ sys-name) %>)
(defclass left-panel (clog:clog-panel)
((left-button-2 :reader left-button-2)
(left-button-1 :reader left-button-1) (app-menu :reader app-menu)
(left-bounds :reader left-bounds)))
(defun create-left-panel
(clog-obj &key (hidden nil) (class nil) (html-id nil) (auto-place t))
(let ((panel
(change-class
(clog:create-div clog-obj :content
"<div style=\"box-sizing: content-box; position: absolute; left: 0px; top: 0px; width: 194px; height: 367.017px;\" id=\"CLOGB3869833761\" data-clog-name=\"left-bounds\"><div style=\"width: 175px; height: 100%; display: flex; flex-direction: column; box-sizing: content-box; position: static;\" class=\"\" id=\"CLOGB3869833762\" data-clog-name=\"app-menu\"><button class=\"w3-button w3-ripple w3-border w3-black\" style=\"box-sizing: content-box; position: static;\" id=\"CLOGB3869833763\" data-clog-name=\"left-button-1\">Main Panel</button><button class=\"w3-button w3-ripple w3-border w3-black\" style=\"box-sizing: content-box; position: static;\" id=\"CLOGB3869833764\" data-clog-name=\"left-button-2\">Next Panel</button></div></div>"
:hidden hidden :class class :html-id html-id
:auto-place auto-place)
'left-panel)))
(setf (slot-value panel 'left-button-2)
(attach-as-child clog-obj "CLOGB3869833764" :clog-type
'clog:clog-button :new-id t))
(setf (slot-value panel 'left-button-1)
(attach-as-child clog-obj "CLOGB3869833763" :clog-type
'clog:clog-button :new-id t))
(setf (slot-value panel 'app-menu)
(attach-as-child clog-obj "CLOGB3869833762" :clog-type
'clog:clog-div :new-id t))
(setf (slot-value panel 'left-bounds)
(attach-as-child clog-obj "CLOGB3869833761" :clog-type
'clog:clog-div :new-id t))
(clog:set-on-click (left-button-1 panel)
(lambda (target)
(declare (ignorable target))
(replace-center (create-main-panel panel))))
(clog:set-on-click (left-button-2 panel)
(lambda (target)
(declare (ignorable target))
(replace-center (create-next-panel panel))))
panel))

View file

@ -0,0 +1 @@
<data id="I3869693078" data-in-package="<%= (@ sys-name) %>" data-custom-slots="" data-clog-next-id="3" data-clog-title="main-panel"></data><div data-clog-type="w3-container" class="w3-container w3-card-2" data-clog-name="main-container" style="width: 300px; height: 150px; box-sizing: content-box; position: relative;">Hello World<button data-clog-type="button" data-clog-name="next-button" style="box-sizing: content-box; position: absolute; left: 110px; top: 90px;" data-on-click="(replace-element panel (create-next-panel panel))">Next Panel</button></div>

View file

@ -0,0 +1,24 @@
(in-package :<%= (@ sys-name) %>)
(defclass main-panel (clog:clog-panel)
((next-button :reader next-button)
(main-container :reader main-container)))
(defun create-main-panel
(clog-obj &key (hidden nil) (class nil) (html-id nil) (auto-place t))
(let ((panel
(change-class
(clog:create-div clog-obj :content
"<div class=\"w3-container w3-card-2\" style=\"width: 300px; height: 150px; box-sizing: content-box; position: relative;\" id=\"CLOGB3869692796\" data-clog-name=\"main-container\">Hello World<button style=\"box-sizing: content-box; position: absolute; left: 110px; top: 90px;\" id=\"CLOGB3869692797\" data-clog-name=\"next-button\">Next Panel</button></div>"
:hidden hidden :class class :html-id html-id
:auto-place auto-place)
'main-panel)))
(setf (slot-value panel 'next-button)
(attach-as-child clog-obj "CLOGB3869692797" :clog-type
'clog:clog-button :new-id t))
(setf (slot-value panel 'main-container)
(attach-as-child clog-obj "CLOGB3869692796" :clog-type
'clog:clog-div :new-id t))
(clog:set-on-click (next-button panel)
(lambda (target)
(declare (ignorable target))
(replace-element panel (create-next-panel panel))))
panel))

View file

@ -0,0 +1 @@
<data id="I3869693014" data-in-package="<%= (@ sys-name) %>" data-custom-slots="" data-clog-next-id="3" data-clog-title="next-panel"></data><div data-clog-type="w3-container" class="w3-container w3-card-2" data-clog-name="next-container" style="width: 300px; height: 150px; box-sizing: content-box; position: relative;">Next Panel<button data-clog-type="button" data-clog-name="next-button" style="box-sizing: content-box; position: absolute; left: 110px; top: 90px;" data-on-click="(replace-element panel (create-main-panel panel))">Go to Main</button></div>

View file

@ -0,0 +1,24 @@
(in-package :<%= (@ sys-name) %>)
(defclass next-panel (clog:clog-panel)
((next-button :reader next-button)
(next-container :reader next-container)))
(defun create-next-panel
(clog-obj &key (hidden nil) (class nil) (html-id nil) (auto-place t))
(let ((panel
(change-class
(clog:create-div clog-obj :content
"<div class=\"w3-container w3-card-2\" style=\"width: 300px; height: 150px; box-sizing: content-box; position: relative;\" id=\"CLOGB38696928071\" data-clog-name=\"next-container\">Next Panel<button style=\"box-sizing: content-box; position: absolute; left: 110px; top: 90px;\" id=\"CLOGB3869692808\" data-clog-name=\"next-button\">Go to Main</button></div>"
:hidden hidden :class class :html-id html-id
:auto-place auto-place)
'next-panel)))
(setf (slot-value panel 'next-button)
(attach-as-child clog-obj "CLOGB3869692808" :clog-type
'clog:clog-button :new-id t))
(setf (slot-value panel 'next-container)
(attach-as-child clog-obj "CLOGB38696928071" :clog-type
'clog:clog-div :new-id t))
(clog:set-on-click (next-button panel)
(lambda (target)
(declare (ignorable target))
(replace-element panel (create-main-panel panel))))
panel))

View file

@ -0,0 +1 @@
<data id="I3869812961" data-in-package="<%= (@ sys-name) %>" data-custom-slots="" data-clog-next-id="2" data-clog-title="right-panel"></data><div data-clog-type="div" data-clog-name="right-bounds" style="box-sizing: content-box; position: absolute; left: 0px; top: 0px; height: 100%;"></div>

View file

@ -0,0 +1,16 @@
(in-package :<%= (@ sys-name) %>)
(defclass right-panel (clog:clog-panel) ((div-1 :reader div-1)))
(defun create-right-panel
(clog-obj &key (hidden nil) (class nil) (html-id nil) (auto-place t))
(let ((panel
(change-class
(clog:create-div clog-obj :content
"<div id=\"CLOGB38698129071\" style=\"box-sizing: content-box; position: absolute; left: 0px; top: 0px; height: 100%;\" data-clog-name=\"div-1\"></div>"
:hidden hidden :class class :html-id html-id
:auto-place auto-place)
'right-panel)))
(setf (slot-value panel 'div-1)
(attach-as-child clog-obj "CLOGB38698129071" :clog-type
'clog:clog-div :new-id t))
panel))

View file

@ -0,0 +1,26 @@
(asdf:defsystem #:<%= (@ sys-name) %>
:description "New CLOG System"
:author "some@one.com"
:license "BSD"
:version "0.0.0"
:serial t
:entry-point "<%= (@ sys-name) %>:start-app"
:depends-on (#:clog) ; add clog plugins here as #:plugin for run time
:components ((:file "<%= (@ sys-name) %>")
(:file "main")
(:file "next")
(:file "top")
(:file "foot")
(:file "left")
(:file "right")))
(asdf:defsystem #:<%= (@ sys-name) %>/tools
:defsystem-depends-on (:clog)
:depends-on (#:<%= (@ sys-name) %> #:clog/tools) ; add clog plugins here as #:plugin/tools for design time
:components ((:clog-file "main")
(:clog-file "next")
(:clog-file "top")
(:clog-file "foot")
(:clog-file "left")
(:clog-file "right")))

View file

@ -0,0 +1,31 @@
(defpackage #:<%= (@ sys-name) %>
(:use #:cl #:clog #:clog-web)
(:export start-app))
(in-package :<%= (@ sys-name) %>)
(defun on-new-window (body)
(debug-mode body)
;; Add the clog-web look and feel
(clog-web-initialize body)
(let ((layout (create-panel-box-layout body :top-height 0
:left-width 0
:bottom-height 0
:right-width 0)))
(setf (connection-data-item body "layout") layout)
(create-top-panel (top-panel layout))
(create-foot-panel (bottom-panel layout))
(create-left-panel (left-panel layout))
(create-right-panel (right-panel layout))
(create-main-panel (center-panel layout))
(fit-layout layout)))
(defun replace-center (obj)
(let ((layout (connection-data-item obj "layout")))
(replace-children (center-panel layout) obj)))
(defun start-app ()
(initialize 'on-new-window
:static-root (merge-pathnames "./www/"
(asdf:system-source-directory :<%= (@ sys-name) %>)))
(open-browser))

View file

@ -0,0 +1 @@
<data id="I3869785126" data-in-package="<%= (@ sys-name) %>" data-custom-slots="" data-clog-next-id="6" data-clog-title="top-panel"></data><div data-clog-type="div" data-clog-name="top-bounds" style="box-sizing: content-box; position: absolute; width: 100%; height: 65.4943px;"><div data-clog-type="w3-container" class="w3-container w3-card-2" data-clog-name="app-header" style="width: 100%; height: 50px; box-sizing: content-box; position: absolute;"><img src="/img/clogicon.png" alt="Add image url" data-clog-type="image" data-clog-name="app-image" style="box-sizing: content-box; position: absolute; left: 4.99715px; top: 10px;"><div data-clog-type="div" data-clog-name="app-title" style="box-sizing: content-box; position: absolute; left: 57.9986px; top: 5px;" class="w3-xlarge">My App</div></div></div>

View file

@ -0,0 +1,27 @@
(in-package :<%= (@ sys-name) %>)
(defclass top-panel (clog:clog-panel)
((app-title :reader app-title) (app-image :reader app-image)
(app-header :reader app-header) (top-bounds :reader top-bounds)))
(defun create-top-panel
(clog-obj &key (hidden nil) (class nil) (html-id nil) (auto-place t))
(let ((panel
(change-class
(clog:create-div clog-obj :content
"<div id=\"CLOGB38697849925\" style=\"box-sizing: content-box; position: absolute; width: 100%; height: 65.4943px;\" data-clog-name=\"top-bounds\"><div class=\"w3-container w3-card-2\" style=\"width: 100%; height: 50px; box-sizing: content-box; position: absolute;\" id=\"CLOGB3869784706\" data-clog-name=\"app-header\"><img src=\"/img/clogicon.png\" alt=\"Add image url\" style=\"box-sizing: content-box; position: absolute; left: 4.99715px; top: 10px;\" id=\"CLOGB3869784707\" data-clog-name=\"app-image\"><div style=\"box-sizing: content-box; position: absolute; left: 57.9986px; top: 5px;\" class=\"w3-xlarge\" id=\"CLOGB3869784708\" data-clog-name=\"app-title\">My App</div></div></div>"
:hidden hidden :class class :html-id html-id
:auto-place auto-place)
'top-panel)))
(setf (slot-value panel 'app-title)
(attach-as-child clog-obj "CLOGB3869784708" :clog-type
'clog:clog-div :new-id t))
(setf (slot-value panel 'app-image)
(attach-as-child clog-obj "CLOGB3869784707" :clog-type
'clog:clog-img :new-id t))
(setf (slot-value panel 'app-header)
(attach-as-child clog-obj "CLOGB3869784706" :clog-type
'clog:clog-div :new-id t))
(setf (slot-value panel 'top-bounds)
(attach-as-child clog-obj "CLOGB38697849925" :clog-type
'clog:clog-div :new-id t))
panel))

View file

@ -2270,36 +2270,41 @@
(list
'(:name "CLOG Builder - Panel Projects"
:code :group)
'(:name "New Builder Panel Project"
'(:name "Center Panel Project"
:code "nbp"
:type :system
:www "templates/www/"
:loc "templates/projects/clog-panel/")
'(:name "Full screen/browser Panel Project"
:code "nfp"
:type :system
:www "templates/www/"
:loc "templates/projects/full-screen/")
'(:name "CLOG - General Projects"
:code :group)
'(:name "New CLOG Basic HTML Project"
'(:name "Basic HTML Project"
:code "ncp"
:type :system
:www "templates/www/"
:loc "templates/projects/clog/")
'(:name "New CLOG-GUI Project"
'(:name "CLOG-GUI Project"
:code "ncgp"
:type :system
:www "templates/www/"
:loc "templates/projects/clog-gui/")
'(:name "New CLOG-WEB Project"
'(:name "CLOG-WEB Project"
:code "ncwp"
:type :system
:www "templates/www/"
:loc "templates/projects/clog-web/")
'(:name "New CLOG-WEB-SITE Project"
'(:name "CLOG-WEB-SITE Project"
:code "ncws"
:type :system
:www "templates/www/"
:loc "templates/projects/clog-web-site/")
'(:name "CLOG/CLOG Builder - Extension Projects"
:code :group)
'(:name "New CLOG/CLOG-Builder Plugin Project"
'(:name "CLOG/CLOG Builder Plugin Project"
:code "ncplug"
:type :system
:www "templates/www/"