Compare commits

...

9 Commits

  1. 21
      .env
  2. 10
      .env_prod
  3. 17
      .env_sandbox
  4. 2
      .gitignore
  5. 1
      admin/index.php
  6. 1
      admin/orders.php
  7. 26
      api/order_add.php
  8. 2
      api/send_mail.php
  9. 9
      api/user_add.php
  10. 5
      components/account/account.html
  11. 4
      components/account/account.js
  12. 7
      components/account/account.scss
  13. 3
      components/breadcrumb/breadcrumb.html
  14. 2
      components/buy/buy.js
  15. 4
      components/checkout/checkout.html
  16. 69
      components/checkout/checkout.js
  17. 2
      components/checkout/checkout.scss
  18. 2
      components/content/content-terms.html
  19. 4
      components/header/header.html
  20. 34
      components/header/header.scss
  21. 80
      components/passwordRecovery/passwordRecovery.html
  22. 5
      components/passwordRecovery/passwordRecovery.js
  23. 60
      components/passwordRecovery/passwordRecovery.scss
  24. 3
      components/sectionHeader/sectionHeader.html
  25. 7
      components/thankyou/thankyou.html
  26. 4
      components/thankyou/thankyou.scss
  27. 2
      deploy.sh
  28. 6
      package.json
  29. 1
      pages/index.ejs
  30. 2
      pages/recupera-password.ejs
  31. BIN
      src/fonts/icomoon.eot
  32. 2
      src/fonts/icomoon.svg
  33. BIN
      src/fonts/icomoon.ttf
  34. BIN
      src/fonts/icomoon.woff
  35. 2
      src/fonts/selection.json
  36. 6
      src/scss/forms.scss
  37. 1
      src/scss/main.scss
  38. 7
      src/scss/variables.scss

21
.env

@ -1,17 +1,18 @@
API_URL=http://iolovolio.local/api
SITE_URL=http://iolovolio.local
PP_ACCOUNT=dslaky-seller@gmail.com
PP_CLIENTID=AfnGR9VCjtBF_M0TemwikSG7q0sIm0mE4maIWw9vhiT1-X7vd9ONTvf-D3mEw1AaG9t2CWjoNbHIltI8
PP_SECRET=ENR4dvs4Y4836E-rDGUUMRIY6QEsCzOLsy16yoIBUrDpyt-Jfqi9PwNzBIDeKUpTuTbZUxQBvIe44jC0
#PP_ACCOUNT=dslaknma@gmail.com
#PP_CLIENTID=Ado8S7IQHD3t9n3hG8BfCjUOLkKKMPrX64Bd4gVkV_5HlVw1wg6E0HFbWfVySnxU3KQ6-53yLxPBlnbh
#PP_SECRET=EMY1gGftiSyjYwM1O8cwgOHAIg9cF2oNQAQuXCKrOrhfmMFjrbFZyRHHgCd_lPhpwJNyEYjbr0oSzPDH
PP_CANCEL=http://iolovolio.local/checkout
PP_RETURN=http://iolovolio.local/thankyou
PP_AUTH_URL=https://api-m.sandbox.paypal.com/v1/oauth2/token
PP_ORDER_URL=https://api-m.sandbox.paypal.com/v2/checkout/orders
PP_ACCOUNT=villamarchesacilento@gmail.com
PP_CLIENTID=AWu2qtnudDseQPQgzP8WjoWYgJ35RwVs5xGgnJaSUEy3GZBivJTDwpF1Iac48Ym9awFb_Q3hl30q0oX1
PP_SECRET=EG4ocqai50hgZJ-033h2SVTnrc2QgBeeMg5Eclvrbb3Zw204wGEPmhfeag167tOMPAOpzwP5Cm8bFDmy
PP_CANCEL=https://www.iolovolio.com/checkout
PP_RETURN=https://www.iolovolio.com/thankyou
PP_AUTH_URL=https://api-m.paypal.com/v1/oauth2/token
PP_ORDER_URL=https://api-m.paypal.com/v2/checkout/orders
RECAPTCHA_SITE_KEY=6LfD8FgcAAAAANpdeDvkFRHk8VXTgC7huXa3LKqe
RECAPTCHA_SECRET_KEY=6LfD8FgcAAAAAOZgo5UgR_BRLd83NS3qdFdBA6XH
#dslaky-buyer@gmail.com dslakyPwd
#dslaky-facilitator@gmail.com dslakyPwd

10
.env_prod

@ -1,14 +1,14 @@
API_URL=https://www.iolovolio.com/api
SITE_URL=https://www.iolovolio.com
PP_ACCOUNT=dslaky-seller@gmail.com
PP_CLIENTID=AfnGR9VCjtBF_M0TemwikSG7q0sIm0mE4maIWw9vhiT1-X7vd9ONTvf-D3mEw1AaG9t2CWjoNbHIltI8
PP_SECRET=ENR4dvs4Y4836E-rDGUUMRIY6QEsCzOLsy16yoIBUrDpyt-Jfqi9PwNzBIDeKUpTuTbZUxQBvIe44jC0
PP_ACCOUNT=villamarchesacilento@gmail.com
PP_CLIENTID=AWu2qtnudDseQPQgzP8WjoWYgJ35RwVs5xGgnJaSUEy3GZBivJTDwpF1Iac48Ym9awFb_Q3hl30q0oX1
PP_SECRET=EG4ocqai50hgZJ-033h2SVTnrc2QgBeeMg5Eclvrbb3Zw204wGEPmhfeag167tOMPAOpzwP5Cm8bFDmy
PP_CANCEL=https://www.iolovolio.com/checkout
PP_RETURN=https://www.iolovolio.com/thankyou
PP_AUTH_URL=https://api-m.sandbox.paypal.com/v1/oauth2/token
PP_ORDER_URL=https://api-m.sandbox.paypal.com/v2/checkout/orders
PP_AUTH_URL=https://api-m.paypal.com/v1/oauth2/token
PP_ORDER_URL=https://api-m.paypal.com/v2/checkout/orders
RECAPTCHA_SITE_KEY=6LfD8FgcAAAAANpdeDvkFRHk8VXTgC7huXa3LKqe
RECAPTCHA_SECRET_KEY=6LfD8FgcAAAAAOZgo5UgR_BRLd83NS3qdFdBA6XH

