diff --git a/Core/HtmlElement.dyalog b/Core/HtmlElement.dyalog index 8b78351d..67ce844b 100644 --- a/Core/HtmlElement.dyalog +++ b/Core/HtmlElement.dyalog @@ -70,6 +70,11 @@ r←0 2∊⍨10|⎕DR w ∇ + ∇ r←isNum w + :Access public shared + r←2|⎕DR w + ∇ + ∇ r←isString w :Access public shared :Select ≡w diff --git a/HTML/_DC/Icon.dyalog b/HTML/_DC/Icon.dyalog index 2d14c990..6409ccb3 100644 --- a/HTML/_DC/Icon.dyalog +++ b/HTML/_DC/Icon.dyalog @@ -38,8 +38,9 @@ :EndIf ∇ - ∇ r←Render;prefix;spec;icon;classes;n + ∇ r←Render;prefix;spec;icon;classes;n;origContent;origSpec;origClass :Access public + (origSpec origContent origClass)←Spec Content class Spec←eis Spec Spec,←eis Content Content←⍬ @@ -83,6 +84,7 @@ :EndIf SetUse r←⎕BASE.Render + (Spec Content class)←origSpec origContent((1+origClass≡UNDEF)⊃origClass'') ⍝ cannot just "unset" class ∇ SplitOn1st←{(l↑⍺)((l←⍺⍳⍵)↓⍺)} diff --git a/HTML/_JQ/jqTabs.dyalog b/HTML/_JQ/jqTabs.dyalog index 63daf3db..1a16ba5b 100644 --- a/HTML/_JQ/jqTabs.dyalog +++ b/HTML/_JQ/jqTabs.dyalog @@ -11,13 +11,30 @@ ⍝ Examples:: ⍝ jqTabs 'Title1' 'Title2' ⍝ jqTabs ('Title1' 'Title2')('Section1' 'Section2') -⍝ jqTabs 2 2⍴'Title1' 'Section1' 'Title2' 'Section2' +⍝ jqTabs 2 2⍴'Title1' 'Section1' 'Title2' 'Section2' + +⍝ Constructor:: [titles [sections]] | [titles_sections] +⍝ titles - vector of char vectors containing titles to appear on tabbed sections +⍝ sections - vector of vectors containing HTML content for each section +⍝ or URL pointing to content to load dynamically +⍝ titles_sections - 2-column matrix of titles [;1] and sections [;2] as above +⍝ or vector of 2 element title/section vectors +⍝ Public Fields:: +⍝ Titles - vector of char vectors containing titles to appear on tabbed sections +⍝ Sections - vector of vectors containing HTML content for each section +⍝ IsURL - scalar or vector indicating if a section is a URL default is 0 +⍝ Examples:: +⍝ jqTabs 'Title1' 'Title2' +⍝ jqTabs ('Title1' 'Title2')('Section1' 'Section2') +⍝ jqTabs 2 2⍴'Title1' 'Section1' 'Title2' 'Section2' :field public shared readonly DocBase←'https://jqueryui.com/tabs/' - :field public shared readonly IntEvt←'activate' 'beforeActivate' 'create' + :field public shared readonly IntEvt←'activate' 'beforeActivate' 'beforeLoad' 'create' 'load' :field public shared readonly ApiLevel←3 + :Field public Titles←0⍴⊂'' :Field public Sections←0⍴⊂'' + :Field public IsURL←⍬ ∇ Make :Access public @@ -52,4 +69,4 @@ Sections,←⊂content ∇ -:endclass \ No newline at end of file +:endclass diff --git a/HTML/_JS/jBox.dyalog b/HTML/_JS/jBox.dyalog index ed7fa0f8..81f43a56 100644 --- a/HTML/_JS/jBox.dyalog +++ b/HTML/_JS/jBox.dyalog @@ -52,7 +52,7 @@ 'Invalid jBox Type'⎕SIGNAL(ind>⍴Types)/11 Type←ind⊃Types Container.Content←Content - 'content'Set renderIt Message + 'content'Set renderIt New _.span Message BuildHTML←~0∊⍴Content :If 0<⍴Theme 'theme'Set Theme @@ -66,7 +66,8 @@ jb←New _.jBox'Notice'txt jb.ScriptOptions←0 0 0 :If 2=⎕NC'ColorOrOpts' - :AndIf 0' + p.Add'You can assign custom icons by setting the field "Icon"' + Add _.style ScriptFollows + ⍝ .custom-class {background-color: green;} + ⍝ .custom-class.dc-panel-title {background-color: lightgreen;} + ⍝ .custom-class.dc-panel-icon {color: white;} + p←Add _.Panel('' '.custom-class' 'Custom Class Example Title') + p.Icon←'fa-thumbs-up' + p.Add'You can assign your own classes and icons as well!' ∇ diff --git a/SampleMiSites/MS3/Examples/JS/jBoxAdvanced.mipage b/SampleMiSites/MS3/Examples/JS/jBoxAdvanced.mipage index 961d94c5..f32b0c55 100644 --- a/SampleMiSites/MS3/Examples/JS/jBoxAdvanced.mipage +++ b/SampleMiSites/MS3/Examples/JS/jBoxAdvanced.mipage @@ -2,17 +2,16 @@ ⍝ Control:: _JS.jBox ⍝ Description:: Tooltips and more - - - ∇ Compose;tab;jTab;dt;columns;ocw + ∇ Compose;tab;jTab;dt;columns;ocw;dd;daSpan;NiceDiv;t3 :Access public + + Use'faIcons' - Add _.Style'.demo'(('background-color' 'lightblue')('border' '1px solid gray')) + Use'dcPanel' ⍝ required by Panel that is used in callback function + Add _.style'.demo {border:2px dotted darkorange}' - Add _.Style'.tooltip'(('background-color' 'lightblue')('border' '1px solid gray')) (Add _.jBox).Selector←'.tooltip' - Add _.h2'jBox Widget - Advanced sample' Add _.h3'More fun with tooltips!' @@ -32,9 +31,7 @@ ⍝ here for a demo of Tooltips with titles! ⍝ We will be ⍝ re-using the configuration of the dd-Element (in the APL-Source) to reduce the # of JS-Calls. - - - + '.fa fa-thumbs-up fa-3x' 'style="color:green"'(NiceDiv←'#NiceDiv'Add _.div).Add _.i NiceDiv.Add'Wow! This larger, model tooltip features exciting HTML-Layout and lots of text. Everything is possible!...

' NiceDiv.Add'This tooltip will disappear on any click or also when you press the Esc-Key!
' @@ -57,79 +54,110 @@ 'closeOnClick'dd.Set _true Add _.h3'Confirmations' - '.demo'Add _.div'Click this div to get a prompt...' 'data-confirm="Are you sure?" onclick="alert(''Thanks for confirming!'');"' + '.demo'Add _.span'Click this text to get a prompt...' 'data-confirm="Are you sure?" onclick="alert(''Thanks for confirming!'');"' + Add _.br dd←Add _.jBox'Confirm' dd.ScriptOptions←1 0 0 ⍝[1] Wrap in