News:

Building a 3D Ray Tracer  By stevmjon

Main Menu

Looking Back At My PlayBASIC IDE V037 - PlayBASIC Live

Started by kevin, May 14, 2022, 09:05:54 AM

Previous topic - Next topic

kevin

  Looking Back At My PlayBASIC IDE V037 - PlayBASIC Live

  This is both a nostalgic and futuristic view of my IDE prototype from about a decade ago.  

   Building a programming language IDE is hard; building one with a custom highlighting control in Visual BASIC 6 (VB6)  is even more of a challenge, but certainly doable.    While this never made it to a full release,  it includes a number of nice addictions over the previous generations of PlayBASIC IDE, include TYPE awareness,  user defined Function detection and highlighting.   Faster pre-processing of #INCLUDE files for building large projects and a number I've most like likely forget in the decade since I last looked at it.

   The syntax highlighting and type awareness is time shared with editing and displaying in this IDE.  So when something is loaded it skims through the source building a tokenized view as well as various lists of datatype awareness.    Once you have them; all your really doing is dynamically updating them as edit are the current cursor position.  
 
  So why are we looking at this in 2022 if it'll never get completed ?  -  Well;  in order to complete this we've have to port it to C/C++ which is possible, but the methods used internally aren't that great.   A far better solution was developed during the development of the BlitzBASIC 2 PlayBASIC source code translator.   Which keeps the document is more stable form while editing.   Unlike the editing method used in the IDE which was doing line and row insertions to text buffer.   Which was annoying as declarations within the code would be  moving around, increasing the likeness of bugs and the IDE misunderstanding the source code.    

   In this video we take a look at basic operations of the IDE with some small source code snippets and then put it task loading the BlitzBASIC 2 PlayBASIC source code.   Which it did with ease..   So it mightn't be pretty and it's missing a number of necessary functions,  but it's actually more than capable.    

  I hope you enjoy this walk down memory lane..  


 





 ---[ CREDITS ] ----------------------------------------------------------------------------

  -  BlitzBASIC 2 PlayBASIC source code translator
     
 -   Hal Teach Me To Code

 -  End Section Music: The Right Direction by Shane Ivers - https://www.silvermansound.com

    #IDE #PLAYBASIC #VISUALBASIC


   Video Script:



hello welcome back playbasic coders

let's take a trip down memory lane

i was looking at the forums and in the

development section just down the bottom

here you've got to be logged in to see

the maintenance areas etc there's

updates all that kind of good stuff

one of the updates is a an alternate IDE

this is revision 37

all right

what we've got here is we've got

we've got a central work area down here

it's a debug console of course

uh if we go to new projects

we can just call it whatever we want hey

dude

uh cool program

whatever

we can open the folder these are going

to be recorded uh opened or created

within

and we has it as a default area of my

program so so we can declare where this

is going to be all the time so we don't

have to go searching for a place

it will

create a project for it

but this part here is the same isn't it

so

we don't have the the banner lines we do

in playwright

um not that we don't like those things

they're just you know because don't have

them

hello world

a few different things straight away

isn't there

uh this actually has awareness of help a

whole bunch of things so so

it will give you the parameters for

things for example so if you're doing

new sprites so you have x position it's

y position showing us that we're

in the y position at the moment

index if we need one

this image

whatever that would be

spl

uh so that's type awareness

in general there's a whole bunch of

whole bunch of videos about this as

those features were added

i'm not sure if i set this up

for the compiler or not

uh it's default location for play basic

is looking in the wrong location so

i don't know we'll just try and run that

f5 can't locate points

that's fine

yeah

so

we have to tell it when the playback.exe

file is

which will be different for every single

person

all right pb

it's this file here play basic that's

the one

hit change it should be okay now

so if it hit component right now

yeah

compile it and ran it and return because

that program doesn't do anything it

doesn't stop at all

so we if we hit you know classic sync y

key we'd get the window up front

over here we have our source management

or project management controls

so as as we add more sources to

something

new source

my functions or something

we get

the my functions

under window

same project here up here

so you can close those windows down

if you swap between the two sort of

feels like you're moving between

h1

