명령 입력턴에 select2 적용

hwe/b_processing.php

@@ -77,6 +77,7 @@ $cssList = $commandObj->getCSSFiles();
 <meta name="viewport" content="width=1024" />
 <?=WebUtil::printJS('../e_lib/jquery-3.3.1.min.js')?>
 <?=WebUtil::printJS('../e_lib/bootstrap.bundle.min.js')?>
+<?=WebUtil::printJS('../e_lib/select2/select2.full.min.js')?>
 <?=WebUtil::printJS('../d_shared/common_path.js')?>
 <?=WebUtil::printJS('js/common.js')?>
 <?=WebUtil::printJS('d_shared/base_map.js')?>
@@ -95,10 +96,13 @@ foreach($jsList as $js){
 }
 ?>
 <?=WebUtil::printCSS('../e_lib/bootstrap.min.css')?>
+<?=WebUtil::printCSS('../e_lib/select2/select2.min.css')?>
+<?=WebUtil::printCSS('../e_lib/select2/select2-bootstrap4.css')?>
 <?=WebUtil::printCSS('../d_shared/common.css')?>
 <?=WebUtil::printCSS('css/common.css')?>
 <?=WebUtil::printCSS('css/main.css')?>
 <?=WebUtil::printCSS('css/map.css')?>
+<?=WebUtil::printCSS('css/processing.css')?>
 <?php
 foreach($cssList as $css){
     print(WebUtil::printCSS($css));

hwe/css/processing.css

@@ -0,0 +1,11 @@
+#amount {
+    width: 100px;
+}
+
+#colorType {
+    width: 150px;
+}
+
+.no-padding .select2-results__option {
+    padding: 0;
+}

hwe/js/processing.js

