1 | {* <!-- DRAG & DROP --> *} |
---|
2 | {if $EASYCAPTCHA_CHALLENGE == 'drag'} |
---|
3 | {combine_script id='jquery.event.drag' load='footer' require='jquery' path=$EASYCAPTCHA_PATH|cat:'template/jquery.events/jquery.event.drag-2.2.js'} |
---|
4 | {combine_script id='jquery.event.drop' load='footer' require='jquery' path=$EASYCAPTCHA_PATH|cat:'template/jquery.events/jquery.event.drop-2.2.js'} |
---|
5 | |
---|
6 | {combine_script id='easycaptcha.drag' load='footer' require='jquery.event.drag,jquery.event.drop' path=$EASYCAPTCHA_PATH|cat:'template/drag.js'} |
---|
7 | |
---|
8 | {html_style} |
---|
9 | #easycaptcha, #easycaptcha_noscript {ldelim} |
---|
10 | display:inline-block; |
---|
11 | position:relative; |
---|
12 | padding:10px; |
---|
13 | border-radius:8px; |
---|
14 | background: {$EASYCAPTCHA_CONF.bg1}; |
---|
15 | background: -webkit-linear-gradient(top, {$EASYCAPTCHA_CONF.bg1} 0%, {$EASYCAPTCHA_CONF.bg2} 100%); |
---|
16 | background: -moz-linear-gradient(top, {$EASYCAPTCHA_CONF.bg1} 0%, {$EASYCAPTCHA_CONF.bg2} 100%); |
---|
17 | background: -ms-linear-gradient(top, {$EASYCAPTCHA_CONF.bg1} 0%, {$EASYCAPTCHA_CONF.bg2} 100%); |
---|
18 | background: -o-linear-gradient(top, {$EASYCAPTCHA_CONF.bg1} 0%, {$EASYCAPTCHA_CONF.bg2} 100%); |
---|
19 | background: linear-gradient(to bottom, {$EASYCAPTCHA_CONF.bg1} 0%, {$EASYCAPTCHA_CONF.bg2} 100%); |
---|
20 | color:{$EASYCAPTCHA_CONF.txt}; |
---|
21 | } |
---|
22 | #easycaptcha .drag_item {ldelim} |
---|
23 | position:absolute; |
---|
24 | top:15px; |
---|
25 | width:{$EASYCAPTCHA_CONF.size}px; |
---|
26 | height:{$EASYCAPTCHA_CONF.size}px; |
---|
27 | border-radius:5px; |
---|
28 | border:1px solid {$EASYCAPTCHA_CONF.bd1}; |
---|
29 | background:{$EASYCAPTCHA_CONF.obj}; |
---|
30 | z-index:10; |
---|
31 | cursor:move; |
---|
32 | } |
---|
33 | #easycaptcha .drag_item.active {ldelim} |
---|
34 | z-index:100; |
---|
35 | opacity:0.75; |
---|
36 | } |
---|
37 | #easycaptcha .drag_item img {ldelim} |
---|
38 | width:{$EASYCAPTCHA_CONF.size}px; |
---|
39 | height:{$EASYCAPTCHA_CONF.size}px; |
---|
40 | border-radius:5px; |
---|
41 | } |
---|
42 | #easycaptcha .drop_zone {ldelim} |
---|
43 | -moz-box-sizing:borderbox; |
---|
44 | box-sizing:borderbox; |
---|
45 | padding:5px; |
---|
46 | width:{$EASYCAPTCHA_CONF.size}px; |
---|
47 | height:{$EASYCAPTCHA_CONF.size}px; |
---|
48 | margin-left:{math equation='15+(x+5)*y' x=$EASYCAPTCHA_CONF.size y=$EASYCAPTCHA_CONF.nb}px; |
---|
49 | line-height:{$EASYCAPTCHA_CONF.size}px; |
---|
50 | background: {$EASYCAPTCHA_CONF.bg1}; |
---|
51 | background: -webkit-linear-gradient(bottom, {$EASYCAPTCHA_CONF.bg1} 0%, {$EASYCAPTCHA_CONF.bg2} 100%); |
---|
52 | background: -moz-linear-gradient(bottom, {$EASYCAPTCHA_CONF.bg1} 0%, {$EASYCAPTCHA_CONF.bg2} 100%); |
---|
53 | background: -ms-linear-gradient(bottom, {$EASYCAPTCHA_CONF.bg1} 0%, {$EASYCAPTCHA_CONF.bg2} 100%); |
---|
54 | background: -o-linear-gradient(bottom, {$EASYCAPTCHA_CONF.bg1} 0%, {$EASYCAPTCHA_CONF.bg2} 100%); |
---|
55 | background: linear-gradient(to top, {$EASYCAPTCHA_CONF.bg1} 0%, {$EASYCAPTCHA_CONF.bg2} 100%); |
---|
56 | border:1px dotted {$EASYCAPTCHA_CONF.bd2}; |
---|
57 | border-radius:5px; |
---|
58 | text-align:center; |
---|
59 | text-transform:uppercase; |
---|
60 | color:{$EASYCAPTCHA_CONF.txt}; |
---|
61 | } |
---|
62 | #easycaptcha .drop_zone.active {ldelim} |
---|
63 | background:{$EASYCAPTCHA_CONF.sel}; |
---|
64 | } |
---|
65 | #easycaptcha .drop_zone.valid {ldelim} |
---|
66 | background:{$EASYCAPTCHA_CONF.sel}; |
---|
67 | box-shadow:0 0 0 2px {$EASYCAPTCHA_CONF.sel}; |
---|
68 | } |
---|
69 | {/html_style} |
---|
70 | |
---|
71 | {capture name=easycaptcha} |
---|
72 | <noscript id="easycaptcha_noscript"> |
---|
73 | {'You must activate JavaScript in your browser in order to be able to add a comment, sorry for the inconvenience.'|translate} |
---|
74 | </noscript> |
---|
75 | |
---|
76 | <div id="easycaptcha" style="display:none;"> |
---|
77 | {counter start=0 assign=i} |
---|
78 | {foreach from=$EASYCAPTCHA_CONF.selection item=image} |
---|
79 | <div class="drag_item" style="left:{math equation='10+(x+5)*y' x=$EASYCAPTCHA_CONF.size y=$i}px;" data-id="{$image}"> |
---|
80 | <img src="{$ROOT_URL}{$EASYCAPTCHA_PATH}drag/get.php?{$EASYCAPTCHA_CONF.theme}&{$image}"> |
---|
81 | </div> |
---|
82 | {counter} |
---|
83 | {/foreach} |
---|
84 | <div class="drop_zone">{'Drop'|translate}</div> |
---|
85 | </div> |
---|
86 | |
---|
87 | {* <!-- fields are not type "hidden" for LiveValidation in GuestBook and ContactForm --> *} |
---|
88 | <input type="text" name="easycaptcha" value="" style="display:none;"> |
---|
89 | <input type="text" name="easycaptcha_key" value="{$EASYCAPTCHA_CONF.key}" style="display:none;"> |
---|
90 | {/capture} |
---|
91 | |
---|
92 | |
---|
93 | {* <!-- TIC TAC TOE --> *} |
---|
94 | {else if $EASYCAPTCHA_CHALLENGE == 'tictac'} |
---|
95 | {html_style} |
---|
96 | #easycaptcha table {ldelim} |
---|
97 | width:{$EASYCAPTCHA_CONF.size}px; |
---|
98 | height:{$EASYCAPTCHA_CONF.size}px; |
---|
99 | border-collapse:collapse; |
---|
100 | display:inline-block; |
---|
101 | margin:0; |
---|
102 | background:url('{$ROOT_URL}{$EASYCAPTCHA_PATH}tictac/gen.php?t={$smarty.now}') no-repeat; |
---|
103 | } |
---|
104 | #easycaptcha td {ldelim} |
---|
105 | border:none; |
---|
106 | padding:0; |
---|
107 | } |
---|
108 | #easycaptcha label {ldelim} |
---|
109 | display:block; |
---|
110 | width:{math equation="floor(x/3)" x=$EASYCAPTCHA_CONF.size}px; |
---|
111 | height:{math equation="floor(x/3)" x=$EASYCAPTCHA_CONF.size}px; |
---|
112 | cursor:url('{$ROOT_URL}{$EASYCAPTCHA_PATH}tictac/gen.php?cross=96') 16 16, pointer; |
---|
113 | } |
---|
114 | #easycaptcha input {ldelim} |
---|
115 | display:none; |
---|
116 | } |
---|
117 | #easycaptcha label.selected {ldelim} |
---|
118 | background:url('{$ROOT_URL}{$EASYCAPTCHA_PATH}tictac/gen.php?cross={$EASYCAPTCHA_CONF.size}') no-repeat; |
---|
119 | } |
---|
120 | {/html_style} |
---|
121 | |
---|
122 | {footer_script require='jquery'}{literal} |
---|
123 | (function($){ |
---|
124 | $('#easycaptcha input').on('change', function() { |
---|
125 | $('#easycaptcha label').removeClass('selected'); |
---|
126 | $(this).parent('label').addClass('selected'); |
---|
127 | }); |
---|
128 | }(jQuery)); |
---|
129 | {/literal}{/footer_script} |
---|
130 | |
---|
131 | {capture name=easycaptcha} |
---|
132 | <div id="easycaptcha"> |
---|
133 | <table> |
---|
134 | <tr> |
---|
135 | <td><label><input type="radio" name="easycaptcha" value="00"></label></td> |
---|
136 | <td><label><input type="radio" name="easycaptcha" value="10"></label></td> |
---|
137 | <td><label><input type="radio" name="easycaptcha" value="20"></label></td> |
---|
138 | </tr> |
---|
139 | <tr> |
---|
140 | <td><label><input type="radio" name="easycaptcha" value="01"></label></td> |
---|
141 | <td><label><input type="radio" name="easycaptcha" value="11"></label></td> |
---|
142 | <td><label><input type="radio" name="easycaptcha" value="21"></label></td> |
---|
143 | </tr> |
---|
144 | <tr> |
---|
145 | <td><label><input type="radio" name="easycaptcha" value="02"></label></td> |
---|
146 | <td><label><input type="radio" name="easycaptcha" value="12"></label></td> |
---|
147 | <td><label><input type="radio" name="easycaptcha" value="22"></label></td> |
---|
148 | </tr> |
---|
149 | </table> |
---|
150 | </div> |
---|
151 | |
---|
152 | <input type="text" name="easycaptcha_key" value="{$EASYCAPTCHA_CONF.key}" style="display:none;"> |
---|
153 | {/capture} |
---|
154 | |
---|
155 | {/if} |
---|