diff --git a/clog-element.lisp b/clog-element.lisp index 84b5036..c75c405 100644 --- a/clog-element.lisp +++ b/clog-element.lisp @@ -176,7 +176,18 @@ HTML-ID must be unique.")) ;;;;;;;;;;;;;;;; (defgeneric access-key (clog-element) - (:documentation "Get/Setf access-key.")) + (:documentation "Get/Setf access-key. Used for hot key access to element. +[special key] + Access_Key + + The [special key] per browser and platform is: + + Browser Windows Linux Mac + ----------------- ------- ----- --- + Internet Explorer [Alt] N/A N/A + Chrome [Alt] [Alt] [Control][Alt] + Firefox [Alt][Shift] [Alt][Shift] [Control][Alt] + Safari [Alt] N/A [Control][Alt] + Opera 15+ [Alt] [Alt] [Alt]")) (defmethod access-key ((obj clog-element)) (property obj "accessKey")) @@ -193,7 +204,8 @@ HTML-ID must be unique.")) ;;;;;;;;;;;;;;;;;;;; (defgeneric advisory-title (clog-element) - (:documentation "Get/Setf advisory-title.")) + (:documentation "Get/Setf advisory title of Element, usually +used for body and image maps.")) (defmethod advisory-title ((obj clog-element)) (property obj "title")) @@ -210,7 +222,9 @@ HTML-ID must be unique.")) ;;;;;;;;;;;;;;;; (defgeneric class-name (clog-element) - (:documentation "Get/Setf class-name.")) + (:documentation "Get/Setf class-name. CSS Class name, can be multiple +seperated by . See add-class, remove-class and toggle-class methods +for adding and removing individual or groups of classes in an easier way.")) (defmethod class-name ((obj clog-element)) (property obj "className")) @@ -227,7 +241,8 @@ HTML-ID must be unique.")) ;;;;;;;;;;;;;;; (defgeneric editablep (clog-element) - (:documentation "Get/Setf editable.")) + (:documentation "Get/Setf editable. This will make almost any element with +content editable, even non-form types in most browsers.")) (defmethod editablep ((obj clog-element)) (js-true-p (property obj "isContentEditable"))) @@ -244,7 +259,10 @@ HTML-ID must be unique.")) ;;;;;;;;;;;;;;;; (defgeneric draggablep (clog-element) - (:documentation "Get/Setf draggablep.")) + (:documentation "Get/Setf draggablep. In order to make an object draggable +in addition to Draggable being true the on-drag-start event _must_ be bound +as well to set the drag-text. To receive a drop, you need to bind on-drop. +See clog-base.lisp")) (defmethod draggablep ((obj clog-element)) (js-true-p (property obj "draggable"))) @@ -261,7 +279,10 @@ HTML-ID must be unique.")) ;;;;;;;;;;;;; (defgeneric hiddenp (clog-element) - (:documentation "Get/Setf hiddenp.")) + (:documentation "Get/Setf hiddenp. The hidden property will make an element +invisible, however unlike visiblep, hiddenp implies the element is semantically +not relevant not just visually and will _also_ remove it from layout similar to +setting display (None).")) (defmethod hiddenp ((obj clog-element)) (js-true-p (property obj "hidden"))) @@ -273,12 +294,42 @@ HTML-ID must be unique.")) (setf (property obj "hidden") (p-true-js value))) (defsetf hiddenp set-hiddenp) +;;;;;;;;;;;;;; +;; visiblep ;; +;;;;;;;;;;;;;; + +(defgeneric visiblep (clog-element) + (:documentation "Get/Setf visiblep. This will cause the Element to no longer +be visible but it will still take up space where it was in the layout. Use +hiddenp to also remove from layout. +Note: that each property, visiblep, hiddenp and display (None) all work + independantly and do not reflect the actual client side visual state + but the property state. To check if an object is for sure not visible + would require checking all three properties.")) + +(defmethod visiblep ((obj clog-element)) + (equalp (property obj "visibility") "visible")) + +(defgeneric set-visiblep (clog-element value) + (:documentation "Set visiblep VALUE for CLOG-ELEMENT")) + +(defmethod set-visiblep ((obj clog-element) value) + (if value + (setf (property obj "visibility") "visible") + (setf (property obj "visibility") "hidden"))) +(defsetf visiblep set-visiblep) + ;;;;;;;;;;;;;;;; ;; inner-html ;; ;;;;;;;;;;;;;;;; (defgeneric inner-html (clog-element) - (:documentation "Get/Setf inner-html.")) + (:documentation "Get/Setf inner-html. This will completely replace the inner +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.")) (defmethod inner-html ((obj clog-element)) (jquery-query obj "html()")) @@ -295,7 +346,8 @@ HTML-ID must be unique.")) ;;;;;;;;;;;;;;;; (defgeneric outer-html (clog-element) - (:documentation "Get/Setf outer-html.")) + (:documentation "Get/Setf outer-html. Returns the HTML for Element and all +its contents")) (defmethod outer-html ((obj clog-element)) (query obj "outerHTML")) @@ -305,7 +357,8 @@ HTML-ID must be unique.")) ;;;;;;;;;;;;;;;;; (defgeneric spellcheckp (clog-element) - (:documentation "Get/Setf spellcheckp.")) + (:documentation "Get/Setf spellcheckp. If true Element is subject to browser +spell checking if Editable is also true.")) (defmethod spellcheckp ((obj clog-element)) (js-true-p (property obj "spellcheck"))) @@ -339,7 +392,11 @@ HTML-ID must be unique.")) ;;;;;;;;;; (defgeneric text (clog-element) - (:documentation "Get/Setf text.")) + (:documentation "Get/Setf text. + +Text Content - Text content is the content contained by the + tag. This should not be confused with the + 'Value' of a Form Tag. (See clog-form.lisp)")) (defmethod text ((obj clog-element)) (jquery-query obj "text()")) @@ -358,7 +415,7 @@ HTML-ID must be unique.")) (deftype text-direction-type () '(member :ltr :rtl)) (defgeneric text-direction (clog-element) - (:documentation "Get/Setf text-direction.")) + (:documentation "Get/Setf BiDi text-direction.")) (defmethod text-direction ((obj clog-element)) (property obj "dir")) @@ -392,7 +449,8 @@ HTML-ID must be unique.")) ;;;;;;;;;;;;;;;;; (defgeneric client-left (clog-element) - (:documentation "Get client-left.")) + (:documentation "Get client-left. The width of the left border of an element +in pixels. It does not include the margin or padding.")) (defmethod client-left ((obj clog-element)) (property obj "clientLeft")) @@ -402,37 +460,43 @@ HTML-ID must be unique.")) ;;;;;;;;;;;;;;;; (defgeneric client-top (clog-element) - (:documentation "Get client-top.")) + (:documentation "Get client-top. The width of the top border of an element +in pixels. It does not include the margin or padding.")) (defmethod client-top ((obj clog-element)) (property obj "clientTop")) -;;;;;;;;;;;;;;;;;;; -;; client-bottom ;; -;;;;;;;;;;;;;;;;;;; - -(defgeneric client-bottom (clog-element) - (:documentation "Get client-bottom.")) - -(defmethod client-bottom ((obj clog-element)) - (property obj "clientBottom")) - ;;;;;;;;;;;;;;;;;; -;; client-right ;; +;; client-width ;; ;;;;;;;;;;;;;;;;;; -(defgeneric client-right (clog-element) - (:documentation "Get client-right.")) +(defgeneric client-width (clog-element) + (:documentation "Get client-width. Inner width of an element in pixels. +CSS width + CSS padding - width of vertical scrollbar (if present) +Does not include the border or margin.")) -(defmethod client-right ((obj clog-element)) - (property obj "clientRight")) +(defmethod client-width ((obj clog-element)) + (property obj "clientWidth")) + +;;;;;;;;;;;;;;;;;;; +;; client-height ;; +;;;;;;;;;;;;;;;;;;; + +(defgeneric client-height (clog-element) + (:documentation "Get client-right. Inner height of an element in pixels. +CSS height + CSS padding - height of horizontal scrollbar (if present) +Does not include the border or margin.")) + +(defmethod client-height ((obj clog-element)) + (property obj "clientHeight")) ;;;;;;;;;;;;;;;;; ;; offset-left ;; ;;;;;;;;;;;;;;;;; (defgeneric offset-left (clog-element) - (:documentation "Get offset-left.")) + (:documentation "Get offset-left. The width from parent element border to +child border left.")) (defmethod offset-left ((obj clog-element)) (property obj "offsetLeft")) @@ -442,37 +506,41 @@ HTML-ID must be unique.")) ;;;;;;;;;;;;;;;; (defgeneric offset-top (clog-element) - (:documentation "Get offset-top.")) + (:documentation "Get offset-top. The width from parent element border to +child border top.")) (defmethod offset-top ((obj clog-element)) (property obj "offsetTop")) -;;;;;;;;;;;;;;;;;;; -;; offset-bottom ;; -;;;;;;;;;;;;;;;;;;; - -(defgeneric offset-bottom (clog-element) - (:documentation "Get offset-bottom.")) - -(defmethod offset-bottom ((obj clog-element)) - (property obj "offsetBottom")) - ;;;;;;;;;;;;;;;;;; -;; offset-right ;; +;; offset-width ;; ;;;;;;;;;;;;;;;;;; -(defgeneric offset-right (clog-element) - (:documentation "Get offset-right.")) +(defgeneric offset-width (clog-element) + (:documentation "Get offset-width. CSS width + CSS padding + width of +vertical scrollbar (if present) + Border")) -(defmethod offset-right ((obj clog-element)) - (property obj "offsetRight")) +(defmethod offset-width ((obj clog-element)) + (property obj "offsetWidth")) + +;;;;;;;;;;;;;;;;;;; +;; offset-height ;; +;;;;;;;;;;;;;;;;;;; + +(defgeneric offset-height (clog-element) + (:documentation "Get offset-height. CSS height + CSS padding + height of +horizontal scrollbar (if present) + Border")) + +(defmethod offset-height ((obj clog-element)) + (property obj "offsetHeight")) ;;;;;;;;;;;;;;;;; ;; scroll-left ;; ;;;;;;;;;;;;;;;;; (defgeneric scroll-left (clog-element) - (:documentation "Get scroll-left.")) + (:documentation "Get scroll-left. The number of pixels that an element's +content is scrolled to the left. For RTL languages is negative.")) (defmethod scroll-left ((obj clog-element)) (property obj "scrollLeft")) @@ -489,7 +557,8 @@ HTML-ID must be unique.")) ;;;;;;;;;;;;;;;; (defgeneric scroll-top (clog-element) - (:documentation "Get scroll-top.")) + (:documentation "Get scroll-top. The number of pixels that an element's +content has been scrolled upward.")) (defmethod scroll-top ((obj clog-element)) (property obj "scrollTop")) @@ -501,25 +570,27 @@ HTML-ID must be unique.")) (setf (property obj "scrollTop") value)) (defsetf scroll-top set-scroll-top) -;;;;;;;;;;;;;;;;;;; -;; scroll-bottom ;; -;;;;;;;;;;;;;;;;;;; - -(defgeneric scroll-bottom (clog-element) - (:documentation "Get scroll-bottom.")) - -(defmethod scroll-bottom ((obj clog-element)) - (property obj "scrollBottom")) - ;;;;;;;;;;;;;;;;;; -;; scroll-right ;; +;; scroll-width ;; ;;;;;;;;;;;;;;;;;; -(defgeneric scroll-right (clog-element) - (:documentation "Get scroll-right.")) +(defgeneric scroll-width (clog-element) + (:documentation "Get scroll-width. Either the width in pixels of the content +of an element or the width of the element itself, whichever is greater.")) -(defmethod scroll-right ((obj clog-element)) - (property obj "scrollRight")) +(defmethod scroll-width ((obj clog-element)) + (property obj "scrollWidth")) + +;;;;;;;;;;;;;;;;;;; +;; scroll-height ;; +;;;;;;;;;;;;;;;;;;; + +(defgeneric scroll-height (clog-element) + (:documentation "Get scroll-height. Height of an element's content, including +content not visible on the screen due to overflow.")) + +(defmethod scroll-height ((obj clog-element)) + (property obj "scrollHeight")) ;;;;;;;;;;;;;; ;; html-tag ;; @@ -543,7 +614,9 @@ HTML-ID must be unique.")) (deftype box-sizing-type () '(member :content-box :border-box)) (defgeneric box-sizing (clog-element) - (:documentation "Get/Setf box-sizing.")) + (:documentation "Get/Setf box-sizing. Affects if height and width +properteries represent just the content or the border, marging, padding, +scroll and conent area as a whole. The default is content-box")) (defmethod box-sizing ((obj clog-element)) (style obj "box-sizing")) @@ -563,7 +636,8 @@ HTML-ID must be unique.")) '(member :none :left :right :both :inline-start :inline-end)) (defgeneric clear-side (clog-element) - (:documentation "Get/Setf clear-side.")) + (:documentation "Get/Setf clear-side. When using 'float' for layout sets +if the right or left side of block should be clear of any 'floated' Element.")) (defmethod clear-side ((obj clog-element)) (style obj "clear")) @@ -603,7 +677,25 @@ elements wrap around it.")) (deftype display-type () '(member :none :block :inline :inline-block :flex)) (defgeneric display (clog-element) - (:documentation "Get/Setf display.")) + (:documentation "Get/Setf display. Display sets the CSS Display property that +handles how elements are treated by the browser layout engine. + + Common Values: + + none - Remove Element from layout but remain in the DOM this is + similar to hiddenp, but not like visiblep that makes the + element not visible but still take up space in layout. + + block - Displays an element starting on a new line and stretches + out to the left and right as far as it can. e.g.
by + default + + inline - Wraps with text in a paragraph. e.g. by default + + inline-block - Flows with paragraph but will always fill from left to + right. + + flex - Use the flexbox model")) (defmethod display ((obj clog-element)) (style obj "display")) @@ -622,7 +714,8 @@ elements wrap around it.")) (deftype overflow-type () '(member :visible :hidden :clip :scroll :auto)) (defgeneric overflow (clog-element) - (:documentation "Get/Setf overflow.")) + (:documentation "Get/Setf overflow. How to handle overflow of contents of +an element's box. The default is visible - no clipping.")) (defmethod overflow ((obj clog-element)) (style obj "overflow")) @@ -641,7 +734,8 @@ elements wrap around it.")) (deftype overflow-x-type () '(member :visible :hidden :clip :scroll :auto)) (defgeneric overflow-x (clog-element) - (:documentation "Get/Setf overflow-x.")) + (:documentation "Get/Setf overflow-x. How to handle overflow of contents of +an element's box for X. The default is Visible - no clipping.")) (defmethod overflow-x ((obj clog-element)) (style obj "overflow-x")) @@ -660,7 +754,8 @@ elements wrap around it.")) (deftype overflow-y-type () '(member :visible :hidden :clip :scroll :auto)) (defgeneric overflow-y (clog-element) - (:documentation "Get/Setf overflow-y.")) + (:documentation "Get/Setf overflow-y. How to handle overflow of contents of +an element's box for Y. The default is Visible - no clipping.")) (defmethod overflow-y ((obj clog-element)) (style obj "overflow-y")) @@ -677,7 +772,9 @@ elements wrap around it.")) ;;;;;;;;;;;;; (defgeneric z-index (clog-element) - (:documentation "Get/Setf z-index.")) + (:documentation "Get/Setf z-index. Set stack order of element. +Note: z-index only works on Elements with Position Type of absolute, + relative and fixed.")) (defmethod z-index ((obj clog-element)) (style obj "z-index")) @@ -693,10 +790,12 @@ elements wrap around it.")) ;; resizable ;; ;;;;;;;;;;;;;;; -(deftype resizable-type () '(member :none :both :horizontal :vertical :block :inline)) +(deftype resizable-type () + '(member :none :both :horizontal :vertical :block :inline)) (defgeneric resizable (clog-element) - (:documentation "Get/Setf resizable.")) + (:documentation "Get/Setf resizable. If overflow is not set to visible, +resizeable sets if element can be resized by user.")) (defmethod resizable ((obj clog-element)) (style obj "resize")) @@ -715,7 +814,16 @@ elements wrap around it.")) (deftype positioning-type () '(member :static :relative :absolute :sticky :fixed)) (defgeneric positioning (clog-element) - (:documentation "Get/Setf positioning.")) + (:documentation "Get/Setf positioning. Determins how the properties left, right, +top and bottom are interpreted. + + Static - According to document flow, position properties have no + affect. + Absolute - Position properties are relative to the first non-static + element in the DOM before Element + Fixed - Position properties are relative to browser window + Relative - Position properties are relative to where the static position + of the element would in the normal document flow.")) (defmethod positioning ((obj clog-element)) (style obj "position")) @@ -842,7 +950,7 @@ parent in the DOM.")) ;;;;;;;;;;;;;;;; (defgeneric box-height (clog-element) - (:documentation "Get/Setf box-height.")) + (:documentation "Get/Setf box-height. Height based on box sizing.")) (defmethod box-height ((obj clog-element)) (style obj "height")) @@ -859,7 +967,7 @@ parent in the DOM.")) ;;;;;;;;;;;;;;; (defgeneric box-width (clog-element) - (:documentation "Get/Setf box-width.")) + (:documentation "Get/Setf box-width. Width based on box sizing.")) (defmethod box-width ((obj clog-element)) (style obj "width")) @@ -956,31 +1064,19 @@ parent in the DOM.")) (setf (style obj "max-height") value)) (defsetf maximum-height set-maximum-height) -;;;;;;;;;;;;;; -;; visiblep ;; -;;;;;;;;;;;;;; - -(defgeneric visiblep (clog-element) - (:documentation "Get/Setf visiblep.")) - -(defmethod visiblep ((obj clog-element)) - (equalp (property obj "visibility") "visible")) - -(defgeneric set-visiblep (clog-element value) - (:documentation "Set visiblep VALUE for CLOG-ELEMENT")) - -(defmethod set-visiblep ((obj clog-element) value) - (if value - (setf (property obj "visibility") "visible") - (setf (property obj "visibility") "hidden"))) -(defsetf visiblep set-visiblep) +;; For reference: +;; | Margin | Border | Padding | Scroll | [Element] | Scroll | Padding ... +;; +;; Height and Width of Element are in part of clog-base +;; All the following have the advantage of the CSS related size properties +;; in that the results are always pixels and numeric. ;;;;;;;;;;;;;;;;;; ;; inner-height ;; ;;;;;;;;;;;;;;;;;; (defgeneric inner-height (clog-element) - (:documentation "Get/Setf inner-height.")) + (:documentation "Get/Setf inner-height. Includes padding but not border.")) (defmethod inner-height ((obj clog-element)) (jquery-query obj "innerHeight()")) @@ -997,7 +1093,7 @@ parent in the DOM.")) ;;;;;;;;;;;;;;;;; (defgeneric inner-width (clog-element) - (:documentation "Get/Setf inner-width.")) + (:documentation "Get/Setf inner-width. Includes padding but not border.")) (defmethod inner-width ((obj clog-element)) (jquery-query obj "innerWidth()")) @@ -1014,7 +1110,7 @@ parent in the DOM.")) ;;;;;;;;;;;;;;;;;; (defgeneric outer-height (clog-element) - (:documentation "Get outer-height.")) + (:documentation "Get outer-height. Includes padding and border but not margin.")) (defmethod outer-height ((obj clog-element)) (jquery-query obj "outerHeight()")) @@ -1024,7 +1120,7 @@ parent in the DOM.")) ;;;;;;;;;;;;;;;;; (defgeneric outer-width (clog-element) - (:documentation "Get outer-width.")) + (:documentation "Get outer-width. Includes padding and border but not margin.")) (defmethod outer-width ((obj clog-element)) (jquery-query obj "outerWidth()")) @@ -1034,7 +1130,7 @@ parent in the DOM.")) ;;;;;;;;;;;;;;;;;;;;;;;;;;;; (defgeneric outer-height-to-margin (clog-element) - (:documentation "Get outer-height-to-margin.")) + (:documentation "Get outer-height-to-margin. Includes padding and border and margin.")) (defmethod outer-height-to-margin ((obj clog-element)) (jquery-query obj "outerHeight(true)")) @@ -1044,7 +1140,7 @@ parent in the DOM.")) ;;;;;;;;;;;;;;;;;;;;;;;;;;; (defgeneric outer-width-to-margin (clog-element) - (:documentation "Get outer-width-to-margin.")) + (:documentation "Get outer-width-to-margin. Includes padding and border and margin.")) (defmethod outer-width-to-margin ((obj clog-element)) (jquery-query obj "outerWidth(true)")) @@ -1087,6 +1183,8 @@ parent in the DOM.")) ;; background-attachment ;; ;;;;;;;;;;;;;;;;;;;;;;;;;;; +(deftype background-attachment-type () '(member :scroll :fixed :local)) + (defgeneric background-attachment (clog-element) (:documentation "Get/Setf background-attachment.")) @@ -1122,7 +1220,8 @@ parent in the DOM.")) ;;;;;;;;;;;;;;;;;;;;;; (defgeneric background-image (clog-element) - (:documentation "Get/Setf background-image url.")) + (:documentation "Get/Setf background-image url. proper syntax is +'url(...)' | nil to clear")) (defmethod background-image ((obj clog-element)) (style obj "background-image")) @@ -1141,7 +1240,8 @@ parent in the DOM.")) ;;;;;;;;;;;;;;;;;;;;;;;;; (defgeneric background-position (clog-element) - (:documentation "Get/Setf background-position.")) + (:documentation "Get/Setf background-position. combination of 2 - +left/right/center/top/bottom | %x %y | x y")) (defmethod background-position ((obj clog-element)) (style obj "background-position")) @@ -1157,8 +1257,12 @@ parent in the DOM.")) ;; background-origin ;; ;;;;;;;;;;;;;;;;;;;;;;; +(deftype background-origin-type () + '(member :border-box :padding-box :content-box)) + (defgeneric background-origin (clog-element) - (:documentation "Get/Setf background-origin.")) + (:documentation "Get/Setf background-origin. Background position property +is relative to origin of: padding-box|border-box|content-box")) (defmethod background-origin ((obj clog-element)) (style obj "background-origin")) @@ -1174,8 +1278,12 @@ parent in the DOM.")) ;; background-repeat ;; ;;;;;;;;;;;;;;;;;;;;;;; +(deftype background-repeat-type () + '(member :repeat-x :repeat-y :repeat :space :round :no-repeat)) + (defgeneric background-repeat (clog-element) - (:documentation "Get/Setf background-repeat.")) + (:documentation "Get/Setf background-repeat. repeat-x | repeat-y | +[ repeat | space | round | no-repeat ]{1,2}")) (defmethod background-repeat ((obj clog-element)) (style obj "background-repeat")) @@ -1191,8 +1299,12 @@ parent in the DOM.")) ;; background-clip ;; ;;;;;;;;;;;;;;;;;;;;; +(deftype background-clip-type () + '(member :border-box :padding-box :content-box :text)) + (defgeneric background-clip (clog-element) - (:documentation "Get/Setf background-clip.")) + (:documentation "Get/Setf background-clip. If an element's background extends +underneath its border box, padding box, or content box.")) (defmethod background-clip ((obj clog-element)) (style obj "background-clip")) @@ -1209,7 +1321,7 @@ parent in the DOM.")) ;;;;;;;;;;;;;;;;;;;;; (defgeneric background-size (clog-element) - (:documentation "Get/Setf background-size.")) + (:documentation "Get/Setf background-size. auto | w h | % = cover of parent | contain")) (defmethod background-size ((obj clog-element)) (style obj "background-size")) @@ -1225,18 +1337,25 @@ parent in the DOM.")) ;; border ;; ;;;;;;;;;;;; +(deftype border-style-type () + '(member :none :hidden :dotted :dashed :solid :double :groove :ridge :inset :outset)) + (defgeneric border (clog-element) - (:documentation "Get/Setf border.")) + (:documentation "Get border. ")) (defmethod border ((obj clog-element)) (style obj "border")) -(defgeneric set-border (clog-element value) - (:documentation "Set border VALUE for CLOG-ELEMENT")) +;;;;;;;;;;;;;;;; +;; set-border ;; +;;;;;;;;;;;;;;;; -(defmethod set-border ((obj clog-element) value) - (setf (style obj "border") value)) -(defsetf border set-border) +(defgeneric set-border (clog-element line-width line-style line-color) + (:documentation "Set border width style and color. +line-width - size or medium|thin|thick|length|initial|inherit")) + +(defmethod set-border ((obj clog-element) line-width line-style line-color) + (setf (style obj "border") (format nil "~A ~A ~A" line-width line-style line-color))) ;;;;;;;;;;;;;;;;;;; ;; border-radius ;; @@ -1266,7 +1385,7 @@ parent in the DOM.")) (style obj "box-shadow")) (defgeneric set-box-shadow (clog-element value) - (:documentation "Set box-shadow VALUE for CLOG-ELEMENT")) + (:documentation "Set box-shadow. See https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Background_and_Borders/Box-shadow_generator")) (defmethod set-box-shadow ((obj clog-element) value) (setf (style obj "box-shadow") value)) @@ -1276,51 +1395,62 @@ parent in the DOM.")) ;; outline ;; ;;;;;;;;;;;;; -(defgeneric outline (clog-element) - (:documentation "Get/Setf outline.")) +(deftype outline-style-type () + '(member :none :hidden :dotted :dashed :solid :double + :groove :ridge :inset :outset)) -(defmethod border ((obj clog-element)) +(defgeneric outline (clog-element) + (:documentation "Get outline. ")) + +(defmethod outline ((obj clog-element)) (style obj "outline")) -(defgeneric set-outline (clog-element value) - (:documentation "Set outline VALUE for CLOG-ELEMENT")) +;;;;;;;;;;;;;;;;; +;; set-outline ;; +;;;;;;;;;;;;;;;;; -(defmethod set-outline ((obj clog-element) value) - (setf (style obj "outline") value)) -(defsetf outline set-outline) +(defgeneric set-outline (clog-element line-color line-style line-width) + (:documentation "Set outline +line-width - size or medium|thin|thick|length|initial|inherit")) + +(defmethod set-outline ((obj clog-element) line-color line-style line-width) + (setf (style obj "outline") (format nil "~A ~A ~A" line-color line-style line-width))) ;;;;;;;;;;;; ;; margin ;; ;;;;;;;;;;;; (defgeneric margin (clog-element) - (:documentation "Get/Setf margin.")) + (:documentation "Get margin.")) (defmethod margin ((obj clog-element)) (style obj "margin")) -(defgeneric set-margin (clog-element value) - (:documentation "Set margin VALUE for CLOG-ELEMENT")) +;;;;;;;;;;;;;;;; +;; set-margin ;; +;;;;;;;;;;;;;;;; -(defmethod set-margin ((obj clog-element) value) - (setf (style obj "margin") value)) -(defsetf margin set-margin) +(defgeneric set-margin (clog-element top right bottom left) + (:documentation "Set margins, Each can be - |auto|initial|inherit")) + +(defmethod set-margin ((obj clog-element) top right bottom left) + (setf (style obj "margin") (format nil "~A ~A ~A ~A" top right bottom left))) ;;;;;;;;;;;;; ;; padding ;; ;;;;;;;;;;;;; (defgeneric padding (clog-element) - (:documentation "Get/Setf padding.")) + (:documentation "Get padding.")) (defmethod padding ((obj clog-element)) (style obj "padding")) -(defgeneric set-padding (clog-element value) - (:documentation "Set padding VALUE for CLOG-ELEMENT")) +(defgeneric set-padding (clog-element top right bottom left) + (:documentation "Set padding. Each can be - |initial|inherit")) -(defmethod set-padding ((obj clog-element) value) - (setf (style obj "padding") value)) +(defmethod set-padding ((obj clog-element) top right bottom left) + (setf (style obj "padding") (format nil "~A ~A ~A ~A" top right bottom left))) (defsetf padding set-padding) ;;;;;;;;;;;; @@ -1328,7 +1458,11 @@ parent in the DOM.")) ;;;;;;;;;;;; (defgeneric cursor (clog-element) - (:documentation "Get/Setf cursor.")) + (:documentation "Get/Setf cursor. Sets the cursor to a standard type or an +image if set to url(url_to_image). When using a url is best to suggest an +alternate cursor, e.g. 'url(url_to_image),auto' +A list of standard cursor types can be found at: + http://www.w3schools.com/cssref/pr_class_cursor.asp")) (defmethod cursor ((obj clog-element)) (style obj "cursor")) @@ -1344,18 +1478,46 @@ parent in the DOM.")) ;; font ;; ;;;;;;;;;; +(deftype font-style-type () '(member :normal :italic :unique)) + +(deftype font-variant-type () '(member :normal :small-caps)) + (defgeneric font (clog-element) (:documentation "Get/Setf font.")) (defmethod font ((obj clog-element)) (style obj "font")) -(defgeneric set-font (clog-element value) - (:documentation "Set font VALUE for CLOG-ELEMENT")) +(defgeneric set-font + (clog-element font-style font-variant font-weight font-height font-family) +(:documentation "Set font.")) -(defmethod set-font ((obj clog-element) value) - (setf (style obj "font") value)) -(defsetf font set-font) +(defmethod set-font + ((obj clog-element) + font-style font-variant font-weight font-height font-family) + (setf (style obj "font") + (format nil "~A ~A ~A ~A ~A" + font-style font-variant font-weight font-height font-family))) + +;;;;;;;;;;;;;;;;;;;; +;; text-alignment ;; +;;;;;;;;;;;;;;;;;;;; + +(deftype text-alignment-type () + '(member :start :end :left :right :center :justify :match-parent)) + +(defgeneric text-alignment (clog-element) + (:documentation "Get/Setf text-alignment.")) + +(defmethod text-alignment ((obj clog-element)) + (style obj "text-align")) + +(defgeneric set-text-alignment (clog-element value) + (:documentation "Set text-alignment VALUE for CLOG-ELEMENT")) + +(defmethod set-text-alignment ((obj clog-element) value) + (setf (style obj "text-align") value)) +(defsetf text-alignment set-text-alignment) ;;;;;;;;;;;;;;;;;;;; ;; vertical-align ;; @@ -1444,9 +1606,8 @@ html id than Element_Type will have an ID of undefined and therefore attached to no actual HTML elemen.")) (defmethod first-child ((obj clog-element)) - (make-clog-element - (connection-id obj) - (jquery-execute obj (format nil "children().first().attr('id');")))) + (attach-as-child + obj (jquery-execute obj (format nil "children().first().attr('id');")))) ;;;;;;;;;;;;;;;;;; ;; next-sibling ;; @@ -1458,6 +1619,4 @@ html id than Element_Type will have an ID of undefined and therefore attached to no actual HTML elemen.")) (defmethod next-sibling ((obj clog-element)) - (make-clog-element - (connection-id obj) - (jquery-execute obj (format nil "next().attr('id');")))) + (attach-as-child obj (jquery-execute obj (format nil "next().attr('id');")))) diff --git a/clog.lisp b/clog.lisp index dc80449..fa72310 100644 --- a/clog.lisp +++ b/clog.lisp @@ -125,6 +125,7 @@ application." (class-name generic-function) (editablep generic-function) (draggablep generic-function) + (visiblep generic-function) (hiddenp generic-function) (inner-html generic-function) (outer-html generic-function) @@ -136,75 +137,89 @@ application." (language-code generic-function) (client-left generic-function) (client-top generic-function) - (client-bottom generic-function) - (client-right generic-function) + (client-width generic-function) + (client-height generic-function) (offset-left generic-function) (offset-top generic-function) - (offset-bottom generic-function) - (offset-right generic-function) + (offset-width generic-function) + (offset-height generic-function) (html-tag generic-function) "CLOG-Element - Styles" - (box-sizing-type type) - (box-sizing generic-function) - (clear-side-type type) - (clear-side generic-function) - (float-wrap-type type) - (float-wrap generic-function) - (display-type type) - (display generic-function) - (overflow-type type) - (overflow generic-function) - (overflow-x-type type) - (overflow-x generic-function) - (overflow-y-type type) - (overflow-y generic-function) - (z-index generic-function) - (resizable-type type) - (resizable generic-function) - (position-type type) - (positioning generic-function) - (position-top generic-function) - (position-left generic-function) - (offset-top generic-function) - (offset-left generic-function) - (left generic-function) - (top generic-function) - (right generic-function) - (bottom generic-function) - (box-height generic-function) - (box-width generic-function) - (maximum-height generic-function) - (maximum-width generic-function) - (minimum-height generic-function) - (minimum-width generic-function) - (visiblep generic-function) - (inner-height generic-function) - (inner-width generic-function) - (outer-height generic-function) - (outer-width generic-function) - (outer-height-to-margin generic-function) - (outer-width-to-margin generic-function) - (color generic-function) - (opacity generic-function) - (background-attachment generic-function) - (background-color generic-function) - (background-image generic-function) - (background-position generic-function) - (background-origin generic-function) - (background-repeat generic-function) - (background-clip generic-function) - (background-size generic-function) - (border generic-function) - (border-radius generic-function) - (box-shadow generic-function) - (outline generic-function) - (margin generic-function) - (padding generic-function) - (cursor generic-function) - (font generic-function) - (vertical-align-type type) - (vertical-align generic-function) + (box-sizing-type type) + (box-sizing generic-function) + (clear-side-type type) + (clear-side generic-function) + (float-wrap-type type) + (float-wrap generic-function) + (display-type type) + (display generic-function) + (overflow-type type) + (overflow generic-function) + (overflow-x-type type) + (overflow-x generic-function) + (overflow-y-type type) + (overflow-y generic-function) + (z-index generic-function) + (resizable-type type) + (resizable generic-function) + (position-type type) + (positioning generic-function) + (position-top generic-function) + (position-left generic-function) + (offset-top generic-function) + (offset-left generic-function) + (left generic-function) + (top generic-function) + (right generic-function) + (bottom generic-function) + (box-height generic-function) + (box-width generic-function) + (maximum-height generic-function) + (maximum-width generic-function) + (minimum-height generic-function) + (minimum-width generic-function) + (inner-height generic-function) + (inner-width generic-function) + (outer-height generic-function) + (outer-width generic-function) + (outer-height-to-margin generic-function) + (outer-width-to-margin generic-function) + (color generic-function) + (opacity generic-function) + (background-attachment-type type) + (background-attachment generic-function) + (background-color generic-function) + (background-image generic-function) + (background-position generic-function) + (background-origin-type type) + (background-origin generic-function) + (background-repeat-type type) + (background-repeat generic-function) + (background-clip-type type) + (background-clip generic-function) + (background-size generic-function) + (border-style-type type) + (border generic-function) + (set-border generic-function) + (border-radius generic-function) + (box-shadow generic-function) + (outline-style-type type) + (outline generic-function) + (set-outline generic-function) + (margin generic-function) + (set-margin generic-function) + (padding generic-function) + (set-padding generic-function) + (cursor generic-function) + (font-style-type type) + (font-variant-type type) + (font generic-function) + (set-font generic-function) + (text-alignment-type type) + (text-alignment generic-function) + (vertical-align-type type) + (vertical-align generic-function) "CLOG-Element - Methods" (add-class generic-function) diff --git a/doc/clog-manual.html b/doc/clog-manual.html index 3520029..e95ee01 100644 --- a/doc/clog-manual.html +++ b/doc/clog-manual.html @@ -610,7 +610,19 @@ and if :AUTO-PLACE (default t) place-inside-bottom-of CLOG-OB

  • [generic-function] ACCESS-KEY CLOG-ELEMENT

    -

    Get/Setf access-key.

    • +

    Get/Setf access-key. Used for hot key access to element. +[special key][] + Access_Key

    + +

    The [special key][] per browser and platform is:

    + +
    Browser              Windows       Linux           Mac
