Ignore:
Timestamp:
01/06/13 21:05:36 (7 years ago)
Author:
julien1311
Message:

[piwecard] Use of colorbox (better integration with theme). Add of some JS testing. Replace table by div/span

File:
1 edited

Legend:

Unmodified
Added
Removed
  • extensions/Piwecard/template/ecard.tpl

    r19732 r19923  
    1 <div id="filter"></div> 
    2 <div id="box"> 
    3 <span id="boxtitle"></span> 
    4 <div class="ecard"> 
    5 <table align="center" cellpadding="0" cellspacing="0"> 
    6 <tr> 
    7 <td></td> 
    8 </tr> 
    9 <tr> 
    10 <td><form name="form1" method="post" class="ecard"> 
    11         <table> 
    12                 <tr><td colspan="3"><br></td></tr> 
    13                 <tr><td colspan="3"><br></td></tr> 
    14                 <tr> 
    15                         <td colspan="3" align="left"><strong><em>{'ecard_send_stage1'|@translate}</em></strong></td> 
    16                 </tr> 
    17                 <tr> 
    18                         <td colspan="2"> {'ecard_send_title'|@translate}</td> 
    19                         <td><input name="sujet" type="text" id="sujet" value="{$ecard.sujet}"></td> 
    20                 <tr><td colspan="3"><br></td></tr> 
    21                 <tr> 
    22                         <td> {'ecard_send_message'|@translate}</td> 
    23                         <td colspan="2">  <textarea name="message" cols="50" rows="4" id="message">{$ecard.message}</textarea> </td> 
    24                 <tr> 
    25                 <tr><td colspan="3"><br></td></tr> 
    26                 <tr> 
    27                         <td colspan="3" align="left"><strong><em>{'ecard_send_stage2'|@translate}</em></strong></td> 
    28                 </tr> 
    29         <tr>  
    30                 <td><div align="center"> {'ecard_send_exp'|@translate} :</div></td> 
    31                 <td><div align="center">  
    32                         <input name="votrenom" type="text" id="votrenom" value="{$ecard.votrenom}" size="25" maxlength="100" > 
    33                   </div></td> 
    34                 <td><div align="center">  
    35                         <input name="votremail" type="text" id="votremail" value="{$ecard.votremail}" size="35" maxlength="100" {$ecard.changemail}> 
    36                   </div></td> 
    37           </tr> 
     1{include file='include/colorbox.inc.tpl'} 
    382 
    39           <tr>  
    40                 <td><div align="center"> {'ecard_send_dest'|@translate} :</div></td> 
    41                 <td><div align="center">  
    42                         <input name="sonnom" type="text" id="sonnom" value="{$ecard.sonnom}" size="25" maxlength="100"> 
    43                   </div></td> 
    44                 <td><div align="center">  
    45                         <input name="sonmail" type="text" id="sonmail" value="{$ecard.sonmail}" size="35" maxlength="100"> 
    46                   </div></td> 
    47           </tr> 
    48                 <tr><td colspan="3"><br></td></tr> 
    49                 <tr> 
    50                         <td colspan="3" align="left"><strong><em>{'ecard_send_stage3'|@translate}</em></strong></td> 
    51                 </tr> 
    52           <tr>  
    53                 <td colspan="3" align="left"><input type="checkbox" name="copy" {$ecard.copy}/> {'ecard_send_copy'|@translate} </td> 
    54           </tr> 
    55           <tr> 
    56                 <td colspan="3" align="left"> 
    57                   {'ecard_send_method'|@translate} :  
    58                          {foreach from=$ECARD_SEND item=ECARD_SEND} 
    59                           <input type="radio" name="ecard_send" value="{$ECARD_SEND.ID}" {$ECARD_SEND.SELECTED}>{$ECARD_SEND.NAME}  
    60                          {/foreach}              
    61                 </td> 
    62           </tr> 
    63           {if isset($ECARD_ACTIV)} 
    64                 <tr> 
    65                         <td colspan="3" align="left"> {'ecard_activ_choice'|@translate} : 
    66                          {foreach from=$ECARD_ACTIV item=ECARD_ACTIV} 
    67                           <input type="radio" name="ecard_activ" value="{$ECARD_ACTIV.ID}" {$ECARD_ACTIV.SELECTED}>{$ECARD_ACTIV.NAME}  
    68                          {/foreach} 
    69                         </td> 
    70                 </tr> 
    71           {/if} 
    72         </table> 
    73         <p align="left"><strong><em>{'ecard_send_stage4'|@translate}</em></strong></p> 
    74         <p align="center"> 
    75           <input type="submit" name="ecard_submit" value="{'ecard_send'|@translate}" /> 
    76           <input type="button" name="cancel" value="{'ecard_cancel'|@translate}" onclick="closebox()"> 
    77         </p> 
    78   </form></td> 
    79 </tr> 
    80 <tr> 
    81 <td>&nbsp;</td> 
    82 </tr> 
    83 </table> 
     3{footer_script}{literal} 
     4jQuery(document).ready(function(){ 
     5        jQuery(".createECardOpen").colorbox({ 
     6                inline:true, 
     7                href:"#addECardForm", 
     8                width:"50%", 
     9                minWidth:"500px", 
     10                height:"90%", 
     11                onComplete:function(){ 
     12                        jQuery("input[name=ecard_subject]").focus(); 
     13                } 
     14        }); 
    8415 
     16        jQuery("#addECardForm form").submit(function(){ 
     17                //jQuery(".createECardOpen").colorbox.close(); 
     18        }); 
     19}); 
     20 
     21function ecard_clearDefaultText(element, defaultText) { 
     22        if (element.value == defaultText) { 
     23                element.value = ''; 
     24        } 
     25} 
     26 
     27function ecard_checkField(element, elementType) { 
     28        var TEXT = 0; 
     29        var EMAIL = 1; 
     30         
     31        switch (elementType) { 
     32                case TEXT: 
     33                        if (element.value == '') { 
     34                                document.getElementById(element.id+'_error').innerHTML = "{'ecard_error'|@translate} {'ecard_error_text'|@translate}"; 
     35                                element.className += " ecard_error_input"; 
     36                                return false; 
     37                        } else { 
     38                                document.getElementById(element.id+'_error').innerHTML = ''; 
     39                                element.className = element.className.replace( /(?:^|\s)ecard_error_input(?!\S)/g , ''); 
     40                                return true; 
     41                        } 
     42                        break; 
     43                case EMAIL: 
     44                        var filter = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/; 
     45                        if (!filter.test(element.value)) { 
     46                                document.getElementById(element.id+'_error').innerHTML = "{'ecard_error'|@translate} {'ecard_error_email'|@translate}"; 
     47                                element.className += " ecard_error_input"; 
     48                                return false; 
     49                        } else { 
     50                                document.getElementById(element.id+'_error').innerHTML = ''; 
     51                                element.className = element.className.replace( /(?:^|\s)ecard_error_input(?!\S)/g , ''); 
     52                                return true; 
     53                        } 
     54                        break; 
     55                default: 
     56                        return false; 
     57                        break; 
     58        } 
     59} 
     60 
     61function ecard_checkForm(form) { 
     62        var subjectOK = ecard_checkField(form.ecard_subject, 0); 
     63        var messageOK = ecard_checkField(form.ecard_message, 0); 
     64        var senderNameOK = ecard_checkField(form.ecard_sender_name, 0); 
     65        var senderEMailOK = ecard_checkField(form.ecard_sender_email, 1); 
     66        var recipientNameOK = ecard_checkField(form.ecard_recipient_name, 0); 
     67        var recipientEMailOK = ecard_checkField(form.ecard_recipient_email, 1); 
     68         
     69        if(subjectOK && messageOK && senderNameOK && senderEMailOK && recipientNameOK && recipientEMailOK) 
     70                return true; 
     71        else 
     72                return false; 
     73} 
     74{/literal}{/footer_script} 
     75 
     76<div style="display:none"> 
     77        <div id="addECardForm"> 
     78                <form method="post" onsubmit="return ecard_checkForm(this);"> 
     79                        <fieldset> 
     80                                <legend>{'ecard_send_stage1'|@translate}</legend> 
     81                                <div class="ecard_field"> 
     82                                        <div class="ecard_error" id="ecard_subject_error"></div> 
     83                                        <div class="ecard_error" id="ecard_message_error"></div> 
     84                                        <span class="ecard_label">{'ecard_send_title'|@translate}<span class="ecard_mandatory_fields">*</span> :</span> 
     85                                        <span class="ecard_input_right"><input name="ecard_subject" type="text" id="ecard_subject" value="{$ecard.subject}" onfocus="ecard_clearDefaultText(this, '{$ecard.subject}');" title="{$ecard.subject}"></span> 
     86                                </div> 
     87                                <div class="ecard_field"> 
     88                                        <span class="ecard_label">{'ecard_send_message'|@translate}<span class="ecard_mandatory_fields">*</span> :</span> 
     89                                        <span class="ecard_input_right"><textarea name="ecard_message" id="ecard_message" value="{$ecard.message}" onfocus="ecard_clearDefaultText(this, '{$ecard.message}');" title="{$ecard.message}">{$ecard.message}</textarea></span> 
     90                                </div> 
     91                        </fieldset> 
     92                        <fieldset> 
     93                                <legend>{'ecard_send_stage2'|@translate}</legend> 
     94                                <div class="ecard_field"> 
     95                                        <div class="ecard_error" id="ecard_sender_name_error"></div> 
     96                                        <div class="ecard_error" id="ecard_sender_email_error"></div> 
     97                                        <span class="ecard_label">{'ecard_send_exp'|@translate}<span class="ecard_mandatory_fields">*</span> :</span> 
     98                                        <span class="ecard_name"><input name="ecard_sender_name" type="text" id="ecard_sender_name" maxlength="100" value="{$ecard.sender_name}"></span> 
     99                                        <span class="ecard_email"><input name="ecard_sender_email" type="text" id="ecard_sender_email" maxlength="100" {$ecard.changemail}  value="{$ecard.sender_email}" onfocus="ecard_clearDefaultText(this, '{$ecard.sender_email}');" onblur="ecard_checkField(this, 1);"></span> 
     100                                </div> 
     101                                <div class="ecard_field"> 
     102                                        <div class="ecard_error" id="ecard_recipient_name_error"></div> 
     103                                        <div class="ecard_error" id="ecard_recipient_email_error"></div> 
     104                                        <span class="ecard_label">{'ecard_send_dest'|@translate}<span class="ecard_mandatory_fields">*</span> :</span> 
     105                                        <span class="ecard_name"><input name="ecard_recipient_name" type="text" id="ecard_recipient_name" maxlength="100" value="{$ecard.recipient_name}" onfocus="ecard_clearDefaultText(this, '{$ecard.recipient_name}');"></span> 
     106                                        <span class="ecard_email"><input name="ecard_recipient_email" type="text" id="ecard_recipient_email" maxlength="100" value="{$ecard.recipient_email}" onfocus="ecard_clearDefaultText(this, '{$ecard.recipient_email}');" onblur="ecard_checkField(this, 1);"></span> 
     107                                </div> 
     108                        </fieldset> 
     109                        <fieldset> 
     110                                <legend>{'ecard_send_stage3'|@translate}</legend> 
     111                                <div class="ecard_field"> 
     112                                        <span class="ecard_label"><label for="ecard_copy">{'ecard_send_copy'|@translate} :</label></span> 
     113                                        <span><input type="checkbox" id="ecard_copy" name="ecard_copy" {$ecard.copy}/></span> 
     114                                </div> 
     115                                <div class="ecard_field"> 
     116                                        <span class="ecard_label">{'ecard_send_method'|@translate} : </span> 
     117                                                <span> 
     118                                                {foreach from=$ecard_send_method item=ecard_send_method} 
     119                                                        <input type="radio" name="ecard_send_method" id="ecard_send_method_{$ecard_send_method.id}" value="{$ecard_send_method.id}" {$ecard_send_method.selected}><label for="ecard_send_method_{$ecard_send_method.id}">{$ecard_send_method.name} </label> 
     120                                                {/foreach} 
     121                                        </span> 
     122                                </div> 
     123                                {if isset($ecard_validity)} 
     124                                        <div class="ecard_field"> 
     125                                                <span class="ecard_label">{'ecard_validity_label'|@translate} :</span> 
     126                                                <span> 
     127                                                        {foreach from=$ecard_validity item=ecard_validity} 
     128                                                                <input type="radio" name="ecard_validity" id="ecard_validity_{$ecard_validity.id}" value="{$ecard_validity.id}" {$ecard_validity.selected}><label for="ecard_validity_{$ecard_validity.id}">{$ecard_validity.name} </label> 
     129                                                        {/foreach} 
     130                                                </span> 
     131                                        </div> 
     132                                {/if} 
     133                        </fieldset> 
     134                        <fieldset> 
     135                                <legend>{'ecard_send_stage4'|@translate}</legend> 
     136                                <div class="ecard_submit"> 
     137                                        <input type="submit" name="ecard_submit" value="{'ecard_send'|@translate}" /> 
     138                                </div> 
     139                        </fieldset> 
     140                        <div> 
     141                                <span class="ecard_mandatory_fields">* {'ecard_send_mandatory_fields'|@translate}</span> 
     142                        </div> 
     143                </form> 
     144        </div> 
    85145</div> 
    86 </div> 
    87 <p> {'ecard_send_link1'|@translate} , <a href="#" onclick="openbox('{'ecard_send_link3'|@translate}', 1)">{'ecard_send_link2'|@translate}</a>. <br> 
     146<p> 
     147        <a href="#" class="createECardOpen" title="{'ecard_send_link3'|@translate}">{'ecard_send_link1'|@translate}, {'ecard_send_link2'|@translate}</a>. 
    88148</p> 
Note: See TracChangeset for help on using the changeset viewer.