page_stack 1.0.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (47) hide show
  1. checksums.yaml +7 -0
  2. data/MIT-LICENSE +20 -0
  3. data/README.md +123 -0
  4. data/Rakefile +34 -0
  5. data/app/assets/javascripts/pagestack.js +299 -0
  6. data/app/assets/stylesheets/pagestack.css +193 -0
  7. data/lib/page_stack/engine.rb +4 -0
  8. data/lib/page_stack/version.rb +3 -0
  9. data/lib/page_stack.rb +10 -0
  10. data/lib/tasks/page_stack_tasks.rake +4 -0
  11. data/test/dummy/README.rdoc +28 -0
  12. data/test/dummy/Rakefile +6 -0
  13. data/test/dummy/app/assets/javascripts/application.js +13 -0
  14. data/test/dummy/app/assets/stylesheets/application.css +15 -0
  15. data/test/dummy/app/controllers/application_controller.rb +5 -0
  16. data/test/dummy/app/helpers/application_helper.rb +2 -0
  17. data/test/dummy/app/views/layouts/application.html.erb +14 -0
  18. data/test/dummy/bin/bundle +3 -0
  19. data/test/dummy/bin/rails +4 -0
  20. data/test/dummy/bin/rake +4 -0
  21. data/test/dummy/bin/setup +29 -0
  22. data/test/dummy/config/application.rb +26 -0
  23. data/test/dummy/config/boot.rb +5 -0
  24. data/test/dummy/config/database.yml +25 -0
  25. data/test/dummy/config/environment.rb +5 -0
  26. data/test/dummy/config/environments/development.rb +41 -0
  27. data/test/dummy/config/environments/production.rb +79 -0
  28. data/test/dummy/config/environments/test.rb +42 -0
  29. data/test/dummy/config/initializers/assets.rb +11 -0
  30. data/test/dummy/config/initializers/backtrace_silencers.rb +7 -0
  31. data/test/dummy/config/initializers/cookies_serializer.rb +3 -0
  32. data/test/dummy/config/initializers/filter_parameter_logging.rb +4 -0
  33. data/test/dummy/config/initializers/inflections.rb +16 -0
  34. data/test/dummy/config/initializers/mime_types.rb +4 -0
  35. data/test/dummy/config/initializers/session_store.rb +3 -0
  36. data/test/dummy/config/initializers/wrap_parameters.rb +14 -0
  37. data/test/dummy/config/locales/en.yml +23 -0
  38. data/test/dummy/config/routes.rb +56 -0
  39. data/test/dummy/config/secrets.yml +22 -0
  40. data/test/dummy/config.ru +4 -0
  41. data/test/dummy/public/404.html +67 -0
  42. data/test/dummy/public/422.html +67 -0
  43. data/test/dummy/public/500.html +66 -0
  44. data/test/dummy/public/favicon.ico +0 -0
  45. data/test/page_stack_test.rb +7 -0
  46. data/test/test_helper.rb +20 -0
  47. metadata +139 -0