+-----------------    -------       -----           ---
+Internet Explorer     [Alt]         N/A            N/A
+Chrome                [Alt]        [Alt]     [Control][Alt]
+Firefox           [Alt][Shift] [Alt][Shift]  [Control][Alt]
+Safari                [Alt]         N/A      [Control][Alt]
+Opera 15+             [Alt]        [Alt]          [Alt]
+

@@ -618,7 +630,8 @@ and if :AUTO-PLACE (default t) place-inside-bottom-of CLOG-OB

  • [generic-function] ADVISORY-TITLE CLOG-ELEMENT

    -

    Get/Setf advisory-title.

    • +

    Get/Setf advisory title of Element, usually +used for body and image maps.

@@ -626,7 +639,9 @@ and if :AUTO-PLACE (default t) place-inside-bottom-of CLOG-OB

  • [generic-function] CLASS-NAME CLOG-ELEMENT

    -

    Get/Setf class-name.

    • +

    Get/Setf class-name. CSS Class name, can be multiple +seperated by . See add-class, remove-class and toggle-class methods +for adding and removing individual or groups of classes in an easier way.

@@ -634,7 +649,8 @@ and if :AUTO-PLACE (default t) place-inside-bottom-of CLOG-OB

  • [generic-function] EDITABLEP CLOG-ELEMENT

    -

    Get/Setf editable.

    • +

    Get/Setf editable. This will make almost any element with +content editable, even non-form types in most browsers.

@@ -642,7 +658,24 @@ and if :AUTO-PLACE (default t) place-inside-bottom-of CLOG-OB

  • [generic-function] DRAGGABLEP CLOG-ELEMENT

    -

    Get/Setf draggablep.

    • +

    Get/Setf draggablep. In order to make an object draggable +in addition to Draggable being true the on-drag-start event must be bound +as well to set the drag-text. To receive a drop, you need to bind on-drop. +See clog-base.lisp

    +
+ +

+ +
    +

  • [generic-function] VISIBLEP CLOG-ELEMENT

    + +

    Get/Setf visiblep. This will cause the Element to no longer +be visible but it will still take up space where it was in the layout. Use +hiddenp to also remove from layout. +Note: that each property, visiblep, hiddenp and display (None) all work + independantly and do not reflect the actual client side visual state + but the property state. To check if an object is for sure not visible + would require checking all three properties.

@@ -650,7 +683,10 @@ and if :AUTO-PLACE (default t) place-inside-bottom-of CLOG-OB

  • [generic-function] HIDDENP CLOG-ELEMENT

    -

    Get/Setf hiddenp.

    • +

    Get/Setf hiddenp. The hidden property will make an element +invisible, however unlike visiblep, hiddenp implies the element is semantically +not relevant not just visually and will also remove it from layout similar to +setting display (None).

