Last day of this week, and probably the last day of log writing. After today only two days are left, and I will be wrapping up my code, writing blog posts, fixing bugs and stuff.

Today I fixed the obj search bug, it used to search from obj files of all the models, now it does only from the gFile opened. Started working on UI/UX of OGV. It was really messy, the way I created the model edit page, and a lot of problems were occuring because of it. So I merged the model view and model edit page.

Apart from this I fixed small bugs, that I could find. Redesigned comments section in model viewer.

Fixed header navigation bar, by adding a dropdown like menu for upload, settings and logout. Various icons were creating confusion on what they did. So I added them to dropdown with their label.

The toolbar I have been working from past 3 days I guess was almost complete. I started looking for small yet significant bugs and started solving them.

There was one thing that still wasn't working in the toolbar. I really wanted it to work. It was the search object. I wasn't able to search the object from list. Saw the explore.js code. OGV is using some SearchSource to simplify the search and add stuff like history and local search. I used the same to create a search for objfiles.

Everything seemed to work perfectly, so there was this doubt how could everything work fine at first time. :P And to my horrors I got to know my mistake. The list started showing all the objfiles of all the uploaded models instead of just the specific model.

I need to find out where I can mention the gFile filter in it's selector.

Another day and I am still working on show/hide & color toolbar's backend.

The database part seems cool to me. It works fine. The problem is in applying values from database. Searched about it, saw the code, made myself clearly understand what's happening while loading a model part. Draw journey of obj file from database to rendered object on canvas in my mind.

Also from documentation and github issues of THREE js(ultimate source of information) I found that there's this traverse function of Object3D. It can be used to traverse through all the child nodes of any Object3D. And then while traversing we can set their visible property to false, and hence that model part shall vanish from screen until the moment you refresh or set it's visible property to true. Lightbulb!!!

Now I was left for color part, color of model actually comes from the material attribute of object THREE.MeshPhongMaterial. In my code there was only one instance of this object, and it's material attribute was changing in loop. This resulted in getting the last model part color as color of complete model. Created an array of mesh objects and assigned each mesh object to each part. And voila, color seemed to work

Just one little thing, there was need to refresh the page after changing color in order to see it's effect.

Came to know it can be changed by changing the assigned mesh object's material property. For this I needed it's index in array. This was solved using data-src attribute of div. I assigned index to each li of object, this index was the same index of the mesh assigned to it.

And by the end of day everything seemed to work perfectly. Happy moment!!

Since the frontend of toolbar was complete I started working on it's backend. Now there were two things to be taken care of. One was to add attributes in database, that save the color of part. While rendering, the loader should pick values from the database and render using the designated properties. Another was to see change on model in real time, without refreshing.

I thought of one problem at a time, and concentrated on getting values from database. Added an attribute color to OBJFiles collection. Instead of fetching array of URLs of OBJFiles, I fetched OBJFile data object in modelViewer. In loop I used THREE.Color to add color to the object parts. It seemed so simple at that time.

The problem with this was that only the color of last object part was applied to whole model. Instead of distinctive model colors.

In case of show/hide the problem was that changing the attribute show to false in database won't affect the model in real time. Since the model is already rendered. I need to take a dive in THREE js documentation for solution.

Started traversing through THREE js examples and documentation to find a logic that may fulfuill my need

Today I mostly worked on the show/hide toolbar frontend. Design was almost complete. I need to make it look working. Things like changing the eye icon to striked line eye icon when clicked and if clicked on all objects eye icon, then all the icons of following objects should change accordingly.

80% of my today was spent on working with the toolbar, making it look more realistic. It also set a basic framework for my backend code. I got to know where I will add code to show model part, where I will add code to hide model part. This made things real easy. The time I had after doing this was spent in finding and fixing small bugs to make OGV stable, as the goal of this GSoC is to make it production ready.

Today I started working on UI of updating thumbnail. Currently there was just a simple HTML button, on pressing it screenshots the current view and goes to the profile page. One cannot see the preview of the thumbnail right when it's captured. So i created another div that showed the screenshot preview when captured. It got a little messy there, so thought of clearing the workspace

For clearing the workspace I used a camera icon that toggles the preview window in and out of screen. It looked perfectly fine and in tune with existing UI of OGV.

After that today I also installed BRL-CAD on server. It took some time, but the installation worked like a charm, there were zero reported errors

Updated the live OGV, by changing the admin settings, to the path of currently installed BRL-CAD. Tested the installation by uploading a model.

Today I finished with the front end of dialog box of model viewer. Also I created a separate template named modelEditor for edit page as it was getting difficult to manage within model viewer template.

Today's commit consisted of this dialog box and copy to clipboard embed code.

I also started working on showing preview on the edit page itself to see how it looks like.

Another thing I worked today was finding ways to get that dialog box I created working, for show/hide I did the database thing, added an attribute show that toggles to true or false on clicking. But the part of model is still loaded in the render window. I need to refresh to see the change this is not what I want. Saw three js documentation there's a remove and visible function to do the required function. But for that I need to work on the very specific object whose name is clicked in the dialog box. Need to get that link. After that everything would work perfect

For changing color, it's real easy we have to specify the color in OBJMaterial object being used. Color is not specified as a string, it is specified as an object of THREE.color. this takes hexadecimal color code for instance 0xffffff

HTML input type color gives value as #ffffff and I need it in form of 0xffffff. Traversed through OGV code and came to know there's already a function named handleColorChange() to deal with this. Yayy!