Share My Creation [BANanoVuetifyAD3] Source Code Quality Checker, Updater & Documentor - An awesome case of Office Automation

Ola

BANanoVuetifyAD3 has 102+ components that you can use on your layouts for user inputs etc. That's a lot. One thing for sure, maintaining this lib via copy and paste between the various 152 files has been one of the most challenging things. If you are wondering why so many, well its kinda designer focused where the sky is the limit and your imagination is the boss. Yes there are some components with advanced features like VMsgBox, VueTable, VExpansionPanels, VBadge, VStepper, VTimeline, VForm, VField, BANanoDataSource etc as these have additional features that I have added for everyday development.

Below is the automated "copy & paste", processing 102 BANano Custom Views

Adding functionality that cuts accross all components like the gradients that's coming to the new version meant I generated code for:

• DesignerProperties
• Class_Globals
• Initialize
• DesignCreate

The same code has to be available in all the layouts. I started copying code from these 4 sections and pasting in other layouts like I have been doing this time. Phew.

Updating custom layouts that share the same attributes does take time. So I thought, I can continue copying and pasting or I can just automate the whole process. Now here comes the challenging part, making the whole thing work and do exactly what its supposed to do, including checking the source code quality based on lessons learned and also how Vuetify and VueJS work and then using BANano.Await...

We look at code consistency, for example are the signatures of Subs the same across all components? especially for Subs that do the same thing? Is there code duplication? Can some code be optimized? Can BANanoVuetifyAD3Lite come out of this for those who dont want the heavy version. How about removing the code that was on BVAD1, BVAD2 thats no longer relevant? Remember BVAD3 has been an evolving beast in itself and is growing and becoming more awesome and amazing and especially making life easy by providing a very easy way to create webapps, whether you want PHP or jRDC etc, we got you.

Version 6.05, which has been a massive update is coming soon. Still there are things I wish it does differently here and there and I cant change due to back-ward compatibility.

BTW, this includes a consistent toolbar just above the table. This is achieve by creating the toolbar on pgindex, just on top of the view-router.

Ta!

 

[Mashiane]

CODE MAINTAINANCE PROCESS

Hi there, just to elaborate, here are some rules and the resulting output applied to the custom view for this automation process to work. The output lines indicate what action was being done and the resulting success of the operation. These rules can be applied to 1 file or all files

R = Rule
O = Output

Adding A Designer Property Definition

R. On the VAlert file, Find the Designer Propery (GradientActive), if it does not exist, add it.
O: VAlert~~Design Property~~#DesignerProperty: Key: GradientActive, DisplayName: GradientActive, FieldType: Boolean, DefaultValue: false, Description: Gradient should be set~~true

Adding a variable definition on Class Globals

R. On the VAlert file, Find the Class Global defined as (bGradientActive), if it does not exist, add it.
O VAlert~~Class Globals~~Private bGradientActive As String~~true

Adding a designer property reading inside DesignerCreateView Sub

R. On the VAlert file, inside the DesignerCreateView sub routine, find a property reading defined as (bGradientActive), if it does not exist, add it inside the [If Props <> Null, End If], add the property reading call
O: VAlert~~CreateView Get~~bGradientActive = Props.GetDefault("GradientActive", False)~~true

Adding code lines before existing code lines

R: On the VAlert file, find a line with content 1.[VElement.BindAllEvents], if that line exists, find a line with 2.[If bGradientActive Then] on lines before [1], if it that line does not exist on the lines before [1], add [2] just before [1]
O: VAlert~~Code Before [VElement.BindAllEvents]~~If bGradientActive Then~~true

Adding code lines after existing code lines

R: On the VAlert file, find a line with content 1. [If bGradientActive] , if that line exist, find if lines after it has content 2[Dim agradient As String = VElement.GetActualGradient(sGradient)] and if that content does not exist, add it.
O: VAlert~~Code After [If bGradientActive Then]~~Dim agradient As String = VElement.GetActualGradient(sGradient)~~true

Adding code lines on Initialize

R: On the VAlert file, find out if the variable assignment [VEOnApp = False] exist, if not add it
O: VApp~~Class Globals~~Private VEOnApp As Boolean~~true

For now this is helping me copy code between modules especially code that is supposed to be the same across modules for the property bag.

One other thing I realized, using .IndexOf (because I write each modules code in a list for ease of search), was out of the question for finding code lines, the catch is case sensitivity. In one Module, you might have written code as [Dim bButton As String] and in another have [Dim bbutton as String] etc - these actually are the same code lines, irrespective of how they are written, then search with lowercase helped.

So I defined a type, I pass it some properties I need and because Im accessing files from my laptop via a web app, decided to use PHP.

Type EachProperty(Definition As String,
ClassGlobals As String,
InitializeCode As String,
ReadPropCode As String,
SetPropCode As String,
FileName As String,
logPhp As BANanoPHP,
codeToFind As String,
codeToAddAfter As String,
codeToAddBefore As String,
bindVariable As String,
onTop As Boolean)

The example of usage is..

vuetify.SetData("apptitle", "Gradients 4...")
    For Each strfile As String In profiles.keys
        vuetify.SetData("apptitle", $"Gradients 4.${strfile}"$)
        aCnt = aCnt + 1
        progPercent.UpdateProgressOnApp(vuetify, aCnt, aTot)
        Dim ano3 As EachProperty = NewProperty(strfile, logPhp)
        ano3.codeToFind = "VElement.setLinearGradient(agradient, sGradientColor1, sGradientColor2)"
        ano3.codeToAddAfter = "End If"
        ano3.ClassGlobals = $"Private sGradientColor2 As String"$
        ano3.Definition = "#DesignerProperty: Key: GradientColor2, DisplayName: GradientColor2, FieldType: Color, DefaultValue: 0xFFCFDCDC, Gradient Color 2."
        ano3.ReadPropCode = $"sGradientColor2 = Props.GetDefault("GradientColor2", "")"$
        BANano.Await(AddPropertyAllWait(ano3))
    Next

On each file processing with the more than 100 files, for example, this code will add gradient related functionality for each custom view.

Ta!

 

[Mashiane]

This source code update logs, can be presented in this format. This indicates the module, the section, the operation and its success, reflecting code that's actually added to the class modules.