[variable] *STATIC-ROOT* NIL
+[variable] *STATIC-ROOT* NIL
Contains the static-root setting after initialization.
[variable] *CLOG-PORT* 8080
+[variable] *CLOG-PORT* 8080
Port this instance of clog was started on
ON-NEW-WINDOW-HANDLER and
[function] OPEN-BROWSER &KEY (URL (FORMAT NIL "http://127.0.0.1:~A" *CLOG-PORT*))
[function] OPEN-BROWSER &KEY (URL (FORMAT NIL "http://127.0.0.1:~A" *CLOG-PORT*))
Launch on os a web browser on local machine to URL. See OPEN-WINDOW
for openning windows on remote machines.
[variable] *STORE-NEW-OBJECTS* NIL
Dynamic variable that when true every create-* or attach-* will also -create a connection-data-item keyed by the html-id
CLOG Element Objects is the base class for all html element objects.
-CLOG-Element - Low Level Creation
+CLOG-Element - Low Level
Create a new CLOG-ELEMENT or sub-type of CLOG-TYPE from HTML
as child of CLOG-OBJ and if :AUTO-PLACE (default t) place-inside-bottom-of
CLOG-OBJ, you can also set auto-place to :bottom or :top. If HTML-ID is nil one
-will be generated. If auto-place is nil, note that if browser-gc is called
-or clog-connect:*browser-gc-on-ping* is t the browser side will be destroyed.
HTML-ID. The HTML-ID m
must be in DOM, ie placed or auto-placed. If new-id is true the HTML-ID
after attachment is changed to one unique to this session.
+
+[generic-function] DESTROY-CHILDREN CLOG-ELEMENT
+ +Destroy all children in DOM contained with in CLOG-ELEMENT
+and run a BROWSER-GC
CLOG-Element - DOM Placement
@@ -1384,7 +1393,8 @@ html of an element. This will remove any Elements within Element from the DOM. If those elements were created in CLOG they are still available and can be placed in the DOM again using the placement methods. However if they were created through html writes or otherwise not assigned an ID by CLOG, they are -lost forever. +lost forever. IfBROWSER-GC is called at any point, the elements will be
+destroyed from the browser and placement methods will no longer have an affect.
@@ -1662,9 +1672,15 @@ flex - Turn this item in to a flexbox container. The flexbox
:space-around ( - - - )
:space-evenly ( - - - )
+For info on using grids see:
+https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_grid_layout
+
grid - Turn this item in to a grid container block level. The grid
properties to adjust for container are:
+ Tip - 1 1 1 1 = repeat(4,1fr) also minmax()
+
+ grid-template
grid-template-columns
grid-template-rows
grid-template-areas
@@ -1680,10 +1696,15 @@ grid - Turn this item in to a grid container block level. The grid
The properties to adjust for grid items is:
+ Tip - 1 / 4 means from 1 to 4
+
+ grid-column
grid-column-start
grid-column-end
+ grid-row
grid-row-start
grid-row-end
+ grid-area
align-self
justify-self
@@ -1738,6 +1759,13 @@ flex-basis (default :auto = use width or height) for CLOG-ELEMENTGet/Setf direction of flexbox packing.
+
+[generic-function] GRID-TEMPLATE CLOG-ELEMENT
+ +Get/Setf grid-template.
CLOG-ELEMENTGet/Setf grid-auto-flow.
[generic-function] GRID-COLUMN CLOG-ELEMENT
+ +Get/Setf grid-column.
CLOG-ELEMENTGet/Setf grid-column-end.
[generic-function] GRID-ROW CLOG-ELEMENT
+ +Get/Setf grid-row.
CLOG-ELEMENTGet/Setf grid-row-end.
[generic-function] GRID-AREA CLOG-ELEMENT
+ +Get/Setf grid-area named or as +grid-row-start / grid-column-start / grid-row-end / grid-column-end
+ +e.g. 1 / 1 / 4 / 2
[generic-function] LEFT CLOG-WINDOW
+[generic-function] LEFT CLOG-ELEMENT
-Get/Setf browser x position.
Get/Setf left (defaults to us :px units).
[generic-function] TOP CLOG-WINDOW
+[generic-function] TOP CLOG-ELEMENT
-Get/Setf browser y postion.
Get/Setf top (defaults to use :px units).
[generic-function] INNER-HEIGHT CLOG-WINDOW
+[generic-function] INNER-HEIGHT CLOG-ELEMENT
-Get/Setf inner height of browser window.
Get/Setf inner-height. Includes padding but not border.
[generic-function] INNER-WIDTH CLOG-WINDOW
+[generic-function] INNER-WIDTH CLOG-ELEMENT
-Get/Setf inner width of browser window.
Get/Setf inner-width. Includes padding but not border.
[generic-function] OUTER-HEIGHT CLOG-WINDOW
+[generic-function] OUTER-HEIGHT CLOG-ELEMENT
-Get/Setf outer height of browser window.
Get outer-height. Includes padding and border but not +margin.
[generic-function] OUTER-WIDTH CLOG-WINDOW
+[generic-function] OUTER-WIDTH CLOG-ELEMENT
-Get/Setf outer width of browser window.
Get outer-width. Includes padding and border +but not margin.
[generic-function] REMOVE-FROM-DOM CLOG-ELEMENT
-Remove CLOG-Element from the DOM.
Remove CLOG-Element from the DOM. If object +is not stored in connection-data will become subject to browser-gc requests.
[generic-function] BROWSER-GC CLOG-ELEMENT
-Remove any clog cache items on browser not in DOM. +
Finalize any clog cache items on browser not in DOM. If clog-connect:*browser-gc-on-ping* is set this is done during websocket pings. -Care should be taken as any clog-element not placed in the DOM will be deleted -on the browser side (for examle :auto-place nil set and not later placed.) The main use is when clearing out large amounts of DOM objects not using CLOG -destroy.
DESTROY.
[generic-function] FIRST-CHILD CLOG-ELEMENT
+[generic-function] FIRST-CHILD CLOG-ELEMENT &KEY NO-ATTACH
Traverse to first child element. If Child does not have an
html id than Element_Type will have an ID of undefined and therefore attached
@@ -2504,7 +2558,7 @@ to no actual HTML element.
[generic-function] PREVIOUS-SIBLING CLOG-ELEMENT
+[generic-function] PREVIOUS-SIBLING CLOG-ELEMENT &KEY NO-ATTACH
Traverse to previous sibling element.
If Child does not have an html id than Element_Type will have an ID of
@@ -2513,12 +2567,22 @@ undefined and therefore attached to no actual HTML elemen.
[generic-function] NEXT-SIBLING CLOG-ELEMENT
+[generic-function] NEXT-SIBLING CLOG-ELEMENT &KEY NO-ATTACH
Traverse to next sibling element. If Child does not have an
html id than Element_Type will have an ID of undefined and therefore attached
to no actual HTML element.
[generic-function] LIST-OF-CHILDREN CLOG-ELEMENT &KEY NO-ATTACH
+ +Returns a list of child clog-element objects. If no-attach +is t they are only functional if there previously was an attach or was created +by CLOG, i.e. if just walking the DOM of existing clog-objects these are +like pointers.
@@ -3750,6 +3814,17 @@ is set to nil.
CLOG Panel Box Layout Objects.
[generic-function] ENVELOPE-PANEL CLOG-ELEMENT PANEL WIDTH HEIGHT &KEY CLASS STYLE UNITS
+ +Create a panel of WIDTH and HEIGHT with :relative
+positioning to envelope PANEL. This allows any type of clog-panel (including
+those created by CLOG Builder, to be positioned within DISPLAY :flex or
+:grid layouts or otherwise treat the panel as an inline object.
+Returns envelope-panel
Align children of CLOG-ELEMENT VERTICAL (default t)
and/or HORIZONTAL (default t). This will set the DISPLAY property of
-CLOG-ELEMENT to :FLEX. Note: if children of clog-element are using
-:absolute positioning they will not flow with flex and will not be
-centered. Using :relative wrapped in div with :static positioning will
-work. For example in CLOG Builder the panel is created in a static
-positioning panel, if all the contents are positioning in a div
-aboslute and that div is relative the expected bahvior of a centered
-panel will happen.
CLOG-ELEMENT to :FLEX.
+
+Note: if children of CLOG-ELEMENT are using :absolute positioning they will
+not flow with flex and will not be centered. Instead use :relative positioning.
Note: to use with CLOG Buider Panels - use ENVELOPE-PANEL or in the builder
+create a div at top:0 left:0 and size the div to be the boundaries of your panel
+to be centered, then set the positioning on the panel to :relative.
+Add all controls as child of that div.
[generic-function] CREATE-GUI-MENU-DROP-DOWN CLOG-GUI-MENU-BAR &KEY CONTENT CLASS HTML-ID
+[generic-function] CREATE-GUI-MENU-DROP-DOWN CLOG-GUI-MENU-BAR &KEY CONTENT CLASS HTML-ID RIGHT-ALIGN
Attached a menu bar drop-down to a CLOG-GUI-MENU-BAR
REWRITE-URL must be same dom
[generic-function] INNER-HEIGHT CLOG-WINDOW
+[generic-function] INNER-HEIGHT CLOG-ELEMENT
-Get/Setf inner height of browser window.
Get/Setf inner-height. Includes padding but not border.
[generic-function] INNER-WIDTH CLOG-WINDOW
+[generic-function] INNER-WIDTH CLOG-ELEMENT
-Get/Setf inner width of browser window.
Get/Setf inner-width. Includes padding but not border.
[generic-function] OUTER-HEIGHT CLOG-WINDOW
+[generic-function] OUTER-HEIGHT CLOG-ELEMENT
-Get/Setf outer height of browser window.
Get outer-height. Includes padding and border but not +margin.
[generic-function] OUTER-WIDTH CLOG-WINDOW
+[generic-function] OUTER-WIDTH CLOG-ELEMENT
-Get/Setf outer width of browser window.
Get outer-width. Includes padding and border +but not margin.
REWRITE-URL must be same dom
[generic-function] LEFT CLOG-WINDOW
+[generic-function] LEFT CLOG-ELEMENT
-Get/Setf browser x position.
Get/Setf left (defaults to us :px units).