(Year 3 Sem C) Working with technical

For this day, I decided to combine the three js page to the interaction page. I also separated to two different page which one of it is interaction and one of it is the page come into the interaction page. Before inserting the data, the particles also need to be clickable. The most important part of this assignment is to let people see the message that has written by others. Therefore, I decided to work at the important part first. So, I have applied a white box for the message which to show out the pop-up message.

From this step, I have done some research on how to insert data from MySQL database to a div object.

By this point, I also do some research on how to make the sphere object become clickable in three js.

Here is the code that I applied:

var messagebox = document.getElementById("Messagebox");

      

function onDocumentMouseClick(){

isMouseDown = true;

messagebox.material.transparent = true;

        messagebox.material.opacity = 0.5;

console.log ('Mouse Click');

}

function onDocumentMouseUp(){

isMouseDown = false;

messagebox.material.transparent = false;

        messagebox.material.opacity = 0.5;

console.log ('Mouse True');

}

This code is to apply the opacity to the box. Therefore, I decided to change to apply visible effect on the message box.

function onDocumentMouseClick(){

isMouseDown = true;

messagebox.visible = true;

console.log ('Mouse Click');

}

function onDocumentMouseUp(){

isMouseDown = false;

messagebox.visible = false;

console.log ('Mouse True');

}

But, it seems not function as well.

Reference List:

GitHub. (2017). how to make the object fade in and fade out · Issue #3650 · mrdoob/three.js. [online] Available at: https://github.com/mrdoob/three.js/issues/3650 [Accessed 5 Feb. 2017].

Jsfiddle.net. (2017). Edit fiddle - JSFiddle. [online] Available at: http://jsfiddle.net/jeanlescure/7y9ozyj6/ [Accessed 5 Feb. 2017].

Dev.vast.com. (2017). jQuery Popup Overlay. [online] Available at: http://dev.vast.com/jquery-popup-overlay/ [Accessed 5 Feb. 2017].

tag, R. (2017). Receive data from MySQL in a div tag. [online] Stackoverflow.com. Available at: http://stackoverflow.com/questions/34141285/receive-data-from-mysql-in-a-div-tag [Accessed 12 Feb. 2017].

The SitePoint Forums. (2017). Inserting mySQL into a div?. [online] Available at: https://www.sitepoint.com/community/t/inserting-mysql-into-a-div/216810 [Accessed 5 Feb. 2017].

The SitePoint Forums. (2017). Using html select to insert data into MySql db?. [online] Available at: https://www.sitepoint.com/community/t/using-html-select-to-insert-data-into-mysql-db/195475 [Accessed 5 Feb. 2017].