17
.env_sandbox

@ -0,0 +1,17 @@
API_URL=http://iolovolio.local/api
SITE_URL=http://iolovolio.local
PP_ACCOUNT=dslaky-seller@gmail.com
PP_CLIENTID=AfnGR9VCjtBF_M0TemwikSG7q0sIm0mE4maIWw9vhiT1-X7vd9ONTvf-D3mEw1AaG9t2CWjoNbHIltI8
PP_SECRET=ENR4dvs4Y4836E-rDGUUMRIY6QEsCzOLsy16yoIBUrDpyt-Jfqi9PwNzBIDeKUpTuTbZUxQBvIe44jC0
PP_CANCEL=http://iolovolio.local/checkout
PP_RETURN=http://iolovolio.local/thankyou
PP_AUTH_URL=https://api-m.sandbox.paypal.com/v1/oauth2/token
PP_ORDER_URL=https://api-m.sandbox.paypal.com/v2/checkout/orders
RECAPTCHA_SITE_KEY=6LfD8FgcAAAAANpdeDvkFRHk8VXTgC7huXa3LKqe
RECAPTCHA_SECRET_KEY=6LfD8FgcAAAAAOZgo5UgR_BRLd83NS3qdFdBA6XH
#dslaky-buyer@gmail.com dslakyPwd
#dslaky-facilitator@gmail.com dslakyPwd

2
.gitignore

@ -8,3 +8,5 @@ node_modules/
public/
package-lock.json
yarn.lock

1
admin/index.php

@ -12,6 +12,7 @@
mysqli_set_charset($conn, "utf8");
if(@$_GET['q']){ $GLOBALS['getQ'] = explode("/",$_GET['q']); }
if(!$getQ[0]) {$getQ[0] = 'orders';}
?>

1
admin/orders.php

@ -66,6 +66,7 @@
<option value="CREATED" <?= $r['status'] == 'CREATED' ? 'selected' : '';?>>CREATED</option>
<option value="SHIPPED" <?= $r['status'] == 'SHIPPED' ? 'selected' : '';?>>SHIPPED</option>
<option value="PAID" <?= $r['status'] == 'PAID' ? 'selected' : '';?>>PAID</option>
<option value="CANCELED" <?= $r['status'] == 'CANCELED' ? 'selected' : '';?>>CANCELED</option>
</select>
</form>
</div>

26
api/order_add.php

