Differences

This shows you the differences between two versions of the page.

--- components [2020/03/04 15:25]
aducomadmin [Generic properties]
+++ components [2020/08/13 10:01] (current)
aducomadmin [Standard components]
@@ Line 1: / Line 1: @@
-Components are reusable objects that can be put on a design panel. There are two types of components: visual and non-visual. Visual components are components that have a visual appearance on the rendered form. Examples are edits, check boxes, radio buttons, etc. Non-visual components are do not have a visual representation. Instead, they are used for 'invisible actions.' Examples are database components for the connection, query component, email component, etc.
+====== Component overview ======
-Components have properties. These too can have a different meaning. Some properties are only used to present the design form. Examples are 'top, left, height and width.' They are only used within the IDE and NOT in the PHP environment. Other properties are static and are, for instance, used to generate classes and styles which are being used to generate CSS files. Some properties are used to generate static HTML. Some properties are dynamic and being used within the generated PHP code. I.e., the color of the component.
+Components are reusable objects that can be put on a design panel. There are three types of components: layout, visual and non-visual components.
-Below you will find the explanation of all components that you will find in the PHsPeed IDE. Some properties, however, are elements of (almost) every component and to avoid repetitive explanation these are described first. Same issue for server-events.
+  * Layout components are used to design your form. Examples are Panels, rows, columns.
+  * Visual components are components that have a visual appearance on the rendered form. Examples are edits, checkboxes, radio buttons, etc.
+  * Non-visual components are do not have a visual representation. Instead, they are used for 'invisible actions.' Examples are database components for the connection, query component, email component, etc.
+Components have properties and events. Some properties are needed to rebuild your IDE, others have a direct influence in the behavior of the component. Examples of components that have no application function are 'top, left, height, and width.' They are only used within the IDE and NOT in the PHP environment. Other properties are static and are, for instance, used to generate classes and styles which are being used to generate CSS files. Some properties are dynamic and being used within the generated PHP code. I.e., the color of the component. Within the IDE these properties are identified by an icon and can be filtered to be shown or not.
+Events are being triggered while running your application and allow you to insert code of your own. There are two types Server Events and Client Events.
+  * Server Events are happening on your server, these are PHP events.
+  * Client Events are happening on the client, so within your browser. These are Javascript events.
+Some events have an occurrence in the Server Event as the JS event. Here Javascript communicates directly with the PHP. These are Ajax events.
+====== Required components ======
+Every PHP basic module needs to have a root component that defines the kind of application it needs to generate. Currently, we have the following types:
+^Component^ |
+|Root|This is a standard PHP application that contains a form|
+|Building block|This is a reusable module that in general is hosted by a root application|
+|Blank|This is a regular PHP application without a form|
+|Rest service|Under development, to be used for consuming rest services. Currently to be implemented by using a blank application.|
+\\
+====== Component Documentation ======
+Below you will find the documentation of all components that you will find in the PHsPeed IDE. Some properties are elements of (almost) every component and to avoid repetitive explanation these are described first.
 ==== Generic properties ====
@@ Line 19: / Line 47: @@
 |**DeviceClassDesktopMobile** |The number of units (1..12) to be used of the parent|Valid for visible components like panels, edits etc.|
 |**DeviceClassDesktopPhone** |The number of units (1..12) to be used of the parent|Valid for visible components like panels, edits etc.|
-|**DeviceClassDesktopTablet** |The number of units (1..12) to be used of the parent <div>|Valid for visible components like panels, edits etc.|
+|**DeviceClassDesktopTablet** |The number of units (1..12) to be used of the parent|Valid for visible components like panels, edits etc.|
-\\
 ==== Generic server events (PHP based events) ====
@@ Line 33: / Line 58: @@
 ==== Basic components (visual) ====
-Each application must at least have a few basic components to work well. Depending on the type of application this is a root with form, module (with optional form), (or API).\\
+Each application must at least have a few basic components to work well. Depending on the type of application this is a root with form, module (with optional form), (or API). \\  \\ {{:tvaluelisteditor.png?24}}[[:form|Form]] Component that represents a form design area
-\\
-{{:tvaluelisteditor.png?24}}[[:form|Form]] Component that represents a form design area
 ==== Lay out components ====
@@ Line 57: / Line 80: @@
   * {{:tedit.png?24}}[[:edit|Edit]] Component to put an edit field on your form.
   * {{:tlabel.png?24}}[[:label|Label]] Component to display (html) text.
 ==== Additional components ====