Gogel - The crappier google

https://gogel.glitch.me/

Awesome!
Kind of reminds me of Zearch by @Remiix which I use on my Chrome every day. It’s sooo cool and works much better than the other new tab page.

With a bit of work, Gogel could look awesome!
Eddie

4 Likes

Ok i added new stuff:

  • Dark Mode now has a background image
  • I added a top navigation bar, that only tells the time
  • I added a light mode button
  • I made the logo bigger and made it closer to the search bar
    I love css

Looks amazing!

1 Like

I don’t know if you find it annoying (let me know) but I would ask why do you reposition the mode button? Isn’t it easier for a user to click between the modes if they didn’t move?

And I would tend to call it “Light” rather than white. Apps tend to call it dark mode and light mode.

2 Likes

Alright! I repositioned the light mode button because… idk
I’ll probably put it in the dark mode’s position in the next update

New Update!

  • You can directly go to websites by typing their URL
  • You can now search by pressing ENTER instead of clicking the search button!
  • White Mode is now called Light Mode!
  • White Mode button is repositioned to be in Dark Mode button’s position.
  • I changed light mode button’s color to be dark, so it fits in dark mode, and i change dark mode button’s color to be light, so it fits in light mode.

Yet another update!

  • You can now switch backgrounds with the new “Switch background” button!
  • There is a random background each time you reload the page!

For anyone wondering, i got them from https://pexels.com/

That’s cool you took the suggestions as I intended :slight_smile: Would you like a couple more?

in this case you don’t get anything out of setting date to getTime. new Date has done that already.
:
etInterval(function(){ var date = new Date;
date.setTime(date.getTime());

And for the formatting you might get by with const d = new Date().toLocaleTimeString();

rather that concatenating it as you have done

document.getElementById(“time”).innerText = date.getHours() + “:” + date.getMinutes() + “:” + date.getSeconds()

1 Like

Thanks!

Now i added google analytics and a privacy policy along with it.
https://gogel.glitch.me/

You want one that will reduce the code by about a 25% while making it more maintainable? I think you will see it immediately as I point it out but…

There are fundamentally two arrays that contain paths to pexels images.Each of the two is repeated twice. You can sort of see you have an issue when you’re forced to name one of them textArraay to avoid a naming conflict. Check your function bg() and you see the same two arrays.

var textArraay = [
https://images.pexels.com/photos/531321/pexels-photo-531321.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=750&w=1260’,

The arrays can exist throughout the life of the page you don’t need two copies and if you make them two dimensional one array can hold both sets of data. So dark could be the array[0] and light could be array[1] for instance.

If you look at the element above you will see it is 99% pattern with only two values that “must be the same” and vary per image. That suggests if you wanted to the arrays could consist of two sets of 7 numeric values. Those values can be in-lined when you set the backgroundImage url.

Finally your random background routine can (as far as I can tell) never select the original images because they aren’t in the array. Might be handy to place them in the array and simply reference the first element as the default.

There are a few more items but I’ll give you a moment to digest the stuff above. I’m having fun, hopefully you are. I realize that the site ultimately only needs to work but refactoring for reliability and reuse is the lifeblood of software development.

2 Likes

Message From The Owner:

Post a message there telling people that my account is temporarily on hold and i can’t post anything