Ignore:
Timestamp:
Jan 6, 2013, 9:05:36 PM (11 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.