Kogics Foundation would like to celebrate the life of Shri J. C. Pant, who gave up his body and left for his onward journey on 13 th. June, 2025. Sh. Pant was the father of our Managing Trustee Lalit Pant, and inspired Lalit from a very early age to think for himself and figure things out for himself. This led Lalit on a lifelong journey of self-learning and the creation of many software products, and in time led to the creation of Kojo and the Kogics Foundation. Shri Pant was a pillar of support during this entire journey.

Sh. Pant was a retired IAS officer (1961 batch), who held important positions in the Govt. of Uttar Pradesh (as Principal Secretary) and the Govt. of India (as Secretary). His notable contributions to Bharat include seminal work in the areas of Education – as Education Secretary of UP, water utilisation and Watershed Development – as Agriculture Secretary of India, Polio Eradication (via Pulse Polio immunization) – as Health and Family Welfare Secretary of India, and Disaster Management – as Chairman of the High-Power-Committee on Disaster Management constituted by Sh. Atal Bihari Bajpai, PM of India. He was also the Chairman of the Administrative Reforms Commision (ARC) of the newly created state of Uttarakhand.

Sh. Pant was born in Almora, moved to Mussoorie at a young age, and studied till class 10 at the Hindi-medium Ghananand Inter-college. He then moved to the English-medium St. George’s school for classes 11 and 12. During this period of difficult transition in his education, he came in contact with Swami Bhramananda Saraswati, Shankaracharya of Badrinath (who gave Diksha to Sh. J. C. Pant’s father Sh. T. C. Pant). The satsang and blessings of Swami Bhramananda Saraswati changed the course of his life, got him going on the path of spiritual development, and inspired him to work hard and do well in his studies at St. George’s school. From a second division result in the grade 10 board exam at Ghananand Inter-college, he improved to being the topper in his grade 12 board exam at St. George’s school. From there he went on to Allahabad University to do a BSc and MSc in Math. After he finished his MSc studies, he had a year to spare before he could appear for the IAS exam, and he spent this year learning mountaineering at the National Institute of Mountaineering at Uttarkashi (basic course) and Darjeeling (advanced course). During this time, he climbed various peaks in the Himalayas as part of mountaineering expeditions from these Institutes.

Sh. Pant then appeared for the IAS exams, was selected, and started his journey as a bureaucrat in 1961. He came in contact with Pandit Shriram Sharma Acharya in 1979. His first meeting with Acharyaji made a huge impact on him. In his own words:

“During the meeting with Acharyasri, which may have been for about an hour, I seemed to be completely oblivious of the passage of time. I was experiencing a strange kind of elation mixed with disbelief whether what I was going through was real. The sense of elation seemed to be due to a subtle awareness that I had finally reached my destination, and the disbelief was due to a feeling that how could I possibly be so lucky as to be face to face with someone I could look up to as my master, my Guru. I was clearly overwhelmed by his presence without being overawed, and whatever I was experiencing was very pleasant and subtle. This awareness of his benevolent presence was to be my constant companion at all times, and is so to this day”.

He went on to accept Acharyaji as his Guru, and with Acharyaji’s guidance and the support of his organization Shanti-Kunj, carried out many impactful programs for the betterment of Bharat via the machinery of the UP government. Sh. J. C. Pant’s ideas and body of work are being ably carried forward by REACHA, an NGO that he created in 1992.

For more information on Sh. J. C. Pant’s life, you can download his book – Pandit Sriram Sharma Acharya As I knew Him … The Memoirs of A Civil Servant.

Kogics Foundation, inspired by Sh. J. C. Pant’s words and his life, is commited to doing original/creative research, product development, and action – for the betterment of Bharat and the rest of the World.

Om Shanti . Om Sadgati

• Functional gaming
• Object-oriented gaming with kojo-gaming
• kojo-ai
• kojo-music
• Picture clipping and masking
• Other miscellaneous enhancements

Functional gaming

Let’s start with a simple animation that runs via the animateWithRedraw command:

cleari()

case class Model(n: Int)

