diff --git a/java-sso-example/README.md b/java-sso-example/README.md index c8410b6..186aef9 100644 --- a/java-sso-example/README.md +++ b/java-sso-example/README.md @@ -51,11 +51,11 @@ The .env file is listed in this repo's .gitignore file, so your sensitive inform ## Set up SSO with WorkOS 7. Create an [Organization](https://dashboard.workos.com/organizations) and an [SSO Connection](https://workos.com/docs/sso/guide/introduction) in the Organization in your WorkOS Dashboard. -8. Copy the Connection ID from the new connection that you just set up and add it to the same .env file that you created in step 6. The .env file should now look like this: +8. Copy the Organization ID from the organization that you just set up and add it to the same .env file that you created in step 6. The .env file should now look like this: ```bash WORKOS_API_KEY=your_api_key_here WORKOS_CLIENT_ID=your_project_id_here -WORKOS_CONNECTION_ID=your_connection_id_here +WORKOS_ORGANIZATION_ID=your_organization_id_here ``` 10. Add http://localhost:7001/callback as the default Redirect URI in the Configuration section of the WorkOS Dashboard: diff --git a/java-sso-example/src/main/java/com/workos/java/examples/SsoApp.java b/java-sso-example/src/main/java/com/workos/java/examples/SsoApp.java index d954c0e..0ee8052 100644 --- a/java-sso-example/src/main/java/com/workos/java/examples/SsoApp.java +++ b/java-sso-example/src/main/java/com/workos/java/examples/SsoApp.java @@ -25,22 +25,33 @@ public SsoApp() { clientId = env.get("WORKOS_CLIENT_ID"); app.get("/", this::isLoggedIn); - app.get("/login", this::login); + app.post("/login", this::login); app.get("/callback", this::callback); app.get("logout", this::logout); } public void login(Context ctx) { Dotenv env = Dotenv.configure().directory("../.env").load(); - String connectionId = env.get("WORKOS_CONNECTION_ID"); - String url = - workos - .sso - .getAuthorizationUrl(clientId, "http://localhost:7001/callback") - .connection(connectionId) - .build(); + String organizationId = env.get("WORKOS_ORGANIZATION_ID"); + String loginType = ctx.formParam("login_method"); - ctx.redirect(url); + if (loginType.equals("saml")) { + String url = + workos + .sso + .getAuthorizationUrl(clientId, "http://localhost:7001/callback") + .organization(organizationId) + .build(); + ctx.redirect(url); + } else { + String url = + workos + .sso + .getAuthorizationUrl(clientId, "http://localhost:7001/callback") + .provider(loginType) + .build(); + ctx.redirect(url); + } } public void callback(Context ctx) { diff --git a/java-sso-example/src/main/jte/home.jte b/java-sso-example/src/main/jte/home.jte index 971ac24..261b32b 100644 --- a/java-sso-example/src/main/jte/home.jte +++ b/java-sso-example/src/main/jte/home.jte @@ -1,12 +1,43 @@ - -
-
- workos logo -
+ +
+
+
+ workos logo +
-

Java SSO Example App

- +
+
+ + + + +
+
+
+
+
+
+
+
+ Log in with SSO +
+
+ + + +
+
+
+
diff --git a/java-sso-example/src/main/jte/profile.jte b/java-sso-example/src/main/jte/profile.jte index 11566ad..d1812ac 100644 --- a/java-sso-example/src/main/jte/profile.jte +++ b/java-sso-example/src/main/jte/profile.jte @@ -6,10 +6,11 @@
- workos logo + workos logo
+
-
+
@@ -19,22 +20,6 @@
-
-
-

Your app,

-

Enterprise Ready

-
-
-

Start selling to enterprise customers with just a few lines of code.

-

Implement features like single sign-on in minutes instead of months.