pretty straightforward stuff really

some of the more interesting stuff is

that you can go

type

vector3d

has some auto-complete stuff you know to

engine n-type for us so we can just go x

y z

uh

do me as

now

auto-complete

is vector

dot x

equals random

whatever

into the line things

standard cut and paste

so it has some ability to understand

what's going on in the document

and that extends to things like

functions

um

print hello world that'll be our

function name

hit end it closes the function for us uh

inside this

lovely function will print

hello world from

inside a function

just trying to think if i added

the auto complete stuff for

keywords

so i think there is

hello world

and he knows that

it can highlight

the functions as well

so it's aware of what the basic types

are doing

this has different parameters here like

i don't know x and y causal areas

so it's already giving us indication of

what this function parameters are

so when we're typing this out

it would prompt us with you know

what our functions are so that's for

user defined functions

so it's pretty capable and

the way it works is really

it's kind of how

i was talking about this uh the

secondary discussion the other day about

building an

ide from the centex highlight control

from the blitz to the blitz basic to

play basic translator

this program is written in visual basic

it's completely graphical

like i'm just drawing the whole window

here this is all just straight basic

stuff

all the side view there it's all

graphical there's they're not window

controls at all they're just

except for these buttons they are window

controls

uh what we do is we've got we've got

project control

we've got a screen have we yeah we can

change the screen mode the title

which is all hidden away the normal play

basic

ide

okay so we can we can set

whether we're working with play basic or

plug ask effects from this one which was

around that same time we're working the

two things side by side so it's kind of

imperative that we have something that

lets you just switch flick a switch and

then build with the other one

we can't do that in this because i

haven't got the other

i haven't got a pbfx installed on this

system at all

and those builds are

yeah i think 2008 was about the last one

of those it was

floating and ever since then we've been

trying to

separate ourselves

from the from the two products it's been

quite a while

you know i mean for the last six years

i've been

a full-time carer so i couldn't do

anything

but i'm back now and we are going to do

stuff

and we have some

projects to load

crossfade between two images

this was something i wrote uh wrote

today

so we run this just f5

that's a that's my dog by the way

my dog's this one here where the bad

ears and that's my friend's dog

this is demonstrating

uh

altering the alpha channel within an afx

image

back to it

it's not actually in there there is

there but you'll see at the top here we

have it have two products in memory side

by side

and they're tabbed

something that's kind of evolved now as

a standard within

modern

uh modern editors i guess in general

whether it's a

a programming environment or even my

video editor works this way they tend to

have a tree over here where you've got

if you load different projects you can

you can click the the the trunk of the

tree and it reveals any branches from

that which would be the source code you

know let's uh

attempt fade some more what have you

tried something bigger

all right so we're loading this is the

blitz

to play basic translator this is the

actual code

we don't have things like the

function

controls over here where we could

you know we could show

uh

the source inspector kind of stuff but

it is highlighted it has understood the

functions you notice that user functions

are actually

uh there

are there and i can just go find

declaration oh sorry

clicked off it

find declaration so it does find those

things

so i can navigate the code

it's a pretty big program this this

application this is

i don't know how many lines of code this

would actually be

uh it's the lexa

part bunch of

if you looked at the html to play basic

or sorry the playback to html converter

you would have seen this code i've just

renamed some of the functions bb alexa

what a shock

uh

labels have got their own

colorization as well

they actually have any structures in

this i just a bunch of type handling

stuff in there

conversion we'll go to that a bunch of

document stuff there so this is the

actual uh oh no it's the delete

uh new blitz conversion product this is

how the conversion works we load the

file in we strip it

grab some information about the actual

file name and i'll grab the project name

from that

because in blitz you don't have a

project file you just have source files

fair enough no big deal

we just check

where our current path is

if this thing exists when we

we just grab a free project from the

blitz conversion product array

initialize it

grab a pointer to it so we never have to

refer to it through this

now i refer to me i'm referring to this

it's just a way of short children and

stuff and you know that from this point

on we don't actually need to do that so

what i'm actually doing is as i'm in

this case here as i've um i'm pretty

much doing type caching manually

so in this case type casing would for

this program probably wouldn't ever

