Skip to content
Snippets Groups Projects
Commit 30409063 authored by Rafael Caferati's avatar Rafael Caferati
Browse files

Refactored and reorganised entire css/less files and logic.

parent 1f072dfa
No related branches found
No related tags found
No related merge requests found
@FlexTab = (->
check = ->
$flex = $("section.flex-tab")
if $flex.length
$search = $flex.find ".search-form"
if $search.length
$siblings = $search.siblings("a")
if $siblings.length
width = ($siblings.outerWidth() + $siblings.css("marginLeft").replace("px","") * 2) * $siblings.length + 1
$search.css
width: "calc(100% - #{width}px)"
check: check
check = ->
$flex = $("section.flex-tab")
if $flex.length
$search = $flex.find ".search-form"
if $search.length
$siblings = $search.siblings("a")
if $siblings.length
width = ($siblings.outerWidth() + $siblings.css("marginLeft").replace("px","") * 2) * $siblings.length + 1
$search.css
width: "calc(100% - #{width}px)"
check: check
)()
@Modal = (->
self = {}
win = $(window)
self = {}
win = $(window)
#mistérios da vida c.483: Pq a self.$window diz ter 100% da janela via css mas na verdade ocupa menos de 100% da tela?
#isso impede que o retorno da janela ao normal quando não mais necessária a classe fluid. (comportamento dançante)
#mistérios da vida c.483: Pq a self.$window diz ter 100% da janela via css mas na verdade ocupa menos de 100% da tela?
#isso impede que o retorno da janela ao normal quando não mais necessária a classe fluid. (comportamento dançante)
focus = ->
if self.$modal
input = self.$modal.find "input[type='text']"
input.get(0).focus() if input.length
keydown = (e) ->
k = e.which
if k is 27
e.preventDefault()
e.stopImmediatePropagation()
close()
focus = ->
if self.$modal
input = self.$modal.find "input[type='text']"
input.get(0).focus() if input.length
keydown = (e) ->
k = e.which
if k is 27
e.preventDefault()
e.stopImmediatePropagation()
close()
check = ->
if self.$modal and self.$modal.length
if win.height() < self.$window.outerHeight() + (win.height() * 0.10)
unless self.$modal.hasClass("fluid")
self.$modal.addClass("fluid")
#else
#if self.$modal.hasClass("fluid")
#self.$modal.removeClass("fluid")
check = ->
if self.$modal and self.$modal.length
if win.height() < self.$window.outerHeight() + (win.height() * 0.10)
unless self.$modal.hasClass("fluid")
self.$modal.addClass("fluid")
#else
#if self.$modal.hasClass("fluid")
#self.$modal.removeClass("fluid")
open = (template, params) ->
params = params or {}
Rocket.animeBack self.$modal, ->
focus()
self.opened = 1
startListening() if params.listening
setContent template, params.data if template?
self.$modal.addClass "opened"
self.$modal.removeClass "fluid"
setTimeout ->
focus()
,200
open = (template, params) ->
params = params or {}
Rocket.animeBack self.$modal, ->
focus()
self.opened = 1
startListening() if params.listening
setContent template, params.data if template?
self.$modal.addClass "opened"
self.$modal.removeClass "fluid"
setTimeout ->
focus()
,200
close = ->
self.$modal.addClass "closed"
win.unbind("keydown.modal")
# acionar no on-complete da animação
setTimeout ->
self.opened = 0
stopListening()
self.$modal.removeClass "opened closed"
, 300
close = ->
self.$modal.addClass "closed"
win.unbind("keydown.modal")
# acionar no on-complete da animação
setTimeout ->
self.opened = 0
stopListening()
self.$modal.removeClass "opened closed"
, 300
setContent = (template, data) ->
self.$main.empty()
if template
if data
Blaze.renderWithData template, data, self.$main.get(0)
else
Blaze.render template, self.$main.get(0)
checkFooter()
check()
setContent = (template, data) ->
self.$main.empty()
if template
if data
Blaze.renderWithData template, data, self.$main.get(0)
else
Blaze.render template, self.$main.get(0)
checkFooter()
check()
checkFooter = ->
if self.$footer and self.$footer.length
buttons = self.$footer.find "button"
buttons.each ->
btn = $(@)
if btn.html().match /fechar/ig
btn.click (e) ->
e.preventDefault()
close()
checkFooter = ->
if self.$footer and self.$footer.length
buttons = self.$footer.find "button"
buttons.each ->
btn = $(@)
if btn.html().match /fechar/ig
btn.click (e) ->
e.preventDefault()
close()
startListening = ->
stopListening()
self.interval = setInterval ->
check()
, 100
startListening = ->
stopListening()
self.interval = setInterval ->
check()
, 100
stopListening = ->
clearInterval self.interval if self.interval
stopListening = ->
clearInterval self.interval if self.interval
init = ($modal, params) ->
self.params = params or {}
self.opened = 0
self.initialized = 0
self.$modal = if $modal.length then $modal else $(".kncty-modal")
if self.$modal.length
self.initialized = 0
self.$window = self.$modal.find ".-modal"
self.$main = self.$modal.find "main"
self.$close = self.$modal.find "header > .close"
self.$footer = self.$modal.find "footer"
self.$close.unbind("click").click close
win.unbind("resize.modal").bind "resize.modal", check
win.unbind("keydown.modal").bind "keydown.modal", (e) ->
keydown(e)
init = ($modal, params) ->
self.params = params or {}
self.opened = 0
self.initialized = 0
self.$modal = if $modal.length then $modal else $(".rocket-modal")
if self.$modal.length
self.initialized = 0
self.$window = self.$modal.find ".modal"
self.$main = self.$modal.find "main"
self.$close = self.$modal.find "header > .close"
self.$footer = self.$modal.find "footer"
self.$close.unbind("click").click close
win.unbind("resize.modal").bind "resize.modal", check
win.unbind("keydown.modal").bind "keydown.modal", (e) ->
keydown(e)
init: init
open: open
close: close
focus: focus
setContent: setContent
init: init
open: open
close: close
focus: focus
setContent: setContent
)()
......@@ -20,3 +20,105 @@
99% { opacity: 0; visibility: visible; }
100% { opacity: 0; visibility: hidden; }
}
@-webkit-keyframes highlight {
0% {
background: #ffff99;
}
100% {
background: none;
}
}
@-moz-keyframes highlight {
0% {
background: #ffff99;
}
100% {
background: none;
}
}
@-o-keyframes highlight {
0% {
background: #ffff99;
}
100% {
background: none;
}
}
@keyframes highlight {
0% {
background: #ffff99;
}
100% {
background: none;
}
}
@keyframes modalEnter {
0% {
opacity: 0;
visibility: hidden;
}
1% {
opacity: 0;
visibility: visible;
.transform(translateY(-150px));
}
100% {
opacity: 1;
visibility: visible;
.transform(translateY(0));
}
}
@-webkit-keyframes modalEnter {
0% {
opacity: 0;
visibility: hidden;
}
1% {
opacity: 0;
visibility: visible;
-webkit-transform: translateY(-150px);
}
100% {
opacity: 1;
visibility: visible;
-webkit-transform: translateY(0);
}
}
@keyframes modalExit {
0% {
opacity: 1;
visibility: visible;
}
99% {
opacity: 0;
visibility: visible;
.transform(translateY(150px));
}
100% {
opacity: 0;
visibility: hidden;
}
}
@-webkit-keyframes modalExit {
0% {
opacity: 1;
visibility: visible;
}
99% {
opacity: 0;
visibility: visible;
-webkit-transform: translateY(150px);
}
100% {
opacity: 0;
visibility: hidden;
}
}
\ No newline at end of file
......@@ -15,33 +15,33 @@ article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
display: block;
display: block;
}
body {
line-height: 1;
line-height: 1;
}
ol, ul {
list-style: none;
list-style: none;
}
blockquote, q {
quotes: none;
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
border-collapse: collapse;
border-spacing: 0;
}
\ No newline at end of file
<template name='loginServices'>
{{#if hasLoginServices}}
<div class="external-login">
<div class="social-login">
<h3>{{_ "loginServices.login_with"}}</h3>
{{#each loginService}}
<button type="button" class="button external-login {{service}}"><span>{{displayName}}</span></button>
......
<template name="modal">
<section id="{{this.id}}" class="kncty-modal {{this.class}}" tabindex="-1" role="dialog" aria-hidden="true">
<section id="{{this.id}}" class="rocket-modal {{this.class}}" tabindex="-1" role="dialog" aria-hidden="true">
<div class="wrapper">
<div class="window">
<form id="{{this.id}}-form" class="-modal form-horizontal">
<form id="{{this.id}}-form" class="modal form-horizontal">
<header>
<h3>{{this.title}}</h3>
<span class="close"><i class="fa fa-close"></i></span>
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment