import { Reception } from './classes.reception.js';
import { RegistrationSession } from './classes.registrationsession.js';
import { User } from './classes.user.js';
import * as plugins from '../plugins.js';

export class ReceptionMailer {
  public receptionRef: Reception;

  constructor(receptionRefArg: Reception) {
    this.receptionRef = receptionRefArg;
  }

  private createBodyString = (textArg) => `
  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  <html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    
  <style type="text/css">
    * {
      font-family:Arial,Helvetica Neue,Helvetica,sans-serif;
      box-sizing:border-box;
    }
    body {
      width: 100%;
    }
    .bodyspacer {
      background-color: #f0f0f0;
      padding-top:20px;
      padding-bottom:20px;
      padding-left:10px;
      padding-right:10px;
    }
    
    .logo {
      display: block;
      margin: auto;
      width: 200px;
      padding: 30px;
    }

    .logoBottom {
      display: block;
      margin: auto;
      width: 150px;
      padding: 30px;
    }

    h1 {
      text-align:center;
      line-height:35px;
      margin-bottom:20;
    }
    h1.subheading{
      font-size:15px;
      font-weight:normal;
      margin-bottom:10px;
    }
    h3 {
      padding:0;
      margin:0;
      margin-bottom:5px;
    }
    p {
      margin-top:5px;
    }
    a {
      text-decoration:none;
      color: #CCCCCC;
    }
    .contentspacer{
      padding-left:20px;
      padding-right:20px;
    }
    .content {
      box-shadow: 0px 0px 3px rgba(0,0,0,0.5);
      color: #333333;
      background:#ffffff;
      max-width:600px;
      border-radius:3px;
      margin-left:auto;
      margin-right:auto;
      min-height:40px;
      overflow:hidden;
    }
    .headerimagewrapper {
      overflow:hidden;
      border:none;
    }
    .headerimage {
      min-height: 10px;
      width:100%;
      vertical-align:middle;
      background:#eeeeeb;
    }
    img, a {
      border:none;
      outline:none;
    }
    .textcontent {
      padding:20px;
    }

    .button {
      transition: all 0.2s ease;
      width: 200px;
      text-align: center;
      border-radius: 3px;
      color: #333333;
      background: #f0f0f0;
      margin: 20px auto;
      padding: 10px;
      text-transform: uppercase;
      cursor: pointer;
    }

    .button:hover {
      color: #fff;
      background: #e4002b;
    }

    .footer {
      color: #CCCCCC;
      text-align:center;
      font-size:12px;
      margin-top:10px;
    }
</style>
</head>
  <body>
    <div class="bodyspacer">
      <img class="logo" src="https://assetbroker.lossless.one/brandfiles/00general/brightdark_workspaceglobal@2x.png" />
      <div class="contentspacer">
        <div class="content">
          <div class="headerimagewrapper">
            
          </div>
          <div class="textcontent">
            <span>
              ${textArg}
            </span>
          </div>
        </div>
        <div class="footer">
          This email is a service by<br/>
          Task Venture Capital GmbH, Karl-Ferdinand-Braun-Str. 5, 28359 Bremen, Germany<br/>
          <a style="color: #666666" href="https://legal.task.vc">Legal Info (https://legal.task.vc)</a>
          <img class="logoBottom" src="https://assetbroker.lossless.one/brandfiles/00general/brightdark_taskvc@2x_transparent.png" />
        </div>
      </div>
    </div>
  </body>
</html>
`;

  public async sendRegistrationEmail(signupSessionArg: RegistrationSession, validationTokenArg: string) {
    this.receptionRef.szPlatformClient.emailConnector.sendEmail({
      from: `idp.global@${this.receptionRef.options.baseUrl} <noreply@mail.workspace.global>`,
      title: 'Verify your Email Address!',
      to: signupSessionArg.emailAddress,
      body: this.createBodyString(`
        <h1>Email Verification for <br><a style="color: #555555;" href="mailto:${
          signupSessionArg.emailAddress
        }">${signupSessionArg.emailAddress}</a></h1>
        <p>It looks like you requested to register an account with us. We just want to make sure it really was you.</p>
        <p>In case it was you, <b>please continue with the registration process by clicking the button below</b>. Otherwise, please ignore this email.</p>
        <a href="${this.receptionRef.options.baseUrl}/finishregistration?validationtoken=${encodeURI(
          validationTokenArg
        )}"><div class="button">
          continue with registration
        </div></a>
        <p>
          <b>What do I need a workspace.global Account for?</b><br/>
          The workspace.global Account is needed to log into e.g. <b>social.io</b>
        </p>
      `),
    });
  }

