From 5aee9a57ecc02f3c40eb9faac2907778ee7bf51e Mon Sep 17 00:00:00 2001 From: michael Date: Sun, 30 Aug 2020 09:17:43 +0000 Subject: [PATCH] * Additional bootstrap demos --- demo/webwidget/widgets/demobootstrap.pp | 187 ++++++++++++++++++++++ demo/webwidget/widgets/frmdemo.pp | 2 +- demo/webwidget/widgets/webwidgetsdemo.lpi | 15 +- demo/webwidget/widgets/webwidgetsdemo.lpr | 2 +- demo/webwidget/widgets/widgetdemo.pp | 10 ++ demo/webwidget/widgets/widgetsdemo.html | 7 +- 6 files changed, 215 insertions(+), 8 deletions(-) create mode 100644 demo/webwidget/widgets/demobootstrap.pp diff --git a/demo/webwidget/widgets/demobootstrap.pp b/demo/webwidget/widgets/demobootstrap.pp new file mode 100644 index 0000000..a94453b --- /dev/null +++ b/demo/webwidget/widgets/demobootstrap.pp @@ -0,0 +1,187 @@ +unit demobootstrap; + +{$mode objfpc} + +interface + +uses + sysutils, web, js, webwidget, htmlwidgets, bootstrapwidgets, widgetdemo; + +Type + + { TSimpleToastWidgetDemo } + + TSimpleToastWidgetDemo = class(TDemoContainer) + public + class function WebWidgetClass: TCustomWebWidgetClass; override; + Procedure ShowDemo; override; + end; + + { TToastManagerDemo } + + TToastManagerDemo = class(TDemoContainer) + private + procedure DoShowToast(Sender: TObject; Event: TJSEvent); + Protected + FLabelClosable:TLabelWidget; + FLabelHeader:TLabelWidget; + FLabelBody:TLabelWidget; + FLabelContextual:TLabelWidget; + FHeader : TTextInputWidget; + FBody : TTextAreaWidget; + FContextual : TSelectWidget; + FClosable : TCheckboxInputWidget; + FShowButton: TBootstrapButton; + public + Class Function Demohelp : String; override; + Class Function Description : String; override; + class function WebWidgetClass: TCustomWebWidgetClass; override; + Function GetInspectorInstance: TObject; override; + Procedure ShowDemo; override; + end; + + + { TBootstrapButtonDemo } + + TBootstrapButtonDemo = class(TDemoContainer) + Private + public + class function WebWidgetClass: TCustomWebWidgetClass; override; + Procedure ShowDemo; override; + end; + +implementation + +{ TToastManagerDemo } + +procedure TToastManagerDemo.DoShowToast(Sender: TObject; Event: TJSEvent); + +Var + T : TContextual; +begin + if FContextual.SelectedIndex<>-1 then + T:=TContextual(FContextual.SelectedIndex) + else + T:=cNone; + TToastManager.Instance.ShowToast(FHeader.Value,FBody.Lines.text,T,FClosable.Checked); +end; + +class function TToastManagerDemo.Demohelp: String; +begin + Result:='Toast manager demo: click button to show a toast in the top-left corner'; +end; + +class function TToastManagerDemo.Description: String; +begin + Result:='Toast manager demo'; +end; + +class function TToastManagerDemo.WebWidgetClass: TCustomWebWidgetClass; +begin + Result:=Nil; +end; + +function TToastManagerDemo.GetInspectorInstance: TObject; +begin + Result:=TToastManager.Instance; +end; + +procedure TToastManagerDemo.ShowDemo; + +Var + T : TContextual; + R : TRowWidget; + C : TColWidget; + + Procedure AddRow; + begin + R:=TRowWidget.Create(Self); + R.Parent:=Self; + C:=TColWidget.Create(Self); + C.Parent:=R; + end; + +begin + inherited ShowDemo; + TToastManager.Instance.ParentID:='toastarea-stack'; + // Contextual + AddRow; + FLabelContextual:=TLabelWidget.Create(Self); + FLabelContextual.Text:='Contextual class for message'; + FContextual:=TSelectWidget.Create(Self); + For T in TContextual do + FContextual.Items.Add(ContextualNames[t]); + FContextual.SelectedIndex:=0; + FLabelContextual.LabelFor:=FContextual; + FLabelContextual.Parent:=C; + FContextual.Parent:=C; + FContextual.Classes:='form-control'; + // Header + AddRow; + FLabelHeader:=TLabelWidget.Create(Self); + FLabelHeader.Text:='Toast header'; + FHeader:=TTextInputWidget.Create(Self); + FHeader.Value:='The message title'; + FLabelHeader.LabelFor:=FHeader; + FLabelHeader.Parent:=C; + FHeader.Parent:=C; + FHeader.Classes:='form-control'; + // Body + AddRow; + FLabelBody:=TLabelWidget.Create(Self); + FLabelBody.Text:='Toast body'; + FBody:=TTextAreaWidget.Create(Self); + FBody.Lines.Text:='A nice message to show'; + FLabelBody.LabelFor:=FBody; + FLabelBody.Parent:=C; + FBody.Parent:=C; + FBody.Classes:='form-control'; + // Closable checkbox + AddRow; + FLabelClosable:=TLabelWidget.Create(Self); + FLabelClosable.Text:='Allow to close toast'; + FClosable:=TCheckboxInputWidget.Create(Self); + FClosable.Classes:='form-check-input'; + FLabelClosable.LabelFor:=FClosable; + FLabelClosable.Parent:=C; + FClosable.Parent:=C; + // button + AddRow; + FShowButton:=TBootstrapButton.Create(Self); + FShowButton.Text:='Show toast'; + FShowButton.Parent:=C; + FShowButton.OnClick:=@DoShowToast; + Refresh; +end; + +{ TBootstrapButtonDemo } + +class function TBootstrapButtonDemo.WebWidgetClass: TCustomWebWidgetClass; +begin + Result:=TBootstrapButton; +end; + +procedure TBootstrapButtonDemo.ShowDemo; +begin + inherited ShowDemo; + WidgetInstance.OnClick:=@DoClick; +end; + +{ TToastManagerDemo } + +class function TSimpleToastWidgetDemo.WebWidgetClass: TCustomWebWidgetClass; +begin + Result:=TSimpleToastWidget; +end; + +procedure TSimpleToastWidgetDemo.ShowDemo; +begin + inherited ShowDemo; +end; + +initialization + TBootstrapButtonDemo.RegisterDemo; + TSimpleToastWidgetDemo.RegisterDemo; + TToastManagerDemo.RegisterDemo; +end. + diff --git a/demo/webwidget/widgets/frmdemo.pp b/demo/webwidget/widgets/frmdemo.pp index a726bfc..ba587af 100644 --- a/demo/webwidget/widgets/frmdemo.pp +++ b/demo/webwidget/widgets/frmdemo.pp @@ -89,7 +89,7 @@ begin FContainer.ParentID:=SDemoContainerID; FContainer.Refresh; FContainer.ShowDemo; - FPropertyGrid.Subject:=FContainer.WidgetInstance; + FPropertyGrid.Subject:=FContainer.InspectorInstance; FPropertyGrid.LookupRoot:=FContainer; FPropertyGrid.Refresh; end; diff --git a/demo/webwidget/widgets/webwidgetsdemo.lpi b/demo/webwidget/widgets/webwidgetsdemo.lpi index d2546b4..9611a59 100644 --- a/demo/webwidget/widgets/webwidgetsdemo.lpi +++ b/demo/webwidget/widgets/webwidgetsdemo.lpi @@ -4,22 +4,23 @@ + + + <UseAppBundle Value="False"/> <ResourceType Value="res"/> </General> - <CustomData Count="5"> + <CustomData Count="3"> <Item0 Name="MaintainHTML" Value="1"/> - <Item1 Name="PasJSHTMLFile" Value="project1.html"/> - <Item2 Name="PasJSPort" Value="0"/> - <Item3 Name="PasJSWebBrowserProject" Value="1"/> - <Item4 Name="RunAtReady" Value="1"/> + <Item1 Name="PasJSWebBrowserProject" Value="1"/> + <Item2 Name="RunAtReady" Value="1"/> </CustomData> <BuildModes> <Item Name="Default" Default="True"/> @@ -60,6 +61,10 @@ <Filename Value="democonsts.pp"/> <IsPartOfProject Value="True"/> </Unit> + <Unit> + <Filename Value="demobootstrap.pp"/> + <IsPartOfProject Value="True"/> + </Unit> </Units> </ProjectOptions> <CompilerOptions> diff --git a/demo/webwidget/widgets/webwidgetsdemo.lpr b/demo/webwidget/widgets/webwidgetsdemo.lpr index 7c85f1c..237991a 100644 --- a/demo/webwidget/widgets/webwidgetsdemo.lpr +++ b/demo/webwidget/widgets/webwidgetsdemo.lpr @@ -4,7 +4,7 @@ program webwidgetsdemo; uses browserconsole, browserapp, JS, Classes, SysUtils, Web, widgetdemo, frmDemo, Rtl.TemplateLoader, - demohtmlwidgets, democonsts, webrouter; + demohtmlwidgets, democonsts, webrouter, demobootstrap; type TMyApplication = class(TBrowserApplication) diff --git a/demo/webwidget/widgets/widgetdemo.pp b/demo/webwidget/widgets/widgetdemo.pp index 73148a3..56c4b89 100644 --- a/demo/webwidget/widgets/widgetdemo.pp +++ b/demo/webwidget/widgets/widgetdemo.pp @@ -20,6 +20,8 @@ Type procedure DoClick(Sender: TObject; Event: TJSEvent); virtual; // Event that can be used by descendents to attach to OnChange procedure DoChange(Sender: TObject; Event: TJSEvent); virtual; + // Override this to return something else but the widget itself + function GetInspectorInstance: TObject; virtual; Public function HTMLTag: String; override; function DoRenderHTML(aParent, aElement: TJSHTMLElement): TJSHTMLElement; override; @@ -27,7 +29,10 @@ Type Class Function Description : String; virtual; Class function WebWidgetClass : TCustomWebWidgetClass; virtual; abstract; Class Function RegisterDemo : TDemoRegistration; + // The widget instance Property WidgetInstance : TCustomWebWidget Read FWidgetInstance; + // The object to show in object inspector. By default, this is the widget instance + Property InspectorInstance : TObject Read GetInspectorInstance; Procedure ShowDemo; virtual; end; TDemoContainerClass = Class of TDemoContainer; @@ -185,6 +190,11 @@ end; { TDemoContainer } +function TDemoContainer.GetInspectorInstance: TObject; +begin + Result:=WidgetInstance; +end; + procedure TDemoContainer.DoClick(Sender: TObject; Event: TJSEvent); begin Writeln(Sender.ClassName,' : OnClick event'); diff --git a/demo/webwidget/widgets/widgetsdemo.html b/demo/webwidget/widgets/widgetsdemo.html index 88e2d65..96c79aa 100644 --- a/demo/webwidget/widgets/widgetsdemo.html +++ b/demo/webwidget/widgets/widgetsdemo.html @@ -21,8 +21,13 @@ <div class="banner container-fluid"> <h2 class="text-center"> <span "align-middle">WebWidgets demo</span> - </h2> </div> + </h2> + </div> <div class="container-fluid"/> + <div id="toastarea" aria-live="polite" aria-atomic="true" style="position: relative; top:0; right: 0; z-index: 99;"> + <div id="toastarea-stack" style="position: absolute; top: 0; right: 0; z-index: 99;" data-ww-element-content="ww-1" > + </div> + </div> <div class="row"> <div id="demoarea" class="col-10"> <div class="row">