@ -43,28 +43,29 @@ if($stmt->execute()) {
$subject = 'Ordine n. '.$order_id;
$body = emailHeader();
$body .= "<tr><td colspan=\"4\" style=\"padding: 10px 20px\">Ciao ".$data->profile->first_name."<br><br>
Siamo contenti che tu abbia acquistato il nostro olio, speriamo sia protagonista di tanti momenti conviviali.<br><br>
$body .= "<tr><td colspan=\"4\" style=\"padding: 10px 20px\">Ciao ".$data->profile->first_name.",<br>
siamo contenti che tu abbia acquistato il nostro olio, speriamo sia protagonista di tanti momenti conviviali.<br><br>
Ecco i dati riassuntivi del tuo ordine:<br><br>
<span style=\"color: #92704F\">CODICE IDENTIFICATIVO ORDINE:</span><br>
<b>$order_id</b><br><br>
<span style=\"color: #92704F\">TEMPI DI CONSEGNA:</span><br>
La consegna avverrà in circa xx giorni lavorativi<br><br>
La consegna avverrà in circa 5 giorni lavorativi<br><br>
<span style=\"color: #92704F\">INDIRIZZO DI CONSEGNA:</span><br>".
$data->profile->first_name." ".$data->profile->last_name."<br>".
$data->profile->address."<br>".
$data->profile->city." - ".
$data->profile->zip_code." - ".
$data->profile->city."<br>
 Telefono contatto: <br>".
$data->profile->city."<br>".
"Contatto telefonico: <br>".
$data->profile->phone."<br><br>
<span style=\"color: #92704F\">PRODOTTI ORDINATI:</span><br>
</td></tr>";
$body .= '<tr style="margin: 0; padding: 10px">
<td style="font-weight: bold">Prodotto</td>
$body .= '<tr>
<td style="font-weight: bold; padding-left: 20px">Prodotto</td>
<td style="font-weight: bold">Prezzo</td>
<td style="font-weight: bold">Quantità</td>
<td style="font-weight: bold">Totale</td>
<td style="font-weight: bold; padding-right: 20px">Totale</td>
</tr>';
foreach($data->cart as $item) {
@ -73,20 +74,21 @@ if($stmt->execute()) {
$stmtp->execute();
$p = $stmtp->fetch(PDO::FETCH_ASSOC);
$body .= '<tr style="margin: 0; padding: 10px">
<td style="border-bottom: 1px solid #323232;">'.$p['type'].' - '.$p['name'].' </td>
$body .= '<tr>
<td style="border-bottom: 1px solid #323232; padding-left: 20px"><b style="color: #92704F; font-style: italic">'.$p['name'].'</b><br>
<span style="font-size: 10px">'.$p['type'].'</span> </td>
<td style="border-bottom: 1px solid #323232; width: 90px">'.money_format('%.2n', $item->price).' </td>
<td style="border-bottom: 1px solid #323232; width: 90px">'.$item->qty.' </td>
<td style="border-bottom: 1px solid #323232; width: 90px">'.money_format('%.2n', $item->price * $item->qty).' </td>
</tr>';
}
$body .= "<tr><td colspan=\"4\"><br>Ci auguriamo che non ci siano problemi con i prodotti acquistati. In caso contrario puoi effettuare un reso in base a quanto previsto dalle nostre politiche di reso, consultabili cliccando su questo link<br><br>
Grazie,<br>Servizio Clienti Iolovolio<br><br></td></tr>";
$body .= "<tr><td colspan=\"4\" style=\"padding: 10px 20px\"><br>Ci auguriamo che non ci siano problemi con i prodotti acquistati. In caso contrario puoi contattarci in qualsiasi momento all'indirizzo ordini@iolovolio.com<br><br>
Grazie,<br>il team Iolovolio<br><br></td></tr>";
$body .= emailFooter();
$sent = sendEmail($toEmail, $toName, $subject, $body);
$sent = sendEmail($toEmail, $toName, $subject, $body, 'ordini');
if($sent === true) {
http_response_code(200);
echo json_encode(

2
api/send_mail.php

@ -4,7 +4,7 @@ use PHPMailer\PHPMailer\SMTP;
use PHPMailer\PHPMailer\Exception;
require 'vendor/autoload.php';
function sendEmail($toEmail, $toName, $subject, $body) {
function sendEmail($toEmail, $toName, $subject, $body, $from = 'ordini') {
$mail = new PHPMailer(true);

9
api/user_add.php

@ -19,14 +19,13 @@ $data = json_decode(file_get_contents("php://input"));
$query = "SELECT * FROM `users` WHERE email = '".trim($data->email)."'";
$stmt = $conn->prepare($query);
$toEmail = trim($data->email);
$toName = trim($data->first_name)." ".trim($data->last_name);
$subject = 'Iolovolio - Registrazione';
$body = emailHeader();
$body .= "<tr><td colspan=\"4\" style=\"padding: 10px 20px\">Ciao ".$data->first_name."<br>".
"Grazie per esserti registrato a Iolovolio, di seguito un riepilogo dei tuoi dati:<br><br>".
$body .= "<tr><td colspan=\"4\" style=\"padding: 10px 20px\">Ciao ".$data->first_name.",<br>".
"grazie per esserti registrato a Iolovolio, di seguito un riepilogo dei tuoi dati:<br><br>".
"Nome: ".$data->first_name."<br>".
"Cognome: ".$data->last_name."<br>".
"Indirizzo: ".$data->address."<br>".
@ -36,7 +35,7 @@ $stmt = $conn->prepare($query);
"Password: ".$data->password."<br>".
"</td></tr>";
$body .= "<tr><td colspan=\"4\">Grazie,<br>Servizio Clienti Iolovolio<br><br></td></tr>";
$body .= "<tr><td colspan=\"4\" style=\"padding: 10px 20px\">Grazie,<br>Servizio Clienti Iolovolio<br><br></td></tr>";
$body .= emailFooter();
if($stmt->execute()) {
@ -50,7 +49,7 @@ if($stmt->execute()) {
));
} else {
$sent = sendEmail($toEmail, $toName, $subject, $body);
$sent = sendEmail($toEmail, $toName, $subject, $body, 'noreply');
if($sent === true) {
$query = "INSERT INTO `users`

5
components/account/account.html

@ -57,7 +57,7 @@
<div class="row">
<div class="col-12 col-md-4 mr-auto mb-5">
<span class="title">Sei già registrato?</span>
<form class="login-form" action="/account/ordini" method="POST">
<form class="login-form <?= $_POST['login_usr'] && $_POST['login_pwd'] ? 'error' : '';?>" action="/account/ordini" method="POST">
<div class="row">
<div class="col-12">
<span class="label">E-mail</span>
@ -67,6 +67,9 @@
<span class="label">Password</span>
<input type="password" name="login_pwd" class="input-text">
</div>
<div class="col-12 text-right">
<a href="/recupera-password" class="text-black font-12 d-block pt-2">Hai dimenticato la password?</a>
</div>
<div class="col-12 mt-4">
<button class="button button-brown button-big ml-auto">Accedi</button>
</div>

4
components/account/account.js

@ -9,6 +9,9 @@ $(document).ready( () => {
const updatePassword = pwdform.find('.update-password')
const register = component.find('.register')
const registerForm = component.find('.new-user-form')
const loginForm = component.find('.login-form')
if(loginForm.hasClass('error')) Apis.notification('ERRORE: Username o password errate.')
const orders = component.find('.order-row')
@ -115,7 +118,6 @@ $(document).ready( () => {
})
const checkForm = () => {
console.log('checkForm')
const inputs = component.find('.input')
const passwords = component.find('.input[type="password"]')
let errors = 0

7
components/account/account.scss

@ -37,6 +37,13 @@
padding: 15px 0 5px 0;
}
.errors {
display: block;
@include font-style($font-sans, 700, $font-16);
color: $red;
padding: 15px 0 5px 0;
}
.input {
&.error {
border: 1px solid $red;

3
components/breadcrumb/breadcrumb.html

@ -22,6 +22,9 @@
case 'account':
$levels[0] = array('account', '/account');
break;
case 'recupera-password':
$levels[0] = array('Recupera password', '/recupera-password');
break;
case 'checkout':
$levels[0] = array('checkout', '/checkout');
break;

2
components/buy/buy.js

@ -61,9 +61,7 @@ $(document).ready( () => {
}).catch( (error) => {
console.error(error)
})
})
}
}
})

4
components/checkout/checkout.html

@ -234,8 +234,8 @@
</label>
</div>
<div class="col-12 py-2 px-0">
<button class="place-order button button-big button-brown">procedi su paypal</button>
<div class="col-12 py-2 px-0 mt-3" id="paypal-button-container">
<button class="place-order button button-big button-brown w-100">procedi su paypal</button>
</div>
</div>

69
components/checkout/checkout.js

@ -65,8 +65,8 @@ $(document).ready( () => {
const input = $(e)
const type = input.prop('type')
const required = input.prop('required')
if(required) {
const visible = input.is(':visible')
if(required && visible) {
switch(type) {
case 'text':
case 'select-one':
@ -110,11 +110,13 @@ $(document).ready( () => {
}
})
if(passwords[0].value != passwords[1].value) {
$(passwords[1]).addClass('error')
errors++
} else {
$(passwords[1]).removeClass('error')
if(isNewUser) {
if(passwords[0].value != passwords[1].value) {
$(passwords[1]).addClass('error')
errors++
} else {
$(passwords[1]).removeClass('error')
}
}
if(!errors) {
@ -138,13 +140,13 @@ $(document).ready( () => {
placeOrder(body, isNewUser)
})
})
}
}
const placeOrder = (profile, isNewUser) => {
const inputs = component.find('.input, .radio input')
inputs.attr('disabled', true)
place.hide(0)
window.Spinner('show')
const placeOrderCall = (profile, cartItems, token, uid) => {
@ -169,21 +171,34 @@ $(document).ready( () => {
}
}]
Apis.checkout(cart, token, uid).then( (data) => {
const capture = data.links.find(item => item.rel == 'capture')
const approve = data.links.find(item => item.rel == 'approve')
sessionStorage.setItem('order', JSON.stringify({
profile: profile,
cartItems: cartItems,
token: data.id,
uid: uid,
amount: amount
}))
window.location = approve.href
}).catch( (error) => {
console.error(error)
})
paypal.Buttons({
style: { label: 'pay' },
onInit: () => {window.Spinner('hide')},
createOrder: (data, actions) => {
return actions.order.create({
intent: 'CAPTURE',
application_context: {
brand_name: 'Iolovolio',
locale: 'it-IT',
shipping_preference: 'NO_SHIPPING'
},
purchase_units: cart
})
},
onApprove: (data, actions) => {
return actions.order.capture().then( (details) => {
console.log('Transaction completed by ', details, `${ENV.PP_RETURN}?token=${data.orderID}`)
sessionStorage.setItem('order', JSON.stringify({
profile: profile,
cartItems: cartItems,
token: data.orderID,
uid: uid,
amount: amount
}))
window.location = `${ENV.PP_RETURN}?token=${data.orderID}`
})
}
}).render('#paypal-button-container')
}
Apis.getCart().then( (data) => {
@ -197,6 +212,8 @@ $(document).ready( () => {
placeOrderCall(profile, cartItems, token, data.id)
}).catch( (error) => {
console.error(error)
window.Spinner('hide')
Apis.notification("ATTENZIONE: L'utente è già presente in database<br> Fai click su \"Accedi\" per effettuare il login!")
})
} else {
placeOrderCall(profile, cartItems, token, loggedUid)
@ -204,9 +221,11 @@ $(document).ready( () => {
}).catch( (error) => {
console.error(error)
window.Spinner('show')
})
}).catch( (error) => {
console.error(error)
window.Spinner('show')
})
}
}

2
components/checkout/checkout.scss

@ -79,7 +79,7 @@
.place-order {
display: inline-block;
@include font-style($font-serif, 'regular', $font-20);
margin: 20px 0 0 auto;
margin: auto;
}
}

2
components/content/content-terms.html

@ -14,7 +14,7 @@
<b>Premesse</b>
<br>Le presenti Condizioni Generali di Vendita regolano l'acquisto, tramite modalità telematiche o per via telefonica, dei prodotti (i "Prodotti") presentati sul Sito www.iolovolio.com (il "Sito"), gestito da Società Agricola Semplice "Stefano Crocamo e figli" con sede in Località Chiusa di Santa Maria, via San Nicola n. 25, Castelnuovo Cilento (SA) [ITALIA], registrata presso il Registro Imprese di Salerno, REA n. SA-408540, C. Fiscale e P.IVA: 04961360650 (di seguito la "Società").
<br>Le Condizioni Generali di Vendita costituiscono parte integrante ed essenziale del contratto di acquisto di qualsiasi Prodotto. Esse regolano, esclusivamente, l'offerta, la trasmissione, l'accettazione, la spedizione, le modalità di acquisto e il diritto di recesso di ordini d'acquisto dei Prodotti sul Sito iolovolio.com tra gli utenti di iolovolio.com e la Società.
<br>Le Condizioni Generali di Vendita non regolano invece la fornitura di servizi o la vendita di prodotti da parte di soggetti diversi dalla Società, che siano presenti sul Sito iolovolio.com tramite collegamenti ipertestuali, link o banner. Prima di acquistare prodotti e servizi da soggetti diversi dalla Società, Le raccomandiamo di verificare con attenzione le condizioni di vendita, perché la Società non è responsabile per la fornitura di servizi da parte di soggetti terzi o per la conclusione di contratti tra gli utenti di Olivyou.com e soggetti terzi. Per qualunque dubbio, La invitiamo a contattarci direttamente inviandoci una e-mail all'indirizzo info@iolovolio.com.
<br>Le Condizioni Generali di Vendita non regolano invece la fornitura di servizi o la vendita di prodotti da parte di soggetti diversi dalla Società, che siano presenti sul Sito iolovolio.com tramite collegamenti ipertestuali, link o banner. Prima di acquistare prodotti e servizi da soggetti diversi dalla Società, Le raccomandiamo di verificare con attenzione le condizioni di vendita, perché la Società non è responsabile per la fornitura di servizi da parte di soggetti terzi o per la conclusione di contratti tra gli utenti di iolovolio.com e soggetti terzi. Per qualunque dubbio, La invitiamo a contattarci direttamente inviandoci una e-mail all'indirizzo info@iolovolio.com.
<br>L'acquisto dei Prodotti sarà regolato, oltre che dalle presenti Premesse e dalle condizioni speciali di ciascun singolo ordine, esclusivamente dalle previsioni contenute ai paragrafi seguenti di queste Condizioni Generali di Vendita. Si precisa, infine, che le previsioni delle Condizioni Generali di Vendita che facciano riferimento ai Consumatori (come di seguito definiti) troveranno applicazione esclusivamente nei confronti di soggetti che ricadano nella relativa definizione. I Consumatori beneficeranno, in particolare, di tutte le tutele previste in caso di conclusione di contratti a distanza ai sensi del Titolo III, Sezione II, del D.lgs. 6 settembre 2005, n. 206 ("Codice del Consumo"), oltre che di tutte le ulteriori tutele inderogabilmente previste, in favore dei Consumatori, dal Codice del Consumo medesimo e da ogni altra legge applicabile.
<br>Il servizio clienti della Società è a disposizione per informazioni, reclami e contestazioni: Servizio Clienti: +39 3478779283
<br>A disposizione da lunedì al venerdì (10-13 e 14-19) - E-mail: info@iolovolio.com

4
components/header/header.html

@ -10,9 +10,7 @@
<a href="/carrello" class="cart-cta icon-buy">
<span class="counter"><?= count($_SESSION['CART']);?></span>
<span class="label">Carrello</span>
</a>
<a href="/account" class="account-cta icon-user">
</a><a href="/account" class="account-cta icon-user">
<span class="label">
<?php
if($_SESSION['AUTH']) {

34
components/header/header.scss

@ -21,7 +21,7 @@
top: 32px;
left: 50%;
height: 100%;
max-height: 50px;
max-height: 40px;
margin: auto 0;
transition: max-height .4s, top .3s;
transform: translateX(-50%);
@ -30,9 +30,9 @@
.ctas {
position: absolute;
top: 28px;
left: 20px;
font-size: $font-34;
top: 30px;
left: 10px;
font-size: $font-30;
padding: 0 !important;
color: $black;
transition: top .3s;
@ -46,11 +46,11 @@
.counter {
position: absolute;
left: 10px;
top: 14px;
left: 8px;
top: 13px;
width: 22px;
text-align: center;
@include font-style($font-sans, 'semibold', $font-14);
@include font-style($font-sans, 'semibold', $font-12);
}
.label {
@ -68,7 +68,7 @@
.hamburger {
position: absolute;
top: 32px;
right: 20px;
right: 10px;
transition: top .3s;
}
@ -137,7 +137,7 @@
.header-wrapper {
min-height: $header-height-mobile-sticky;
.logo {
max-height: 50px;
max-height: 35px;
top: 18px;
}
@ -179,14 +179,26 @@
}
.ctas {
font-size: $font-34;
left: 20px;
.cart-cta,
.account-cta {
.label {
display: block;
}
.counter {
font-size: $font-14;
left: 10px;
top: 14px;
}
}
}
.hamburger {
right: 20px;
}
.menu-container {
.menu-label {
//display: block;
@ -197,6 +209,10 @@
&.sticky {
.header-wrapper {
min-height: $header-height-sticky;
.logo {
max-height: 50px;
top: 18px;
}
}
}
}

80
components/passwordRecovery/passwordRecovery.html

@ -0,0 +1,80 @@
<?php
include_once './api/send_mail.php';
@include('components/breadcrumb/breadcrumb.php');
setlocale(LC_MONETARY, 'it_IT.UTF-8');
if(isset($_POST['reset_usr'])) {
$query = "SELECT * FROM `users` WHERE email = '".trim($_POST['reset_usr'])."'";
$q = mysqli_query($conn, $query);
if(mysqli_affected_rows($conn)) {
$new_password = base_convert(date('Y-m-d H:i:s'), 10, 36).rand(1,99)."+";
$user = mysqli_fetch_array($q);
$query = "UPDATE `users` SET `password` = '".md5($new_password)."' WHERE id = '".$user['id']."'";
$q = mysqli_query($conn, $query);
$toEmail = $user['email'];
$toName = $user['first_name']." ".$user['last_name'];
$subject = 'Iolovolio - Reimposta password';
$body = emailHeader();
$body .= "<tr><td colspan=\"4\" style=\"padding: 10px 20px\">Ciao ".$user['first_name'].",<br>".
"ricevi questa mail perchè hai richiesto il reset della tua password su Iolovolio, di seguito troverai la tua nuova password temporanea, ti consigliamo di modificarla al primo accesso:<br><br>".
"Username: ".$user['email']."<br>".
"Nuova password: ".$new_password."<br>".
"</td></tr>";
$body .= "<tr><td colspan=\"4\" style=\"padding: 10px 20px\">Grazie,<br>Servizio Clienti Iolovolio<br><br></td></tr>";
$body .= emailFooter();
$sent = sendEmail($toEmail, $toName, $subject, $body, 'noreply');
if($sent === true) {
$message = "Password reimpostata correttamente!<br>
Ti abbiamo inviato la nuova password provvisoria all'indirizzo ".trim($_POST['reset_usr']);
} else {
$message = "Erore invio mail!<br>
Contatta l'assistenza";
}
} else {
$message = "ERRORE: L'indirizzo email inserito non è presente nel database!<br>Controlla l'indirizzo inserito e riprova.";
}
}
?>
<div class="component-passwordRecovery">
<div class="container">
<div class="row">
<?php
if($message) {
echo "<div class=\"message col-12\">$message</div>";
}
?>
<div class="content col-12">
<div class="row">
<div class="col-12 col-md-6 mb-5">
<span class="title">Hai dimenticato la password?</span>
<span class="subtitle">Inserisci l'indirizzo email-con il quale ti sei registrato</span>
<form class="reset-form <?= $no_user ? 'error' : '';?>" action="/recupera-password" method="POST">
<div class="row">
<div class="col-12">
<span class="label">E-mail</span>
<input type="email" name="reset_usr" class="input input-text">
</div>
<div class="col-12 mt-4">
<button class="button button-brown button-big mr-auto">Reimposta password</button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>

5
components/passwordRecovery/passwordRecovery.js

@ -0,0 +1,5 @@
$(document).ready( () => {
console.log('Load component - passwordRecovery')
})

60
components/passwordRecovery/passwordRecovery.scss

@ -0,0 +1,60 @@
@import "../../src/scss/variables.scss";
@import "../../src/scss/mixins.scss";
.component-passwordRecovery {
padding: 10px 0 40px 0;
min-height: 100vh;
.message {
color: $white;
background: $brown;
padding: 10px;
margin-bottom: 20px;
@include font-style($font-sans, 'regular', $font-12);
animation: blinker 2s linear 1;
}
.content {
.title {
display: block;
@include font-style($font-serif, 400, $font-32);
color: $black;
height: 50px;
}
.subtitle {
display: block;
@include font-style($font-sans, 700, $font-16);
color: $gray;
height: 40px;
}
.label {
display: block;
@include font-style($font-sans, 700, $font-16);
color: $gray;
padding: 15px 0 5px 0;
}
.errors {
display: block;
@include font-style($font-sans, 700, $font-16);
color: $red;
padding: 15px 0 5px 0;
}
.input {
max-width: 400px;
&.error {
border: 1px solid $red;
}
}
.submit {
@include font-style($font-serif, 700, $font-16);
}
}
}

3
components/sectionHeader/sectionHeader.html

@ -16,6 +16,9 @@
case 'account':
$section_label = 'account';
break;
case 'recupera-password':
$section_label = 'recupera password';
break;
case 'acquistare':
case 'carrello':
case 'checkout':

7
components/thankyou/thankyou.html

@ -12,6 +12,13 @@
L'ordine è andato a buon fine. Riceverai un'e-mail all'indirizzo indicato con i dettagli dell'ordine.<br>
<b>Ti ringraziamo per aver acquistato su iolovolio.it</b>
</span>
<?php
if($_SESSION['AUTH']) {
?>
<a href="/account/ordini" class="goto button button-brown mt-4">Vai ai tuoi ordini</a>
<?php
}
?>
</div>
</div>
</div>

4
components/thankyou/thankyou.scss

@ -9,4 +9,8 @@
@include font-style($font-sans, 400, $font-18);
color: $gray;
}
.goto {
display: inline-block;
}
}

2
deploy.sh

@ -14,6 +14,6 @@ do
done
cd ..
rsync -avz --delete --exclude '/cgi-bin/conn.conn' --exclude '/admin/.htaccess' --exclude '/api' -e "ssh -i ./auth/marketmind.pem" ./public/* ubuntu@18.194.83.82:/var/www/iolovolio.com/
rsync -avz --delete --exclude '/cgi-bin/conn.conn' --exclude '/admin/.htaccess' --exclude '/admin/.htpasswd' --exclude '/api' -e "ssh -i ./auth/marketmind.pem" ./public/* ubuntu@18.194.83.82:/var/www/iolovolio.com/
rsync -avz --delete --exclude '/config.php' --exclude '/vendor' -e "ssh -i ./auth/marketmind.pem" ./api/* ubuntu@18.194.83.82:/var/www/iolovolio.com/api/

6
package.json

@ -5,8 +5,8 @@
"main": "index.js",
"repository": "http://git.dslak.it:3000/dslak/iolovolio.git",
"scripts": {
"dev": "nodemon --watch webpack.config.js --exec \"webpack --config webpack.config.js --watch --progress --mode development\"",
"prod": "webpack --config webpack.config.js --mode none --env prod=true",
"dev": "export NODE_OPTIONS=--openssl-legacy-provider && nodemon --watch webpack.config.js --exec \"webpack --config webpack.config.js --watch --progress --mode development\"",
"prod": "export NODE_OPTIONS=--openssl-legacy-provider && webpack --config webpack.config.js --mode none --env prod=true",
"deploy": "yarn prod && sh deploy.sh",
"add-comp": "sh ./comps.sh add",
"del-comp": "sh ./comps.sh del",
@ -44,11 +44,11 @@
"jquery": "^3.5.1",
"mini-css-extract-plugin": "^1.3.3",
"minimist": "^1.2.5",
"node-sass": "^5.0.0",
"nodemon": "^2.0.6",
"popper.js": "^1.16.1",
"postcss-loader": "^4.1.0",
"prettier": "^2.2.1",
"sass": "^1.49.9",
"sass-loader": "^10.1.0",
"slick-slider": "^1.8.2",
"url-loader": "^4.1.1",

1
pages/index.ejs

@ -81,6 +81,7 @@
if($getQ[0] == 'checkout' || $getQ[0] == 'account') {
?>
<script src="https://www.google.com/recaptcha/api.js?render=${ENV.RECAPTCHA_SITE_KEY}"></script>
<script src="https://www.paypal.com/sdk/js?client-id=${ENV.PP_CLIENTID}&components=buttons&currency=EUR&locale=it_IT"></script>
<?php
}
?>

2
pages/recupera-password.ejs

@ -0,0 +1,2 @@
${require('../components/passwordRecovery/passwordRecovery.html')}

BIN
src/fonts/icomoon.eot

Binary file not shown.

2
src/fonts/icomoon.svg

@ -15,5 +15,5 @@
<glyph unicode="&#xe905;" glyph-name="angle-right" d="M253.965 26.513l47.292-47.292 468.778 468.778-468.778 468.778-47.292-47.292 421.487-421.487z" />
<glyph unicode="&#xe906;" glyph-name="angle-left" d="M770.035 869.487l-47.292 47.292-468.778-468.778 468.778-468.778 47.292 47.292-421.487 421.487z" />
<glyph unicode="&#xe907;" glyph-name="close" d="M811.532 805.42l57.959-57.973-657.024-656.865-57.959 57.973zM869.43 148.479l-57.973-57.959-656.865 657.024 57.973 57.959z" />
<glyph unicode="&#xe908;" glyph-name="user" d="M511.999 782.445c94.616 0 172.93-78.305 172.93-172.93s-78.307-172.93-172.93-172.93c-94.616 0-172.93 78.304-172.93 172.93s78.304 172.93 172.93 172.93zM511.999 864.011c-140.299 0-254.496-114.197-254.496-254.496s114.197-254.496 254.496-254.496c140.3 0 254.497 114.197 254.497 254.496s-114.197 254.496-254.497 254.496zM512.003 306.085c94.616 0 205.553-22.841 231.652-189.241h-463.307c29.361 166.4 137.038 189.241 231.653 189.241zM512.003 394.183c-179.45 0-323.009-88.098-323.009-362.164h646.029c0 274.072-143.559 362.164-323.008 362.164z" />
<glyph unicode="&#xe908;" glyph-name="user" d="M511.999 789.38c98.41 0 179.865-81.445 179.865-179.865s-81.447-179.865-179.865-179.865c-98.41 0-179.865 81.444-179.865 179.865s81.444 179.865 179.865 179.865zM511.999 864.011c-140.299 0-254.496-114.197-254.496-254.496s114.197-254.496 254.496-254.496c140.3 0 254.497 114.197 254.497 254.496s-114.197 254.496-254.497 254.496zM512.002 337.547c117.39 0 255.030-33.386 287.411-276.607h-574.827c36.428 243.221 154.135 276.607 287.413 276.607zM512.002 406.657c-203.703 0-366.665-100.005-366.665-411.112h733.343c0 311.114-162.962 411.112-366.664 411.112z" />
</font></defs></svg>

Before

Width:  |  Height:  |  Size: 2.4 KiB

After

Width:  |  Height:  |  Size: 2.4 KiB

BIN
src/fonts/icomoon.ttf

Binary file not shown.

BIN
src/fonts/icomoon.woff

Binary file not shown.

2
src/fonts/selection.json

@ -1 +1 @@
{"IcoMoonType":"selection","icons":[{"icon":{"paths":["M511.999 177.555c94.616 0 172.93 78.305 172.93 172.93s-78.307 172.93-172.93 172.93c-94.616 0-172.93-78.304-172.93-172.93s78.304-172.93 172.93-172.93zM511.999 95.989c-140.299 0-254.496 114.197-254.496 254.496s114.197 254.496 254.496 254.496c140.3 0 254.497-114.197 254.497-254.496s-114.197-254.496-254.497-254.496z","M512.003 653.915c94.616 0 205.553 22.841 231.652 189.241h-463.307c29.361-166.4 137.038-189.241 231.653-189.241zM512.003 565.817c-179.45 0-323.009 88.098-323.009 362.164h646.029c0-274.072-143.559-362.164-323.008-362.164z"],"attrs":[{},{}],"isMulticolor":false,"isMulticolor2":false,"grid":0,"tags":["user"]},"attrs":[{},{}],"properties":{"order":471,"id":8,"name":"user","prevSize":32,"code":59656},"setIdx":0,"setId":0,"iconIdx":0},{"icon":{"paths":["M498.102 56.824c-115.187 0-211.767 96.565-211.767 215.468h-167.207v78.016h0.363v538.852h-0.363v78.016h784.003v-7.693h1.742v-687.408h-78.016v0.218h-113.213c0-118.903-100.353-215.468-215.541-215.468zM498.102 131.139c78.030 0 141.226 63.124 141.226 141.154h-278.679c0-78.030 59.422-141.154 137.453-141.154zM197.579 350.308h88.756v55.736h74.314v-55.736h278.679v55.736h74.314v-55.736h113.213v538.852h-629.278z"],"attrs":[{}],"isMulticolor":false,"isMulticolor2":false,"tags":["buy"],"grid":0},"attrs":[{}],"properties":{"order":117,"id":0,"name":"buy","prevSize":32,"code":59648},"setIdx":0,"setId":0,"iconIdx":1},{"icon":{"paths":["M976.53 470.996v81.976h-929.060v-81.976z"],"attrs":[{}],"isMulticolor":false,"isMulticolor2":false,"tags":["minus"],"grid":0},"attrs":[{}],"properties":{"order":118,"id":1,"name":"minus","prevSize":32,"code":59649},"setIdx":0,"setId":0,"iconIdx":2},{"icon":{"paths":["M471.011 47.47h81.976v929.060h-81.976z","M976.53 470.996v81.976h-929.060v-81.976z"],"attrs":[{},{}],"isMulticolor":false,"isMulticolor2":false,"tags":["plus"],"grid":0},"attrs":[{},{}],"properties":{"order":147,"id":2,"name":"plus","prevSize":32,"code":59650},"setIdx":0,"setId":0,"iconIdx":3},{"icon":{"paths":["M811.532 154.58l57.959 57.973-657.024 656.865-57.959-57.973z","M869.43 811.521l-57.973 57.959-656.865-657.024 57.973-57.959z"],"attrs":[{},{}],"isMulticolor":false,"isMulticolor2":false,"tags":["close"],"grid":0},"attrs":[{},{}],"properties":{"order":148,"id":3,"prevSize":32,"code":59655,"name":"close"},"setIdx":0,"setId":0,"iconIdx":4},{"icon":{"paths":["M90.513 253.965l-47.292 47.292 468.778 468.778 468.778-468.778-47.292-47.292-421.487 421.487z"],"attrs":[{}],"isMulticolor":false,"isMulticolor2":false,"tags":["angle-down"],"grid":0},"attrs":[{}],"properties":{"order":119,"id":4,"name":"angle-down","prevSize":32,"code":59651},"setIdx":0,"setId":0,"iconIdx":5},{"icon":{"paths":["M933.487 770.035l47.292-47.292-468.778-468.778-468.778 468.778 47.292 47.292 421.487-421.487z"],"attrs":[{}],"isMulticolor":false,"isMulticolor2":false,"tags":["angle-top"],"grid":0},"attrs":[{}],"properties":{"order":122,"id":5,"prevSize":32,"code":59652,"name":"angle-top"},"setIdx":0,"setId":0,"iconIdx":6},{"icon":{"paths":["M253.965 933.487l47.292 47.292 468.778-468.778-468.778-468.778-47.292 47.292 421.487 421.487z"],"attrs":[{}],"isMulticolor":false,"isMulticolor2":false,"tags":["angle-right"],"grid":0},"attrs":[{}],"properties":{"order":120,"id":6,"prevSize":32,"code":59653,"name":"angle-right"},"setIdx":0,"setId":0,"iconIdx":7},{"icon":{"paths":["M770.035 90.513l-47.292-47.292-468.778 468.778 468.778 468.778 47.292-47.292-421.487-421.487z"],"attrs":[{}],"isMulticolor":false,"isMulticolor2":false,"tags":["angle-left"],"grid":0},"attrs":[{}],"properties":{"order":121,"id":7,"prevSize":32,"code":59654,"name":"angle-left"},"setIdx":0,"setId":0,"iconIdx":8}],"height":1024,"metadata":{"name":"icomoon"},"preferences":{"showGlyphs":true,"showQuickUse":false,"showQuickUse2":true,"showSVGs":true,"fontPref":{"prefix":"icon-","metadata":{"fontFamily":"icomoon"},"metrics":{"emSize":1024,"baseline":6.25,"whitespace":50},"embed":false,"autoHost":true},"imagePref":{"prefix":"icon-","png":true,"useClassSelector":true,"color":0,"bgColor":16777215,"classSelector":".icon"},"historySize":50,"showCodes":true,"gridSize":16,"quickUsageToken":{"UntitledProject":"ZjQ5ODNjZDkzZGRhNGRlZDg3YmQ2Njc5YTQyNWU2Y2QjMSMxNTY0MDUxMDkxIyMj"},"showGrid":false}}
{"IcoMoonType":"selection","icons":[{"icon":{"paths":["M511.999 170.62c98.41 0 179.865 81.445 179.865 179.865s-81.447 179.865-179.865 179.865c-98.41 0-179.865-81.444-179.865-179.865s81.444-179.865 179.865-179.865zM511.999 95.989c-140.299 0-254.496 114.197-254.496 254.496s114.197 254.496 254.496 254.496c140.3 0 254.497-114.197 254.497-254.496s-114.197-254.496-254.497-254.496z","M512.002 622.453c117.39 0 255.030 33.386 287.411 276.607h-574.827c36.428-243.221 154.135-276.607 287.413-276.607zM512.002 553.343c-203.703 0-366.665 100.005-366.665 411.112h733.343c0-311.114-162.962-411.112-366.664-411.112z"],"attrs":[{},{}],"tags":["user"],"grid":0,"isMulticolor":false,"isMulticolor2":false},"attrs":[{},{}],"properties":{"order":471,"id":0,"name":"user","prevSize":32,"code":59656},"setIdx":0,"setId":0,"iconIdx":0},{"icon":{"paths":["M498.102 56.824c-115.187 0-211.767 96.565-211.767 215.468h-167.207v78.016h0.363v538.852h-0.363v78.016h784.003v-7.693h1.742v-687.408h-78.016v0.218h-113.213c0-118.903-100.353-215.468-215.541-215.468zM498.102 131.139c78.030 0 141.226 63.124 141.226 141.154h-278.679c0-78.030 59.422-141.154 137.453-141.154zM197.579 350.308h88.756v55.736h74.314v-55.736h278.679v55.736h74.314v-55.736h113.213v538.852h-629.278z"],"attrs":[{}],"isMulticolor":false,"isMulticolor2":false,"tags":["buy"],"grid":0},"attrs":[{}],"properties":{"order":117,"id":1,"name":"buy","prevSize":32,"code":59648},"setIdx":0,"setId":0,"iconIdx":1},{"icon":{"paths":["M976.53 470.996v81.976h-929.060v-81.976z"],"attrs":[{}],"isMulticolor":false,"isMulticolor2":false,"tags":["minus"],"grid":0},"attrs":[{}],"properties":{"order":118,"id":2,"name":"minus","prevSize":32,"code":59649},"setIdx":0,"setId":0,"iconIdx":2},{"icon":{"paths":["M471.011 47.47h81.976v929.060h-81.976z","M976.53 470.996v81.976h-929.060v-81.976z"],"attrs":[{},{}],"isMulticolor":false,"isMulticolor2":false,"tags":["plus"],"grid":0},"attrs":[{},{}],"properties":{"order":147,"id":3,"name":"plus","prevSize":32,"code":59650},"setIdx":0,"setId":0,"iconIdx":3},{"icon":{"paths":["M811.532 154.58l57.959 57.973-657.024 656.865-57.959-57.973z","M869.43 811.521l-57.973 57.959-656.865-657.024 57.973-57.959z"],"attrs":[{},{}],"isMulticolor":false,"isMulticolor2":false,"tags":["close"],"grid":0},"attrs":[{},{}],"properties":{"order":148,"id":4,"prevSize":32,"code":59655,"name":"close"},"setIdx":0,"setId":0,"iconIdx":4},{"icon":{"paths":["M90.513 253.965l-47.292 47.292 468.778 468.778 468.778-468.778-47.292-47.292-421.487 421.487z"],"attrs":[{}],"isMulticolor":false,"isMulticolor2":false,"tags":["angle-down"],"grid":0},"attrs":[{}],"properties":{"order":119,"id":5,"name":"angle-down","prevSize":32,"code":59651},"setIdx":0,"setId":0,"iconIdx":5},{"icon":{"paths":["M933.487 770.035l47.292-47.292-468.778-468.778-468.778 468.778 47.292 47.292 421.487-421.487z"],"attrs":[{}],"isMulticolor":false,"isMulticolor2":false,"tags":["angle-top"],"grid":0},"attrs":[{}],"properties":{"order":122,"id":6,"prevSize":32,"code":59652,"name":"angle-top"},"setIdx":0,"setId":0,"iconIdx":6},{"icon":{"paths":["M253.965 933.487l47.292 47.292 468.778-468.778-468.778-468.778-47.292 47.292 421.487 421.487z"],"attrs":[{}],"isMulticolor":false,"isMulticolor2":false,"tags":["angle-right"],"grid":0},"attrs":[{}],"properties":{"order":120,"id":7,"prevSize":32,"code":59653,"name":"angle-right"},"setIdx":0,"setId":0,"iconIdx":7},{"icon":{"paths":["M770.035 90.513l-47.292-47.292-468.778 468.778 468.778 468.778 47.292-47.292-421.487-421.487z"],"attrs":[{}],"isMulticolor":false,"isMulticolor2":false,"tags":["angle-left"],"grid":0},"attrs":[{}],"properties":{"order":121,"id":8,"prevSize":32,"code":59654,"name":"angle-left"},"setIdx":0,"setId":0,"iconIdx":8}],"height":1024,"metadata":{"name":"icomoon"},"preferences":{"showGlyphs":true,"showQuickUse":false,"showQuickUse2":true,"showSVGs":true,"fontPref":{"prefix":"icon-","metadata":{"fontFamily":"icomoon"},"metrics":{"emSize":1024,"baseline":6.25,"whitespace":50},"embed":false,"autoHost":true},"imagePref":{"prefix":"icon-","png":true,"useClassSelector":true,"color":0,"bgColor":16777215,"classSelector":".icon"},"historySize":50,"showCodes":true,"gridSize":16,"quickUsageToken":{"UntitledProject":"ZjQ5ODNjZDkzZGRhNGRlZDg3YmQ2Njc5YTQyNWU2Y2QjMSMxNTY0MDUxMDkxIyMj"},"showGrid":false}}

6
src/scss/forms.scss

@ -215,10 +215,10 @@ select,
input {
position: absolute;
opacity: 0;
opacity: 0 !important;
cursor: pointer;
height: 0;
width: 0;
height: 0 !important;
width: 0 !important;
&:checked ~ .mark {
&:after {
display: block;

1
src/scss/main.scss

@ -25,3 +25,4 @@
@import "./components/checkout/checkout.scss";
@import "./components/thankyou/thankyou.scss";
@import "./components/account/account.scss";
@import "./components/passwordRecovery/passwordRecovery.scss";

7
src/scss/variables.scss

@ -51,10 +51,11 @@ $black-alpha: rgba(0, 0, 0, 0.2);
//Hamburgers settings
$hamburger-padding-x : 0;
$hamburger-padding-y : 6px;
$hamburger-layer-width : 30px;
$hamburger-padding-y : 5px;
$hamburger-layer-width : 25px;
$hamburger-layer-height : 3px;
$hamburger-layer-spacing : 8px;
$hamburger-layer-spacing : 6px;
$hamburger-layer-color : $olive-dark;
$hamburger-layer-border-radius : 0;
$hamburger-hover-opacity : 1;

Loading…
Cancel
Save