@@ -658,7 +694,12 @@ and if :AUTO-PLACE (default t) place-inside-bottom-of CLOG-OB

  • [generic-function] INNER-HTML CLOG-ELEMENT

    -

    Get/Setf inner-html.

    • +

    Get/Setf inner-html. This will completely replace the inner +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.

@@ -666,7 +707,8 @@ and if :AUTO-PLACE (default t) place-inside-bottom-of CLOG-OB

  • [generic-function] OUTER-HTML CLOG-ELEMENT

    -

    Get/Setf outer-html.

    • +

    Get/Setf outer-html. Returns the HTML for Element and all +its contents

@@ -674,7 +716,8 @@ and if :AUTO-PLACE (default t) place-inside-bottom-of CLOG-OB

  • [generic-function] SPELLCHECKP CLOG-ELEMENT

    -

    Get/Setf spellcheckp.

    • +

    Get/Setf spellcheckp. If true Element is subject to browser +spell checking if Editable is also true.

@@ -690,7 +733,11 @@ and if :AUTO-PLACE (default t) place-inside-bottom-of CLOG-OB

  • [generic-function] TEXT CLOG-ELEMENT

    -

    Get/Setf text.

    • +

    Get/Setf text.

    + +

    Text Content - Text content is the content contained by the + tag. This should not be confused with the + 'Value' of a Form Tag. (See clog-form.lisp)

