widgets/admin_main/include/template/tempimage.tmpl.html

   1 /**
   2  * 表示データ作成用テンプレート(patTemplate)
   3  *
   4  * LICENSE: This source file is licensed under the terms of the GNU General Public License.
   5  *
   6  * @package    Magic3 Framework
   7  * @author     平田直毅(Naoki Hirata) <naoki@aplo.co.jp>
   8  * @copyright  Copyright 2006-2017 Magic3 Project.
   9  * @license    http://www.gnu.org/copyleft/gpl.html  GPL License
  10  * @version    SVN: $Id$
  11  * @link       http://www.magic3.org
  12  */
  13 <patTemplate:tmpl name="_widget">
  14 <script type="text/javascript">
  15 //<![CDATA[
  16 function updateList()
  17 {
  18         if (!window.confirm('{_LC_MSG_FILE_UPLOAD}')) return false;
  19         document.main.act.value = 'update';
  20         document.main.submit();
  21         return true;
  22 }
  23 function delItem(){
  24         if (document.main.seriallist.value){
  25                 var items = document.main.seriallist.value.split(",");
  26                 for (var i = 0; i < items.length; i++){
  27                         var name = "document.main.item" + i + "_selected";
  28                         var itemObj = eval(name);
  29                         // チェックありのときは終了
  30                         if (itemObj && itemObj.checked) break;
  31                 }
  32                 if (i == items.length){
  33                         window.alert('{_LC_MSG_SELECT_ITEM_TO_DEL}');
  34                 } else {
  35                         if (!window.confirm('{_LC_MSG_DELETE_ITEM}')) return false;
  36                         document.main.act.value = 'delete';
  37                         document.main.submit();
  38                 }
  39         }
  40         return true;
  41 }
  42 function editItem(){
  43         if (document.main.seriallist.value){
  44                 var items = document.main.seriallist.value.split(",");
  45                 for (var i = 0; i < items.length; i++){
  46                         var name = "document.main.item" + i + "_selected";
  47                         var itemObj = eval(name);
  48                         // チェックありのときは終了
  49                         if (itemObj && itemObj.checked) break;
  50                 }
  51                 if (i == items.length){
  52                         window.alert('{_LC_MSG_SELECT_ITEM_TO_EDIT}');
  53                 } else {
  54                         // ディレクトリは編集不可
  55                         if (items[i] == -1){
  56                                 window.alert('{_LC_MSG_DIRECTORY_NOT_ALLOWED}');
  57                                 return true;
  58                         }
  59                         document.main.task.value = 'tempimage_detail';
  60                         document.main.act.value = 'edit';
  61                         document.main.serial.value = items[i];
  62                         document.main.submit();
  63                 }
  64         }
  65         return true;
  66 }
  67 function editItemBySerial(serial){
  68         document.main.task.value = 'tempimage_detail';
  69         document.main.act.value = 'edit';
  70         document.main.serial.value = serial;
  71         document.main.submit();
  72 }
  73 // ディレクトリ作成ダイアログ表示
  74 function showCreateDir()
  75 {
  76         var dialogText = '';
  77
  78         dialogText += '{_LC_LABEL_DIRECTORY_NAME}<input type="text" id="dir_name" name="dir_name" class="form-control" value="{DIRECTORY_NAME}" maxlength="100" />';
  79
  80         // ダイアログ作成
  81         BootstrapDialog.show({
  82                 title: '{_LC_LABEL_CREATE_DIRECTORY}',
  83                 message: dialogText,
  84                 closable: false,
  85                 nl2br: false,
  86                 buttons: [{
  87                         id: 'cancel',
  88                         label: 'キャンセル',
  89                         action: function(dialog) {
  90                                 dialog.close();
  91                         }
  92                 }, {
  93                         id: 'ok',
  94                         label: '{_LC_LABEL_CREATE}',
  95                         cssClass: 'btn-primary',
  96                         action: function(dialog) {
  97                                 // 入力状態のチェック
  98                                 var value = $('#dir_name').val();
  99                                 if (value){
 100                                         dialog.close();
 101
 102                                         // ディレクトリ名を送信
 103                                         createDir(value);
 104                                 } else {
 105                                         alert("ディレクトリ名を入力してください");
 106                                 }
 107                         }
 108                 }]
 109         });
 110 }
 111 // ディレクトリを作成
 112 function createDir(dir)
 113 {
 114         document.main.directory_name.value = dir;
 115         document.main.act.value = 'createdir';
 116         document.main.submit();
 117         return true;
 118 }
 119 // ファイルアップロードダイアログ表示
 120 function showFileUpload()
 121 {
 122         var dialogText = '';
 123
 124         dialogText += '<div id="uploader_image">{UPLOAD_AREA}</div>';
 125
 126         // ダイアログ作成
 127         BootstrapDialog.show({
 128                 title: '{_LC_LABEL_UPLOAD}',
 129                 message: dialogText,
 130                 closable: false,
 131                 nl2br: false,
 132                 onshown: function(dialog) {
 133                         // 画像アップローダー作成
 134                         m3CreateDragDropUploadFile('uploader_image', '{UPLOAD_IMAGE_URL}');
 135                 },
 136                 buttons: [{
 137                         id: 'cancel',
 138                         label: '終了',
 139                         action: function(dialog) {
 140                                 dialog.close();
 141
 142                                 // 画面再表示
 143                                 window.location.href = window.location.href;
 144                         }
 145                 }]
 146         });
 147 }
 148 $(function(){
 149         // テーブルを作成
 150         m3SetConfigTable('mainconfig');
 151
 152         // ボタンの処理
 153         $("#fileuploadbutton").click(function (){
 154                 showFileUpload();
 155         });
 156         $("#createdirbutton").click(function (){
 157                 showCreateDir();
 158         });
 159 });
 160 //]]>
 161 </script>
 162 <div class="m3config_container">
 163 <!-- m3:ErrorMessage -->
 164 <form method="post" name="main">
 165 <input type="hidden" name="task" value="tempimage" />
 166 <input type="hidden" name="act" />
 167 <input type="hidden" name="serial" />
 168 <input type="hidden" name="seriallist" value="{SERIAL_LIST}" />
 169 <input type="hidden" name="path" value="{PATH}" />
 170 <input type="hidden" name="directory_name" />
 171
 172 <h3 class="m3config_h" style="margin-right:20px;"><span {_HELP_TEMPIMAGE_LIST}>画像一覧</span></h3><span {_HELP_TEMPIMAGE_TEMPLATE}>{_LC_LABEL_TEMPLATE}</span><span style="margin-right:10px;">{TEMPLATE}</span> <span {_HELP_TEMPIMAGE_PATH}>{_LC_LABEL_PATH}</span>{PATH_LINK}
 173 <div class="m3config_h_side_buttons pull-right"><div {_HELP_TEMPIMAGE_BUTTONS}><div class="btn-group">
 174 <input type="button" class="button" onclick="editItem();" value="{_LC_LABEL_EDIT}" /><input type="button" class="button" onclick="delItem();" value="{_LC_LABEL_DELETE}" {DEL_DISABLED}/>
 175 </div></div></div>
 176
 177 <div class="m3config_h_side_buttons pull-right" style="margin-right:10px;">
 178 <div {_HELP_TEMPIMAGE_BUTTONS2}><div class="btn-group">
 179 <a href="javascript:void(0);" id="fileuploadbutton" class="button" role="button" rel="m3help" data-container="body" title="ファイルアップロード"><i class="glyphicon glyphicon-cloud-upload"></i></a><a href="javascript:void(0);" id="createdirbutton" class="button" role="button" rel="m3help" data-container="body" title="ディレクトリを作成"><i class="glyphicon glyphicon-folder-close"></i></a>
 180 </div></div></div>
 181
 182 <table id="mainconfig">
 183     <thead>
 184     <tr>
 185             <th class="select"><span {_HELP_TEMPIMAGE_CHECK}>{_LC_LABEL_CHECK}</span></th>
 186             <th style="border-right:none;width:50px;"></th>
 187             <th style="border-left:none;width:300px;"><span {_HELP_TEMPIMAGE_FILENAME}>{_LC_LABEL_FILENAME}</span></th>
 188             <th><span {_HELP_TEMPIMAGE_IMAGE_SIZE}>画像サイズ(横x縦)</span></th>
 189                 <th><span {_HELP_TEMPIMAGE_FILE_SIZE}>サイズ(バイト)</span></th>
 190             <th class="date_narrow"><span {_HELP_TEMPIMAGE_DATE}>{_LC_LABEL_DATE}</span></th>
 191         </tr>
 192     </thead>
 193     <tbody>
 194     <patTemplate:tmpl name="file_list">
 195     <tr>
 196             <td><input type="checkbox" name="item{INDEX}_selected" {CHECK_DISABLED}/><input type="hidden" name="item{INDEX}_name" value="{NAME}" /></td>
 197             <td style="border-right:none;text-align:center;">{ICON}</td>
 198             <td style="border-left:none;">{FILENAME}</td>
 199             <td>{IMAGE_SIZE}</td>
 200             <td>{SIZE}</td>
 201             <td>{DATE}</td>
 202         </tr>
 203         </patTemplate:tmpl>
 204     </tbody>
 205 </table>
 206 {PAGE_LINK}
 207 </form>
 208 </div>
 209 </patTemplate:tmpl>