wouldn't be much benefit

i wonder if it's compiling run

trigger polling right from here

yeah works fine

it's kind of freaky isn't it

uh hit view

that's a pretty big big code base um i

doubt you can write that kind of a

product of that size with this idea at

the moment

i'm not saying that's that's buggy but

uh

it was built to a point but wasn't

tested beyond that point really so

um i love the fact that you can actually

use it to find functions are highlighted

differently so you can differentiate

between what's uh what's used to find

function etc

i like the navigation through the code

you can just switch the panel whatever

you want of course you would need other

things yeah

this this actually doesn't have

our

collapsing stuff at all

that was on the to-do list but just

never implemented

uh

a bit clunky there when you change

products

because really each window is still

there so

what i probably should have done is i

probably should have just just had

because i sort of wanted i was i sort of

had this idea at the time if uh

you know

at some points in my life when i've had

a wider screen

um it's been sort of cool to

lay the two windows

side by side

and do that sort of thing where i'm

looking at one thing and looking at

something else

um but that doesn't happen that

frequently

and i think that if we have a render

mode we have our own sort of sort of

rent split view render where we

which we could do

quite easily

because the renderer

in in this actually sorry in this thing

here this converter

it just renders to the viewport

and whatever the viewport is so

uh all this here is just running pure

play basic it's just 165

collapsing works properly you know

do all the highlighting get all the same

stuff but this one but in this version

here we actually detect

what's a variable what's an array what's

a function

do all that kind of good stuff so

we don't need to have

you know it's not this is not threaded

this is not

fancy at all actually it's incredibly

simple the way it works

i wish i thought of this

when i was writing the original idea

um

it's kind of a shame really

but looking back on this i mean it's not

it's not the worst thing i've ever seen

in my life i've seen worse editors than

this but

this is nowhere near complete

you know

my favorite part of this thing is

actually the the help file

window

i i love this a lot because it has a

much better search i've spent a lot more

time

one of the problems you've probably

encountered with the current ide is when

you do a search you're going to match

that keyword almost identical

uh this will give i just searched for

sprite collision or something

uh it takes a while the first time you

you search because it's looking through

all of the html documents

stripping them

all the html out into the raw text

and building a database that we can use

from now on in so

because it gives us a list of short

shortcuts with you know previews of

what's on the document so we can go to

uh sprite

there's a thing command called image hit

sprite pixels and it's in the sprite

command set to look at

so what we want

we could probably load that from there

we can load that from there

and

just duck it down the bottom there and

hit

run so here we're

most of the things in the help files

aren't graphical they're just kind of

they're trying to demonstrate ideas

quickly and simply so i'm going to uh

sprite here

what's being constrained by

other objects but

by pixel

it's pretty cool

so we go back to the help we can just go

back we can go back to the

the

sorry is it back to the search result

now

back to the search results

uh

we might go to

so everywhere that keywords popped up

it's giving us uh some hints about that

actually there's a

down the bottom there's this is the

sprite tutorial if you never if you

never

looked at this thing

and you have a retail version of pb i'm

not quite sure this is in

the learning edition or not but it will

be in the lead edition when we update

that

in the not too distant future

um

this is a huge document

there's all these sections here this is

one tutorial and it covers pretty much

everything you need to know about

sprites

what are sprites

right

getting started with sprites

some simple codes images you you've got

to cut and paste these in

a lot of these ones here are not

runnable because you need the media to

go with those things there so i've kind

of i'm telling you that as we go through

and so i've got examples with animated

gifs like this one here

and what this code here is doing

so that's how we create motion we

have a variable that uh is changing and

we're redrawing this particular object

using that variable

each time we refresh the screen and that

creates the illusion of animation or

movement

huge bit of documentation but

out of all the things with this ide i

love this page this actually worked

really well and i was very proud of this

very happy with the way i was happy the

way it sort of looks and feels and all

that good stuff

yeah it's relatively capable it's just

it's not pretty

um what else we're doing this thing i

was a

so i testost kind of thinking about

having all the windows be

skinnable

so you would sort of have

some graphical elements that you would

just insert over the top this is a live

document