@@ -704,7 +751,7 @@ and if :AUTO-PLACE (default t) place-inside-bottom-of CLOG-OB

  • [generic-function] TEXT-DIRECTION CLOG-ELEMENT

    -

    Get/Setf text-direction.

    • +

    Get/Setf BiDi text-direction.

@@ -720,7 +767,8 @@ and if :AUTO-PLACE (default t) place-inside-bottom-of CLOG-OB

  • [generic-function] CLIENT-LEFT CLOG-ELEMENT

    -

    Get client-left.

    • +

    Get client-left. The width of the left border of an element +in pixels. It does not include the margin or padding.

@@ -728,23 +776,28 @@ and if :AUTO-PLACE (default t) place-inside-bottom-of CLOG-OB

  • [generic-function] CLIENT-TOP CLOG-ELEMENT

    -

    Get client-top.

    • +

    Get client-top. The width of the top border of an element +in pixels. It does not include the margin or padding.

-

+

    -

  • [generic-function] CLIENT-BOTTOM CLOG-ELEMENT

    +

  • [generic-function] CLIENT-WIDTH CLOG-ELEMENT

    -

    Get client-bottom.

    • +

    Get client-width. Inner width of an element in pixels. +CSS width + CSS padding - width of vertical scrollbar (if present) +Does not include the border or margin.

