From 45aa8cb5a4980aa8240579b118f0b38e4c48c56b Mon Sep 17 00:00:00 2001 From: xbpcb Date: Mon, 9 Sep 2024 15:04:10 +0300 Subject: [PATCH 01/90] Gp: scaffold credits page --- src/assets/js/app-globalping.js | 2 ++ src/assets/less/app-globalping.less | 1 + src/assets/less/pages/globalping/credits.less | 9 +++++ src/views/pages/globalping/credits.html | 35 +++++++++++++++++++ 4 files changed, 47 insertions(+) create mode 100644 src/assets/less/pages/globalping/credits.less create mode 100644 src/views/pages/globalping/credits.html diff --git a/src/assets/js/app-globalping.js b/src/assets/js/app-globalping.js index ebf3c946f..07e507e53 100644 --- a/src/assets/js/app-globalping.js +++ b/src/assets/js/app-globalping.js @@ -9,6 +9,7 @@ const cGlobalpingSlack = require('../../views/pages/globalping/slack.html'); const cGlobalpingNetworkTools = require('../../views/pages/globalping/network-tools.html'); const cGlobalpingIntegrations = require('../../views/pages/globalping/integrations.html'); const cGlobalpingAbout = require('../../views/pages/globalping/about-us.html'); +const cGlobalpingCredits = require('../../views/pages/globalping/credits.html'); const { getGlobalpingUser } = require('./utils/http'); Ractive.DEBUG = location.hostname === 'localhost'; @@ -33,6 +34,7 @@ app.router.addRoute('/slack', cGlobalpingSlack); app.router.addRoute('/network-tools/:params?', cGlobalpingNetworkTools); app.router.addRoute('/integrations', cGlobalpingIntegrations); app.router.addRoute('/about-us', cGlobalpingAbout); +app.router.addRoute('/credits', cGlobalpingCredits); app.router.replaceQueryParam = function (name, newValue) { history.replaceState(history.state, null, location.href.replace(new RegExp(`${name}=[^&]+|$`), `${name}=${encodeURIComponent(newValue)}`)); diff --git a/src/assets/less/app-globalping.less b/src/assets/less/app-globalping.less index a96ce650d..cbc87b3bd 100644 --- a/src/assets/less/app-globalping.less +++ b/src/assets/less/app-globalping.less @@ -24,3 +24,4 @@ @import "pages/globalping/network-tools.less"; @import "pages/globalping/integrations.less"; @import "pages/globalping/about-us.less"; +@import "pages/globalping/credits.less"; diff --git a/src/assets/less/pages/globalping/credits.less b/src/assets/less/pages/globalping/credits.less new file mode 100644 index 000000000..a74889899 --- /dev/null +++ b/src/assets/less/pages/globalping/credits.less @@ -0,0 +1,9 @@ +.p-globalping-credits { + font-family: Lexend, sans-serif; + font-style: normal; + font-weight: 400; + -webkit-font-smoothing: antialiased; + display: flex; + flex-direction: column; + align-items: center; +} diff --git a/src/views/pages/globalping/credits.html b/src/views/pages/globalping/credits.html new file mode 100644 index 000000000..2ef1170b1 --- /dev/null +++ b/src/views/pages/globalping/credits.html @@ -0,0 +1,35 @@ + + + + + + + + + + + +
+ + +
+

CREDITS

+
+
+ + + + + From 7e28c6ef72e92b1dbb532579e3bc0332d5cdf978 Mon Sep 17 00:00:00 2001 From: xbpcb Date: Mon, 9 Sep 2024 19:34:36 +0300 Subject: [PATCH 02/90] GpCredits: mod haeder styles --- src/views/pages/globalping/credits.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/views/pages/globalping/credits.html b/src/views/pages/globalping/credits.html index 2ef1170b1..327673cbe 100644 --- a/src/views/pages/globalping/credits.html +++ b/src/views/pages/globalping/credits.html @@ -7,7 +7,7 @@ - +
From 4388add097e3689ff35f2cccf4bb5722aeabc942 Mon Sep 17 00:00:00 2001 From: xbpcb Date: Mon, 9 Sep 2024 21:38:04 +0300 Subject: [PATCH 03/90] GpCredits: scaffold html and content --- src/assets/less/pages/globalping/credits.less | 80 +++++++++++++++++++ src/views/pages/globalping/credits.html | 52 +++++++++++- 2 files changed, 131 insertions(+), 1 deletion(-) diff --git a/src/assets/less/pages/globalping/credits.less b/src/assets/less/pages/globalping/credits.less index a74889899..e70d2796d 100644 --- a/src/assets/less/pages/globalping/credits.less +++ b/src/assets/less/pages/globalping/credits.less @@ -6,4 +6,84 @@ display: flex; flex-direction: column; align-items: center; + + .gp-credits { + display: flex; + flex-direction: column; + row-gap: 48px; + padding: 48px 24px 24px; + + &_info { + display: flex; + flex-direction: column; + + &_title { + font-size: 40px; + font-weight: 600; + line-height: 60px; + text-align: left; + color: #17233a; + } + + &_descr { + margin-top: 24px; + font-size: 14px; + font-weight: 400; + line-height: 20px; + text-align: left; + color: #17233a; + } + + &_user-benefits { + display: flex; + flex-direction: column; + row-gap: 8px; + margin-top: 48px; + + &_block { + display: flex; + flex-direction: column; + row-gap: 16px; + padding: 24px 8px; + border: 1px solid #e7e7ee; + border-radius: 8px; + min-height: 186px; + + &_title { + font-size: 24px; + font-weight: 600; + line-height: 36px; + text-align: left; + padding-left: 24px; + } + + &_list { + display: flex; + flex-direction: column; + row-gap: 8px; + + &_item { + padding-left: 24px; + } + } + + &_hint { + padding-left: 24px; + } + } + } + + &_credits-donations { + height: 100px; + margin-top: 48px; + background-color: #e7e7ee; + } + } + + &_become-a-sposnor { + } + + &_faq { + } + } } diff --git a/src/views/pages/globalping/credits.html b/src/views/pages/globalping/credits.html index 327673cbe..340b7e91f 100644 --- a/src/views/pages/globalping/credits.html +++ b/src/views/pages/globalping/credits.html @@ -13,7 +13,57 @@
-

CREDITS

+
+

Globalping limits and credits

+ +
+ Start using Globalping for free! You don't even need to register, just start using any of our web apps or tools right away! +
+ +
+
+ Unregistered User + +
+ + 50 Probes per measurement + + + + 250 Free tests per hour + +
+
+ +
+ Registered User + +
+ + 500 Probes per measurement + + + + 500 Free tests per hour + +
+ + + Higher limits for members! + +
+
+ +
+
+ +
+ Become a sponsor +
+ +
+ FAQ +
From 4cabd542e32b0d1d9ad381a3f896f1d09183c342 Mon Sep 17 00:00:00 2001 From: xbpcb Date: Mon, 9 Sep 2024 22:19:28 +0300 Subject: [PATCH 04/90] GpCredits: scaffold sponsors content --- src/assets/less/pages/globalping/credits.less | 41 ++++++++++++++++++- src/views/pages/globalping/credits.html | 27 +++++++++++- 2 files changed, 66 insertions(+), 2 deletions(-) diff --git a/src/assets/less/pages/globalping/credits.less b/src/assets/less/pages/globalping/credits.less index e70d2796d..5dec7e459 100644 --- a/src/assets/less/pages/globalping/credits.less +++ b/src/assets/less/pages/globalping/credits.less @@ -23,6 +23,7 @@ line-height: 60px; text-align: left; color: #17233a; + margin: 0; } &_descr { @@ -80,7 +81,45 @@ } } - &_become-a-sposnor { + &_become-a-sponsor { + display: flex; + flex-direction: column; + row-gap: 40px; + + &_block { + display: flex; + flex-direction: column; + row-gap: 16px; + + &_title { + font-size: 32px; + font-weight: 600; + line-height: 50px; + letter-spacing: 0.2px; + text-align: left; + color: #17233a; + } + + &_subtitle { + font-size: 18px; + font-weight: 600; + line-height: 32px; + text-align: left; + color: #17233a; + } + + &_content { + font-size: 16px; + font-weight: 400; + line-height: 32px; + text-align: left; + color: #17233a; + } + + &_btn { + + } + } } &_faq { diff --git a/src/views/pages/globalping/credits.html b/src/views/pages/globalping/credits.html index 340b7e91f..77693d96a 100644 --- a/src/views/pages/globalping/credits.html +++ b/src/views/pages/globalping/credits.html @@ -58,7 +58,32 @@

Globalping limits and credits

- Become a sponsor +
+ Become a sponsor + + +200 tests per 1$ donated + +
+ We aim to offer a free and reliable service to everyone, from home users and solo developers to startups, corporations and large enterprises. + To support the active development of the project we're doing our best to keep things fair. + Everyone gets free credits and passive credits generation features, but we still require larger corporations to help us pay for the development costs. +
+ + +
+ +
+ Host a probe + + +150 tests/probe/day + +
+ Generate free credits passively! Simply adopt a Globalping probe under your account and become a member of the community. + For every day your probe stays online you will get free credits to be used in your tests! +
+ + +
From edf6fd78b324a59fc4cf4d6bb123b53c8ec25b76 Mon Sep 17 00:00:00 2001 From: xbpcb Date: Mon, 9 Sep 2024 22:34:48 +0300 Subject: [PATCH 05/90] GpCredits: scaffold FAQ content --- src/assets/less/pages/globalping/credits.less | 58 ++++++++++++++++++- src/views/pages/globalping/credits.html | 55 ++++++++++++++++-- 2 files changed, 107 insertions(+), 6 deletions(-) diff --git a/src/assets/less/pages/globalping/credits.less b/src/assets/less/pages/globalping/credits.less index 5dec7e459..1bea00b3f 100644 --- a/src/assets/less/pages/globalping/credits.less +++ b/src/assets/less/pages/globalping/credits.less @@ -11,7 +11,7 @@ display: flex; flex-direction: column; row-gap: 48px; - padding: 48px 24px 24px; + padding: 48px 24px 8px; &_info { display: flex; @@ -98,6 +98,7 @@ letter-spacing: 0.2px; text-align: left; color: #17233a; + margin: 0; } &_subtitle { @@ -106,6 +107,7 @@ line-height: 32px; text-align: left; color: #17233a; + margin: 0; } &_content { @@ -123,6 +125,60 @@ } &_faq { + display: flex; + flex-direction: column; + + &_title { + font-size: 40px; + font-weight: 600; + line-height: 60px; + text-align: left; + color: #17233a; + margin: 0; + } + + &_descr { + margin-top: 24px; + font-size: 14px; + font-weight: 400; + line-height: 20px; + text-align: left; + color: #17233a; + } + + &_list { + margin-top: 48px; + display: flex; + flex-direction: column; + row-gap: 16px; + + &_item { + display: flex; + flex-direction: column; + border: 1px solid #e7e7ee; + border-radius: 8px; + + &_question { + padding: 16px; + background: #f3f5f6; + border-bottom: 1px solid #e7e7ee; + font-size: 16px; + font-weight: 600; + line-height: 24px; + text-align: left; + color: #17233a; + } + + &_answer { + padding: 24px; + font-size: 14px; + font-weight: 400; + line-height: 20px; + text-align: left; + color: #17233a; + } + } + } } } } diff --git a/src/views/pages/globalping/credits.html b/src/views/pages/globalping/credits.html index 77693d96a..28acd5cad 100644 --- a/src/views/pages/globalping/credits.html +++ b/src/views/pages/globalping/credits.html @@ -59,9 +59,9 @@

Globalping limits and credits

- Become a sponsor +

Become a sponsor

- +200 tests per 1$ donated +

+200 tests per 1$ donated

We aim to offer a free and reliable service to everyone, from home users and solo developers to startups, corporations and large enterprises. @@ -73,9 +73,9 @@

Globalping limits and credits

- Host a probe +

Host a probe

- +150 tests/probe/day +

+150 tests/probe/day

Generate free credits passively! Simply adopt a Globalping probe under your account and become a member of the community. @@ -87,7 +87,52 @@

Globalping limits and credits

- FAQ +

Frequently Asked Questions

+ + Start using Globalping for free! You don't even need to register, just start using any of our web apps or tools right away! + + +
+
+ What is my password? + + Dui tristique augue orci id sed elit. Mattis accumsan aliquet augue id et. + Sed pretium, ipsum rhoncus est, neque, convallis et tempus. Ut eget est aliquam adipiscing ut vitae. + +
+ +
+ What is my password? + + Dui tristique augue orci id sed elit. Mattis accumsan aliquet augue id et. + Sed pretium, ipsum rhoncus est, neque, convallis et tempus. Ut eget est aliquam adipiscing ut vitae. + +
+ +
+ What is my password? + + Dui tristique augue orci id sed elit. Mattis accumsan aliquet augue id et. + Sed pretium, ipsum rhoncus est, neque, convallis et tempus. Ut eget est aliquam adipiscing ut vitae. + +
+ +
+ What is my password? + + Dui tristique augue orci id sed elit. Mattis accumsan aliquet augue id et. + Sed pretium, ipsum rhoncus est, neque, convallis et tempus. Ut eget est aliquam adipiscing ut vitae. + +
+ +
+ What is my password? + + Dui tristique augue orci id sed elit. Mattis accumsan aliquet augue id et. + Sed pretium, ipsum rhoncus est, neque, convallis et tempus. Ut eget est aliquam adipiscing ut vitae. + +
+
From 2636686350a830f08e6e2638e2dc34a5cca6b4d7 Mon Sep 17 00:00:00 2001 From: xbpcb Date: Tue, 10 Sep 2024 17:08:43 +0300 Subject: [PATCH 06/90] GpCredits: mod faq logic --- src/views/pages/globalping/credits.html | 67 +++++++++++-------------- 1 file changed, 28 insertions(+), 39 deletions(-) diff --git a/src/views/pages/globalping/credits.html b/src/views/pages/globalping/credits.html index 28acd5cad..f45d1af44 100644 --- a/src/views/pages/globalping/credits.html +++ b/src/views/pages/globalping/credits.html @@ -93,45 +93,12 @@

Frequently Asked Questions

-
- What is my password? - - Dui tristique augue orci id sed elit. Mattis accumsan aliquet augue id et. - Sed pretium, ipsum rhoncus est, neque, convallis et tempus. Ut eget est aliquam adipiscing ut vitae. - -
- -
- What is my password? - - Dui tristique augue orci id sed elit. Mattis accumsan aliquet augue id et. - Sed pretium, ipsum rhoncus est, neque, convallis et tempus. Ut eget est aliquam adipiscing ut vitae. - -
- -
- What is my password? - - Dui tristique augue orci id sed elit. Mattis accumsan aliquet augue id et. - Sed pretium, ipsum rhoncus est, neque, convallis et tempus. Ut eget est aliquam adipiscing ut vitae. - -
- -
- What is my password? - - Dui tristique augue orci id sed elit. Mattis accumsan aliquet augue id et. - Sed pretium, ipsum rhoncus est, neque, convallis et tempus. Ut eget est aliquam adipiscing ut vitae. - -
- -
- What is my password? - - Dui tristique augue orci id sed elit. Mattis accumsan aliquet augue id et. - Sed pretium, ipsum rhoncus est, neque, convallis et tempus. Ut eget est aliquam adipiscing ut vitae. - -
+ {{#each faq}} +
+ {{this.question}} + {{this.answer}} +
+ {{/each}}
@@ -144,6 +111,28 @@

Frequently Asked Questions

component.exports = { data () { return { + faq: [ + { + question: 'What is my password?', + answer: 'Dui tristique augue orci id sed elit. Mattis accumsan aliquet augue id et. Sed pretium, ipsum rhoncus est, neque, convallis et tempus. Ut eget est aliquam adipiscing ut vitae.', + }, + { + question: 'What is my password?', + answer: 'Dui tristique augue orci id sed elit. Mattis accumsan aliquet augue id et. Sed pretium, ipsum rhoncus est, neque, convallis et tempus. Ut eget est aliquam adipiscing ut vitae.', + }, + { + question: 'What is my password?', + answer: 'Dui tristique augue orci id sed elit. Mattis accumsan aliquet augue id et. Sed pretium, ipsum rhoncus est, neque, convallis et tempus. Ut eget est aliquam adipiscing ut vitae.', + }, + { + question: 'What is my password?', + answer: 'Dui tristique augue orci id sed elit. Mattis accumsan aliquet augue id et. Sed pretium, ipsum rhoncus est, neque, convallis et tempus. Ut eget est aliquam adipiscing ut vitae.', + }, + { + question: 'What is my password?', + answer: 'Dui tristique augue orci id sed elit. Mattis accumsan aliquet augue id et. Sed pretium, ipsum rhoncus est, neque, convallis et tempus. Ut eget est aliquam adipiscing ut vitae.', + }, + ], }; }, oninit () { From f9677b82b7df2f54bb00d2b9d0627a60f2abfbab Mon Sep 17 00:00:00 2001 From: xbpcb Date: Tue, 10 Sep 2024 17:22:09 +0300 Subject: [PATCH 07/90] GpCredits: mod buttons --- src/assets/less/pages/globalping/credits.less | 7 ++++++- src/views/pages/globalping/credits.html | 4 ++-- 2 files changed, 8 insertions(+), 3 deletions(-) diff --git a/src/assets/less/pages/globalping/credits.less b/src/assets/less/pages/globalping/credits.less index 1bea00b3f..147209ea3 100644 --- a/src/assets/less/pages/globalping/credits.less +++ b/src/assets/less/pages/globalping/credits.less @@ -119,7 +119,12 @@ } &_btn { - + width: 192px; + font-size: 14px; + font-weight: 400; + line-height: 20px; + text-align: left; + color: #f3f5f6; } } } diff --git a/src/views/pages/globalping/credits.html b/src/views/pages/globalping/credits.html index f45d1af44..999934815 100644 --- a/src/views/pages/globalping/credits.html +++ b/src/views/pages/globalping/credits.html @@ -69,7 +69,7 @@

+200 tests per 1$ donated Everyone gets free credits and passive credits generation features, but we still require larger corporations to help us pay for the development costs. - +
@@ -82,7 +82,7 @@

+150 tests/probe/day

For every day your probe stays online you will get free credits to be used in your tests!
- + From 8fde608749ba442fa9f198a0d070475da384ea45 Mon Sep 17 00:00:00 2001 From: xbpcb Date: Tue, 10 Sep 2024 17:43:18 +0300 Subject: [PATCH 08/90] GpCredits: add svg icon --- src/assets/img/globalping/check.svg | 3 +++ 1 file changed, 3 insertions(+) create mode 100644 src/assets/img/globalping/check.svg diff --git a/src/assets/img/globalping/check.svg b/src/assets/img/globalping/check.svg new file mode 100644 index 000000000..b0266a611 --- /dev/null +++ b/src/assets/img/globalping/check.svg @@ -0,0 +1,3 @@ + + + From e598404cccc8f0dff79fd0e24bdfae20924f3730 Mon Sep 17 00:00:00 2001 From: xbpcb Date: Tue, 10 Sep 2024 17:43:33 +0300 Subject: [PATCH 09/90] GpCredits: mod user benefits styles --- src/assets/less/pages/globalping/credits.less | 20 ++++++++ src/views/pages/globalping/credits.html | 48 +++++++++++++++++-- 2 files changed, 63 insertions(+), 5 deletions(-) diff --git a/src/assets/less/pages/globalping/credits.less b/src/assets/less/pages/globalping/credits.less index 147209ea3..2ad6f3e89 100644 --- a/src/assets/less/pages/globalping/credits.less +++ b/src/assets/less/pages/globalping/credits.less @@ -50,12 +50,21 @@ border-radius: 8px; min-height: 186px; + &.registered { + background: #e8fff9; + + .gp-credits_info_user-benefits_block_title { + color: #17d4a7; + } + } + &_title { font-size: 24px; font-weight: 600; line-height: 36px; text-align: left; padding-left: 24px; + color: #17233a; } &_list { @@ -64,7 +73,18 @@ row-gap: 8px; &_item { + display: flex; + align-items: center; + column-gap: 8px; + height: 28px; padding-left: 24px; + + &_numbers { + font-size: 14px; + font-weight: 600; + line-height: 20px; + text-align: left; + } } } diff --git a/src/views/pages/globalping/credits.html b/src/views/pages/globalping/credits.html index 999934815..51d1849fa 100644 --- a/src/views/pages/globalping/credits.html +++ b/src/views/pages/globalping/credits.html @@ -26,25 +26,53 @@

Globalping limits and credits

- 50 Probes per measurement + + + + {{this.userBenefits.unregistered.probesPerMeas}} + + + Probes per measurement - 250 Free tests per hour + + + + {{this.userBenefits.unregistered.freeTestsPerHour}} + + + Free tests per hour
-
+
Registered User
- 500 Probes per measurement + + {{this.userBenefits.registered.probesPerMeas}} + Probes per measurement - 500 Free tests per hour + + {{this.userBenefits.registered.freeTestsPerHour}} + Free tests per hour
@@ -111,6 +139,16 @@

Frequently Asked Questions

component.exports = { data () { return { + userBenefits: { + unregistered: { + probesPerMeas: 50, + freeTestsPerHour: 250, + }, + registered: { + probesPerMeas: 500, + freeTestsPerHour: 500, + }, + }, faq: [ { question: 'What is my password?', From 7167f92f994d1a30bb108310879e8d846e545273 Mon Sep 17 00:00:00 2001 From: xbpcb Date: Tue, 10 Sep 2024 18:56:30 +0300 Subject: [PATCH 10/90] GpCredits: add new grid type --- .../img/globalping/globalping-grid-type-4.svg | 21 +++++++++++++++++++ 1 file changed, 21 insertions(+) create mode 100644 src/assets/img/globalping/globalping-grid-type-4.svg diff --git a/src/assets/img/globalping/globalping-grid-type-4.svg b/src/assets/img/globalping/globalping-grid-type-4.svg new file mode 100644 index 000000000..3bf717e4a --- /dev/null +++ b/src/assets/img/globalping/globalping-grid-type-4.svg @@ -0,0 +1,21 @@ + + + + + + + + + + + + + + + + + + + + + From ea61ac311d80361830eb40306a0dd1fb32a022f3 Mon Sep 17 00:00:00 2001 From: xbpcb Date: Tue, 10 Sep 2024 18:56:47 +0300 Subject: [PATCH 11/90] GpJumbotron: add new grid type --- src/assets/less/components/gp-jumbotron.less | 14 ++++++++++++++ src/views/components/gp-jumbotron.html | 6 +++++- 2 files changed, 19 insertions(+), 1 deletion(-) diff --git a/src/assets/less/components/gp-jumbotron.less b/src/assets/less/components/gp-jumbotron.less index 0d91d2af4..dc4ab3910 100644 --- a/src/assets/less/components/gp-jumbotron.less +++ b/src/assets/less/components/gp-jumbotron.less @@ -262,4 +262,18 @@ } } } + + &.credits { + padding: 0; + height: 100%; + top: 0; + left: 0; + z-index: -1; + + .jumbotron_grid { + position: absolute; + top: -14px; + left: 65px; + } + } } diff --git a/src/views/components/gp-jumbotron.html b/src/views/components/gp-jumbotron.html index 9ba1cbe6a..e6a96d5bc 100644 --- a/src/views/components/gp-jumbotron.html +++ b/src/views/components/gp-jumbotron.html @@ -13,7 +13,6 @@
-
+ {{elseif gridType === 'type4'}} + {{/if}}
From 9f67cabf6348ac222bcdd1e97756cd1a03be9640 Mon Sep 17 00:00:00 2001 From: xbpcb Date: Tue, 10 Sep 2024 18:57:12 +0300 Subject: [PATCH 12/90] GpCredits: use new grid, fix info descr --- src/assets/less/pages/globalping/credits.less | 1 + src/views/pages/globalping/credits.html | 4 ++-- 2 files changed, 3 insertions(+), 2 deletions(-) diff --git a/src/assets/less/pages/globalping/credits.less b/src/assets/less/pages/globalping/credits.less index 2ad6f3e89..d611fa2fb 100644 --- a/src/assets/less/pages/globalping/credits.less +++ b/src/assets/less/pages/globalping/credits.less @@ -49,6 +49,7 @@ border: 1px solid #e7e7ee; border-radius: 8px; min-height: 186px; + background: #fff; &.registered { background: #e8fff9; diff --git a/src/views/pages/globalping/credits.html b/src/views/pages/globalping/credits.html index 51d1849fa..0a9a51c8a 100644 --- a/src/views/pages/globalping/credits.html +++ b/src/views/pages/globalping/credits.html @@ -10,14 +10,14 @@
- +

Globalping limits and credits

- Start using Globalping for free! You don't even need to register, just start using any of our web apps or tools right away! + Start using Globalping for free! You don't even need to register, just start using any of our web apps or tools
right away!
From 6b0f06d816c9ab347f9842866a1847aff822f173 Mon Sep 17 00:00:00 2001 From: xbpcb Date: Tue, 10 Sep 2024 21:50:45 +0300 Subject: [PATCH 13/90] GpCredits: mod info-block styles --- src/assets/less/pages/globalping/credits.less | 20 +++++++++++++++++++ 1 file changed, 20 insertions(+) diff --git a/src/assets/less/pages/globalping/credits.less b/src/assets/less/pages/globalping/credits.less index d611fa2fb..7c9095be5 100644 --- a/src/assets/less/pages/globalping/credits.less +++ b/src/assets/less/pages/globalping/credits.less @@ -10,12 +10,22 @@ .gp-credits { display: flex; flex-direction: column; + align-items: center; row-gap: 48px; padding: 48px 24px 8px; + @media (min-width: @screen-sm-min) { + padding-top: 100px; + } + &_info { display: flex; flex-direction: column; + width: 100%; + + @media (min-width: @screen-sm-min) { + max-width: 808px; + } &_title { font-size: 40px; @@ -41,6 +51,11 @@ row-gap: 8px; margin-top: 48px; + @media (min-width: @screen-sm-min) { + flex-direction: row; + column-gap: 8px; + } + &_block { display: flex; flex-direction: column; @@ -51,6 +66,11 @@ min-height: 186px; background: #fff; + @media (min-width: @screen-sm-min) { + flex-grow: 1; + flex-basis: 0; + } + &.registered { background: #e8fff9; From 2715a852c6e9f69a3795f7893bd5c15a251b72af Mon Sep 17 00:00:00 2001 From: xbpcb Date: Tue, 10 Sep 2024 21:57:35 +0300 Subject: [PATCH 14/90] GpCredits: add sponsors block polygons svg --- src/assets/img/globalping/credits/polygons_1.svg | 14 ++++++++++++++ src/assets/img/globalping/credits/polygons_2.svg | 14 ++++++++++++++ 2 files changed, 28 insertions(+) create mode 100644 src/assets/img/globalping/credits/polygons_1.svg create mode 100644 src/assets/img/globalping/credits/polygons_2.svg diff --git a/src/assets/img/globalping/credits/polygons_1.svg b/src/assets/img/globalping/credits/polygons_1.svg new file mode 100644 index 000000000..88bfdebfc --- /dev/null +++ b/src/assets/img/globalping/credits/polygons_1.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + + diff --git a/src/assets/img/globalping/credits/polygons_2.svg b/src/assets/img/globalping/credits/polygons_2.svg new file mode 100644 index 000000000..08fee8426 --- /dev/null +++ b/src/assets/img/globalping/credits/polygons_2.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + + From d1d323df7d4bdcc79f85756a86f81d68a672cf5d Mon Sep 17 00:00:00 2001 From: xbpcb Date: Tue, 10 Sep 2024 22:09:42 +0300 Subject: [PATCH 15/90] GpCredits: add sponsors polygons, mod styles --- src/assets/less/pages/globalping/credits.less | 42 +++++++++++++++++++ src/views/pages/globalping/credits.html | 12 ++++++ 2 files changed, 54 insertions(+) diff --git a/src/assets/less/pages/globalping/credits.less b/src/assets/less/pages/globalping/credits.less index 7c9095be5..e532ef85f 100644 --- a/src/assets/less/pages/globalping/credits.less +++ b/src/assets/less/pages/globalping/credits.less @@ -16,6 +16,7 @@ @media (min-width: @screen-sm-min) { padding-top: 100px; + row-gap: 80px; } &_info { @@ -123,15 +124,50 @@ } &_become-a-sponsor { + position: relative; display: flex; flex-direction: column; row-gap: 40px; + @media (min-width: @screen-sm-min) { + flex-direction: row; + flex-wrap: wrap; + column-gap: 48px; + overflow: visible; + } + + &_polygons { + position: absolute; + z-index: -1; + + &.left { + top: 418px; + left: -72px; + } + + &.right { + top: -75px; + right: 20px; + } + } + &_block { display: flex; flex-direction: column; row-gap: 16px; + @media (min-width: @screen-sm-min) { + max-width: 380px; + flex-grow: 1; + flex-basis: 0; + } + + &.right { + @media (min-width: @screen-sm-min) { + padding-top: 240px; + } + } + &_title { font-size: 32px; font-weight: 600; @@ -160,6 +196,7 @@ } &_btn { + height: 36px; width: 192px; font-size: 14px; font-weight: 400; @@ -174,6 +211,11 @@ display: flex; flex-direction: column; + @media (min-width: @screen-sm-min) { + max-width: 808px; + width: 100%; + } + &_title { font-size: 40px; font-weight: 600; diff --git a/src/views/pages/globalping/credits.html b/src/views/pages/globalping/credits.html index 0a9a51c8a..835cc50bc 100644 --- a/src/views/pages/globalping/credits.html +++ b/src/views/pages/globalping/credits.html @@ -86,6 +86,18 @@

Globalping limits and credits

+ + + +

Become a sponsor

From 3aa9a37392e382bd3f154e0a84c0ffa39170de34 Mon Sep 17 00:00:00 2001 From: xbpcb Date: Tue, 10 Sep 2024 22:13:04 +0300 Subject: [PATCH 16/90] GpCredits: small fixes --- src/assets/less/pages/globalping/credits.less | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/src/assets/less/pages/globalping/credits.less b/src/assets/less/pages/globalping/credits.less index e532ef85f..225cb65d4 100644 --- a/src/assets/less/pages/globalping/credits.less +++ b/src/assets/less/pages/globalping/credits.less @@ -130,8 +130,7 @@ row-gap: 40px; @media (min-width: @screen-sm-min) { - flex-direction: row; - flex-wrap: wrap; + flex-flow: row wrap; column-gap: 48px; overflow: visible; } @@ -172,7 +171,7 @@ font-size: 32px; font-weight: 600; line-height: 50px; - letter-spacing: 0.2px; + letter-spacing: .2px; text-align: left; color: #17233a; margin: 0; From 2f82480927884e70895eea8de668a03d306ea4b9 Mon Sep 17 00:00:00 2001 From: xbpcb Date: Tue, 10 Sep 2024 22:16:32 +0300 Subject: [PATCH 17/90] GpCredits: fix desktop paddings --- src/assets/less/pages/globalping/credits.less | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/assets/less/pages/globalping/credits.less b/src/assets/less/pages/globalping/credits.less index 225cb65d4..2d9418b1c 100644 --- a/src/assets/less/pages/globalping/credits.less +++ b/src/assets/less/pages/globalping/credits.less @@ -15,7 +15,7 @@ padding: 48px 24px 8px; @media (min-width: @screen-sm-min) { - padding-top: 100px; + padding: 100px 24px 88px; row-gap: 80px; } From c6b8f96a3c259fc4e52968893fc7f014fad189fe Mon Sep 17 00:00:00 2001 From: xbpcb Date: Tue, 10 Sep 2024 22:53:05 +0300 Subject: [PATCH 18/90] GpJumbotron: fix desktop styles --- src/assets/less/components/gp-jumbotron.less | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/src/assets/less/components/gp-jumbotron.less b/src/assets/less/components/gp-jumbotron.less index dc4ab3910..429cd70a3 100644 --- a/src/assets/less/components/gp-jumbotron.less +++ b/src/assets/less/components/gp-jumbotron.less @@ -274,6 +274,11 @@ position: absolute; top: -14px; left: 65px; + + @media (min-width: @screen-sm-min) { + top: -32px; + left: 65px; + } } } } From db0d1a0f497ba5c7c15c17c748a0882e63e270ad Mon Sep 17 00:00:00 2001 From: xbpcb Date: Tue, 10 Sep 2024 22:59:52 +0300 Subject: [PATCH 19/90] GpCredits: mod user benefits styles --- src/assets/less/pages/globalping/credits.less | 11 +++++++++-- 1 file changed, 9 insertions(+), 2 deletions(-) diff --git a/src/assets/less/pages/globalping/credits.less b/src/assets/less/pages/globalping/credits.less index 2d9418b1c..20372db08 100644 --- a/src/assets/less/pages/globalping/credits.less +++ b/src/assets/less/pages/globalping/credits.less @@ -64,8 +64,9 @@ padding: 24px 8px; border: 1px solid #e7e7ee; border-radius: 8px; - min-height: 186px; + height: 186px; background: #fff; + box-sizing: border-box; @media (min-width: @screen-sm-min) { flex-grow: 1; @@ -92,7 +93,6 @@ &_list { display: flex; flex-direction: column; - row-gap: 8px; &_item { display: flex; @@ -111,7 +111,14 @@ } &_hint { + display: flex; + align-items: center; + height: 14px; padding-left: 24px; + font-size: 12px; + font-weight: 400; + line-height: 12px; + text-align: left; } } } From 25de6912f941457602beefd03880ad8fcf937b33 Mon Sep 17 00:00:00 2001 From: xbpcb Date: Wed, 11 Sep 2024 18:48:51 +0300 Subject: [PATCH 20/90] RangeSlider: setup new component --- src/assets/less/app-globalping.less | 1 + src/assets/less/components/range-slider.less | 6 ++++++ src/views/components/range-slider.html | 17 +++++++++++++++++ 3 files changed, 24 insertions(+) create mode 100644 src/assets/less/components/range-slider.less create mode 100644 src/views/components/range-slider.html diff --git a/src/assets/less/app-globalping.less b/src/assets/less/app-globalping.less index cbc87b3bd..dcbd0aa1c 100644 --- a/src/assets/less/app-globalping.less +++ b/src/assets/less/app-globalping.less @@ -17,6 +17,7 @@ @import "components/gp-credits-message.less"; @import "components/gp-credits.less"; @import "components/controlled-textarea.less"; +@import "components/range-slider.less"; @import "pages/globalping.less"; @import "pages/globalping/cli.less"; diff --git a/src/assets/less/components/range-slider.less b/src/assets/less/components/range-slider.less new file mode 100644 index 000000000..67f57139e --- /dev/null +++ b/src/assets/less/components/range-slider.less @@ -0,0 +1,6 @@ +.range-slider { + font-family: Lexend, sans-serif; + font-style: normal; + font-weight: 400; + -webkit-font-smoothing: antialiased; +} \ No newline at end of file diff --git a/src/views/components/range-slider.html b/src/views/components/range-slider.html new file mode 100644 index 000000000..33bbaf87b --- /dev/null +++ b/src/views/components/range-slider.html @@ -0,0 +1,17 @@ +
+ +
+ + From 1c0f5353115d7a12c9f5824f6a6a3254ae536b37 Mon Sep 17 00:00:00 2001 From: xbpcb Date: Wed, 11 Sep 2024 22:00:14 +0300 Subject: [PATCH 21/90] GpCredits: rm redundant style rule --- src/assets/less/pages/globalping/credits.less | 1 - 1 file changed, 1 deletion(-) diff --git a/src/assets/less/pages/globalping/credits.less b/src/assets/less/pages/globalping/credits.less index 20372db08..b855bb61c 100644 --- a/src/assets/less/pages/globalping/credits.less +++ b/src/assets/less/pages/globalping/credits.less @@ -126,7 +126,6 @@ &_credits-donations { height: 100px; margin-top: 48px; - background-color: #e7e7ee; } } From b58bfe6b9f8801fd319fdfaed1d47336ba449103 Mon Sep 17 00:00:00 2001 From: xbpcb Date: Wed, 11 Sep 2024 22:00:38 +0300 Subject: [PATCH 22/90] RangeSlider: scaffold component logic --- src/assets/less/components/range-slider.less | 44 +++++++- src/views/components/range-slider.html | 100 ++++++++++++++++++- 2 files changed, 142 insertions(+), 2 deletions(-) diff --git a/src/assets/less/components/range-slider.less b/src/assets/less/components/range-slider.less index 67f57139e..e4f363399 100644 --- a/src/assets/less/components/range-slider.less +++ b/src/assets/less/components/range-slider.less @@ -1,6 +1,48 @@ -.range-slider { +.c-range-slider { font-family: Lexend, sans-serif; font-style: normal; font-weight: 400; -webkit-font-smoothing: antialiased; + + .range-slider { + position: relative; + width: 100%; + height: 4px; + + &_line { + position: absolute; + display: flex; + justify-content: space-between; + align-items: center; + top: 0; + left: 0; + width: 100%; + height: 4px; + } + + &_knob { + position: absolute; + width: 16px; + height: 16px; + background: #17d4a7; + cursor: pointer; + transition: left .2s ease; + border: 2px solid #fff; + border-radius: 50%; + box-shadow: 0 2px 4px 0 #000033; + transform: translate(-50%, calc(-50% + 2px)); + } + } + + .part { + flex-grow: 1; + height: 100%; + background-color: #e7e7ee; + transition: background-color .3s ease; + } + + .gap { + width: 2px; + background: transparent; + } } \ No newline at end of file diff --git a/src/views/components/range-slider.html b/src/views/components/range-slider.html index 33bbaf87b..1f95d8cf8 100644 --- a/src/views/components/range-slider.html +++ b/src/views/components/range-slider.html @@ -1,5 +1,10 @@
+
+
+
+
+

From a35b0f487ab75a3d184d7990d328a8ba5c4f6005 Mon Sep 17 00:00:00 2001 From: xbpcb Date: Thu, 12 Sep 2024 21:52:39 +0300 Subject: [PATCH 34/90] Small fixes --- src/views/components/range-slider.html | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/views/components/range-slider.html b/src/views/components/range-slider.html index 7a110a6f9..a3e5dd0b8 100644 --- a/src/views/components/range-slider.html +++ b/src/views/components/range-slider.html @@ -120,8 +120,8 @@ } } - let partWidth = parts[0].offsetWidth + partsGap; - let maxSliderPosition = partWidth * partsCount; + let partWidth = parts[0].offsetWidth + partsGap; + let maxSliderPosition = partWidth * partsCount; this.set('partsElements', parts); this.set('partWidth', partWidth); From 9e8fa10c6cdd457490d17dd0997fe58b9b31667b Mon Sep 17 00:00:00 2001 From: xbpcb Date: Thu, 12 Sep 2024 22:31:36 +0300 Subject: [PATCH 35/90] RangeSlider: mod donation-credits logic --- src/assets/less/components/range-slider.less | 1 + src/views/components/range-slider.html | 28 +++++++++++++++----- 2 files changed, 22 insertions(+), 7 deletions(-) diff --git a/src/assets/less/components/range-slider.less b/src/assets/less/components/range-slider.less index 28acf40ab..0cc8c70aa 100644 --- a/src/assets/less/components/range-slider.less +++ b/src/assets/less/components/range-slider.less @@ -79,6 +79,7 @@ } &-slider-header { + height: 24px; text-align: center; font-size: 16px; font-weight: 600; diff --git a/src/views/components/range-slider.html b/src/views/components/range-slider.html index a3e5dd0b8..5f487cbb3 100644 --- a/src/views/components/range-slider.html +++ b/src/views/components/range-slider.html @@ -1,8 +1,10 @@
{{#if useDefaultHeader}} -
- {{creditsPerDollar * donationValue}} credits/donation -
+
+ {{#if donationValue}} + {{creditsPerDollar * donationValue}} credits/donation + {{/if}} +
{{elseif @this.partials.customHeader}} {{>customHeader}} {{/if}} @@ -23,7 +25,7 @@ return { useDefaultHeader: true, creditsPerDollar: 200, - donationValue: 1, + donationValue: null, partsCount: 9, partsGap: 2, sliderPosition: 0, @@ -172,17 +174,29 @@ // initiate the slider this.updateSliderPosition(); + + this.observe('sliderPosition', (sliderPosition) => { + let partWidth = this.get('partWidth'); + let partsLabelsData = this.get('partsLabelsData'); + let partIdx = Math.round(sliderPosition / partWidth) - 1; + + if (partIdx < 0) { + this.set('donationValue', null); + } else { + this.set('donationValue', partsLabelsData[partIdx].value); + } + }); } }, updateSliderPosition () { let sliderPosition = this.get('sliderPosition'); let partsElements = this.get('partsElements'); let partWidth = this.get('partWidth'); - let sliderKnob = document.getElementById('slider-knob'); + let sliderKnobEl = document.getElementById('slider-knob'); - sliderKnob.style.left = `${sliderPosition}px`; + sliderKnobEl.style.left = `${sliderPosition}px`; - // highlight parts to the left of the sliderKnob + // highlight parts to the left of the sliderKnobEl partsElements.forEach((partEl, idx) => { if (idx * partWidth < sliderPosition) { partEl.style.backgroundColor = '#17d4a7'; From 67abcfdf2e6d9b66aeb83aa9ef1657c4d992eadc Mon Sep 17 00:00:00 2001 From: xbpcb Date: Fri, 13 Sep 2024 15:56:40 +0300 Subject: [PATCH 36/90] GpCredits: add an icon with a tooltip as a hint --- src/assets/less/pages/globalping/credits.less | 17 ++++++++++++----- src/views/pages/globalping/credits.html | 11 ++++++++++- 2 files changed, 22 insertions(+), 6 deletions(-) diff --git a/src/assets/less/pages/globalping/credits.less b/src/assets/less/pages/globalping/credits.less index b855bb61c..7a4257acb 100644 --- a/src/assets/less/pages/globalping/credits.less +++ b/src/assets/less/pages/globalping/credits.less @@ -113,12 +113,15 @@ &_hint { display: flex; align-items: center; - height: 14px; + column-gap: 10px; padding-left: 24px; - font-size: 12px; - font-weight: 400; - line-height: 12px; - text-align: left; + + > span { + font-size: 12px; + font-weight: 400; + line-height: 12px; + text-align: left; + } } } } @@ -275,3 +278,7 @@ } } } + +.gp-credits_tooltip { + border-radius: 8px; +} diff --git a/src/views/pages/globalping/credits.html b/src/views/pages/globalping/credits.html index 2c38a75fc..d34e889a8 100644 --- a/src/views/pages/globalping/credits.html +++ b/src/views/pages/globalping/credits.html @@ -78,7 +78,11 @@

Globalping limits and credits

- Higher limits for members! + Higher limits for members! +
@@ -151,7 +155,12 @@

Frequently Asked Questions

From fefcba77853332644a0880e38f399cd613dc1ae4 Mon Sep 17 00:00:00 2001 From: xbpcb Date: Thu, 19 Sep 2024 23:39:22 +0300 Subject: [PATCH 62/90] RangeSlider: rename vars, add TODO --- src/views/components/range-slider.html | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) diff --git a/src/views/components/range-slider.html b/src/views/components/range-slider.html index 970e7bf92..da1e6ea4f 100644 --- a/src/views/components/range-slider.html +++ b/src/views/components/range-slider.html @@ -282,18 +282,19 @@ this.updateSliderPosition(); }, + // TODO: 673, while dragging it is possible to move out of available ranges fix it handleSliderOnMouseDown (x) { let partsElements = this.get('partsElements'); let partWidth = this.get('partWidth'); let sliderKnobEl = document.getElementById('slider-knob'); - let division = Math.round(x / partWidth); + let quotient = Math.round(x / partWidth); - sliderKnobEl.style.left = `${division * partWidth}px`; + sliderKnobEl.style.left = `${quotient * partWidth}px`; // highlight parts to the left of the sliderKnobEl partsElements.forEach((partEl, idx) => { - if (idx < division) { + if (idx < quotient) { partEl.style.backgroundColor = '#17d4a7'; } else { partEl.style.backgroundColor = '#e7e7ee'; From 8dab7c8f7dae9f9af762f498311619814d7d0854 Mon Sep 17 00:00:00 2001 From: xbpcb Date: Fri, 20 Sep 2024 17:34:24 +0300 Subject: [PATCH 63/90] GpCredits: small styles fix --- src/assets/less/pages/globalping/credits.less | 9 ++++++--- src/views/pages/globalping/credits.html | 8 ++++---- 2 files changed, 10 insertions(+), 7 deletions(-) diff --git a/src/assets/less/pages/globalping/credits.less b/src/assets/less/pages/globalping/credits.less index 1f623f99e..0f69d7a45 100644 --- a/src/assets/less/pages/globalping/credits.less +++ b/src/assets/less/pages/globalping/credits.less @@ -101,11 +101,14 @@ height: 28px; padding-left: 24px; - &_numbers { + &_numbers, &_text { font-size: 14px; - font-weight: 600; line-height: 20px; - text-align: left; + color: #17233a; + } + + &_numbers { + font-weight: 600; } } } diff --git a/src/views/pages/globalping/credits.html b/src/views/pages/globalping/credits.html index 6b2d29681..73a66dd3e 100644 --- a/src/views/pages/globalping/credits.html +++ b/src/views/pages/globalping/credits.html @@ -36,7 +36,7 @@

Globalping limits and credits

{{this.userBenefits.unregistered.probesPerMeas}} - Probes per measurement + Probes per measurement @@ -49,7 +49,7 @@

Globalping limits and credits

{{this.userBenefits.unregistered.freeTestsPerHour}} - Free tests per hour + Free tests per hour
@@ -64,7 +64,7 @@

Globalping limits and credits

src="{{@shared.assetsHost}}/img/globalping/check.svg" loading="lazy"> {{this.userBenefits.registered.probesPerMeas}} - Probes per measurement + Probes per measurement @@ -73,7 +73,7 @@

Globalping limits and credits

src="{{@shared.assetsHost}}/img/globalping/check.svg" loading="lazy"> {{this.userBenefits.registered.freeTestsPerHour}} - Free tests per hour + Free tests per hour
From 05049e416e74ebd99ea9429fd589e7cc6c5c77ee Mon Sep 17 00:00:00 2001 From: Dmitriy Akulov Date: Fri, 20 Sep 2024 17:11:58 +0200 Subject: [PATCH 64/90] FAQ credits --- src/views/pages/globalping/credits.html | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/src/views/pages/globalping/credits.html b/src/views/pages/globalping/credits.html index 6b2d29681..7ce7ba807 100644 --- a/src/views/pages/globalping/credits.html +++ b/src/views/pages/globalping/credits.html @@ -186,6 +186,10 @@

Frequently Asked Questions

question: 'How to generate free credits?', answer: 'Simply login to the Globalping Dashboard and follow the instructions. You will need to host a probe using a Docker container or by ordering our hardware probe.', }, + { + question: 'What is a credit and what does it do?', + answer: 'A single credit equals to one test. For example if you request a ping measurement from 5 locations, it will use 5 credits. A single measurement can request up to 500 probes, which effectively means a maximum of 500 credits being used per measurement.', + }, { question: 'How to buy more credits?', answer: 'You will need to register an account first and then donate your chosen ammount using GitHub Sponsors. Our system will pick up the donation and credit your account.', From 17f9dfa6a4c2ddacffbe001bad71865634f929aa Mon Sep 17 00:00:00 2001 From: xbpcb Date: Fri, 20 Sep 2024 20:36:42 +0300 Subject: [PATCH 65/90] GpCredits: allow to use html elements in faq answers, fix gp-dash link --- src/assets/less/pages/globalping/credits.less | 5 +++++ src/views/pages/globalping/credits.html | 4 ++-- 2 files changed, 7 insertions(+), 2 deletions(-) diff --git a/src/assets/less/pages/globalping/credits.less b/src/assets/less/pages/globalping/credits.less index 0f69d7a45..f3adf5036 100644 --- a/src/assets/less/pages/globalping/credits.less +++ b/src/assets/less/pages/globalping/credits.less @@ -281,6 +281,11 @@ line-height: 20px; text-align: left; color: #17233a; + + > a { + color: #17d4a7; + font-weight: 600; + } } } } diff --git a/src/views/pages/globalping/credits.html b/src/views/pages/globalping/credits.html index e9e8f0440..1a7c544db 100644 --- a/src/views/pages/globalping/credits.html +++ b/src/views/pages/globalping/credits.html @@ -151,7 +151,7 @@

Frequently Asked Questions

{{#each faq}}
{{this.question}} - {{this.answer}} + {{{this.answer}}}
{{/each}}
@@ -184,7 +184,7 @@

Frequently Asked Questions

faq: [ { question: 'How to generate free credits?', - answer: 'Simply login to the Globalping Dashboard and follow the instructions. You will need to host a probe using a Docker container or by ordering our hardware probe.', + answer: 'Simply login to the Globalping Dashboard and follow the instructions. You will need to host a probe using a Docker container or by ordering our hardware probe.', }, { question: 'What is a credit and what does it do?', From 35d9b6baaebdcb8cfa921df194bbe40d4c8cd4a5 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Martin=20Kol=C3=A1rik?= Date: Sun, 22 Sep 2024 21:59:19 +0200 Subject: [PATCH 66/90] Fixes --- src/views/components/range-slider.html | 19 ++++++++++--------- src/views/pages/globalping/credits.html | 6 +++--- 2 files changed, 13 insertions(+), 12 deletions(-) diff --git a/src/views/components/range-slider.html b/src/views/components/range-slider.html index da1e6ea4f..1485659a0 100644 --- a/src/views/components/range-slider.html +++ b/src/views/components/range-slider.html @@ -18,6 +18,7 @@
From 83588e951d0433b411c9aeac0c6bf2be1495cd28 Mon Sep 17 00:00:00 2001 From: xbpcb Date: Mon, 23 Sep 2024 19:46:52 +0300 Subject: [PATCH 71/90] RangeSlider: add free case --- src/assets/less/components/range-slider.less | 6 +++- src/views/components/range-slider.html | 32 +++++++++++++++----- 2 files changed, 29 insertions(+), 9 deletions(-) diff --git a/src/assets/less/components/range-slider.less b/src/assets/less/components/range-slider.less index 0cc8c70aa..75bfe1736 100644 --- a/src/assets/less/components/range-slider.less +++ b/src/assets/less/components/range-slider.less @@ -69,12 +69,16 @@ display: flex; flex-grow: 1; flex-basis: 0; - justify-content: flex-start; + justify-content: flex-end; overflow: hidden; font-size: 14px; font-weight: 400; line-height: 20px; color: #17233a; + + &.first-label { + justify-content: space-between; + } } } diff --git a/src/views/components/range-slider.html b/src/views/components/range-slider.html index cefc3c5fa..152f04333 100644 --- a/src/views/components/range-slider.html +++ b/src/views/components/range-slider.html @@ -19,7 +19,11 @@ From ae82268dfbdf4ce0634b8946e03b2ad69197ff3d Mon Sep 17 00:00:00 2001 From: xbpcb Date: Mon, 23 Sep 2024 21:50:45 +0300 Subject: [PATCH 74/90] RangeSlider: linter fix, rm unused code --- src/views/components/range-slider.html | 3 --- 1 file changed, 3 deletions(-) diff --git a/src/views/components/range-slider.html b/src/views/components/range-slider.html index 66c4ed389..29e627c6f 100644 --- a/src/views/components/range-slider.html +++ b/src/views/components/range-slider.html @@ -181,9 +181,6 @@ document.removeEventListener('mousemove', onMouseMove); document.removeEventListener('mouseup', onMouseUp); - let rect = sliderContainer.getBoundingClientRect(); - let x = event.clientX - rect.left; - // reset isSliderDragging with a next tick to avoid conflicts with an occasional click event setTimeout(() => { isSliderDragging = false; From b4748dc32d2906d8ce5690b77ecbebc1498d9717 Mon Sep 17 00:00:00 2001 From: xbpcb Date: Mon, 23 Sep 2024 21:51:32 +0300 Subject: [PATCH 75/90] Small fix --- src/views/components/range-slider.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/views/components/range-slider.html b/src/views/components/range-slider.html index 29e627c6f..ed02dde93 100644 --- a/src/views/components/range-slider.html +++ b/src/views/components/range-slider.html @@ -177,7 +177,7 @@ this.handleSliderOnMouseDown(x); }; - let onMouseUp = (event) => { + let onMouseUp = () => { document.removeEventListener('mousemove', onMouseMove); document.removeEventListener('mouseup', onMouseUp); From 8c991990583f5999201dec40f9f5cb4720467f48 Mon Sep 17 00:00:00 2001 From: xbpcb Date: Mon, 23 Sep 2024 22:15:36 +0300 Subject: [PATCH 76/90] Gp: add an id to the join-the-network el --- src/views/pages/globalping/_index.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/views/pages/globalping/_index.html b/src/views/pages/globalping/_index.html index 260ae3537..857949f5d 100644 --- a/src/views/pages/globalping/_index.html +++ b/src/views/pages/globalping/_index.html @@ -813,7 +813,7 @@
-
+
Join the network To join the Globalping probe network all you have to do is run our container. From 6707d57df6e5d71e0c0691386fe1b6ca17b5740c Mon Sep 17 00:00:00 2001 From: xbpcb Date: Mon, 23 Sep 2024 22:43:55 +0300 Subject: [PATCH 77/90] GpCredits: onclick host-a-probe open main page join-the-net el --- src/views/pages/globalping/credits.html | 12 +++++------- 1 file changed, 5 insertions(+), 7 deletions(-) diff --git a/src/views/pages/globalping/credits.html b/src/views/pages/globalping/credits.html index f27668d10..1395ba99a 100644 --- a/src/views/pages/globalping/credits.html +++ b/src/views/pages/globalping/credits.html @@ -116,9 +116,8 @@

+200 tests per $1 donated Everyone gets free credits and passive credits generation features, but we still require larger corporations to help us pay for the development costs.

- + Host a probe
@@ -209,10 +208,9 @@

Frequently Asked Questions

], }; }, - oninit () { - if (!Ractive.isServer) { - // on init actions - } + openLink (url) { + event.preventDefault(); + window.open(url, '_blank'); }, }; From 83dd18cb49ba3e83177c5fae6a7e549e97b0a77e Mon Sep 17 00:00:00 2001 From: xbpcb Date: Tue, 24 Sep 2024 16:40:05 +0300 Subject: [PATCH 78/90] RAngeSlider: handle screen width changes --- src/views/components/range-slider.html | 14 ++++++++++++++ 1 file changed, 14 insertions(+) diff --git a/src/views/components/range-slider.html b/src/views/components/range-slider.html index ed02dde93..e1ea1fa3c 100644 --- a/src/views/components/range-slider.html +++ b/src/views/components/range-slider.html @@ -19,6 +19,8 @@ From 08a9073fb072212f07a67237ef7ad3c92924d816 Mon Sep 17 00:00:00 2001 From: xbpcb Date: Thu, 26 Sep 2024 19:13:06 +0300 Subject: [PATCH 85/90] RangeSlider: mod logic for small screens --- src/assets/less/components/range-slider.less | 12 +++ src/views/components/range-slider.html | 105 ++++++++++++++----- 2 files changed, 91 insertions(+), 26 deletions(-) diff --git a/src/assets/less/components/range-slider.less b/src/assets/less/components/range-slider.less index 75bfe1736..b6fa92cbf 100644 --- a/src/assets/less/components/range-slider.less +++ b/src/assets/less/components/range-slider.less @@ -79,6 +79,18 @@ &.first-label { justify-content: space-between; } + + &.m-first-label { + justify-content: flex-start; + } + + &.m-middle-label { + justify-content: center; + } + + &.m-last-label { + justify-content: flex-end; + } } } diff --git a/src/views/components/range-slider.html b/src/views/components/range-slider.html index 9e93e81b9..095fcde91 100644 --- a/src/views/components/range-slider.html +++ b/src/views/components/range-slider.html @@ -90,6 +90,11 @@ ], }; }, + oninit () { + if (!Ractive.isServer) { + this.set('screenWidth', screen.width); + } + }, onrender () { if (!Ractive.isServer) { let isSliderDragging = false; @@ -200,12 +205,17 @@ // handle slider position this.observe('sliderPosition', (sliderPosition) => { let partsLabelsData = this.get('partsLabelsData'); + let donationValue; if (sliderPosition - 1 < 0) { - this.set('donationValue', NO_DONATION.value); + donationValue = NO_DONATION.value; } else { - this.set('donationValue', partsLabelsData[sliderPosition - 1].value); + donationValue = partsLabelsData[sliderPosition - 1].value; } + + this.set('donationValue', donationValue); + + this.updateSliderSelectedValue(); }); // create default header based on the Slider value @@ -239,6 +249,8 @@ sliderKnobEl.style.left = `${sliderPosition * updPartWidth}px`; this.set('partWidth', updPartWidth); + this.set('screenWidth', screen.width); + this.createSliderLabels(); }, 200))); } }, @@ -340,37 +352,78 @@ createSliderLabels () { let sliderLabels = document.getElementById('slider-labels'); let partsLabelsData = this.get('partsLabelsData'); + let screenWidth = this.get('screenWidth'); + let partLabelClassname = this.get('partLabelClassname'); let partsCount = partsLabelsData.length; - // divide the line with parts and gaps, create parts labels - for (let i = 0; i < partsCount; i++) { - // create labels line - let partLabelEl = document.createElement('div'); - partLabelEl.className = this.get('partLabelClassname'); - - if (i === 0) { - let freeLabelElPart = document.createElement('span'); - let firstLabelElPart = document.createElement('span'); - - partLabelEl.className = `${partLabelEl.className} first-label`; - freeLabelElPart.textContent = NO_DONATION.displayed; - firstLabelElPart.textContent = partsLabelsData[i].displayed; - partLabelEl.appendChild(freeLabelElPart); - partLabelEl.appendChild(firstLabelElPart); - } else { - partLabelEl.textContent = partsLabelsData[i].displayed; - } + // if there are labels - remove them + let labels = sliderLabels.querySelectorAll('div'); - sliderLabels.appendChild(partLabelEl); + if (labels.length > 0) { + labels.forEach(label => sliderLabels.removeChild(label)); + } - // add gap between slider labels, except after the last part - if (i < partsCount - 1) { - let gapEl = document.createElement('div'); + // create labels line + if (screenWidth < 576) { + let firstLabelEl = document.createElement('div'); + let middleLabelEl = document.createElement('div'); + let lastLabelEl = document.createElement('div'); - gapEl.className = this.get('gapClassname'); - sliderLabels.appendChild(gapEl); + firstLabelEl.className = `${partLabelClassname} m-first-label`; + middleLabelEl.className = `${partLabelClassname} m-middle-label`; + lastLabelEl.className = `${partLabelClassname} m-last-label`; + + firstLabelEl.textContent = NO_DONATION.displayed; + middleLabelEl.textContent = this.getMiddleLabelText(); + lastLabelEl.textContent = partsLabelsData[partsCount - 1].displayed; + + sliderLabels.appendChild(firstLabelEl); + sliderLabels.appendChild(middleLabelEl); + sliderLabels.appendChild(lastLabelEl); + } else { + // divide the line with parts and gaps, create parts labels + for (let i = 0; i < partsCount; i++) { + let partLabelEl = document.createElement('div'); + partLabelEl.className = partLabelClassname; + + if (i === 0) { + let freeLabelElPart = document.createElement('span'); + let firstLabelElPart = document.createElement('span'); + + partLabelEl.className = `${partLabelEl.className} first-label`; + freeLabelElPart.textContent = NO_DONATION.displayed; + firstLabelElPart.textContent = partsLabelsData[i].displayed; + partLabelEl.appendChild(freeLabelElPart); + partLabelEl.appendChild(firstLabelElPart); + } else { + partLabelEl.textContent = partsLabelsData[i].displayed; + } + + sliderLabels.appendChild(partLabelEl); + + // add gap between slider labels, except after the last part + if (i < partsCount - 1) { + let gapEl = document.createElement('div'); + + gapEl.className = this.get('gapClassname'); + sliderLabels.appendChild(gapEl); + } } } }, + updateSliderSelectedValue () { + let middleLabel = document.querySelector('.m-middle-label'); + + if (middleLabel) { + middleLabel.textContent = this.getMiddleLabelText(); + } + }, + getMiddleLabelText () { + let sliderPosition = this.get('sliderPosition'); + let partsLabelsData = this.get('partsLabelsData'); + let newLabelData = partsLabelsData[sliderPosition - 1] ? partsLabelsData[sliderPosition - 1] : null; + + return newLabelData === null ? '' : newLabelData.value === CUSTOM_DONATION_VALUE ? '' : newLabelData.displayed; + }, }; From 2c6b142426ad5b6e9f8dcc9094fd84cd275d6464 Mon Sep 17 00:00:00 2001 From: xbpcb Date: Fri, 27 Sep 2024 17:48:50 +0300 Subject: [PATCH 86/90] RangeSlider: mod labels positioning --- src/assets/less/components/range-slider.less | 11 ++---- src/views/components/range-slider.html | 40 ++++++++++---------- 2 files changed, 23 insertions(+), 28 deletions(-) diff --git a/src/assets/less/components/range-slider.less b/src/assets/less/components/range-slider.less index b6fa92cbf..b3b0b060e 100644 --- a/src/assets/less/components/range-slider.less +++ b/src/assets/less/components/range-slider.less @@ -61,25 +61,22 @@ } &-slider-labels { + position: relative; display: flex; justify-content: space-between; align-items: center; + height: 20px; &_label { display: flex; - flex-grow: 1; - flex-basis: 0; - justify-content: flex-end; + justify-content: center; + align-items: center; overflow: hidden; font-size: 14px; font-weight: 400; line-height: 20px; color: #17233a; - &.first-label { - justify-content: space-between; - } - &.m-first-label { justify-content: flex-start; } diff --git a/src/views/components/range-slider.html b/src/views/components/range-slider.html index 095fcde91..d09a31d8f 100644 --- a/src/views/components/range-slider.html +++ b/src/views/components/range-slider.html @@ -44,7 +44,7 @@ defaultHeaderText: null, defaultHeaderAdditional: null, partsGap: 2, - sliderPosition: 0, + sliderPosition: 1, partsElements: [], partWidth: null, partClassname: 'range-slider_line_part', @@ -353,6 +353,7 @@ let sliderLabels = document.getElementById('slider-labels'); let partsLabelsData = this.get('partsLabelsData'); let screenWidth = this.get('screenWidth'); + let partWidth = this.get('partWidth'); let partLabelClassname = this.get('partLabelClassname'); let partsCount = partsLabelsData.length; @@ -364,7 +365,7 @@ } // create labels line - if (screenWidth < 576) { + if (screenWidth < 768) { let firstLabelEl = document.createElement('div'); let middleLabelEl = document.createElement('div'); let lastLabelEl = document.createElement('div'); @@ -381,33 +382,30 @@ sliderLabels.appendChild(middleLabelEl); sliderLabels.appendChild(lastLabelEl); } else { - // divide the line with parts and gaps, create parts labels for (let i = 0; i < partsCount; i++) { + if (i === 0) { + let firstLabelEl = document.createElement('div'); + + firstLabelEl.className = partLabelClassname; + firstLabelEl.textContent = NO_DONATION.displayed; + sliderLabels.appendChild(firstLabelEl); + } + let partLabelEl = document.createElement('div'); + partLabelEl.className = partLabelClassname; + partLabelEl.textContent = partsLabelsData[i].displayed; + partLabelEl.style.position = 'absolute'; - if (i === 0) { - let freeLabelElPart = document.createElement('span'); - let firstLabelElPart = document.createElement('span'); - - partLabelEl.className = `${partLabelEl.className} first-label`; - freeLabelElPart.textContent = NO_DONATION.displayed; - firstLabelElPart.textContent = partsLabelsData[i].displayed; - partLabelEl.appendChild(freeLabelElPart); - partLabelEl.appendChild(firstLabelElPart); + if (i === partsCount - 1) { + partLabelEl.className = partLabelClassname; + partLabelEl.style.right = 0; } else { - partLabelEl.textContent = partsLabelsData[i].displayed; + partLabelEl.style.left = `${(i + 1) * partWidth - 1}px`; + partLabelEl.style.transform = 'translateX(-50%)'; } sliderLabels.appendChild(partLabelEl); - - // add gap between slider labels, except after the last part - if (i < partsCount - 1) { - let gapEl = document.createElement('div'); - - gapEl.className = this.get('gapClassname'); - sliderLabels.appendChild(gapEl); - } } } }, From 5a591e2c05368d250ca484ccd718685a6fa5cb73 Mon Sep 17 00:00:00 2001 From: xbpcb Date: Fri, 27 Sep 2024 19:51:47 +0300 Subject: [PATCH 87/90] RangeSlider: fix screen resize handling --- src/views/components/range-slider.html | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/views/components/range-slider.html b/src/views/components/range-slider.html index d09a31d8f..3c9beef7d 100644 --- a/src/views/components/range-slider.html +++ b/src/views/components/range-slider.html @@ -92,7 +92,7 @@ }, oninit () { if (!Ractive.isServer) { - this.set('screenWidth', screen.width); + this.set('screenWidth', window.innerWidth); } }, onrender () { @@ -249,7 +249,7 @@ sliderKnobEl.style.left = `${sliderPosition * updPartWidth}px`; this.set('partWidth', updPartWidth); - this.set('screenWidth', screen.width); + this.set('screenWidth', window.innerWidth); this.createSliderLabels(); }, 200))); } From 45aece2962f8b40b975220ad1ecd1dca86d1b8a6 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Martin=20Kol=C3=A1rik?= Date: Sat, 28 Sep 2024 11:59:57 +0200 Subject: [PATCH 88/90] Update vcs.xml --- .idea/vcs.xml | 13 ------------- 1 file changed, 13 deletions(-) delete mode 100644 .idea/vcs.xml diff --git a/.idea/vcs.xml b/.idea/vcs.xml deleted file mode 100644 index 38e1abb11..000000000 --- a/.idea/vcs.xml +++ /dev/null @@ -1,13 +0,0 @@ - - - - - - - - - - - - - \ No newline at end of file From f98d0204d1704e0a643bb7bc95163cacee268d8e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Martin=20Kol=C3=A1rik?= Date: Sat, 28 Sep 2024 12:00:33 +0200 Subject: [PATCH 89/90] update slider --- src/assets/less/components/range-slider.less | 4 ++-- src/views/components/range-slider.html | 7 +------ 2 files changed, 3 insertions(+), 8 deletions(-) diff --git a/src/assets/less/components/range-slider.less b/src/assets/less/components/range-slider.less index b3b0b060e..8935afe3b 100644 --- a/src/assets/less/components/range-slider.less +++ b/src/assets/less/components/range-slider.less @@ -52,10 +52,10 @@ height: 16px; background: #17d4a7; cursor: pointer; - transition: left .2s ease; + transition: left .1s linear; border: 2px solid #fff; border-radius: 50%; - box-shadow: 0 2px 4px 0 #003; + box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .2); transform: translate(-50%, 0); } } diff --git a/src/views/components/range-slider.html b/src/views/components/range-slider.html index 3c9beef7d..6473203f2 100644 --- a/src/views/components/range-slider.html +++ b/src/views/components/range-slider.html @@ -30,7 +30,7 @@ const NO_DONATION = { value: 'free', displayed: 'Free', - msg: 'TODO: 500 free tests/hour', + msg: '250 free tests/hour', }; component.exports = { @@ -274,7 +274,6 @@ moveSliderToClosestPart (x) { let partWidth = this.get('partWidth'); let partsCount = this.get('partsLabelsData').length; - let currSliderPos = this.get('sliderPosition'); let newSliderPos = Math.round((x < 0 ? 0 : x) / partWidth); let updSliderPos; @@ -282,10 +281,6 @@ updSliderPos = 0; } else if (newSliderPos > partsCount) { updSliderPos = partsCount; - } else if (x - currSliderPos * partWidth < partWidth && x - currSliderPos * partWidth > 0) { - updSliderPos = currSliderPos + 1; - } else if (currSliderPos * partWidth - x < partWidth && currSliderPos * partWidth - x > 0) { - updSliderPos = currSliderPos - 1; } else { updSliderPos = newSliderPos; } From 241b7af82cd5267fd26c88b66dbc219454f91239 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Martin=20Kol=C3=A1rik?= Date: Sat, 28 Sep 2024 13:04:25 +0200 Subject: [PATCH 90/90] update texts --- src/views/pages/globalping/credits.html | 36 ++++++++++++------------- 1 file changed, 18 insertions(+), 18 deletions(-) diff --git a/src/views/pages/globalping/credits.html b/src/views/pages/globalping/credits.html index 1395ba99a..464421486 100644 --- a/src/views/pages/globalping/credits.html +++ b/src/views/pages/globalping/credits.html @@ -18,7 +18,7 @@

Globalping limits and credits

- Start using Globalping for free! You don't even need to register, just start using any of our web apps or tools
right away! + Start using Globalping for free - no registration needed!
@@ -79,7 +79,7 @@

Globalping limits and credits

Higher limits for members! - @@ -111,14 +111,16 @@

Become a sponsor

+200 tests per $1 donated

- We aim to offer a free and reliable service to everyone, from home users and solo developers to startups, corporations and large enterprises. - To support the active development of the project we're doing our best to keep things fair. - Everyone gets free credits and passive credits generation features, but we still require larger corporations to help us pay for the development costs. + We aim to offer a reliable service to everyone, + from home users and solo developers to startups, corporations, and large enterprises. + We're doing our best to keep things fair. Everyone gets a number of free requests every hour, + while larger users may pay for additional requests, and help support the active development of the project.
- - Host a probe + + Become a GitHub sponsor
@@ -128,23 +130,21 @@

Host a probe

+150 tests/probe/day

- Generate free credits passively! Simply adopt a Globalping probe under your account and become a member of the community. - For every day your probe stays online you will get free credits to be used in your tests! + Generate free credits passively! + Become a member of the community by hosting a probe and adopting it under your account. + For each day your probe stays online, you will get additional free credits.
- - Become a GitHub sponsor + + Host a probe

Frequently Asked Questions

- - Start using Globalping for free! You don't even need to register, just start using any of our web apps or tools right away! - +
{{#each faq}} @@ -191,7 +191,7 @@

Frequently Asked Questions

}, { question: 'How to buy more credits?', - answer: 'You will need to register an account first and then donate your chosen ammount using GitHub Sponsors. Our system will pick up the donation and credit your account.', + answer: 'You will need to register an account first and then donate your chosen amount using GitHub Sponsors. Our system will pick up the donation and credit your account automatically.', }, { question: 'Can I use credits to power a commercial tool or product?',