def initState = Model(1)
def update(m: Model) = m.copy(n = m.n + 1)
def view(m: Model) = Picture.text(m.n, 30)

animateWithRedraw(initState, update, view)

With animateWithRedraw, you need to define the following:

• The state of your animation (i.e. the stuff that changes as your animation runs) – defined here via a Model case class.
• an init function that returns your initial state.
• an update function that returns the next state given the previous state.
• a view function that returns a picture given a state (the picture is the visual representation of the state).

The animation is defined in a purely functional way with the above. To run it and show it on the screen, you call the animateWithRedraw command, passing it the init, update, and view functions.

As the animation runs, it increments a counter in the center of the screen (do you see why?).

Now, what you need (in general) to convert an animation into a game is interactivity, so that messages (like key presses and mouse clicks) from outside can get into your program, enabling you to react to them.

Let’s do a simple cut of this with our animation above. Let’s just make the increasing counter move left/right on key presses, until it moves more than 100 pixels away from the origin:

cleari()
val speed = 5
val limit = 100

case class Model(n: Int, x: Double, y: Double)

trait Msg
case object Tick extends Msg
case object Left extends Msg
case object Right extends Msg
case object Still extends Msg

def initState = Model(1, 0, 0)

def update(m: Model, msg: Msg) = msg match {
    case Tick =>
        m.copy(n = m.n + 1)
    case Left =>
        m.copy(x = m.x - speed)
    case Right =>
        m.copy(x = m.x + speed)
    case Still =>
        m
}

def view(m: Model) = Picture.text(m.n, 30).withTranslation(m.x, m.y)

val tickSub: Sub[Msg] = Subscriptions.onAnimationFrame {
    Tick
}

val keySub: Sub[Msg] = Subscriptions.onKeyDown {
    case Kc.VK_LEFT  => Left
    case Kc.VK_RIGHT => Right
    case _           => Still
}

def subs(m: Model) = {
    if (m.x > -limit && m.x < limit) Seq(tickSub, keySub)
    else Seq()
}

runGame(initState, update, view, subs)
activateCanvas()

Let us see what’s changed compared to the pure animation:

• You still have a Model case class to represent the state of the game. This contains an x and y now in addition to the counter value.
• You have a bunch of case classes / objects to represent the possible messages that can come into your game.
• You still have an init function that returns your initial state.
• You still have an update function that returns the next state given the previous state. But this function now takes an additional message paramter.
• You still have a view function as before.
• You have a new subs function that returns subscriptions for messages that the game is interested in, given the current state of the game. These subscriptions deliver the desired messages into the game.

And there, you have the essentials of a purely functional game!

Based on these ideas, you can see a fuller game here.

Note – Functional gaming in Kojo is a proof of concept prototype (partially based on ideas derived from elm). Many thanks to Anay Kamat for his inputs in this area.

Object-oriented gaming with kojo-gaming

kojo-gaming is a module/extension for Kojo, built with the goal of exposing older students (11th grade, 2nd/3rd year undergrad, and older) to core ideas in practical coding – in an interesting context, with the building of fun (hardware accelerated) games within Kojo that they can export to Desktop and Mobile.

kojo-gaming is based on the object-oriented paradigm (this works very well for gaming in our mind, plus is also widely used in industry), with functional ideas coming in as needed to improve code.

The core ideas in kojo-gaming are the following:

• A simple entity component system, with the following features:
  • animated sprites with rendering based on textures, texture atlases, and particle systems.
  • simple physics (kinematics).
  • collision detection and response.
  • world boundary behaviors (bouncing, wrapping, etc).
  • and more…
• A couple of different implementations:
  • One that works right within the Kojo canvas – for a quick and simple start, and the easy learning of fundamental ideas. This is called game-engine-lite
  • One that is based on libGDX – for putting the fundamental ideas to use in creating fancier games that can be exported to Desktop and Mobile. In this approach, Kojo brings up a new window where all the action happens.