checksums.yaml ADDED
@@ -0,0 +1,7 @@
1
+ ---
2
+ SHA1:
3
+ metadata.gz: b2563b563a818502061ad05de81ad4f3fe661636
4
+ data.tar.gz: 7b595a56316e36a0c32fb4b389822c62be297071
5
+ SHA512:
6
+ metadata.gz: 21b1b480cad5263826d019b4a49977b26d26275f2d4140ad14b1ff80a9127d6f9f91d51611c8711e251696a191fe400499b35c95f65919046eafac467e11bded
7
+ data.tar.gz: d33683a00e04b16e5ce83fc258941ef8f88590c04f9121e21ccd53e46f1e8245667c4904e832583f339082be349272b72aa1b42586f5c35f433e9d2bb49b1d28
data/MIT-LICENSE ADDED
@@ -0,0 +1,20 @@
1
+ Copyright 2016 Bruno Porto
2
+
3
+ Permission is hereby granted, free of charge, to any person obtaining
4
+ a copy of this software and associated documentation files (the
5
+ "Software"), to deal in the Software without restriction, including
6
+ without limitation the rights to use, copy, modify, merge, publish,
7
+ distribute, sublicense, and/or sell copies of the Software, and to
8
+ permit persons to whom the Software is furnished to do so, subject to
9
+ the following conditions:
10
+
11
+ The above copyright notice and this permission notice shall be
12
+ included in all copies or substantial portions of the Software.
13
+
14
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
15
+ EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
16
+ MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
17
+ NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
18
+ LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
19
+ OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
20
+ WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
data/README.md ADDED
@@ -0,0 +1,123 @@
1
+ PageStack
2
+ =======
3
+
4
+ [![Code Climate](https://codeclimate.com/github/brunoporto/page_stack/badges/gpa.svg)](https://codeclimate.com/github/brunoporto/page_stack)
5
+
6
+ Essa GEM fornece a possibilidade de navegação de paǵinas sobrepostas, facilitando assim a abertura de novas páginas em perder o conteúdo anterior.
7
+
8
+ # Requisitos
9
+
10
+ - Rails 4.2+
11
+ - jQuery 2+
12
+ - Remotipart (Envio de formulário por Ajax)
13
+
14
+ # Instalação
15
+
16
+ Adicione essa linha no Gemfile do projeto:
17
+ ```ruby
18
+ gem 'page_stack'
19
+ ```
20
+
21
+ Instale a gem utilizando o comando abaixo no diretório raiz da aplicação:
22
+ ```sh
23
+ $ bundle install
24
+ ```
25
+
26
+ Adicione no seu arquivo `application_controller.rb` a seguinte configuração:
27
+ ```ruby
28
+ class ApplicationController < ActionController::Base
29
+ include PageStack
30
+ layout :pagestack_layout
31
+ end
32
+ ```
33
+
34
+ Adicione a seguinte linha no seu arquivo `application.css`:
35
+ ```css
36
+ *= require pagestack
37
+ ```
38
+
39
+ Adicione a seguinte linha no seu arquivo `application.js`:
40
+ ```js
41
+ //= require pagestack
42
+ //= require jquery.remotipart
43
+ ```
44
+
45
+ Para inicializar o plugin você utilizará o código abaixo:
46
+ ```js
47
+ var pagestack = new PageStack().init();
48
+ ```
49
+
50
+ Seus eventos são baseados em [delegator](https://learn.jquery.com/events/event-delegation/) do jQuery e estão vinculados ao **document**.
51
+
52
+ # Configuração
53
+
54
+ Você possui três parâmetros de configuração para o pagestack:
55
+ - form : (padrão: 'form') Informe o elemento form que ele deverá o recurso "submit" via AJAX.
56
+ - loading : (padrão: true) Informa se o ícone de *carregando* será exibido para informar ao usuário o progresso de ações AJAX.
57
+ - closeOnEsc : (padrão: false) Permite fechar o pagestack ativo com a tecla ESC
58
+ - debug : (padrão: false) Exibe as mensagens de testes no console.log
59
+
60
+ ```js
61
+ var pagestack = new PageStack({
62
+ form: 'form',
63
+ loading: true,
64
+ closeOnEsc: false,
65
+ debug: false
66
+ }).init();
67
+ ```
68
+
69
+ # Utilização
70
+
71
+ Você pode abrir multiplas páginas sobrepostas apenas configurando os links em cada página.
72
+
73
+ Para indicar que um link abrirá uma pagestack adicione a classe `pagestack` ao seu elemento:
74
+ ```haml
75
+ = link_to "Abrir Página", root_path, class: 'pagestack'
76
+ ```
77
+
78
+ Para indicar o título da nova página utilize o atributo data `pagestack-title`:
79
+ ```haml
80
+ = link_to "Abrir Página", root_path, class: 'pagestack', data: {'pagestack-title' => 'Título da minha página sobreposta'}
81
+ ```
82
+
83
+ Caso você abra uma sub-página sobreposta e precise que ao fechar essa página você recarregue o conteúdo da página origem você precisa indicar o atributo data `pagestack-refresh-parent-onclose`:
84
+ ```haml
85
+ = link_to "Abrir Página", root_path, class: 'pagestack', data: {'pagestack-refresh-parent-onclose' => true}
86
+ ```
87
+
88
+ Caso você precise alterar o conteúdo da própria pagestack (self) ao invés de abrir uma nova você pode informar o atributo `data-pagestack-replace-content`:
89
+ ```haml
90
+ = link_to "Abrir Página", root_path, class: 'pagestack', data: {'pagestack-refresh-replace-content' => true}
91
+ ```
92
+
93
+ Para ativar/desativar o fechamento do pagestack ativo através da tecla ESC utilize o atributo `data-pagestack-close-esc`. O padrão é **false**:
94
+ ```haml
95
+ = link_to "Abrir Página", root_path, class: 'pagestack', data: {'pagestack-esc-close' => 'true'}
96
+ = link_to "Abrir Página", root_path, class: 'pagestack', data: {'pagestack-esc-close' => 'false'}
97
+ ```
98
+
99
+ ## Eventos Javascript
100
+
101
+ Ao iniciar o plugin você recebe o retorno e pode atribuir a uma variável (Ex: `var pagestack` no código de instalação):
102
+ ```js
103
+ var pagestack = PageStack().init();
104
+ var current_page = pagestack.getItem(elemento_dentro_do_pagestack);
105
+ pagestack.close(elemento_dentro_do_pagestack);
106
+ ```
107
+
108
+ - **init**: Método que inicia o pagestack e atriu os eventos
109
+ - **close(elemento)**: Fecha o pagestack de um elemento indicado (pode ser qualquer elemento dentro daquele pagestack, inclusive o próprio elemento pagestack).
110
+ - **getItem(elemento)**: Retorna o elemento "container" do pagestack a partir de um elemento interno indicado.
111
+
112
+ ## Comportamento
113
+
114
+ **Formulário**
115
+ - Receberá por padrão o atributo *data-pagestack-replace-content* para carregar o conteúdo de retorno na própria página do formulário.
116
+ - Receberá por padrão o atributo rails *data-remote* para processamento o "submit" por AJAX através do plugin *jquery.remotipart*.
117
+
118
+ **Links**
119
+ - Os links com method=delete *(Links de exclusão)* receberão por padrão o atributo rails *data-remote* para processamento via AJAX.
120
+
121
+ # Referências
122
+
123
+ - [Remotipart: Rails jQuery File Uploads](https://github.com/JangoSteve/remotipart)
data/Rakefile ADDED
@@ -0,0 +1,34 @@
1
+ begin
2
+ require 'bundler/setup'
3
+ rescue LoadError
4
+ puts 'You must `gem install bundler` and `bundle install` to run rake tasks'
5
+ end
6
+
7
+ require 'rdoc/task'
8
+
9
+ RDoc::Task.new(:rdoc) do |rdoc|
10
+ rdoc.rdoc_dir = 'rdoc'
11
+ rdoc.title = 'PageStack'
12
+ rdoc.options << '--line-numbers'
13
+ rdoc.rdoc_files.include('README.rdoc')
14
+ rdoc.rdoc_files.include('lib/**/*.rb')
15
+ end
16
+
17
+
18
+
19
+
20
+
21
+
22
+ Bundler::GemHelper.install_tasks
23
+
24
+ require 'rake/testtask'
25
+
26
+ Rake::TestTask.new(:test) do |t|
27
+ t.libs << 'lib'
28
+ t.libs << 'test'
29
+ t.pattern = 'test/**/*_test.rb'
30
+ t.verbose = false
31
+ end
32
+
33
+
34
+ task default: :test
@@ -0,0 +1,299 @@
1
+ (function(window, $){
2
+
3
+ var PageStack = function(options){
4
+ this.options = options;
5
+ this.config = null;
6
+ };
7
+
8
+ var _this;
9
+
10
+ PageStack.prototype = {
11
+ defaults: {
12
+ form: 'form',
13
+ debug: false,
14
+ loading: true,
15
+ closeOnEsc: false
16
+ },
17
+ init: function() {
18
+ this.config = $.extend({}, this.defaults, this.options);
19
+ _this = this;
20
+
21
+ $(document).on('click','.pagestack_close',function(e){
22
+ e.preventDefault();
23
+ _this.close($(this));
24
+ });
25
+
26
+ $(document).on('click','.pagestack',function(ev) {
27
+ ev.preventDefault();
28
+
29
+ var $elem = $(this);
30
+ var quadroTotal = count();
31
+
32
+ if (quadroTotal==0) {
33
+ var stack = $('<ul id="pagestack_container" class="pagestack_container"></ul>');
34
+ var wWidth = $(window).width();
35
+ var wHeight = $(window).height();
36
+ stack.css({'width': wWidth+'px', 'height': wHeight+'px'});
37
+ $('body').prepend(stack);
38
+ }
39
+
40
+ var index = quadroTotal + 1;
41
+ var item = $('<li id="pagestack-item-'+index+'" class="pagestack_item" data-pagestack-load-url="'+encodeURIComponent($elem.attr('href'))+'" data-pagestack-nivel="'+index+'" style="display: none;"></li>');
42
+ //COPY ALL DATA pagestack attributes
43
+ $.each($elem.prop("attributes"),function() {
44
+ if (this.name.match(/^data\-pagestack/)) {
45
+ item.attr(this.name, this.value);
46
+ }
47
+ });
48
+
49
+ //~~ CONTENT BLOCK
50
+ item.append('<div id="pagestack-content-'+index+'" class="pagestack_content"></div>');
51
+
52
+ //~~ TITLE
53
+ var title = $('<div id="pagestack-title-'+index+'" class="pagestack_title">'+item.attr('data-pagestack-title')+'</div>');
54
+ var btFechar = $('<a href="javascript:void(0);" class="pagestack_close"></a>');
55
+ var header = $('<div id="pagestack-header-'+index+'" class="pagestack_header"></div>').append(btFechar).append(title);
56
+ if (item.attr('data-pagestack-esc-close')==undefined && _this.config.closeOnEsc==true) {
57
+ item.attr('data-pagestack-esc-close','true');
58
+ }
59
+ item.prepend(header);
60
+
61
+ //~~ STYLE
62
+ item.css({
63
+ 'transform-origin': 'top center',
64
+ "-webkit-transform": "translateY(30px)",
65
+ "-ms-transform": "translateY(30px)",
66
+ "transform": "translateY(30px)"
67
+ });
68
+
69
+ //~~ RESIZE
70
+ resize(item);
71
+
72
+ //~~ REFRESH EVENT
73
+ item.on('refresh',function(ev) {
74
+ if (_this.config.debug) console.log('*** REFRESH EVENT CONTENT - ITEM '+item.attr('id'));
75
+ loadContent(item).done(function(container) {
76
+ if (_this.config.debug) console.log('=== LOADED CONTENT - ITEM '+container.attr('id'));
77
+ });
78
+ });
79
+
80
+ //~~ APPEND TO CONTAINER
81
+ item.appendTo('#pagestack_container').show("scale",{}, 500);
82
+
83
+ //~~ LOAD CONTENT
84
+ loadContent(item).done(function(pagestack_item) {
85
+ //SUCCESS
86
+ }).fail(function(response) {
87
+ if (_this.config.debug) console.log(response);
88
+ });
89
+
90
+ //~~ REORDER (ANIMATE) CONTAINER ITEMS
91
+ reorder();
92
+ });
93
+
94
+ $(document).on('click','[data-dismiss="pagestack"]',function(ev){
95
+ ev.preventDefault();
96
+ _this.close(this);
97
+ });
98
+
99
+ $(document).keyup(function(e) {
100
+ if (e.which === 27) { //escape key maps to keycode `27`
101
+ var $item = $('.pagestack_item[data-pagestack-nivel='+count()+']');
102
+ if ($item.attr('data-pagestack-esc-close')==='true') {
103
+ _this.close($item);
104
+ }
105
+ }
106
+ });
107
+
108
+ $( window ).resize(function() {
109
+ //RESIZE CONTAINER
110
+ var wWidth = $(window).width();
111
+ var wHeight = $(window).height();
112
+ $('#pagestack_container').css({'width': wWidth+'px', 'height': wHeight+'px'});
113
+ //RESIZE PAGESTACK
114
+ resize($('#pagestack_container .pagestack_item'));
115
+ });
116
+
117
+ return this;
118
+ },
119
+ close: function(elem) {
120
+ var $item = _this.getItem(elem);
121
+ var nivel = $item.attr('data-pagestack-nivel');
122
+ var onclose = $item.attr('data-pagestack-refresh-parent-onclose');
123
+ $item.hide("scale",{percent: 0},300,function() {
124
+ $item.remove();
125
+ if (_this.config.loading) {loading($item, false);}
126
+ reorder();
127
+ if (count()==0) {
128
+ $('#pagestack_container').remove();
129
+ }
130
+ //VERIFICA SE PRECISA RECARREGAR A PÁGINA
131
+ if (onclose == 'true') {
132
+ if (nivel==1) {
133
+ if (_this.config.loading) {loading('body', true, true);}
134
+ window.location.reload(true);
135
+ } else {
136
+ $('.pagestack_item[data-pagestack-nivel="'+(nivel-1)+'"]').trigger('refresh');
137
+ }
138
+ }
139
+ });
140
+ },
141
+ getItem: function(elemento) {
142
+ return $(elemento).hasClass('pagestack_item') ? $(elemento) : $(elemento).parents('.pagestack_item:first');
143
+ }
144
+ };
145
+
146
+ //PRIVATE
147
+ function resize(elements){
148
+ var wWidth = $(window).width()-40;
149
+ var wHeight = $(window).height()-40;
150
+ $.each(elements, function(i, element){
151
+ $(element).css({
152
+ 'margin-left': '20px',
153
+ 'width': wWidth+'px',
154
+ 'height': wHeight+'px'
155
+ });
156
+ });
157
+ }
158
+
159
+ function reorder() {
160
+ var totalItens = count();
161
+ for(var i=1; i <= totalItens; i++) {
162
+ var item = $('#pagestack-item-'+i);
163
+ var itemIndex = totalItens-i;
164
+ var newY = 30-(itemIndex*10);
165
+ var newScale = 1-(itemIndex*10/100);
166
+ var newOpacity = 1-(itemIndex*20/100);
167
+ item.css({
168
+ 'transform-origin': 'top center',
169
+ "-webkit-transform": "translateY("+newY+"px) scale("+newScale+")",
170
+ "-ms-transform": "translateY("+newY+"px) scale("+newScale+")",
171
+ "transform": "translateY("+newY+"px) scale("+newScale+")",
172
+ "opacity": newOpacity
173
+ });
174
+ }
175
+ }
176
+
177
+ function count() {
178
+ return $('ul.pagestack_container li.pagestack_item').length;
179
+ }
180
+
181
+ function loadContent(item, _html) {
182
+ var dfd = jQuery.Deferred();
183
+
184
+ var content = item.find('.pagestack_content:first');
185
+ if (_this.config.loading) {loading(item);}
186
+ if (_html!==undefined) {
187
+ content.html(_html);
188
+ htmlCallbacks(content);
189
+ if (_this.config.loading){loading(item, false);}
190
+ dfd.resolve(item);
191
+ } else {
192
+ var loadLink = updateQueryStringParameter(decodeURIComponent(item.attr('data-pagestack-load-url')), 'pagestack', true);
193
+ content.load(loadLink, function(response, status, xhr){
194
+ if (status == "error") {
195
+ content.html(response);
196
+ dfd.reject(response);
197
+ }
198
+ htmlCallbacks(content);
199
+ if (_this.config.loading){loading(item, false);}
200
+ dfd.resolve(item);
201
+ });
202
+ }
203
+ return dfd.promise();
204
+ }
205
+ //
206
+ function htmlCallbacks(content) {
207
+ //FORMS
208
+ content.find(_this.config.form).each(function(i,form) {
209
+ var $form = $(form);
210
+ var container = _this.getItem(form);
211
+ if ($form.find('.pagestack_container_id').length==0) {
212
+ $form.attr('data-remote', true);
213
+ $form.attr('data-pagestack-replace-content', true);
214
+ $form.append('<input type="hidden" name="pagestack_container_id" value="'+container.attr('id')+'" />');
215
+ $form.attr('action', updateQueryStringParameter($form.attr('action'),'pagestack',true));
216
+ ajaxCallbacks($form);
217
+ }
218
+ });
219
+ //LINKS DELETE
220
+ content.find('[data-method="delete"]').each(function(i,element){
221
+ var $element = $(element);
222
+ if ($element.attr('href').indexOf('pagestack') < 0) {
223
+ $element.attr('data-remote', true);
224
+ $element.attr('href', updateQueryStringParameter($element.attr('href'),'pagestack',true));
225
+ ajaxCallbacks($element);
226
+ }
227
+ });
228
+ }
229
+ //
230
+ function ajaxCallbacks(element) {
231
+ element.bind("ajax:beforeSend", function(xhr, settings){
232
+ if (_this.config.loading) {loading(element)}
233
+ if (_this.config.debug) console.log('ajax:beforeSend', xhr, settings);
234
+ });
235
+ element.bind("ajax:error", function(xhr, status, error) {
236
+ if (_this.config.loading) {loading(element, false);}
237
+ // console.log('ajax:error', xhr, status, error);
238
+ });
239
+ element.bind("ajax:success", function(e, data, status, xhr) {
240
+ if (_this.config.debug) console.log('ajax:success', e, data, status, xhr);
241
+ var item = _this.getItem(element);
242
+ if (_this.config.loading) {loading(item, false);}
243
+ if (data !=='' && element.attr('data-pagestack-replace-content') == 'true') {
244
+ loadContent(item, data);
245
+ } else {
246
+ item.trigger('refresh');
247
+ }
248
+ });
249
+ element.bind("ajax:remotipartComplete", function(e, data){
250
+ if (_this.config.debug) {
251
+ console.log('carregando...');
252
+ console.log(e, data);
253
+ }
254
+ if (_this.config.loading) {loading(element, false);}
255
+ });
256
+ element.bind("ajax:complete", function(data, status, xhr) {
257
+ if (_this.config.debug) console.log('ajax:complete',xhr, status);
258
+ if ( !element.data('remotipartSubmitted') ) {
259
+ if (_this.config.loading) {loading(element, false)}
260
+ }
261
+ });
262
+ }
263
+ //
264
+ function updateQueryStringParameter(uri, key, value) {
265
+ var re = new RegExp("([?&])" + key + "=.*?(&|$)", "i");
266
+ var separator = uri.indexOf('?') !== -1 ? "&" : "?";
267
+ if (uri.match(re)) {
268
+ return uri.replace(re, '$1' + key + "=" + value + '$2');
269
+ }
270
+ else {
271
+ return uri + separator + key + "=" + value;
272
+ }
273
+ }
274
+ //
275
+ function loading(container, start_stop, fullscreen) {
276
+ var $container = $(container);
277
+ if (start_stop==undefined) start_stop=true;
278
+ if (fullscreen==undefined) fullscreen=false;
279
+ var $loading_icon = $container.find('.pagestack_loading_icon');
280
+ if ($loading_icon.length > 0) {
281
+ if (start_stop!==true) {
282
+ $loading_icon.remove();
283
+ $container.find('.pagestack_loading_overlay').remove();
284
+ }
285
+ } else {
286
+ $container.prepend('<div class="pagestack_loading_icon">Aguarde Carregando...&#8230;</div>');
287
+ if (fullscreen===true) {
288
+ $container.prepend('<div class="pagestack_loading_overlay"></div>');
289
+ $container.find('.pagestack_loading_icon').css({
290
+ top: ($container.height()/2)+'px'
291
+ });
292
+ }
293
+ }
294
+ }
295
+
296
+ PageStack.defaults = PageStack.prototype.defaults;
297
+
298
+ window.PageStack = PageStack;
299
+ })(window, jQuery);
@@ -0,0 +1,193 @@
1
+ /* COMPONENT */
2
+ #pagestack_container {
3
+ z-index: 99999;
4
+ position: fixed;
5
+ top: 0;
6
+ left: 0;
7
+ right: 0;
8
+ bottom: 0;
9
+ padding: 0;
10
+ background-color: rgba(0,0,0,0.2);
11
+ }
12
+
13
+ #pagestack_container .pagestack_item {
14
+ background: #fff;
15
+ height: 100%;
16
+ width: 100%;
17
+ border-radius: 4px;
18
+ overflow: hidden;
19
+ position: absolute;
20
+ /*opacity: 0;*/
21
+ display: -webkit-flex;
22
+ display: flex;
23
+ -webkit-flex-direction: column;
24
+ flex-direction: column;
25
+ /*-webkit-touch-callout: none;
26
+ -webkit-user-select: none;
27
+ -khtml-user-select: none;
28
+ -moz-user-select: none;
29
+ -ms-user-select: none;
30
+ user-select: none;*/
31
+ pointer-events: auto;
32
+
33
+ transition: transform 0.5s ease-in-out;
34
+ -webkit-transition: -webkit-transform 0.5s ease-in-out;
35
+ }
36
+
37
+ .pagestack_item .pagestack_header {
38
+ padding: 10px 15px;
39
+ border-bottom: 1px solid transparent;
40
+ border-top-right-radius: 3px;
41
+ border-top-left-radius: 3px;
42
+ color: #333333;
43
+ background-color: #f5f5f5;
44
+ border-color: #ddd;
45
+ }
46
+ .pagestack_item .pagestack_header .pagestack_close:before {
47
+ content: "\00d7";
48
+ color: #333;
49
+ font-weight: 300;
50
+ font-family: Arial, sans-serif;
51
+ }
52
+
53
+ .pagestack_item .pagestack_header .pagestack_close {
54
+ text-align: center;
55
+ width: 28px;
56
+ height: 28px;
57
+ border-radius: 4px;
58
+ text-decoration: none;
59
+ font-size: 20px;
60
+ float: right !important;
61
+ background-color: #ddd;
62
+ }
63
+ .pagestack_item .pagestack_header .pagestack_close:hover {
64
+ background-color: #bbb;
65
+ }
66
+
67
+ .pagestack_item .pagestack_header .pagestack_title {
68
+ margin-top: 0;
69
+ margin-bottom: 0;
70
+ font-size: 16px;
71
+ color: inherit;
72
+ float: left !important;
73
+ }
74
+
75
+ .pagestack_item .pagestack_content {
76
+ margin: 10px;
77
+ overflow: auto;
78
+ }
79
+
80
+ /* LOADING */
81
+
82
+ /* Overlay */
83
+ .pagestack_loading_overlay {
84
+ z-index: 99999;
85
+ position: fixed;
86
+ top: 0;
87
+ left: 0;
88
+ right: 0;
89
+ bottom: 0;
90
+ padding: 0;
91
+ background-color: rgba(0,0,0,0.2);
92
+ }
93
+
94
+ /* spinner */
95
+ .pagestack_loading_icon {
96
+ z-index: 10;
97
+ position: relative;
98
+ margin-left: 50%;
99
+ top: 50%;
100
+ }
101
+
102
+ /* :not(:required) fix para não carregar em IE9 e anteriores */
103
+ .pagestack_loading_icon:not(:required) {
104
+ /* ocultando texto */
105
+ font: 0/0 a;
106
+ color: transparent;
107
+ text-shadow: none;
108
+ background-color: transparent;
109
+ border: 0;
110
+ }
111
+
112
+ .pagestack_loading_icon:not(:required):after {
113
+ content: '';
114
+ display: block;
115
+ font-size: 10px;
116
+ width: 1em;
117
+ height: 1em;
118
+ margin-top: -0.5em;
119
+ -webkit-animation: pagestack_loading_spinner 1500ms infinite linear;
120
+ -moz-animation: pagestack_loading_spinner 1500ms infinite linear;
121
+ -ms-animation: pagestack_loading_spinner 1500ms infinite linear;
122
+ -o-animation: pagestack_loading_spinner 1500ms infinite linear;
123
+ animation: pagestack_loading_spinner 1500ms infinite linear;
124
+ border-radius: 0.5em;
125
+ -webkit-box-shadow: rgba(0, 0, 0, 0.75) 1.5em 0 0 0, rgba(0, 0, 0, 0.75) 1.1em 1.1em 0 0, rgba(0, 0, 0, 0.75) 0 1.5em 0 0, rgba(0, 0, 0, 0.75) -1.1em 1.1em 0 0, rgba(0, 0, 0, 0.5) -1.5em 0 0 0, rgba(0, 0, 0, 0.5) -1.1em -1.1em 0 0, rgba(0, 0, 0, 0.75) 0 -1.5em 0 0, rgba(0, 0, 0, 0.75) 1.1em -1.1em 0 0;
126
+ box-shadow: rgba(0, 0, 0, 0.75) 1.5em 0 0 0, rgba(0, 0, 0, 0.75) 1.1em 1.1em 0 0, rgba(0, 0, 0, 0.75) 0 1.5em 0 0, rgba(0, 0, 0, 0.75) -1.1em 1.1em 0 0, rgba(0, 0, 0, 0.75) -1.5em 0 0 0, rgba(0, 0, 0, 0.75) -1.1em -1.1em 0 0, rgba(0, 0, 0, 0.75) 0 -1.5em 0 0, rgba(0, 0, 0, 0.75) 1.1em -1.1em 0 0;
127
+ }
128
+
129
+ /* Loading Animation */
130
+ @-webkit-keyframes pagestack_loading_spinner {
131
+ 0% {
132
+ -webkit-transform: rotate(0deg);
133
+ -moz-transform: rotate(0deg);
134
+ -ms-transform: rotate(0deg);
135
+ -o-transform: rotate(0deg);
136
+ transform: rotate(0deg);
137
+ }
138
+ 100% {
139
+ -webkit-transform: rotate(360deg);
140
+ -moz-transform: rotate(360deg);
141
+ -ms-transform: rotate(360deg);
142
+ -o-transform: rotate(360deg);
143
+ transform: rotate(360deg);
144
+ }
145
+ }
146
+ @-moz-keyframes pagestack_loading_spinner {
147
+ 0% {
148
+ -webkit-transform: rotate(0deg);
149
+ -moz-transform: rotate(0deg);
150
+ -ms-transform: rotate(0deg);
151
+ -o-transform: rotate(0deg);
152
+ transform: rotate(0deg);
153
+ }
154
+ 100% {
155
+ -webkit-transform: rotate(360deg);
156
+ -moz-transform: rotate(360deg);
157
+ -ms-transform: rotate(360deg);
158
+ -o-transform: rotate(360deg);
159
+ transform: rotate(360deg);
160
+ }
161
+ }
162
+ @-o-keyframes pagestack_loading_spinner {
163
+ 0% {
164
+ -webkit-transform: rotate(0deg);
165
+ -moz-transform: rotate(0deg);
166
+ -ms-transform: rotate(0deg);
167
+ -o-transform: rotate(0deg);
168
+ transform: rotate(0deg);
169
+ }
170
+ 100% {
171
+ -webkit-transform: rotate(360deg);
172
+ -moz-transform: rotate(360deg);
173
+ -ms-transform: rotate(360deg);
174
+ -o-transform: rotate(360deg);
175
+ transform: rotate(360deg);
176
+ }
177
+ }
178
+ @keyframes pagestack_loading_spinner {
179
+ 0% {
180
+ -webkit-transform: rotate(0deg);
181
+ -moz-transform: rotate(0deg);
182
+ -ms-transform: rotate(0deg);
183
+ -o-transform: rotate(0deg);
184
+ transform: rotate(0deg);
185
+ }
186
+ 100% {
187
+ -webkit-transform: rotate(360deg);
188
+ -moz-transform: rotate(360deg);
189
+ -ms-transform: rotate(360deg);
190
+ -o-transform: rotate(360deg);
191
+ transform: rotate(360deg);
192
+ }
193
+ }
@@ -0,0 +1,4 @@
1
+ module PageStack
2
+ class Engine < ::Rails::Engine
3
+ end
4
+ end
@@ -0,0 +1,3 @@
1
+ module PageStack
2
+ VERSION = "1.0.4"
3
+ end