This project visualises the top searched words on the GittiGidiyor website in some time interval,allows users to reach that words on GittiGidiyor with one click.
- Visualisation can be changed by the user.
- 1x1 2x2 3x3 4x4 5x5 visualisation options.
- Random colour changes according to a time interval from GittGidiyor colour palette.
- Random top searched word changes according to a time interval from GittGidiyor top searched word database.
- Clicking on words, will lead user to search that word on GittiGidiyor website,directly.
-
Opening the index.html file is enough for project to open.
-
On top left corner, there are buttons such as 1,2,3,4,5 .These buttons change the visualisation like 1x1 2x2 3x3 4x4 5x5 box visualisation.
-
User can hit the button freely, clicking another button will delete the previous one.
-
Attention! Fullscreen use is highly recommended for better performance!
To execute project Using mongodb with importing top searched words from local database: =====================================================================================
-
1- Open GG-Trend-Chart-Server-Version folder in repository of this project.
-
2- Execute server.js using mongodb. Browsing localhost:8080 on your browser, will execute this projects index.html, while importing top searched words from local database.
-
Javascript
-
CSS
-
JQuery UI 1.12 API (http://api.jqueryui.com/)
-
Font was used from the google font resources (https://fonts.googleapis.com/css?family=Open+Sans)
-
Typing animation was inspired from Lea Verou’s project. (http://goo.gl/Ef9UY4)
For server based version:
-
NodeJS -
Express -
MongoDB
- index.html includes all the functions,javascript and jQuery codes in it.
- style.css includes all the typing animation, style properties, colours,fonts etc.
- In style.css there are properties of boxes(myButton), properties of typing animation(h1 tag and span tag).
- Different font styles,padding and line height settings are in font classes according to user choice of 1x1 2x2 3x3 4x4 5x5 visualisation.
For further help, you can contact with me, b.ramazan@outlook.com