-

+

    -

  • [generic-function] CLIENT-RIGHT CLOG-ELEMENT

    +

  • [generic-function] CLIENT-HEIGHT CLOG-ELEMENT

    -

    Get client-right.

    • +

    Get client-right. Inner height of an element in pixels. +CSS height + CSS padding - height of horizontal scrollbar (if present) +Does not include the border or margin.

@@ -763,20 +816,22 @@ and if :AUTO-PLACE (default t) place-inside-bottom-of CLOG-OB

Position in pixels from top relative to the document.

-

+

    -

  • [generic-function] OFFSET-BOTTOM CLOG-ELEMENT

    +

  • [generic-function] OFFSET-WIDTH CLOG-ELEMENT

    -

    Get offset-bottom.

    • +

    Get offset-width. CSS width + CSS padding + width of +vertical scrollbar (if present) + Border

-

+

    -

  • [generic-function] OFFSET-RIGHT CLOG-ELEMENT

    +

  • [generic-function] OFFSET-HEIGHT CLOG-ELEMENT

    -

    Get offset-right.

    • +

    Get offset-height. CSS height + CSS padding + height of +horizontal scrollbar (if present) + Border

@@ -800,7 +855,9 @@ and if :AUTO-PLACE (default t) place-inside-bottom-of CLOG-OB

  • [generic-function] BOX-SIZING CLOG-ELEMENT

    -

    Get/Setf box-sizing.

    • +

    Get/Setf box-sizing. Affects if height and width +properteries represent just the content or the border, marging, padding, +scroll and conent area as a whole. The default is content-box