-
-
- - -
-
diff --git a/java-sso-example/src/resources/images/google-button.png b/java-sso-example/src/resources/images/google-button.png new file mode 100644 index 0000000..0332ec0 Binary files /dev/null and b/java-sso-example/src/resources/images/google-button.png differ diff --git a/java-sso-example/src/resources/images/microsoft-button.png b/java-sso-example/src/resources/images/microsoft-button.png new file mode 100644 index 0000000..2c725dc Binary files /dev/null and b/java-sso-example/src/resources/images/microsoft-button.png differ diff --git a/java-sso-example/src/resources/images/saml-button.png b/java-sso-example/src/resources/images/saml-button.png new file mode 100644 index 0000000..e03328f Binary files /dev/null and b/java-sso-example/src/resources/images/saml-button.png differ diff --git a/java-sso-example/src/resources/main.css b/java-sso-example/src/resources/main.css index 5abb1d8..6f6a6b0 100644 --- a/java-sso-example/src/resources/main.css +++ b/java-sso-example/src/resources/main.css @@ -1,257 +1,383 @@ body { - font-family: Inter, sans-serif; - background-color: #f9f9fb; - + font-family: Inter, sans-serif; + background-color: #f9f9fb; } .container_login { - display: flex; - flex-direction: column; - justify-content: center; - margin: auto; - width: 30%; - height: 90vh; + display: flex; + flex-direction: column; + justify-content: center; + margin: auto; + width: 30%; + height: 90vh; } .container_login img { - height: 150px; + height: 150px; } .container_login h1 { - font-size: 65px; - color: #111111; - position: relative; - bottom: 10px; + font-size: 65px; + color: #111111; + position: relative; + bottom: 10px; } .flex { - display: flex; - justify-content: center; + display: flex; + justify-content: center; + align-items: center; } .flex_column { - display: flex; - flex-direction: column; - justify-content: center; - align-items: center; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; } -.space-between { - justify-content: space-between; +.m-top-20 { + margin-top: 20px; } .width-75 { - width: 75%; + width: 75%; } .width-40vw { - width: 40vw; + width: 40vw; +} + +.width-25vw { + width: 25vw; +} + +.width-18vw { + width: 18vw; +} + +.width-941px { + width: 941px; +} + +.width-335 { + width: 335px; +} + +.height-315 { + height: 315px; +} + +.height-40vh { + height: 40vw; +} + +.height-80vh { + height: 80vh; +} + +.height-100vh { + height: 100vh; +} + +.space-between { + justify-content: space-between; } .container_success { - display: flex; - flex-direction: column; - justify-content: center; - margin: auto; - width: 100%; + display: flex; + flex-direction: column; + justify-content: center; + margin: auto; + width: 100%; } .heading_div { - margin: 25px 0px 25px 0px; + margin: 35px 0px 0px 0px; } .heading_text_div { - align-self: center; + align-self: center; } .container_success { - display: flex; - flex-direction: column; - justify-content: center; - margin: auto; - width: 100%; - background-size: cover; + display: flex; + flex-direction: column; + justify-content: center; + margin: auto; + width: 100%; + background-size: cover; +} + +.text_input { + border: 1px solid #555555; + border-radius: 10px; + margin: 10px 0px 7px 0px; + padding: 5px; + height: 35px; + width: 18vw; + text-align: center; +} + +.code-input { + width: 75px; + height: 100px; + margin: 0px 5px 30px 5px; + font-size: 60px; + color: darkslategray; +} + +.qr_div { + align-self: center; + margin-top: 45px; +} + +.qr_code { + width: 7vw; + max-width: 100px; +} + +.factor_card { + border: 1px solid #555555; + border-radius: 10px; + width: 20vw; + margin: 0px 15px 0px 15px; + padding: 25px; +} + +.card { + border: 1px solid #555555; + border-radius: 10px; + margin: 0px 15px 0px 15px; + padding: 25px 50px; + margin-bottom: 20px; +} + +.profile_card { + width: 40vw; + overflow: scroll; + background: white; + box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.1); } .button { - background-color: #6363f1; - border: 2px solid #6363f1; - border-radius: 26px; - color: white; - padding: 8px 16px; - text-align: center; - text-decoration: none; - display: inline-block; - font-size: 16px; - margin: 4px 2px; - transition-duration: 0.4s; - cursor: pointer; - box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.1); + background-color: #6363f1; + border: 2px solid #6363f1; + border-radius: 10px; + color: white; + padding: 8px 16px; + text-align: center; + text-decoration: none; + display: inline-block; + font-size: 16px; + margin: 4px 2px; + transition-duration: 0.4s; + cursor: pointer; + box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.1); } .button-outline { - background-color: #f9f9fb; - color: #6363f1; - padding: 8px 16px; + background-color: #f9f9fb; + color: #6363f1; + padding: 8px 16px; +} + +.button-sm { + padding: 8px 16px; } .button:hover, .button-outline:hover { - background-color: #555555; - border: 2px solid #555555; - color: white; + background-color: #555555; + border: 2px solid #555555; + color: white; } .sales-button { - margin-left: 10px; + margin-left: 10px; } .login_button { - width: 95%; - box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.1); + width: 100%; + box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.1); + background-color: white; + color: ; +} + +.login_button:hover { + border-color: #6363f1; + color: #292929; } h2, h1 { - text-align: center; - color: #555555; + text-align: center; + color: #555555; } .logged_in_div_right { - width: 60%; - height: 90vh; - display: flex; - flex-direction: column; - justify-content: center; - align-items: center; - position: relative; - bottom: 10%; - /* background-color: #f9f9fb; */ + width: 60%; + height: 90vh; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + position: relative; + bottom: 10%; } .logged_in_div_left { - width: 40%; - height: 125vh; - display: flex; - flex-direction: column; - justify-content: center; - align-items: left; - background-color: #f9f9fb; - margin-left: 4vw; + width: 40%; + height: 100vh; + display: flex; + flex-direction: column; + justify-content: center; + align-items: left; + background-color: #f9f9fb; + margin-left: 4vw; } .logged_in_div_left div { - justify-content: left; - position: relative; - bottom: 20%; + justify-content: left; + position: relative; + bottom: 20%; } .logged_in_div_left h1 { - color: #111111; - font-size: 75px; - text-align: left; - margin-bottom: 0px; - font-weight: normal; - letter-spacing: -.05em; + color: #111111; + font-size: 75px; + text-align: left; + margin-bottom: 0px; + font-weight: normal; + letter-spacing: -0.05em; } .home-hero-gradient { - background-image: linear-gradient(45deg, #a163f1, #6363f1 22%, #3498ea 40%, #40dfa3 67%, rgba(64, 223, 163, 0)); - background-size: 150% 100%; - background-repeat: no-repeat; - -webkit-background-clip: text; - -webkit-text-fill-color: transparent; - background-clip: text; - animation: intro-gradient 1.2s cubic-bezier(0.85, 0.26, 0.89, 0.93); - animation-iteration-count: 1; - animation-fill-mode: backwards; - animation-delay: 0.4s; - text-align: left; - font-size: 75px; - letter-spacing: -.05em; - font-weight: normal; - margin-top: 0px; + background-image: linear-gradient( + 45deg, + #a163f1, + #6363f1 22%, + #3498ea 40%, + #40dfa3 67%, + rgba(64, 223, 163, 0) + ); + background-size: 150% 100%; + background-repeat: no-repeat; + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; + background-clip: text; + animation: intro-gradient 1.2s cubic-bezier(0.85, 0.26, 0.89, 0.93); + animation-iteration-count: 1; + animation-fill-mode: backwards; + animation-delay: 0.4s; + text-align: left; + font-size: 75px; + letter-spacing: -0.05em; + font-weight: normal; + margin-top: 0px; } .title-text { - margin-top: -50px; + margin-bottom: -50px; } .title-subtext { - color: gray; - line-height: 10px; - margin-bottom: 15px; - font-weight: 200; + color: gray; + line-height: 10px; + margin-bottom: 15px; + font-weight: 200; } .logged_in_div_left button { - padding: 8px 22px; - box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.1); -} - -div.text_box { - background-color: #f9f9fb; - width: 40vw; - max-height: 30vh; - padding: 10px; - word-wrap: break-word; - overflow: scroll; - border-width: 3px; - border-style: solid; - border-image: - linear-gradient(#a163f1, #6363f1 22%, #3498ea 40%, #40dfa3 67%, rgba(64, 223, 163, 0)) 0 100%; + padding: 8px 22px; + box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.1); } .logged_in_nav { - display: flex; - justify-content: space-between; - background-color: #f9f9fb; - height: 60px; - padding: 15px 30px 15px 30px; - - z-index: 1000; + display: flex; + justify-content: space-between; + background-color: #f9f9fb; + padding: 15px 30px 15px 30px; + z-index: 1000; } .logged_in_nav p { - padding: 4px 0px 0px 15px; - line-height: 1; - color: #29363d; + padding: 4px 0px 0px 15px; + line-height: 1; + color: #29363d; } .logged_in_nav img { - height: 50px; + height: 50px; } .nav-item { - color: black; - border: 2px solid #f9f9fb; - background-color: #f9f9fb; - box-shadow: none; - border-radius: 5px; + color: black; + border: 2px solid #f9f9fb; + background-color: #f9f9fb; + box-shadow: none; + border-radius: 5px; } .blog-nav-button { - margin-right: 20px; - background-color: #f9f9fb; - border: 2px solid #f9f9fb; + margin-right: 20px; + background-color: #f9f9fb; + border: 2px solid #f9f9fb; } .nav-item:hover { - background-color: #f9f9fb; - border: 2px solid #f9f9fb; - color: #a6a4a4; + background-color: #f9f9fb; + border: 2px solid #f9f9fb; + color: #a6a4a4; } -pre.prettyprint { - border: none !important; +.workos-logo { + position: relative; + top: 38px; + padding-right: 25px; + height: 75px !important; } -.text_input { - border: 1px solid #555555; - border-radius: 10px; - margin: 20px 0px 7px 0px; - padding: 5px; - height: 35px; - width: 18vw; - text-align: center; -} \ No newline at end of file +.webhooks_container { + width: 45vw; + padding: 25px; + max-height: 450px; + overflow-y: scroll; +} + +.mb-0 { + margin-bottom: 0px; +} + +.mb-20 { + margin-botton: 20px; +} + +.google_button { + background-image: url("./images/google-button.png"); + background-size: cover; +} + +.microsoft_button { + background-image: url("./images/microsoft-button.png"); + background-size: cover; +} + +.saml_button { + background-image: url("./images/saml-button.png"); + background-size: cover; +} + +.error_message { + color: #6363f1; + margin-top: 0px; + font-size: 12px; +} + +#noborder { + border: none; +} + +#noborder > :first-child { + display: none; +}