this is a thing

and because because you

because we would draw this background

element here

it makes the application have its own

custom

appearance so it doesn't look like a

standard windows application all the way

through

uh because these this would just be a

graphical panel pretty much

as this panel here is this is just a

picture and i'm just rendering the

backdrop to it rendering the text out to

it

food for thought so if you've never seen

this before

that is the

the secondary idea

there's actually three ideas there's one

that was written

well before

um

empty started work on playwright

playwright is the one that you use and

see all the time

well if you're using play basic at all

that is

uh

before this danny whatnaby he wrote

the first ide which is really

like a a combination uh interface

between his scripting language and my

scripting language

and eventually we split away from that

you might be able to find some really

old screenshots of that that on the

forums but there's not many around

a few other people have had to go

writing ideas and i commend them for it

it's not a fun process

as you can see there's like little areas

where it's rendering outside

the item there it shouldn't be

the colors are ugly but that this is

actually skinnable the the colors that

we're using here are just coming from a

bitmap that's drawn

and grabs the elements off the bitmap

and uses those to just for this display

purposes really

in recent times a few people have

mentioned doing updates doing uh

doing ides because you know one of the

things that does limit you you progress

with with pv

um

and i actually find this

let's see remove source

do i remove

remove main hmm

oh sorry

uh close

project thanks

go to

close that project

no thanks

crossfire between images

close that project things

yeah if you didn't think that that blitz

converter probe is a large bit of code

horrifying isn't it

it did turn out to be a pretty pretty

big fat program a lot bigger than i was

anticipating

um

just look at some of those things we've

got command sets

if i jump into a function

where are we

i don't know a function here i go

tokens

next next token

oh it doesn't know what it is

yeah it doesn't

there you go

it doesn't know what tokens is because

it doesn't know what make array is i

reckon

it probably probably knows make array

from

um

from doing integer or float or string

arrays but not typed arrays this is old

syntax

in terms of modern syntax we really

should have tokens as blah blah blah

so i suspect

that's one thing it doesn't work

not that i'm going to fix it now but

that

this thing here has got a type in it so

if i just go

print me dot

yeah let's go

as far as i'm concerned a modern tool

should have at least be aware of what

fields you're looking at give you an

indication what these fields are

etcetera and that would make

writing larger probes easier less typos

etc

like modern

applications are just completely

dependent upon them

developing these

hmm

okay that's interesting

once we've got over here

search thing select all paste oh the

other thing i liked about this too is

that i don't want to damage the source

code you can just do this which

you can tab a block or hit oh sorry is

it shift tab

yes shift shift and tab to go backwards

and forwards so i always found that when

you hit hit tab in in playwright it

would delete the block

i don't know why it does that

something's highlighted

just very annoying

not a big deal but

all right that's

uh the old

that's my old

ide product from

probably 10 years ago now

the history here too is interesting is

that

one of the things i don't like about the

current

i didn't like at the time is it when you

loaded something

and then went away and did something

else came back

you go oh geez where's that thing i was

looking at yesterday or last week or

last month

so i think with

your history in terms of what you've

loaded in into your ide

i think it's even really important that

that um this keeps a record of you know

these things going forward so

this actually has an unlimited

it's uh array size

it just keeps if i reload something if i

had more things here it would scroll up

and down but we know that but just light

up in the history and it gives you the

indication too about

who wrote the thing sorry uh who wrote

the project

where it was created when the last time

it was edited that sort of little extra

bits of information

and if we have more data in the project

header we could display like a picture

up here or something like that or the

current screenshot or whatever

um

you know maybe do a do a search upon the

history for certain things or whatever

i found that to be invaluable in the

past because it because often you'll

download something put it somewhere in

your hard drive forget where it is

we all know how large systems are these

days but it's easy to just forget where

things have you unzip something or copy

it somewhere else and

if the ide can remember that and let's

go back to it much easier for people

that's the kind of stuff i want to make

sure it's really intuitive when we move

forward and do something else in the

future

that's enough of this

thanks for watching and

i'll see you next time bye



i'm sorry dave

but i can't teach you that

hall - teach me the code

okay dave

playbasic.com