  public sendAlreadyRegisteredEmail(userArg: User) {
    this.receptionRef.szPlatformClient.emailConnector.sendEmail({
      from: 'workspace.global <noreply@mail.workspace.global>',
      title: 'Login Instead?!',
      to: userArg.data.email,
      body: this.createBodyString(`
        <h1>Email is already registered:<br><a style="color: #555555;" href="mailto:${
          userArg.data.email
        }">${userArg.data.email}</a></h1>
        <p>Someone retried to reregister with the email ${userArg.data.email}</p>
        <p>In case it was you, <b>please simply log in with your existing account</b>. Otherwise, please ignore this email.</p>
        <a href="https://account.lossless.org/finishsignup?email=${encodeURI(
          userArg.data.email
        )}"><div class="button">
          Simply login :)
        </div></a>
        <p>
          <b>Forgot your password?</b><br/>
          Just click the password reset link when logging in.
        </p>
      `),
    });
  }

  public sendWelcomeEMail(userArg: User) {
    this.receptionRef.szPlatformClient.emailConnector.sendEmail({
      from: 'workspace.global <noreply@mail.workspace.global>',
      title: 'Welcome and Thank You!',
      to: userArg.data.email,
      body: this.createBodyString(`
        <h1>Welcome And Thank You, ${userArg.data.name}</h1>
        <p>You now have a fully registered workspace.global Account</p>
        
        <p>
          <b>What can I use it for?</b><br/>
          The workspace.global Account can be used to log into all our apps.<br>
          Some of them are<br/>
          ${(() => {
            const products = ['social.io', 'layer.io'];
            return products.map((productArg) => `<span>${productArg}</span>`).join(' ');
          })()}
        </p>

        <a href="https://account.lossless.org/manage/
          userArg.username
        )}"><div class="button">
          Go to my account
        </div></a>
      `),
    });
  }

  public sendLoginWithEMailMail(userArg: User, validationTokenArg: string) {
    console.log(`sending login email to ${userArg.data.email}`);
    this.receptionRef.szPlatformClient.emailConnector.sendEmail({
      from: 'workspace.global <noreply@mail.workspace.global>',
      title: 'Click to login!',
      to: userArg.data.email,
      body: this.createBodyString(`
        <h1>EMail Login Link for <br><a style="color: #555555;" href="mailto:${
          userArg.data.email
        }">${userArg.data.email}</a></h1>
        <p>It looks like you requested to login passwordless via this email.</p>
        <p>In case it was you, <b>please continue by clicking the button below</b>. Otherwise, please ignore this email.</p>
        <a href="https://account.lossless.org/?email=${encodeURI(
          userArg.data.email
        )}&validationtoken=${encodeURI(validationTokenArg)}"><div class="button">
          Login!
        </div></a>
      `),
    });
  }

  public sendPasswordResetMail(userArg: User, validationTokenArg: string) {
    this.receptionRef.szPlatformClient.emailConnector.sendEmail({
      from: 'workspace.global <noreply@mail.workspace.global>',
      title: 'Password reset?',
      to: userArg.data.email,
      body: this.createBodyString(`
        <h1>Password Reset for <br><a style="color: #555555;" href="mailto:${userArg.data.email}">${
        userArg.data.email
      }</a></h1>
        <p>It looks like you requested to reset your password with us.</p>
        <p>In case it was you, <b>please continue by clicking the button below</b>. Otherwise, please ignore this email.</p>
        <a href="https://account.lossless.org/?email=${encodeURI(
          userArg.data.email
        )}&validationtoken=${encodeURI(validationTokenArg)}"><div class="button">
          Reset Password
        </div></a>
      `),
    });
  }
}
