1+ <!doctype html>
2+ < html >
3+ < head >
4+ < meta name ="viewport " content ="width=device-width, initial-scale=1.0 ">
5+ < link rel ="stylesheet " type ="text/css " href ="{$ENV.DATAFACE_URL|escape}/plone.css?v={$ENV.APPLICATION_VERSION} "/>
6+ < link rel ="stylesheet " type ="text/css " href ="{$ENV.DATAFACE_URL|escape}/css/xataface/actions/mobile_filter_dialog.css?v={$ENV.APPLICATION_VERSION} "/>
7+ </ head >
8+ < body class ='mobile-sort-dialog '>
9+
10+ < h1 > Filter</ h1 >
11+ < ul class ='xf-filter-form '>
12+ {foreach from=$searchFields item=field}
13+ < li class ='xf-filter-field xf-filter-type-{$field.type|escape} '>
14+
15+
16+ {if $field.type == 'filter'}
17+ < a href ='javascript:void(0) ' onclick ='showOptions(this) '>
18+ < i class ='material-icons '> arrow_forward_ios</ i >
19+ < span class ='xf-filter-label '> {$field.label|escape}</ span >
20+ {if $field.value}< span class ='xf-filter-value '> : {$field.value|escape}</ span > {/if}
21+
22+ </ a >
23+ < div class ='xf-filter-options ' data-field ='{$field.fieldDef.name} '>
24+ < div class ='dialog-content '>
25+ < h1 > < span > {$field.label|escape}</ span > </ h1 >
26+ < ul class ='xf-filter-options-list '>
27+ {foreach from=$field.options item=option}
28+ < li >
29+
30+ < input
31+ onclick ='updateFilters(this); '
32+ data-key ='{$option.key|escape} '
33+ type ='checkbox '
34+ id ='{$field.name|escape}-option-{$option.key|escape} '
35+ {if $option.selected}checked{ /if}/>
36+ < label for ='{$field.name|escape}-option-{$option.key|escape} '>
37+ < span class ='xf-filter-option-value '> {$option.value|escape}</ span >
38+ {if $option.count}< span class ='xf-filter-option-count '> ({$option.count|escape})</ span > {/if}
39+ </ labeL >
40+ </ li >
41+ {/foreach}
42+ </ ul >
43+ </ div >
44+ </ div >
45+ {elseif $field.type == 'date-range'}
46+
47+ {elseif $field.type == 'contains'}
48+
49+ {elseif $field.type == 'checkbox'}
50+
51+ {elseif $field.type == 'range'}
52+
53+ {elseif $field.type == 'min'}
54+
55+ {elseif $field.type == 'max'}
56+
57+ {elseif $field.type == 'checkbox'}
58+
59+ {else}
60+
61+
62+ {/if}
63+
64+ </ li >
65+ {/foreach}
66+ </ ul >
67+
68+ < div class ='xf-buttons '>
69+ < button class ='xf-apply-btn ' onclick ='applyFilters() '> Show < span class ='num-results '> x</ span > Results</ button >
70+ </ div >
71+
72+ < script > { literal }
73+
74+ var win = window . parent ;
75+ var filterSearch = win . location . search ;
76+
77+ function showOptions ( targetEl ) {
78+ var $ = win . jQuery ;
79+ var options = $ ( '>.xf-filter-options' , $ ( targetEl ) . parent ( ) ) ;
80+
81+ $ ( options ) . addClass ( 'slidein' ) ;
82+ win . activeSheet . pushState ( {
83+ back : function ( ) {
84+ $ ( options ) . removeClass ( 'slidein' ) ;
85+ } ,
86+ el : options . get ( 0 )
87+ } ) ;
88+
89+ }
90+
91+ function applyFilters ( ) {
92+ if ( win . activeSheet ) {
93+ win . activeSheet . close ( ) ;
94+ }
95+ win . jQuery ( '<div class="spin fillscreen"></div>' ) . appendTo ( win . document . body ) ;
96+ win . location . search = filterSearch ;
97+ return false ;
98+ }
99+
100+ function updateFilters ( srcEl ) {
101+ var $ = win . jQuery ;
102+ var wrapper = $ ( srcEl ) . parents ( '[data-field]' ) . first ( ) ;
103+ var field = $ ( wrapper ) . attr ( 'data-field' ) ;
104+ var selectedKeys = [ ] ;
105+ var selectedString = '' ;
106+ $ ( 'input[data-key]' , wrapper ) . each ( function ( ) {
107+ if ( ! this . checked ) {
108+ return ;
109+ }
110+ selectedKeys . push ( this . getAttribute ( 'data-key' ) ) ;
111+ } ) ;
112+ if ( selectedKeys . length == 0 ) {
113+ if ( filterSearch . indexOf ( '&' + field + '=' ) >= 0 ) {
114+ var re = new RegExp ( '&' + field + '=[^&]*' ) ;
115+
116+ filterSearch = filterSearch . replace ( re , '' ) ;
117+ updateCounts ( ) ;
118+ return ;
119+ }
120+ }
121+ var selectedString = '=' + selectedKeys . join ( ' OR =' ) ;
122+ if ( filterSearch . indexOf ( '&' + field + '=' ) >= 0 ) {
123+ var re = new RegExp ( '&' + field + '=[^&]*' ) ;
124+
125+ filterSearch = filterSearch . replace ( re , '' ) ;
126+ }
127+ filterSearch += '&' + field + '=' + encodeURIComponent ( selectedString ) ;
128+ updateCounts ( ) ;
129+
130+ }
131+
132+ function updateCounts ( ) {
133+ var search = filterSearch ;
134+ var $ = win . jQuery ;
135+ if ( ! $ || ! $ . get ) return ;
136+
137+ if ( search . indexOf ( '-action=' ) >= 0 ) {
138+ search = search . replace ( / - a c t i o n = [ ^ & ] * / , '-action=ajax_count_results' ) ;
139+ } else {
140+ search += '&-action=ajax_count_results' ;
141+ }
142+ $ . get ( search , function ( res ) {
143+ console . log ( res ) ;
144+ if ( res && res . found ) {
145+ document . querySelector ( 'button.xf-apply-btn > .num-results' ) . innerHTML = '' + res . found ;
146+
147+ }
148+ } )
149+ }
150+ updateCounts ( ) ;
151+ { / l i t e r a l } </ script >
152+ </ body >
153+
0 commit comments