@@ -814,7 +871,8 @@ and if :AUTO-PLACE (default t) place-inside-bottom-of CLOG-OB

  • [generic-function] CLEAR-SIDE CLOG-ELEMENT

    -

    Get/Setf clear-side.

    • +

    Get/Setf clear-side. When using 'float' for layout sets +if the right or left side of block should be clear of any 'floated' Element.

@@ -843,7 +901,26 @@ elements wrap around it.

  • [generic-function] DISPLAY CLOG-ELEMENT

    -

    Get/Setf display.

    • +

    Get/Setf display. Display sets the CSS Display property that +handles how elements are treated by the browser layout engine.

    + +
    Common Values:
+
+none         - Remove Element from layout but remain in the DOM this is
+               similar to hiddenp, but not like visiblep that makes the
+               element not visible but still take up space in layout.
+
+block        - Displays an element starting on a new line and stretches
+               out to the left and right as far as it can. e.g. <div> by
+               default
+
+inline       - Wraps with text in a paragraph. e.g. <span> by default
+
+inline-block - Flows with paragraph but will always fill from left to
+               right.
+
+flex         - Use the flexbox model
+

@@ -857,7 +934,8 @@ elements wrap around it.

  • [generic-function] OVERFLOW CLOG-ELEMENT

    -

    Get/Setf overflow.

    • +

    Get/Setf overflow. How to handle overflow of contents of +an element's box. The default is visible - no clipping.

@@ -871,7 +949,8 @@ elements wrap around it.

  • [generic-function] OVERFLOW-X CLOG-ELEMENT

    -

    Get/Setf overflow-x.

    • +

    Get/Setf overflow-x. How to handle overflow of contents of +an element's box for X. The default is Visible - no clipping.

@@ -885,7 +964,8 @@ elements wrap around it.

  • [generic-function] OVERFLOW-Y CLOG-ELEMENT

    -

    Get/Setf overflow-y.

    • +

    Get/Setf overflow-y. How to handle overflow of contents of +an element's box for Y. The default is Visible - no clipping.

@@ -893,7 +973,9 @@ elements wrap around it.

  • [generic-function] Z-INDEX CLOG-ELEMENT

    -

    Get/Setf z-index.

    • +

    Get/Setf z-index. Set stack order of element. +Note: z-index only works on Elements with Position Type of absolute, + relative and fixed.

@@ -907,7 +989,8 @@ elements wrap around it.

  • [generic-function] RESIZABLE CLOG-ELEMENT

    -

    Get/Setf resizable.

    • +

    Get/Setf resizable. If overflow is not set to visible, +resizeable sets if element can be resized by user.

@@ -921,7 +1004,16 @@ elements wrap around it.

  • [generic-function] POSITIONING CLOG-ELEMENT

    -

    Get/Setf positioning.

    • +

    Get/Setf positioning. Determins how the properties left, right, +top and bottom are interpreted.

    + +

    Static - According to document flow, position properties have no + affect. + Absolute - Position properties are relative to the first non-static + element in the DOM before Element + Fixed - Position properties are relative to browser window + Relative - Position properties are relative to where the static position + of the element would in the normal document flow.

