translation_form.twig (9577B)
1 {{ header }}{{ column_left }} 2 <div id="content"> 3 <div class="page-header"> 4 <div class="container-fluid"> 5 <div class="pull-right"> 6 <button type="submit" form="form-translation" data-toggle="tooltip" title="{{ button_save }}" class="btn btn-primary"><i class="fa fa-save"></i></button> 7 <a href="{{ cancel }}" data-toggle="tooltip" title="{{ button_cancel }}" class="btn btn-default"><i class="fa fa-reply"></i></a></div> 8 <h1>{{ heading_title }}</h1> 9 <ul class="breadcrumb"> 10 {% for breadcrumb in breadcrumbs %} 11 <li><a href="{{ breadcrumb.href }}">{{ breadcrumb.text }}</a></li> 12 {% endfor %} 13 </ul> 14 </div> 15 </div> 16 <div class="container-fluid"> 17 {% if error_warning %} 18 <div class="alert alert-danger alert-dismissible"><i class="fa fa-exclamation-circle"></i> {{ error_warning }} 19 <button type="button" class="close" data-dismiss="alert">×</button> 20 </div> 21 {% endif %} 22 <div class="panel panel-default"> 23 <div class="panel-heading"> 24 <h3 class="panel-title"><i class="fa fa-pencil"></i> {{ text_form }}</h3> 25 </div> 26 <div class="panel-body"> 27 <form action="{{ action }}" method="post" enctype="multipart/form-data" id="form-translation" class="form-horizontal"> 28 <div class="form-group"> 29 <label class="col-sm-2 control-label" for="input-store">{{ entry_store }}</label> 30 <div class="col-sm-10"> 31 <select name="store_id" id="input-store" class="form-control"> 32 <option value="0">{{ text_default }}</option> 33 {% for store in stores %} 34 {% if store.store_id == store_id %} 35 <option value="{{ store.store_id }}" selected="selected">{{ store.name }}</option> 36 {% else %} 37 <option value="{{ store.store_id }}">{{ store.name }}</option> 38 {% endif %} 39 {% endfor %} 40 </select> 41 </div> 42 </div> 43 <div class="form-group"> 44 <label class="col-sm-2 control-label" for="input-language">{{ entry_language }}</label> 45 <div class="col-sm-10"> 46 <select name="language_id" id="input-language" class="form-control"> 47 {% for language in languages %} 48 {% if language.language_id == language_id %} 49 <option value="{{ language.language_id }}" selected="selected">{{ language.name }}</option> 50 {% else %} 51 <option value="{{ language.language_id }}">{{ language.name }}</option> 52 {% endif %} 53 {% endfor %} 54 </select> 55 </div> 56 </div> 57 <div class="form-group"> 58 <label class="col-sm-2 control-label" for="input-route">{{ entry_route }}</label> 59 <div class="col-sm-10"> 60 <select name="route" id="input-route" class="form-control"> 61 {% if route %} 62 <option value="{{ route }}" selected="selected">{{ route }}</option> 63 {% endif %} 64 </select> 65 </div> 66 </div> 67 <div class="form-group"> 68 <label class="col-sm-2 control-label" for="input-key">{{ entry_key }}</label> 69 <div class="col-sm-10"> 70 <select name="key" id="input-key" class="form-control"> 71 {% if key %} 72 <option value="{{ key }}" selected="selected">{{ key }}</option> 73 {% endif %} 74 </select> 75 <input type="text" name="key" value="{{ key }}" placeholder="{{ entry_key }}" class="form-control" /> 76 {% if error_key %} 77 <div class="text-danger">{{ error_key }}</div> 78 {% endif %} 79 </div> 80 </div> 81 <div class="form-group"> 82 <label class="col-sm-2 control-label" for="input-default">{{ entry_default }}</label> 83 <div class="col-sm-10"> 84 <textarea name="default" placeholder="{{ entry_default }}" rows="5" id="input-default" class="form-control" disabled="disabled">{% if default %}{{ default }}{% endif %}</textarea> 85 </div> 86 </div> 87 <div class="form-group"> 88 <label class="col-sm-2 control-label" for="input-value">{{ entry_value }}</label> 89 <div class="col-sm-10"> 90 <textarea name="value" rows="5" placeholder="{{ entry_value }}" id="input-value" class="form-control">{{ value }}</textarea> 91 </div> 92 </div> 93 </form> 94 </div> 95 </div> 96 </div> 97 <script type="text/javascript"><!-- 98 {% if key %} 99 $('select[name="store_id"]').prop('disabled', true); 100 $('select[name="language_id"]').prop('disabled', true); 101 $('select[name="route"]').prop('disabled', true); 102 $('select[name="key"]').prop('disabled', true); 103 $('input[name="key"]').prop('disabled', true); 104 {% else %} 105 $('select[name="language_id"]').on('change', function() { 106 $.ajax({ 107 url: 'index.php?route=design/translation/path&user_token={{ user_token }}&language_id=' + $('select[name="language_id"]').val(), 108 dataType: 'json', 109 beforeSend: function() { 110 $('select[name="route"]').html(''); 111 $('select[name="key"]').html(''); 112 $('input[name="key"]').val(''); 113 $('textarea[name="default"]').val(''); 114 $('select[name="store_id"]').prop('disabled', true); 115 $('select[name="language_id"]').prop('disabled', true); 116 $('select[name="route"]').prop('disabled', true); 117 $('select[name="key"]').prop('disabled', true); 118 $('input[name="key"]').prop('disabled', true); 119 $('textarea[name="value"]').prop('disabled', true); 120 }, 121 complete: function() { 122 $('select[name="store_id"]').prop('disabled', false); 123 $('select[name="language_id"]').prop('disabled', false); 124 $('select[name="route"]').prop('disabled', false); 125 }, 126 success: function(json) { 127 html = '<option value=""></option>'; 128 129 if (json) { 130 for (i = 0; i < json.length; i++) { 131 if (i == 0) { 132 html += '<option value="' + json[i] + '" selected="selected">' + json[i] + '</option>'; 133 } else { 134 html += '<option value="' + json[i] + '">' + json[i] + '</option>'; 135 } 136 } 137 } 138 139 $('select[name="route"]').html(html); 140 141 $('select[name="route"]').trigger('change'); 142 }, 143 error: function(xhr, ajaxOptions, thrownError) { 144 alert(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText); 145 } 146 }); 147 }); 148 149 var translation = []; 150 151 $('select[name="route"]').on('change', function() { 152 $.ajax({ 153 url: 'index.php?route=design/translation/translation&user_token={{ user_token }}&language_id=' + $('select[name="language_id"]').val() + '&path=' + $('select[name="route"]').val(), 154 dataType: 'json', 155 {% if not key %} 156 beforeSend: function() { 157 $('select[name="key"]').html(''); 158 $('input[name="key"]').val(''); 159 $('textarea[name="default"]').val(''); 160 $('textarea[name="value"]').val(''); 161 $('select[name="store_id"]').prop('disabled', true); 162 $('select[name="language_id"]').prop('disabled', true); 163 $('select[name="route"]').prop('disabled', true); 164 $('select[name="key"]').prop('disabled', true); 165 $('textarea[name="value"]').prop('disabled', true); 166 }, 167 complete: function() { 168 $('select[name="store_id"]').prop('disabled', false); 169 $('select[name="language_id"]').prop('disabled', false); 170 $('select[name="route"]').prop('disabled', false); 171 $('select[name="key"]').prop('disabled', false); 172 $('textarea[name="value"]').prop('disabled', false); 173 }, 174 {% endif %} 175 success: function(json) { 176 translation = []; 177 178 html = '<option value=""></option>'; 179 180 if (json) { 181 for (i = 0; i < json.length; i++) { 182 translation[json[i]['key']] = json[i]['value']; 183 184 if (i == 0) { 185 html += '<option value="' + json[i]['key'] + '" selected="selected">' + json[i]['key'] + '</option>'; 186 } else { 187 html += '<option value="' + json[i]['key'] + '">' + json[i]['key'] + '</option>'; 188 } 189 } 190 } 191 192 $('select[name="key"]').html(html); 193 194 $('select[name="key"]').trigger('change'); 195 }, 196 error: function(xhr, ajaxOptions, thrownError) { 197 alert(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText); 198 } 199 }); 200 }); 201 202 $('select[name="language_id"]').trigger('change'); 203 204 $('select[name="key"]').on('change', function() { 205 if ($(this).val()) { 206 $('textarea[name="default"]').val(translation[$('select[name="key"]').val()]); 207 $('input[name="key"]').val($('select[name="key"]').val()); 208 209 $('input[name="key"]').prop('disabled', true); 210 } else { 211 $('textarea[name="default"]').val(''); 212 213 $('input[name="key"]').prop('disabled', false); 214 } 215 }); 216 {% endif %} 217 //--></script> 218 </div> 219 {{ footer }}