@@ -2,8 +2,7 @@ function reserveTurn(turnList, command, arg){
     var target;
     if (isChiefTurn) {
         target = 'j_set_chief_command.php';
-    }
+    } else {
-    else{
         target = 'j_set_general_command.php';
     }
     $.post({
@@ -22,8 +21,7 @@ function reserveTurn(turnList, command, arg){
 
         if (!isChiefTurn) {
             window.location.href = './';
-        }
+        } else {
-        else{
             window.location.href = 'b_chiefcenter.php';
         }
 
@@ -62,9 +60,13 @@ window.submitAction = function(){
             },
             'boolean': function($obj) {
                 switch ($obj.eq(0).val().toLowerCase()) {
-            case "true": case "yes": case "1":
+                    case "true":
+                    case "yes":
+                    case "1":
                         return true;
-            case "false": case "no": case "0":
+                    case "false":
+                    case "no":
+                    case "0":
                         return false;
                     default:
                         throw new Error("Boolean.parse: Cannot convert string to boolean.");
@@ -98,5 +100,144 @@ window.submitAction = function(){
 
     $('#commonSubmit').click(submitAction);
 
+    var $colorType = $('#colorType');
+    if ($colorType.length) {
+        $colorType.select2({
+            theme: 'bootstrap4',
+            placeholder: "색상을 선택해 주세요.",
+            language: "ko",
+            containerCss: {
+                display: "inline-block !important",
+                color: 'white !important',
+            },
+            templateSelection: function(item) {
+                if (item.disabled) {
+                    return item.text;
+                }
+                var bgcolor = item.element.dataset.color;
+                var fgcolor = item.element.dataset.fontColor;
+                return $("<span><span style='background-color:{0};color:{1};'>　</span>&nbsp;{2}</span>".format(
+                    bgcolor, fgcolor, item.text
+                ));
+            },
+            templateResult: function(item) {
+                if (item.disabled) {
+                    return item.text;
+                }
+                var bgcolor = item.element.dataset.color;
+                var fgcolor = item.element.dataset.fontColor;
+                return $("<div style='padding: 0.75rem 0.375rem; background-color:{0};color:{1};'>{2}</div>".format(
+                    bgcolor, fgcolor, item.text
+                ));
+            },
+            containerCssClass: 'simple-select2-align-center bg-secondary text-secondary',
+            dropdownCssClass: 'no-padding simple-select2-align-center bg-secondary text-secondary',
+        });
+    }
+
+    var $nationType = $('#nationType');
+    if ($nationType.length) {
+        $nationType.select2({
+            theme: 'bootstrap4',
+            language: "ko",
+            containerCss: {
+                display: "inline-block !important",
+                color: 'white !important',
+            },
+            containerCssClass: 'simple-select2-align-center bg-secondary text-secondary',
+            dropdownCssClass: 'simple-select2-align-center bg-secondary text-secondary',
+        });
+    }
+
+    var $destCityID = $('#destCityID');
+    if ($destCityID.length) {
+        $destCityID.select2({
+            theme: 'bootstrap4',
+            placeholder: "도시를 선택해 주세요.",
+            language: "ko",
+            containerCss: {
+                display: "inline-block !important",
+                color: 'white !important',
+            },
+            containerCssClass: 'simple-select2-align-center bg-secondary text-secondary',
+            dropdownCssClass: 'simple-select2-align-center bg-secondary text-secondary',
+        });
+    }
+
+    var $destNationID = $('#destNationID');
+    if ($destNationID.length) {
+        $destNationID.select2({
+            theme: 'bootstrap4',
+            placeholder: "국가를 선택해 주세요.",
+            language: "ko",
+            containerCss: {
+                display: "inline-block !important",
+                color: 'white !important',
+            },
+            containerCssClass: 'simple-select2-align-center bg-secondary text-secondary',
+            dropdownCssClass: 'simple-select2-align-center bg-secondary text-secondary',
+        });
+    }
+
+    var $destGeneralID = $('#destGeneralID');
+    if ($destGeneralID.length) {
+        $destGeneralID.select2({
+            theme: 'bootstrap4',
+            placeholder: "장수를 선택해 주세요.",
+            language: "ko",
+            containerCss: {
+                display: "inline-block !important",
+                color: 'white !important',
+            },
+            containerCssClass: 'simple-select2-align-center bg-secondary text-secondary',
+            dropdownCssClass: 'simple-select2-align-center bg-secondary text-secondary',
+        });
+    }
+
+    var $isGold = $('#isGold');
+    if ($isGold.length) {
+        $isGold.select2({
+            theme: 'bootstrap4',
+            placeholder: "분량을 지정해 주세요.",
+            language: "ko",
+            containerCss: {
+                display: "inline-block !important",
+                color: 'white !important',
+            },
+            minimumResultsForSearch: -1,
+            containerCssClass: 'simple-select2-align-center bg-secondary text-secondary',
+            dropdownCssClass: 'simple-select2-align-center bg-secondary text-secondary',
+        });
+    }
+
+    var $amount = $('#amount:not([type=hidden])');
+    if ($amount.length) {
+        $amount.select2({
+            theme: 'bootstrap4',
+            placeholder: "분량을 지정해 주세요.",
+            allowClear: false,
+            language: "ko",
+            containerCss: {
+                display: "inline-block !important",
+                color: 'white !important',
+            },
+            tags: true,
+            sorter: function(items) {
+                items.sort(function(lhs, rhs) {
+                    return parseInt(lhs.id) - parseInt(rhs.id);
+                })
+                return items;
+            },
+            containerCssClass: 'simple-select2-align-center bg-secondary text-secondary',
+            dropdownCssClass: 'select2-only-number simple-select2-align-center bg-secondary text-secondary',
+        })
+    }
+
+    $(document).on('keypress', '.select2-only-number .select2-search__field', function() {
+        $(this).val($(this).val().replace(/[^\d].+/, ""));
+        if ((event.which < 48 || event.which > 57)) {
+            event.preventDefault();
+        }
+    });
 
 });

hwe/sammo/Command/General/che_건국.php

@@ -269,7 +269,7 @@ class che_건국 extends Command\GeneralCommand
             }
             */
             ?>
-                <option value="<?= $idx ?>" style='background-color:<?= $color ?>;color:<?= newColor($color) ?>;'>국가명(<?=$color?>)</option>
+                <option value="<?= $idx ?>" data-color="<?= $color ?>" data-font-color="<?=newColor($color)?>" style='background-color:<?= $color ?>;color:<?= newColor($color) ?>;'>국가명(<?=$color?>)</option>
             <?php endforeach; ?>
         </select>
         성향 : <select class='formInput' name='nationType' id='nationType' size='1'>

hwe/sammo/Command/Nation/che_국기변경.php

@@ -182,7 +182,7 @@ class che_국기변경 extends Command\NationCommand
             }
             */
             ?>
-                <option value="<?= $idx ?>" style='background-color:<?= $color ?>;color:<?= newColor($color) ?>;'>국가명(<?=$color?>)</option>
+                <option value="<?= $idx ?>" data-color=<?=$color?> data-font-color="<?=newColor($color)?>" style='background-color:<?= $color ?>;color:<?= newColor($color) ?>;'>국가명(<?=$color?>)</option>
             <?php endforeach; ?> <input type=button id="commonSubmit" value="<?= $this->getName() ?>"><br>
         <br>
 <?php