@@ -995,7 +1087,7 @@ parent in the DOM.

  • [generic-function] BOX-HEIGHT CLOG-ELEMENT

    -

    Get/Setf box-height.

    • +

    Get/Setf box-height. Height based on box sizing.

@@ -1003,7 +1095,7 @@ parent in the DOM.

  • [generic-function] BOX-WIDTH CLOG-ELEMENT

    -

    Get/Setf box-width.

    • +

    Get/Setf box-width. Width based on box sizing.

@@ -1038,14 +1130,6 @@ parent in the DOM.

Get/Setf minimum-width.

-

- -
    -

  • [generic-function] VISIBLEP CLOG-ELEMENT

    - -

    Get/Setf visiblep.

    • -
-

    @@ -1083,7 +1167,7 @@ parent in the DOM.

    • [generic-function] OUTER-HEIGHT-TO-MARGIN CLOG-ELEMENT

      -

      Get outer-height-to-margin.

      • +

      Get outer-height-to-margin. Includes padding and border and margin.

    @@ -1091,7 +1175,7 @@ parent in the DOM.

    • [generic-function] OUTER-WIDTH-TO-MARGIN CLOG-ELEMENT

      -

      Get outer-width-to-margin.

      • +

      Get outer-width-to-margin. Includes padding and border and margin.

    @@ -1110,6 +1194,12 @@ parent in the DOM.

    Get/Setf opacity.

+

+ + +

    @@ -1131,7 +1221,8 @@ parent in the DOM.

    • [generic-function] BACKGROUND-IMAGE CLOG-ELEMENT

      -

      Get/Setf background-image url.

      • +

      Get/Setf background-image url. proper syntax is +'url(...)' | nil to clear

    @@ -1139,7 +1230,14 @@ parent in the DOM.

    • [generic-function] BACKGROUND-POSITION CLOG-ELEMENT

      -

      Get/Setf background-position.

      • +

      Get/Setf background-position. combination of 2 - +left/right/center/top/bottom | %x %y | x y

      +
    + +

    + +

    @@ -1147,7 +1245,14 @@ parent in the DOM.

    • [generic-function] BACKGROUND-ORIGIN CLOG-ELEMENT

      -

      Get/Setf background-origin.

      • +

      Get/Setf background-origin. Background position property +is relative to origin of: padding-box|border-box|content-box

      +
    + +

    + +

    @@ -1155,7 +1260,14 @@ parent in the DOM.

    • [generic-function] BACKGROUND-REPEAT CLOG-ELEMENT

      -

      Get/Setf background-repeat.

      • +

      Get/Setf background-repeat. repeat-x | repeat-y | +[ repeat | space | round | no-repeat ][]{1,2}

      +
    + +

    + +

    @@ -1163,7 +1275,8 @@ parent in the DOM.

    • [generic-function] BACKGROUND-CLIP CLOG-ELEMENT

      -

      Get/Setf background-clip.

      • +

      Get/Setf background-clip. If an element's background extends +underneath its border box, padding box, or content box.

    @@ -1171,7 +1284,13 @@ parent in the DOM.

    • [generic-function] BACKGROUND-SIZE CLOG-ELEMENT

      -

      Get/Setf background-size.

      • +

      Get/Setf background-size. auto | w h | % = cover of parent | contain

      +
    + +

    + +

    @@ -1179,7 +1298,16 @@ parent in the DOM.

    • [generic-function] BORDER CLOG-ELEMENT

      -

      Get/Setf border.

      • +

      Get border.

      +
    + +

    + +
      +

    • [generic-function] SET-BORDER CLOG-ELEMENT LINE-WIDTH LINE-STYLE LINE-COLOR

      + +

      Set border width style and color. +line-width - size or medium|thin|thick|length|initial|inherit

    @@ -1198,12 +1326,27 @@ parent in the DOM.

    Get/Setf box-shadow.

+

+ + +

  • [generic-function] OUTLINE CLOG-ELEMENT

    -

    Get/Setf outline.

    • +

    Get outline.

    +
+ +

+ +
    +

  • [generic-function] SET-OUTLINE CLOG-ELEMENT LINE-COLOR LINE-STYLE LINE-WIDTH

    + +

    Set outline +line-width - size or medium|thin|thick|length|initial|inherit

@@ -1211,7 +1354,15 @@ parent in the DOM.

  • [generic-function] MARGIN CLOG-ELEMENT

    -

    Get/Setf margin.

    • +

    Get margin.

    +
+ +

+ +
    +

  • [generic-function] SET-MARGIN CLOG-ELEMENT TOP RIGHT BOTTOM LEFT

    + +

    Set margins, Each can be - |auto|initial|inherit

@@ -1219,7 +1370,15 @@ parent in the DOM.

  • [generic-function] PADDING CLOG-ELEMENT

    -

    Get/Setf padding.

    • +

    Get padding.

    +
+ +

+ +
    +

  • [generic-function] SET-PADDING CLOG-ELEMENT TOP RIGHT BOTTOM LEFT

    + +

    Set padding. Each can be - |initial|inherit

@@ -1227,7 +1386,23 @@ parent in the DOM.

  • [generic-function] CURSOR CLOG-ELEMENT

    -

    Get/Setf cursor.

    • +

    Get/Setf cursor. Sets the cursor to a standard type or an +image if set to url(url_to_image). When using a url is best to suggest an +alternate cursor, e.g. 'url(url_to_image),auto' +A list of standard cursor types can be found at: + http://www.w3schools.com/cssref/pr_class_cursor.asp

    +
+ +

+ + + +

+ +

@@ -1238,6 +1413,28 @@ parent in the DOM.

Get/Setf font.

+

+ +
    +

  • [generic-function] SET-FONT CLOG-ELEMENT FONT-STYLE FONT-VARIANT FONT-WEIGHT FONT-HEIGHT FONT-FAMILY

    + +

    Set font.

    • +
+ +

+ + + +

+ +
    +

  • [generic-function] TEXT-ALIGNMENT CLOG-ELEMENT

    + +

    Get/Setf text-alignment.

    • +
+

    diff --git a/test/test-clog.lisp b/test/test-clog.lisp index 214e6ca..fbff016 100644 --- a/test/test-clog.lisp +++ b/test/test-clog.lisp @@ -24,9 +24,10 @@ (setf (box-sizing tmp) :border-box) (setf (width tmp) 300) (setf (height tmp) 50) - (setf (border (create-child win + (set-border (create-child win (format nil "

    ~A

    " - (gethash "connection-id" (connection-data win))))) "4px dotted blue") + (gethash "connection-id" (connection-data win)))) + "4px" :dotted "blue") (setf *last-obj* (create-child win "")) (set-on-mouse-enter *last-obj* (lambda ()