All of this will be described in an upcoming post. For now, to get going, you can just download the game-engine-lite.zip file, unzip it anywhere, and then open/run any of the samples under game-engine-lite/samples. Or you can download the full release of kojo-gaming.

kojo-ai

kojo-ai is a module/extension for Kojo, built with the goal of providing older students a good learning ground for AI. kojo-ai provides support for things like the following:

• Learning the essential theoretical concepts in AI.
• Playing with these concepts within engaging projects.
• Getting hands-on with the Learning (Training) process of AI models.
• Building AI-enabled applications.
• Using pre-trained AI models within scripts.
• Using Generative AI Apps for design work for games written in Kojo.
• Gaining insights into generative AI and large-scale foundational models (like ChatGPT).

More on this in an upcoming blog post. For now, to play with kojo-ai, you can use the latest release and provided instructions.

kojo-music

kojo-music is a module/extension for Kojo, built with the following basic goals:

• Provide music as a rich area for children to do creative coding.
• Enable children to have fun with music as creators and composers - via coding.
• Enable the usage of Kojo/coding as a new kind of musical instrument.

kojo-music aims to provide an easy start via a Music Workbench, where musical compositions can be created and played, and then exported as code – to enable a gentle entry into coding for music.

kojo-music uses Alda as its music server.

kojo-music will be described in detail in an upcoming blog post. In the meantime, to play with kojo-music you can use the latest release and provided instructions.

Picture clipping and masking

As a quick reminder, Pictures are Kojo’s way of doing functional graphics. To work with Pictures:

• You create one or more pictures using predefined functions (for various shapes), or by using the turtle-graphics API, or by using lower level primitives from Java2D.
• You transform these pictures using various predefined transforms like translation, rotation, and scaling.
• You combine these pictures in rows, columns, and stacks as desired (with rows/columns/stacks of pictures themselves being pictures).
• And then you finally draw these pictures on the canvas (or use them in animations or games).

Clipping and Masking are a couple of new transforms for Pictures. Let’s get right to them and see them in action.

The following is our base picture (to which clipping and masking will be applied):

cleari()
setBackground(ColorMaker.hsl(0, 0.00, 0.12))

val w = 400
val h = 200
val fill = cm.linearGradient(0, 0, red, 0, h, yellow)
val rect = Picture.rectangle(w, h).withFillColor(fill)

val rectWithReflection = picStack(
    rect,
    rect.withFading(h)
        .withTranslation(0, 3)
        .withFlippedY
)

drawCentered(rectWithReflection)

Let’s now clip the rectangle with a circle (so that only the portion of the rectangle that lies within the circle is visible):

cleari()
setBackground(ColorMaker.hsl(0, 0.0, 0.12))

val w = 400
val h = 200
val fill = cm.linearGradient(0, 0, red, 0, h, yellow)
val rect = Picture.rectangle(w, h).withFillColor(fill)

val rectWithReflection = picStack(
    rect,
    rect.withFading(h)
        .withTranslation(0, 3)
        .withFlippedY
)

val clippingPic = Picture.ellipseInRect(w, h * 2).withTranslation(0, -h)

val clippedPic =
    rectWithReflection
        .withClipping(clippingPic)
        .withPenColor(black)
        .withPenThickness(4)

drawCentered(clippedPic)

Finally, let’s apply a mask to the clipped picture. The mask is a black/white (or grayscale) picture, where black specifies transparent regions, and white specifies opaque regions (with gray in between, with darker grays being more transparent):

cleari()
setBackground(ColorMaker.hsl(0, 0.0, 0.12))

val w = 400
val h = 200
val fill = cm.linearGradient(0, 0, red, 0, h, yellow)
val rect = Picture.rectangle(w, h).withFillColor(fill)

val rectWithReflection = picStack(
    rect,
    rect.withFading(h)
        .withTranslation(0, 3)
        .withFlippedY
)

val clippingPic = Picture.ellipseInRect(w, h * 2).withTranslation(0, -h)

val clippedPic =
    rectWithReflection
        .withClipping(clippingPic)
        .withPenColor(black)
        .withPenThickness(4)

