445 lines
13 KiB
JavaScript
445 lines
13 KiB
JavaScript
let available_colors = {
|
|
white: {
|
|
name: 'blanco',
|
|
rgb: 'rgb(255, 255, 255)'
|
|
},
|
|
black: {
|
|
name: 'negro',
|
|
rgb: 'rgb(0, 0, 0)'
|
|
},
|
|
blue: {
|
|
name: 'azul',
|
|
rgb: 'rgb(0, 0, 255)'
|
|
},
|
|
petrol: {
|
|
name: 'petroleo',
|
|
rgb: 'rgb(0, 0, 150)'
|
|
},
|
|
cyan: {
|
|
name: 'celeste',
|
|
rgb: 'rgb(150, 150, 255)'
|
|
},
|
|
green: {
|
|
name: 'verde',
|
|
rgb: 'rgb(0, 255, 0)'
|
|
},
|
|
yellow: {
|
|
name: 'amarillo',
|
|
rgb: 'rgb(255, 255, 0)'
|
|
},
|
|
orange: {
|
|
name: 'naranjo',
|
|
rgb: 'rgb(255, 130, 0)'
|
|
},
|
|
red: {
|
|
name: 'rojo',
|
|
rgb: 'rgb(255, 0, 0)'
|
|
}
|
|
}
|
|
|
|
class Amount {
|
|
constructor(elem) {
|
|
this.elem = elem
|
|
this.minus = elem.parent().find('.minus')
|
|
this.plus = elem.parent().find('.plus')
|
|
this.n = 0
|
|
this.setup()
|
|
this.max = 999
|
|
}
|
|
setup() {
|
|
this.elem.val(0)
|
|
this.plus.click((e) => {
|
|
this.increment()
|
|
this.print()
|
|
})
|
|
this.minus.click((e) => {
|
|
this.decrement()
|
|
this.print()
|
|
})
|
|
this.elem.change((e) => {
|
|
this.n = parseInt(this.elem.val())
|
|
this.print()
|
|
})
|
|
this.print()
|
|
}
|
|
enable_button(name) {
|
|
this[name].removeClass('disabled')
|
|
if (name == 'plus') {
|
|
this[name].html('<i class="plus icon"></i>')
|
|
}
|
|
if (name == 'minus') {
|
|
this[name].html('<i class="minus icon"></i>')
|
|
}
|
|
}
|
|
disable_button(name) {
|
|
this[name].addClass('disabled')
|
|
this[name].html('')
|
|
}
|
|
check_limits() {
|
|
this.enable_button('plus')
|
|
this.enable_button('minus')
|
|
if (this.n > this.max) {
|
|
this.n = this.max
|
|
}
|
|
if (this.n == this.max) {
|
|
this.disable_button('plus')
|
|
}
|
|
|
|
if (this.n < 0) {
|
|
this.n = 0
|
|
}
|
|
if (this.n == 0) {
|
|
this.disable_button('minus')
|
|
}
|
|
}
|
|
increment() {
|
|
this.n += 1
|
|
}
|
|
decrement() {
|
|
this.n -= 1
|
|
}
|
|
get value() {
|
|
return this.n
|
|
}
|
|
print() {
|
|
this.check_limits()
|
|
this.elem.val(this.n)
|
|
}
|
|
}
|
|
|
|
class Colors {
|
|
constructor(elem, changing = false) {
|
|
this.colors = available_colors
|
|
this.picked = 'blue'
|
|
this.elem = elem
|
|
this.input = elem.find('input[name="color"]')
|
|
this.changing = null
|
|
if (changing) {
|
|
this.changing = elem.parent().parent().find('.column2 img')
|
|
}
|
|
this.setup()
|
|
}
|
|
setup() {
|
|
this.elem.find('.circle').each((i, el) => {
|
|
let color = $(el).attr('class').split(' ')[0]
|
|
let cssColor = $(el).css('background-color')
|
|
if (cssColor != this.colors[color]['rgb']) {
|
|
$(el).css('background-color', this.colors[color]['rgb'])
|
|
}
|
|
$(el).click((e) => {
|
|
this.change_color(color)
|
|
})
|
|
})
|
|
this.change_color('blue')
|
|
}
|
|
default_color_format(el) {
|
|
$(el).removeClass('selected')
|
|
}
|
|
change_color(color) {
|
|
this.picked = this.colors[color]['name']
|
|
this.input.val(this.picked)
|
|
this.elem.find('.circle').each((i, el) => {
|
|
this.default_color_format(el)
|
|
})
|
|
this.elem.find('.' + color + '.circle').addClass('selected')
|
|
if (this.changing != null) {
|
|
this.changing.attr('src', './assets/images/' + this.picked + '.png')
|
|
}
|
|
}
|
|
}
|
|
|
|
let ventajas = {
|
|
elem: $('#ventajas'),
|
|
fotos: 6,
|
|
setup: function() {
|
|
let h = this.elem.css('height')
|
|
let w = this.elem.css('width')
|
|
|
|
this.elem.find('.diagonal').css('borderBottomWidth', h)
|
|
this.elem.find('.diagonal').css('borderRightWidth', w)
|
|
|
|
this.elem.find('.nav.left').click((e) => {
|
|
this.prev()
|
|
})
|
|
this.elem.find('.nav.right').click((e) => {
|
|
this.next()
|
|
})
|
|
|
|
this.elem.find('.gallery').swipe({
|
|
swipeLeft: (e, dir, d, t, n, data) => {
|
|
this.next()
|
|
},
|
|
swipeRight: (e, dir, d, t, n, data) => {
|
|
this.prev()
|
|
}
|
|
})
|
|
},
|
|
current: 1,
|
|
next: function() {
|
|
var n = this.current + 1
|
|
if (n > this.fotos) {
|
|
n = 1
|
|
}
|
|
this.elem.find('.gallery .image img').attr('src', './assets/images/galeria/foto' + n + '.jpg')
|
|
this.current = n
|
|
},
|
|
prev: function() {
|
|
var n = this.current - 1
|
|
if (n < 1) {
|
|
n = this.fotos
|
|
}
|
|
this.elem.find('.gallery .image img').attr('src', './assets/images/galeria/foto' + n + '.jpg')
|
|
this.current = n
|
|
}
|
|
}
|
|
let dimensiones = {
|
|
colors: available_colors,
|
|
elem: $('#dimensiones'),
|
|
setup: function() {
|
|
this.elem.find('.colores .circle').each((i, el) => {
|
|
let color = $(el).attr('class').split(' ')[0]
|
|
if (color == 'petrol' || color == 'cyan') {
|
|
$(el).css('background-color', this.colors[color]['rgb'])
|
|
}
|
|
$(el).click((e) => {
|
|
this.change_color(color)
|
|
})
|
|
})
|
|
},
|
|
change_color: function(color) {
|
|
this.picked = this.colors[color]['name']
|
|
this.elem.find('.colores .circle').each((i, el) => {
|
|
$(el).removeClass('selected')
|
|
})
|
|
this.elem.find('.colores .' + color + '.circle').addClass('selected')
|
|
this.change_images(this.colors[color]['name'])
|
|
},
|
|
change_images: function(color) {
|
|
this.elem.find('.fotos img').each((i, el) => {
|
|
let pos = $(el).attr('class')
|
|
$(el).attr('src', './assets/images/fotos/' + color + '/' + pos + '.jpg')
|
|
})
|
|
}
|
|
}
|
|
|
|
let smtp = {
|
|
SecureToken: '4adcdc1f-6b6e-4e60-ab72-20da4c329b09',
|
|
From: 'contacto@3dstand.cl'
|
|
}
|
|
|
|
let sticky_form = {
|
|
elem: $('.sticky form'),
|
|
setup: function() {
|
|
this.elem.submit((e) => {
|
|
e.preventDefault()
|
|
this.submit()
|
|
return false
|
|
})
|
|
},
|
|
submit: function() {
|
|
console.debug('submit sticky')
|
|
}
|
|
}
|
|
let cotiza_form = {
|
|
elem: $('#corporativos form'),
|
|
setup: function() {
|
|
this.elem.submit((e) => {
|
|
e.preventDefault()
|
|
this.submit()
|
|
return false
|
|
})
|
|
this.file = this.elem.find('input[type="file"]')
|
|
this.elem.find('.file').click((e) => {
|
|
this.file.trigger('click')
|
|
})
|
|
},
|
|
submit: function() {
|
|
let email = this.elem.find('[name="email"]').val()
|
|
let data = new FormData(this.elem[0])
|
|
let body = [
|
|
'Nombre: ' + this.elem.find('[name="nombre"]').val(),
|
|
'E-mail: ' + email,
|
|
'Teléfono: ' + this.elem.find('[name="telefono"]').val(),
|
|
'',
|
|
'Color: ' + this.elem.find('[name="color"]').val(),
|
|
'Cantidad: ' + this.elem.find('[name="cantidad"]').val(),
|
|
this.elem.find('[name="mensaje"]').val()
|
|
]
|
|
let content = {
|
|
SecureToken: smtp.SecureToken,
|
|
To: email,
|
|
From: smtp.From,
|
|
Subject: 'Cotizacion - ' + (new Date()).toLocaleString('es-CL', {timezone: "UTC-3"}),
|
|
Body: body.join('<br />'),
|
|
Attachments: [
|
|
{
|
|
name: "Logo",
|
|
data: data.get('archivo')
|
|
}
|
|
]
|
|
}
|
|
Email.send(content)
|
|
}
|
|
}
|
|
let conversemos_form = {
|
|
elem: $('#contacto_form'),
|
|
setup: function() {
|
|
this.elem.submit((e) => {
|
|
e.preventDefault()
|
|
this.submit()
|
|
return false
|
|
})
|
|
},
|
|
submit: function() {
|
|
let email = this.elem.find('[name="email"]').val()
|
|
let body = [
|
|
'Nombre: ' + this.elem.find('[name="nombre"]').val(),
|
|
'E-mail: ' + email,
|
|
'',
|
|
this.elem.find('[name="mensaje"]').val()
|
|
]
|
|
let content = {
|
|
SecureToken: smtp.SecureToken,
|
|
From: smtp.From,
|
|
To: email,
|
|
Subject: 'Contacto ' + (new Date()).toLocaleString('es-CL', {timezone: "UTC-3"}),
|
|
Body: body.join('<br />')
|
|
}
|
|
Email.send(content)
|
|
}
|
|
}
|
|
|
|
let testimonios = {
|
|
testimonios: [
|
|
{
|
|
"autor": "John Master",
|
|
"contenido": "Este soporte que compré en @Stand-cl me cambió la vida, me sirve para el teléfono y el ipad, y ya no tengo que andar acomodando los aparatos en cualquier parte para las videollamadas"
|
|
},
|
|
{
|
|
"autor": "John Master",
|
|
"contenido": "Siiii todo mi gusto.. me encantó lo completo que es. Gracias"
|
|
},
|
|
{
|
|
"autor": "John Master",
|
|
"contenido": "Está super cool se ve de buena calidad"
|
|
},
|
|
{
|
|
"autor": "John Master",
|
|
"contenido": "Llego el mío, y es excelente, estoy feliz con mi compra"
|
|
},
|
|
{
|
|
"autor": "John Master",
|
|
"contenido": "Hola!!Me llegó el pedido, Muchas gracias muy bello. Me salvaste la vida"
|
|
},
|
|
{
|
|
"autor": "John Master",
|
|
"contenido": "Perfecto el producto, funciona impecable, muchas gracias"
|
|
},
|
|
{
|
|
"autor": "John Master",
|
|
"contenido": "Están bacanes! muchísimas gracias. Le regalé a mis viejos y lo aman"
|
|
},
|
|
{
|
|
"autor": "John Master",
|
|
"contenido": "Hola! Quería decirte que me encantaron los soportes, Muy útiles!"
|
|
},
|
|
{
|
|
"autor": "John Master",
|
|
"contenido": "Compré 3 y olvidé decirte que los encontré geniales! Me encantaron"
|
|
},
|
|
{
|
|
"autor": "John Master",
|
|
"contenido": "Diseño simple y funcional, minimalista y excelente precio, despacho súper Rápido.. gracias!"
|
|
}
|
|
],
|
|
elem: $('#testimonios'),
|
|
page: 0,
|
|
setup: function() {
|
|
if (this.amount != 3) {
|
|
this.elem.find('.testimonios').removeClass('three')
|
|
this.elem.find('.testimonios').addClass(this.word_amount[this.amount])
|
|
}
|
|
this.draw()
|
|
},
|
|
amount: 3,
|
|
word_amount: {
|
|
1: 'one',
|
|
3: 'three'
|
|
},
|
|
draw: function() {
|
|
var n = this.page * this.amount
|
|
let p = this.elem.find('.testimonios')
|
|
p.html('')
|
|
for (var i = 0; i < this.amount; i ++) {
|
|
if (n >= this.testimonios.length) {
|
|
break
|
|
}
|
|
p.append(
|
|
$('<div></div>').attr('class', 'ui centered fluid card').append(
|
|
$('<div></div>').attr('class', 'center aligned content').append(
|
|
$('<div></div>').attr('class', 'header').html(this.testimonios[n]['autor'].toUpperCase())
|
|
).append(
|
|
$('<div></div>').attr('class', 'description').html(this.testimonios[n]['contenido'])
|
|
)
|
|
).append(
|
|
$('<div></div>').attr('class', 'center aligned content').append(
|
|
$('<div></div>').attr('class', 'ui mini black rating disabled').attr('data-rating', '5').attr('data-max-rating', '5')
|
|
)
|
|
)
|
|
)
|
|
n ++
|
|
}
|
|
this.elem.find('.ui.rating').rating()
|
|
this.draw_nav()
|
|
},
|
|
draw_nav: function() {
|
|
let N = Math.ceil(this.testimonios.length / this.amount)
|
|
let k = this.page
|
|
let nav = this.elem.find('.nav')
|
|
let tests = this
|
|
nav.html('')
|
|
for (var i = 0; i < N; i ++) {
|
|
var circle = $('<i></i>').attr('class', 'small circle outline icon').css('cursor', 'pointer').attr('data-page', i)
|
|
if (i == k) {
|
|
circle.removeClass('outline')
|
|
}
|
|
circle.click(function(e) {
|
|
tests.page = parseInt($(this).attr('data-page'))
|
|
tests.draw()
|
|
})
|
|
nav.append(circle)
|
|
}
|
|
}
|
|
}
|
|
|
|
$(document).ready(function() {
|
|
$('#menu.sticky').sticky()
|
|
$('.column2 .sticky').sticky({
|
|
context: '#column'
|
|
})
|
|
$('#subir').sticky()
|
|
|
|
$('.shopping.cart').innerText = 0
|
|
|
|
ventajas.setup()
|
|
dimensiones.setup()
|
|
let sticky_amount = new Amount($('.sticky .input input[name="cantidad"]'))
|
|
let sticky_color = new Colors($('.sticky .colores'), true)
|
|
sticky_form.setup()
|
|
let cotiza_amount = new Amount($('#corporativos .input input[name="cantidad"]'))
|
|
let cotiza_color = new Colors($('#corporativos .colores'))
|
|
cotiza_form.setup()
|
|
conversemos_form.setup()
|
|
|
|
window.mobileCheck = function() {
|
|
let check = false;
|
|
(function(a){if(/(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|mobile.+firefox|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows ce|xda|xiino/i.test(a)||/1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i.test(a.substr(0,4))) check = true;})(navigator.userAgent||navigator.vendor||window.opera);
|
|
return check;
|
|
};
|
|
|
|
if (window.mobileCheck()) {
|
|
testimonios.amount = 1
|
|
}
|
|
testimonios.setup()
|
|
})
|