 Good afternoon everyone. It is a it is a matter of great privilege and honor to welcome Dr. D. V. Patak, Mr. Avinashavartey, other faculty members and my fellow interns for this presentation Graphical Interpreter, Muduram Dumbo in action. Our project is joined under a section initiative under the guidance of Dr. D. V. Patak and Mr. Avinashavartey. Here I would like to introduce my team members, Sivarsan, Siva, Myselav Abhishek, Aditya, Ankur, Basav, Ashwani is not here, Divya, Harshita, Navin and Shobhit. Now as we are saying goes, seeing is better than hearing. So I would like to give you a small demonstration about our project. So I call Divya to start the demonstration. Good evening everyone. Now let's have a small and quick demo about a project. Here we can see we have two windows. First is the framework and second is the graphical framework. The code of C is within the first framework and the execution can be seen in the second window. Let's have a small example. We'll open a file and we have already created some demo and we are opening that file. Okay, now it's open. The first thing we do is to pass the C code into a queue. Now we'll pass it and execute each instruction step by step. The first instruction executed and it's shown on the display area of the graphical team. The first is int G equals to 4. So first thing that we'll do is to label a box with G. Next, it will go back to a display, get edge from a display and label the second box. Now what it will do, it grabs 4, that's the value of G and put it into the box of G. Now it has to calculate the value of edge. So initially, it has to get the value of G, takes it, put it in register 1, that's R1, takes the value from the display as 1, keeps in register 2 and now it evaluates the value of edge. That's 4 plus 1, that's 5. Now it will keep this value to the box of edge. Now the second instruction will be passed, that's float edge is equals, f is equals to edge into 0.3. So f will be labeled. Now it has to be calculated. So initially take the value of edge 5 from the box to the register 1, then again come back, take the value 0.3 from the display, put it to register 2 and again evaluate the value of f. So now this 1.5 will be placed in the box of f and this completes execution. Now the details of each framework and all the modules will be given. I'll call Shri Vatsan to give the details. Good evening everyone. This project is a learning tool. It is meant to teach students programming. This is not for students who have foreign colleges. This is indeed meant for students who are first being introduced to programming. So like 11th and 10th standard students. So these students when they start learning programming, they usually just taught the rules. Even in my school they started off with, this is the C language, these are the literals, these are the strings, these are variables, these are the rules you have to follow and that is what they told me. That is how they taught programming at school. And this is an initiative by Shri Shal to change the way that happens. For a programmer to be good, I mean anybody can learn rules and by repeated practice they can become very good programmers. But do you really want to enjoy the subject? Do you want to know how it actually happens in a computer? Only when you learn that first, you will get an interest in that. You will get an interest in learning architecture and improving the ways it is happening. So with that in mind, we started this project. The objective of this project is the graphical explanation of a memory architecture. That is what we are representing by those boxes, their memory locations to explain the back end of programming. That is to show the accumulator, to show the registers and how addition and subtraction happens. And it is also intended as a learning tool. That is just a first step. With added functionality, this can be a standalone learning tool. The scope of this project that is so far what we have implemented is initialization, arithmetic operation and typecasting support. We have also had some work done on loop and control structures. And when we go on to the, I mean those are yet to be implemented. We will go on to the features of this project. First is the modularity. When we first came here, when we first started this project, none of us, we all knew what theoretically what modularity was. But only when we started implementing this project, we understood it completely. That is, any part of this project can be replaced by some other part without affecting other parts. So for this, we have a modular code, to frame work separately, the passes separately, the graphics separately. Because of this modularity, we believe that we will be able to provide support for any other programming language, say Pascal or basic. And probably not Java, but I think that is also possible. And we have a panelized framework and we have a partial interpreter that interprets single lines and gives you an intermediate code that will be executed by the graphics. And our graphics platform is of course supported across different platforms, Linux, Windows and Android. The project basically has four main modules. The framework which has been implemented in Java swing for desktop applications. The parser which is a hard coded parser that has a certain number of files that we have created for this purpose. And there is a GVM which generates the intermediate code that is, you know, it takes the intermediate code and executes the graphics. The graphics part has been implemented using Blender and LibgDX. The author of Blender and LibgDX is because of the cross-platform support. This is the activity flow diagram of this project. I would like Abhishek to explain it. So here you can see the activity flow diagram. Here the user wants to switch on the application. It has two options, whether to take the input from a file or to use it or to type the instructions manually. When the user takes the file and when the file gets opened, all the data gets shown in the view panel. And after that, that data is passed to the intermediate to the parser. When the user presses the execute button, that data is passed to the parser and then it starts getting executed and it generates the intermediate code. And when the intermediate code gets generated, it is then passed in a queue and the queue dequeues it whenever the framework people starts clicking it. And it is two options, whether to go step by step or all at once. When the user wants to go for all at once or step by step, he or she can see the output. And again the user's two options, whether to go for the next instruction or to terminate the application. And I want to tell, I want to call Shiva-Sant to explain something about framework. When we started with the framework, we just had two basic objectives. First one was to handle the user interaction. That is how the user is going to interact with the system. And the second one was to, you know, integrate the different components of the system. For this first objective, we just went with something that will be familiar to school students. So we went with your basic window application with its menu bar. And we also had panelized structures that could be resized accordingly. And we also have a text editor that can, you know, get user input or open an existing file. And obviously as with any text editor, we have the basic editing operations that copy, paste, undo, redo, etc. And this framework is not just for the project that you've done now. That is, it provides room for, you know, further improvement. That is, we have to provide a separate panel which can then display the variables that are currently in use, the variables that have been initialized that have values. So these are the framework that you saw earlier. We have the menu bar, the text editor, and the other panels which can be resized as needed. So this is how the first part of our objective was met. And the second part, integration, we handled differently. Now, what we did was before passing it to the parser, the parser that we have is a single statement parser. It will take a single C statement as a string and give you as, it will generate a set of intermediate commands for it. So before we have to send it, I mean, people have different coding styles, right? Even people from different schools, different colleges, they have different ways of writing code. So what we do is when they get, when we get code, it just pass it and make it into a single C statement which are then given to the parser. The parser then takes this input and generates intermediate commands which are put in a queue. This queue is then later accessed by the framework when the execute button is pressed and it then calls upon the GBM to execute those instructions. We feel that there is always room for improvement in anything. In any user interface, there's always the option of a better look and feel. And as I said earlier, we hope that we can display the value of variables after each step, display the program counters for, you know, if you happen to implement assembly languages, that would be very useful, displaying the program counter. And we would also like to provide the option of downloading a code directly from the Internet. That is, you see a code, that is, some web page, there is some code, and we would like to provide the option of, you know, downloading it directly. Next we'll move on to the parser. The parser we have right now is a hard-coded parser that simulates the behavior of an actual parser. The actual parser is still under construction. We hope to be able to complete it soon. And this parser, it has a set of 30 to 40 files for which each of its line is known and it generates the intermediate commands. These intermediate commands are then put in a queue, which will later be taken and executed by the framework. And the parser we have now, we'd like to add these functionalities have not been implemented as of yet. Array implementation, user defined function, pointer implementation, file handling and handling user input directly. I'd like to call up on Shobat to explain the intermediate code language and how it's being implemented. So as you have been familiar with how our framework passes the commands in the queue and then it has a got to execute button to execute the commands in the GVM. So you must be wondering like how the source code is being converted and how the graphics is interpreting the source code. So the source code, what intermediate language has got to do with it is it has got some five commands called display. To display the strings, I guess you have seen that black screen appearing on the above of the Dumbo. It's used to display the code line of the commands. Then you've got a label command. The box were being labeled. This command is for that purpose. You have a command called operation which performs operations. You have a command called store. Store is basically, we have made our architecture in a way that everything which is displayed on the window is an element. Either it be a box or a register or a accumulator or the literals, all the four primitive data types. So we label, so store can be done, so they are like properties of store. You can have a store from box to register. You can have a store from accumulator to box. You can have stores from literal to box, literal to register. So these cases are handled by the store command. So to implement these commands in the GVM, now we have got two registers which you had seen R1, R2. You have got a accumulator to store the results. Then you have got memory boxes which have been, we have tried to make it visualize that it's an infinite memory because once you are working with the actual machine, you don't know how much memory is there. We have tried working with it. Then there's a cache. Cache is for basically when you are going with complex operations. There is a need to store the intermediate results. So here you can store the intermediate results in the cache, fetch it back in the registers as and when required. And then you can get the result in the accumulator to store it back into the box. Now what graphics features we have is boxes intelligent. What I mean is that boxes intelligent is that, boxes got a data type rate. Boxes got a data type as in all the primitive data types of integer, char. Then you got float, double. So if you try to store a float in an integer in the box, box takes care that the value is truncated and the value is put at an integer. If you try to put a float, if you try to put a character integer, it's seen that it's again converted in integer and then it's saved. So box is intelligent and since so if you go with any other language like suppose in future you are implementing basic or something else, you can always work with that. Next, how did we do the graphics? So for the graphics things, we have created models and models like the boxes, the Dumbo itself, the Dumbo itself and all the instances like accumulator registers. It's not been drawn in libgdx, it's been created in blender and then put it into this because drawing it with libgd is difficult. Next, we have dynamic text generation. You had seen like the text was generating as you were executing the command. So that's a text dynamic text generation. You have translation of elements as in Dumbo moves. That's the main animation part of libgdx to perform that. For the future thing, we are thinking that implementation of infinite memory for the present thing is it's just an image. It's an illusion that you're getting an infinite memory. In future what we think is when you have a large program and suppose 30 boxes are filled, Dumbo moves forward, the field should come as the things have been replicated again. So that's the point. Then we have a stack implementation. Cache, we have not implemented cache as in right now graphically. So there can be an improvement on that. Cache can be listed there and then the values can be put into the cache once there is a complex expression. Then we are thinking of because pointers are subject to be most tough. For anyone when you are learning a C language pointers are supposed to be most confusing. So we think of implementing pointers and get a feel of it. How is it done? The challenges faced while doing the graphics while doing all this project was the as emphasized by our mentor the intermediate code language was the heart of her system. Once we defined that every module was independent and could work accordingly with that. Dynamic text generation was definitely a challenge. We had now the thing was our thing has to be supported on every platform. It has to be supported on Linux, Windows, Android. The Android thing is also working. So that was the challenge. Integrating all the modules we had four modules. Different people were working on different modules. So there was a challenge that you have to integrate once you are coming up with the full project. Then there is a cross-platform support integrated with that. I would like to call Abhishek again to give you a conclusion. So the conclusion is that you have such a great project and this will help students to know how actually the memory internals are used on the backside of the computer and how actually the stack and memory is implemented. When we run the programming language how the programming language gets executed on the backside and when the stack is used, how is the arithmetic operation takes place, all these can be seen through our graphics in our project. And the second one is it has a modularity. We have four modules so each module is independent of each other. So whenever you change one module it doesn't affect the other module. It means it is effective. And so it is effective. You can advance one module and you can integrate with the other one. The third one is that as it is a long-term vision program so whenever you want to you want to change program so the students of the young generation will have the knowledge of the back end, not only about the front end. So they will have more knowledge of how actually the program is getting executed on the backside and so they will have better knowledge so they can perform better programming. Now I would like to give you some demo how actually the graphics are being implemented. So I would like to call Divyaashree to give a demo about it. Now this is the second demo. Here we are basically showing the typecasting that is the intelligent box thing. The first execution it gets is first blurred area. Scroll it up. Move it up. Here we get the first instruction int ab equals to 5. Again it will do the same thing that it will label the box with ab and give the value of 5. Now the second instruction we get is int c is equals to 0.101 and d equals to 7.5 but here we have the problem that 0.101 and 7.5. None of them is integer type. Type cast 0.101 to 0 and gives to c and 7.5 and it gives to d. That's the value of 7. Now the third line executes its float fi is equals to 90 and gi equals to 8.8. So it labels fi gives the value of 90.0 that's the float type to fi and then again labels gi and gives the value of 8.8 that's also the float type. Then the fourth execution instruction executed char sz equals to h. Now as it's a character type it will automatically send h to the sz box. Now second we get char h equals to 45. Now it will convert 45 from its ASCII value to minus and give it to h. The next instruction float y is equals to 5.890 it will take the value of 4.89 that's float 0 is neglected then int f is equals to hi now any integer type can't accept the single code hi so it gives to f any garbage value that's not the actual value. So here it gives any garbage value then it gets char ghi now again char ghi is now the character type so what it does that it just extracts the last character from the string and then it gives to the box. Each one of those which was simply I think labeling integer a semicolon how a box gets labeled and I think it was a is equal to 5 and y is equal to a plus 2 okay so box gets a value value is picked up operation is done and shown two demonstrations which were like by I think is first computer class okay and each one of them took two weeks to build okay biographics designer that time itself I had told him it is not correct you should have a dynamic thing where a user types anything it should graphically okay now the secret is I did not float this for the last couple of years okay that is because it involved too much work on my part to make it a success okay I wanted to actually do a portion of the parser okay and do the design and get the implementation done from interns. Now this year we had a lot of interns and very few projects so the last minute I said let me float this okay so basically without doing my part of the work okay this is the most complex project okay so I think this team has done a good job to reach where they have they still have to do a lot of work I do not want to let them go without completing the work okay that is what I think they are given up but that is fine I literally threw them to the wolves it took four weeks for them to settle down and to define the problem okay there is one more thing which is very peculiar to me okay I like people to fail okay I definitely like people to fail okay and I do not like people to hide that they are failed failure is the greatest learning experience you can do okay the smart people learn from other people's mistakes also it is not necessary that you fail you watch others fail and learn that is the best policy but sometimes you can also fail so anyway I think you have done a reasonable job but complete all the things that you are supposed to do