val maskPic = picStack(
    Picture.rectangle(w, h * 2).withFillColor(white).withPenColor(white).withPenThickness(4),
    Picture.arc(w / 2, 180).withRotation(90).withScaling(0.9).withTranslation(w+3, h).withFillColor(black).withPenColor(black),
    Picture.arc(w / 2, 180).withRotation(-90).withScaling(0.9).withTranslation(-3, h).withFillColor(black).withPenColor(black)
)

val maskedPic = clippedPic.withMask(maskPic)

drawCentered(maskedPic)

Other miscellaneous enhancements

There have been many other enhancements since the last release announcement. Some of these are mentioned below (without a lot of detail for now – we’ll have explanatory blog posts on some of these in the future):

• Realtime note playing with the setNoteInstrument(instrument) and playNote(note, duration) commands. The Showcase -> Fireworks sample in Kojo has a non-trivial example of this.
• Using CanvasDraw in animations. CanvasDraw offers a Processing-like api for simple shape drawing, and is useful where you don’t want retained-mode graphics (which is what you get with Pictures). CanvasDraw is used by game-engine-lite in kojo-gaming.
• Support for drawing text and images in CanvasDraw.
• Support for spawning external processes from within Kojo. To use this, your script should contain the #exec pragma at the top. This feature is used by kojo-gaming to spawn external libGDX processes.
• Improved curve drawing.
• Neural Style Transfer refinements.
• Apple silicon support.
• New samples.
• Turkish enhancements.

That’s it for now…

As always, the new version of Kojo is available from the Kojo Download Page. If you run into any difficulties, let us know.

Enjoy!

• Support for .with and .thats transforms for Pictures
• Support for declarative animations
• The Kojo code exchange – a new website
• Kojo in the Goa government curriculum – an update
• Turkish enhancements
• Other miscellaneous enhancements

Support for .with and .thats transforms for Pictures

Pictures in Kojo can now be transformed using method based .withXx and .thatsXx transforms. So the following program using the earlier object-functional transforms:

cleari()
 
val pic =
  trans(100, 0) *
    rot(45) *
    trans(50, 0) ->
    Picture.rectangle(100, 50)
 
draw(pic)

now becomes:

cleari()
 
val pic = Picture.rectangle(100, 50)
  .withTranslation(50, 0)
  .thatsRotated(45)
  .withTranslation(100, 0)
 
draw(pic)

The available method-functional transforms can be seen via code completion on any picture pic by typing pic.with + Ctrl+Space or pic.thats + Ctrl+Space.

The .withXx and the corresponding .thatXx transforms do the same thing, and can be used interchangeably to make your code nicely readable – the way you like it.

Both the earlier object-functional and the new method-functional transform syntaxes are fully supported. You are free to pick and choose whatever works best for you.

Here’s a larger program that shows the new transforms in action:

cleari()
 
val cb = canvasBounds
val bg = cm.linearGradient(cb.x, cb.y, cm.black, cb.x + cb.width, cb.y + cb.height, cm.gray, false)
setBackground(bg)
 
val fillc = cm.linearGradient(0, 0, ColorMaker.hsl(40, 1.00, 0.40),  0, 150, cm.yellow, false)
 
def halfPetal = Picture {
  left(45)
  right(90, 120)
}
 
def petal = picStack(halfPetal, halfPetal.withFlippedX)
  .withFillColor(fillc)
  .withPenColor(cm.darkGoldenrod)
  .withPenThickness(1)
 
val nump = 7
 
def flower(petals: Int): Picture = {
  if (petals == 1)
    petal
  else
    picStack(petal, flower(petals - 1).thatsRotated(360.0 / nump))
}
 
draw(flower(nump))

And here’s the output of the program:

Support for declarative animations

Kojo now has support for animations based on Transitions and Timelines. Here’s some sample code for a Transition based animation:

cleari()
drawStage(white)
 
// pic to be animated
def pic = Picture.rectangle(100, 50)
 
// the properties within the animation state
def xProp(s: Seq[Double]) = s(0)
def yProp(s: Seq[Double]) = s(1)
def hueProp(s: Seq[Double]) = s(2)
def scaleProp(s: Seq[Double]) = s(3)
 
// makes a pic for the given animation state
def makePic(s: Seq[Double]) = {
    fillColor(cm.hsl(hueProp(s), 1, 0.5)) *
        trans(xProp(s), yProp(s)) *
        scale(scaleProp(s)) ->
        pic
}
 
// animation definition
val anim = Transition(
    2, // duration
    Seq(0, 100, 0, 1), // initial state
    Seq(300, 50, 240, 0.7), // final state
    easing.QuadInOut, // how animation moves from initial to final state 
    makePic, // a function to make a pic for the current state
    false // hide when done?
)
 
// run the animation
run(anim)

The basic idea with transition based animations (as shown in the code above and described below) is the following:

• You define a picture that you want to animate.
• You define the state of your animation. This consists of properties of the animation picture that change over the course of the animation.
• The animation state is a sequence of doubles. It’s up to you to interpret these doubles however you want. You can do this is a principled way by defining property functions that pick out the relevant double value from the state sequence.
• You define a function that can make an animation frame/picture for you for any given state.
• You then define the actual animation, with a duration, a start state, an end state, an easing function, and the frame making function from the previous step.
  • The easing function defines how Kojo interpolates your animation state from the start state to the end state. Kojo comes with many predefined easing funtions.
• Finally you run the animation!

Once you have one or more animation definitions, you can do the following:

• Reverse an animation to create a new animation that does the given animation in reverse.
• Do anim.repeated(count) to create a new animation that does the given animation repeatedly for the given number of times.
• Combine animations using animSeq – to create a new animations that does the given animations one after the other.
• Combine animations using animPar – to create a new animations that does the given animations concurrently.

The above describes a Transition based animation. If what you want to do is difficult with a Transition, you can use a Timeline. A Timeline differs from a Transition in the following important way:

Instead of being able to specify only an initial and a final state for an animation, you can specify states over the whole lifecycle of the animation using key-frames.

More on this and other aspects of the animation feature in a future blog post. For now, let me finish off this section with a quick couple of animations submitted by students – after a few sessions of coding with this feature:

Many thanks (once again!) to Anay Kamat from the Goa government’s CM-CARES team for his contributions to this feature. And many thanks (once again!) to the Kojo Code Hackers group of students for their experiments and feedback with this feature.

The Kojo code exchange – a new website

The Kojo code exchange is a site where users of Kojo can share their creations. Earlier this year, we released a new version of this site. This cut makes it easier to display your creations and enjoy and learn from the creations of others.

Here’s a quick screenshot of the new site:

Take a minute or two to browse the pages of the site and view the numerous interesting creations there! Many thanks to Vasu Sethia and Anusha Pant for their contributions to the code exchange website.

Kojo in the Goa government curriculum – an update

The Goa Government has released a teacher’s handbook for grade 7 for Coding/ICT. Kojo features prominently in the book:

I’m looking forward to some exciting action with Kojo in Goa over the next few years (especially after seeing some of the wonderful creations by Goan teachers and students on the Kojo Code Exchange).

Turkish enhancements

Bulent Basaran has been busy refining the Turkish translation of Kojo and adding more and more features to it. I will request him to provide an update in a guest blog post here. In the meantime, take a look at his commits – and be impressed 😉 :

https://github.com/litan/kojo/commits?author=bulent2k2

Other miscellaneous enhancements

There have been many other enhancements since the last release announcement. Some of these include:

• Chess support contributed by Ida Rasmark and the team at Lund University. More on this in a future blog post.
• Code completion improvements.
• Breakpoint pane improvements.
• New commands for animation loops that run in a more functional way – without the need for mutable variables.
• A Look and Feel upgrade.
• A Java upgrade.
• And more…

That’s it for now…

As always, the new version of Kojo is available from the Kojo Download Page. If you run into any difficulties, let us know.

Enjoy!

All the earlier posts from 2010 to 2022 are still available on the previous Wordpress blog.