webadmin.php

/var/www/hkosl.com/m.musiccircle/tutor_postjob_form.php

<?php
    include('_init.php');

    if ($_SESSION["is_tutor"] != 1) {
        header("Location: index.php");
        exit;
    }

    $page_settings['domain'] = "tutor_postjob";

    $sql         = "select profile_id,(select id from `tutor_main` where cmsloginid = tb.user_id LIMIT 1) as id
            from `profile_user` as tb where user_id = ? and deleted = ? LIMIT 1";
    $parameters  = array($_SESSION['cmsloginid'], 0);
    $row_profile = bind_pdo($sql, $parameters, "selectone");

    $sql        = "select * from master_type_code where typeid = ? and deleted = ?";
    $parameters = array('TEACH_AREACODE', 0);
    $rows_area  = bind_pdo($sql, $parameters, "selectall");

    //$row = get_teacherpostjob((int)$_GET["id"]);

    if ($row_profile['profile_id'] == 3) {
        $sql        = "select * from tutor_postjob where id = ? and tutormain_id = ? and deleted = ? order by createdate DESC";
        $parameters = array((int)$_GET["id"], $_SESSION["member_login"], 0);
        $row        = bind_pdo($sql, $parameters, "selectone");
    } else {
        $sql        = "select * from tutor_postjob where id = ? and deleted = ? order by createdate DESC";
        $parameters = array((int)$_GET["id"], 0);
        $row        = bind_pdo($sql, $parameters, "selectone");
    }


    if (!empty($_GET["id"]) && empty($row)) {
        $path = $page_settings['domain'] . '_index.php';
        @header("Location: {$path}");
        echo "<script language='JavaScript'>window.location='{$path}'</script>";
        exit;
    }

    if ($row_profile['profile_id'] == 4) {
        if ($row['id']) {
            if ($row_profile['id'] != $row['studentmain_id']) {
                $path = $page_settings['domain'] . '_index.php';
                @header("Location: {$path}");
                echo "<script language='JavaScript'>window.location='{$path}'</script>";
            }
        } else {
            $sql           = "select count(*) as count from student_postjob as tb where studentmain_id = ? and deleted = ? 
                           and (select count(*) from `order` where job_id = tb.id and deleted = 0 and `status` = 'paid') = 0";
            $parameters    = array($row_profile['id'], 0);
            $count_product = bind_pdo($sql, $parameters, "selectone");
            if (!($count_product['count'] < 2)) {
                $path = $page_settings['domain'] . '_index.php';
                @header("Location: {$path}");
                echo "<script language='JavaScript'>window.location='{$path}'</script>";
            }
        }
    }
    if ($row) {
        $action = 'Modify'; // Add or Modify

        $sql99        = "SELECT * FROM sys_cms_login WHERE cmsloginid=?";
        $parameters99 = array((int)$row{'cmsloginid'});
        $row_user     = bind_pdo($sql99, $parameters99, "selectone");

        $sql               = "SELECT * FROM tutor_postjob_date WHERE postjob_refid = ?";
        $parameters99      = array(intval($row['id']));
        $rows_postjob_date = bind_pdo($sql, $parameters99, "selectall");
        //print_r($rows_postjob_date);
    } else {
        $action = 'Add'; // Add or Modify
    }
    $sql          = "select * from tutor_main where status = ? and deleted = ?";
    $parameters   = array(4, 0);
    $rows_teacher = bind_pdo($sql, $parameters, "selectall");

    $sql               = "select * from master_type_code where typeid = ? and deleted = ? order by sort asc";
    $parameters        = array('LEVEL_OF_GRADE', 0);
    $rows_levelofgrade = bind_pdo($sql, $parameters, "selectall");

    if ($row_profile['profile_id'] == 4) {
        $sql = "select * from master_type_code as tt where typeid = ? and deleted = ? and (select count(*) from master_type_code as tb where typeid = 'INSTRUMENT' and extra1 = tt.code and deleted = 0 and (select count(*) from tutor_instrumentquali where tutormain_id = '" . $row_profile['id'] . "' and mas_instrument = tb.id and deleted = 0) > 0) > 0";
    } else {
        $sql = "select * from master_type_code as tt where typeid = ? and deleted = ?";
    }
    $parameters           = array('INSTRUMENT_TYPE', 0);
    $rows_instrument_type = bind_pdo($sql, $parameters, "selectall");
?>
<!DOCTYPE html>
<html lang="en">
<head>
    <?php include('_head.php'); ?>
    <link href="css/style_k.css?v=<?= time(); ?>" type="text/css" rel="stylesheet">

    <style>
        label {
            font-weight: 100;
            margin-right: 10px;
        }

        label input[type="checkbox"] {
            margin-right: 3px;
        }

        label.col-sm-2 {
            margin-right: 0px;
            font-weight: bold;
        }

        .LiTutorCertClass, .LiInstrumentqualiClass {
            margin-bottom: 5px;
        }

        .LiInstrumentqualiClass .form-control {
            margin-right: 3px;
        }

        input[type=file] {
            margin-right: 3px;
            width: 80%;
        }

        .form-del {
            height: 30px;
            width: 30px;
        }

        input[type=file], .form-del {
            display: inline-block;
        }

        .nav-tabs > li > a {
            color: #999;
            border: 1px solid #ededed;
        }

        .box-body .col-md-12, .box-body .col-sm-2, .box-body .col-sm-4, .box-body .col-sm-10 {
            padding: 0;
        }
    </style>
    <script>
        $(function () {

            $('#sel1_area').change(
                function () {
                    //console.log('#sel1_position'+$(this).val());
                    $('.dropdown-menu').hide();
                    $('#sel1_position' + $(this).val()).show();
                }
            );
        })
    </script>
</head>

<body>
<?php include('_header.php') ?>

<?php include('_dialog.php') ?>

<div class="ProfileContent">
    <div class="Profilecontainer">
        <div class="row">
            <div class="col-md-12">

                <p id="post_jobs_desc">
                    同學可發帖讓合適的音樂導師主動聯絡你，更快找到最佳導師。 <br> 請填寫以下資料！
                </p>

                <div class="post_job_tab">
                    <a href="student_postjob_form.php">
                        <div class="post_job_tab_1 tc active">
                            <?= _lang("Post") ?>
                        </div>
                    </a>

                    <a href="student_postjob_index.php">
                        <div class="post_job_tab_2 tc">
                            <?= _lang("Posted") . " / " . _lang("Lesson Record") ?>
                        </div>
                    </a>
                </div>

                <!--<div class="scroll_left_right_container">
                    <div class="scroll_left_right"><img src="../img/scroll_left_right.png"></div>
                </div>-->

                <div class="tab_container">

                    <form action="<?= $page_settings['domain'] ?>_process.php?action=manage" class="myform" id="myform" method="POST" enctype="multipart/form-data">
                        <? if ($row['id']) { ?>
                            <input type="hidden" name="id" value="<?= _h($row['id']) ?>"/>
                        <? } ?>
                        <div class="row">
                            <div class="col-xs-12">
                                <div class="box">
                                    <div class="box-header">

                                    </div>

                                    <!-- /.box-header -->
                                    <div class="box-body">
                                        <br>

                                        <? if ($row["postjob_no"]) { ?>
                                            <div class="col-md-12 form-group">
                                                <label for="" class="col-sm-2 control-label">
                                                    <?= _lang("Pairing Number") ?>
                                                </label>
                                                <div class="col-sm-10">
                                                    <?= $row["postjob_no"] ?>
                                                    <p class="help-block"></p>
                                                </div>
                                            </div>
                                        <? } ?>
                                        <div class="col-md-12 form-group">
                                            <label for="" class="col-sm-2 control-label required_field">導師</label>
                                            <div class="col-sm-10">
                                                <? if ($row_profile['profile_id'] == 1 || $row_profile['profile_id'] == 2) { ?>
                                                    <select name="tutormain_id" class="form-control">
                                                        <option value="">-請選擇-</option>
                                                        <? foreach ($rows_teacher as $row_teacher) { ?>
                                                            <option value="<?= $row_teacher['id'] ?>" <? if ($row_teacher['id'] == $row['tutormain_id']){ ?>selected<? } ?>>
                                                                <?= $row_teacher['tutor_no'] ?>
                                                                <?= $row_teacher['nickname'] ?>
                                                            </option>
                                                        <? } ?>
                                                    </select>
                                                    <div id="tutormainidError" style="color:#F00; display:none;" class="error">
                                                        <?= _lang('Please select student') ?>
                                                    </div>
                                                <? } else { ?>
                                                    <input type="hidden" name="tutormain_id" value="<?= $row_profile['id'] ?>"/>
                                                    <div style="margin-bottom:6px;">
                                                        <?
                                                            $row_teacher = get_teacher($row_profile['id']);
                                                            echo $row_teacher['nickname'];
                                                        ?>
                                                    </div>
                                                <? } ?>
                                                <p class="help-block"></p>
                                            </div>
                                        </div>
                                        <div class="col-md-12 form-group">
                                            <label for="" class="col-sm-2 control-label required_field"> 開放報名日期 </label>
                                            <div class="col-sm-4">
                                                <input name="start_date" type="text" class="form-control datetimepicker" value="<?= $row['start_date'] ?>">
                                                <div id="startdateError" style="color:#F00; display:none;" class="error">
                                                    <?= _lang('請輸入開放報名日期') ?>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-md-12 form-group">
                                            <label for="" class="col-sm-2 control-label required_field"> 完結報名日期 </label>
                                            <div class="col-sm-4">
                                                <input name="end_date" type="text" class="form-control datetimepicker" value="<?= $row['end_date'] ?>">
                                                <div id="enddateError" style="color:#F00; display:none;" class="error">
                                                    <?= _lang('請輸入完結報名日期') ?>
                                                </div>
                                            </div>
                                        </div>

                                        <div class="col-md-12 form-group">
                                            <label for="" class="col-sm-2 control-label required_field"> 樂器 </label>
                                            <div class="col-sm-10">
                                                <select name="mas_instrument" class="form-control">
                                                    <option value="">-請選擇-</option>
                                                    <? foreach ($rows_instrument_type as $row_instrument_type) {

                                                        if ($row_profile['profile_id'] == 3) {
                                                            $sql = "select * from master_type_code as tb where typeid = ? and extra1 = ? and deleted = ? and (select count(*) from tutor_instrumentquali where tutormain_id = '" . $row_profile['id'] . "' and mas_instrument = tb.id and deleted = 0) > 0";
                                                        } else {
                                                            $sql = "select * from master_type_code as tb where typeid = ? and extra1 = ? and deleted = ?";
                                                        }
                                                        $parameters      = array('INSTRUMENT', $row_instrument_type['code'], 0);
                                                        $rows_instrument = bind_pdo($sql, $parameters, "selectall");

                                                        if (!empty($rows_instrument)) {
                                                            echo '<optgroup label="' . $row_instrument_type['name_' . get_langcode()] . '">"';

                                                            foreach ($rows_instrument as $row_instrument) {
                                                                echo '<option value="' . $row_instrument['id'] . '" ' . ($row['mas_instrument'] == $row_instrument['id'] ? "selected" : "") . '>' . $row_instrument['name_' . get_langcode()] . '</option>';
                                                            }

                                                            echo '</optgroup>';
                                                        }
                                                    }
                                                    ?>
                                                </select>
                                                <div id="instrumentError" style="color:#F00; display:none;" class="error">
                                                    <?= _lang('Please select instrument') ?>
                                                </div>
                                                <p class="help-block"></p>
                                            </div>
                                        </div>
                                        <div class="col-md-12 form-group">
                                            <label for="" class="col-sm-2 control-label required_field"> 級別 </label>
                                            <div class="col-sm-10">
                                                <select name="level" class="form-control">
                                                    <option value="">-請選擇-</option>
                                                    <option value="1" <? if (1 == $row['level']){ ?>selected<? } ?>>
                                                        初級
                                                    </option>
                                                    <option value="3" <? if (3 == $row['level']){ ?>selected<? } ?>>
                                                        中級
                                                    </option>
                                                </select>
                                                <div id="levelError" style="color:#F00; display:none;" class="error">
                                                    <?= _lang('Please select level') ?>
                                                </div>
                                                <p class="help-block"></p>
                                            </div>
                                        </div>
                                        <div class="col-md-12 form-group">
                                            <label for="" class="col-sm-2 control-label required_field"> 學生年齡 </label>
                                            <div class="col-sm-10">
                                                <select name="student_age" class="form-control">
                                                    <option value="">-請選擇-</option>
                                                    <option value="1" <? if (1 == $row['student_age']){ ?>selected<? } ?>>
                                                        4 - 10 歲
                                                    </option>
                                                    <option value="3" <? if (3 == $row['student_age']){ ?>selected<? } ?>>
                                                        11 - 18 歲
                                                    </option>
                                                    <option value="3" <? if (3 == $row['student_age']){ ?>selected<? } ?>>
                                                        18 歲或以上
                                                    </option>
                                                </select>
                                                <div id="student_age_Error" style="color:#F00; display:none;" class="error">
                                                    請選擇學生年齡
                                                </div>
                                                <p class="help-block"></p>
                                            </div>
                                        </div>
                                        <div class="col-md-12 form-group">
                                            <label for="" class="col-sm-2 control-label required_field">
                                                <?= lang('上載圖片') ?>
                                                <br> <font color="#0012ff" style="font-size:12px; font-weight:100;">(
                                                    <?= _lang("Size Limit: 1mb, Format: jpeg, jpg, png") ?>
                                                    )</font></label>
                                            <div class="col-sm-10">
                                                <div id="LiTutorCertBox">
                                                    <!-- Wrap the image or canvas element with a block element (container) -->
                                                    <div id="image_container" style="width: 100%;">
                                                        <span style="font-size: 12px; color: #0012ff;">請先選擇圖片，在畫板中可使用滑鼠滾輪可控制圖片縮放，按住左鍵可移動選擇範圍，選擇合適的範圍後按"裁剪圖片"裁剪</span>
                                                        <div id="image"></div>
                                                    </div>

                                                    <br><br>

                                                    <?php for ($i = 1; $i <= 6; $i++) { ?>
                                                        <div class="crop_image_container" style="margin-bottom: 10px;">
                                                            <? if ($row['upload_photo' . $i]) { ?>
                                                                <div style="margin-bottom:5px;" class="img ori_image">
                                                                    <a href="file/teacherpostjob/<?= $row['upload_photo' . $i] ?>" target="_blank"><img src="file/teacherpostjob/<?= $row['upload_photo' . $i] ?>" width="150"/></a>
                                                                    <input type="hidden" name="upload_photo<?= $i ?>_on" value="1" class="existed_image"/>
                                                                </div>
                                                            <? } ?>

                                                            <div id="cropped_img_container" style="display: none; margin-bottom: 5px;">
                                                                <img src="" id="cropped_img" style="width: 200px;margin-top: 10px; border: 1px #ccc solid;"/>
                                                                <input type="hidden" name="base64_upload_photo<?= $i ?>" id="base64_img" class="base64_img" value="">
                                                            </div>

                                                            <input type="file" class="" id="inputImage_<?= $i ?>" name="upload_photo<?= $i ?>" accept="image/*" style="width: 75px;">
                                                            <? if ($row['upload_photo' . $i]) { ?>
                                                                <input type="button" value="刪除圖片" onclick="delphoto(this)" style="margin-left: 10px;"/><? } ?>

                                                            <button type="button" class="crop_image btn btn-primary" style="margin-left: 15px;">
                                                                裁剪圖片
                                                            </button>

                                                            <div id="upload_photo_Error" style="color:#F00; display:none;" class="error">
                                                                請上載最少一張圖片
                                                            </div>
                                                            <div style="color:#F00; display:none;" class="error" id="upload<?= $i ?>Error">
                                                                <?= _lang("Size Limit: 1mb, Format: jpeg, jpg, png, pdf") ?>
                                                            </div>
                                                            <div style="color:#F00; display:none;" class="error" id="upload<?= $i ?>Error2">
                                                                <?= _lang("Uploaded file size cannot over 1 MB.") ?>
                                                            </div>
                                                        </div>
                                                    <?php } ?>


                                                    <? /*for ($i = 1; $i <= 6; $i++) { ?>
                                                <div class="LiTutorCertClass">
                                                    <? if ($row['upload_photo' . $i]) { ?>
                                                        <div style="margin-bottom:5px;" class="img">
                                                            <a href="../file/teacherpostjob/<?= $row['upload_photo' . $i] ?>" target="_blank"><img src="../file/teacherpostjob/<?= $row['upload_photo' . $i] ?>" width="150"/></a>
                                                            <input type="hidden" name="upload_photo<?= $i ?>_on" value="1"/>
                                                        </div>
                                                    <? } ?>
                                                    <input type="file" class="form-control input-sm" name="upload_photo<?= $i ?>" style="width:150px;"><? if ($row['upload_photo' . $i]) { ?>
                                                        <input type="button" value="刪除圖片" onclick="delphoto(this)"/><? } ?>
                                                </div>
                                                <div style="color:#F00; display:none;" class="error" id="upload<?= $i ?>Error">
                                                    <?= _lang("Size Limit: 1mb, Format: jpeg, jpg, png, pdf") ?>
                                                </div>
                                                <div style="color:#F00; display:none;" class="error" id="upload<?= $i ?>Error2">
                                                    <?= _lang("Uploaded file size cannot over 1 MB.") ?>
                                                </div>
                                            <? } */ ?>
                                                </div>

                                            </div>
                                        </div>

                                        <div class="col-md-12 form-group">
                                            <label for="" class="col-sm-2 control-label required_field"> 樂器安排 </label>
                                            <div class="col-sm-10">
                                                <div>
                                                    <input type="checkbox" name="instrument_arrangement_1" id="instrument_arrangement_1" value="1" data-value="1" class="instrument_arrangement" <?= $row['instrument_arrangement_1'] == 1 ? "checked" : "" ?>/>
                                                    導師可免費提供樂器
                                                    <div id="instrument_arrangement_1_container" style="display: none;">
                                                        <div id="instrument_deposit_1_container">
                                                            <span class="required_field">按金</span> : $
                                                            <input type="number" name="instrument_deposit_1" value="<?= $row['instrument_deposit_1'] ?>" style="width: 100px;"/>
                                                            <div id="instrument_deposit_1_Error" style="color:#F00; display:none;" class="error">
                                                                請輸入樂器租借按金
                                                            </div>
                                                            <div id="instrument_deposit_1_Error2" style="color:#F00; display:none;" class="error">
                                                                樂器租借按金必須是數字及大於0
                                                            </div>
                                                        </div>
                                                    </div>

                                                    <br>

                                                    <input type="checkbox" name="instrument_arrangement_2" id="instrument_arrangement_2" value="1" data-value="2" class="instrument_arrangement" <?= $row['instrument_arrangement_2'] == 1 ? "checked" : "" ?>/>
                                                    導師可提供樂器租借
                                                    <div id="instrument_arrangement_2_container" style="display: none;">
                                                        <div style="margin-bottom: 5px;" id="instrument_rent_fee_2">
                                                            <span class="required_field">價錢</span> : $
                                                            <input type="number" name="instrument_rent_fee_2" value="<?= $row['instrument_rent_fee_2'] ?>" style="width: 100px;"/>
                                                            / 課程
                                                            <div id="instrument_rent_fee_2_Error" style="color:#F00; display:none;" class="error">
                                                                請輸入樂器租借價錢
                                                            </div>
                                                            <div id="instrument_rent_fee_2_Error2" style="color:#F00; display:none;" class="error">
                                                                樂器租借價錢必須是數字及大於0
                                                            </div>
                                                        </div>

                                                        <div id="instrument_deposit_2">
                                                            <span class="required_field">按金</span> : $
                                                            <input type="number" name="instrument_deposit_2" value="<?= $row['instrument_deposit_2'] ?>" style="width: 100px;"/>
                                                            <div id="instrument_deposit_2_Error" style="color:#F00; display:none;" class="error">
                                                                請輸入樂器租借按金
                                                            </div>
                                                            <div id="instrument_deposit_2_Error2" style="color:#F00; display:none;" class="error">
                                                                樂器租借按金必須是數字及大於0
                                                            </div>
                                                        </div>
                                                    </div>

                                                    <br>

                                                    <input type="checkbox" name="instrument_arrangement_3" value="1" data-value="3" class="instrument_arrangement" <?= $row['instrument_arrangement_3'] == 1 ? "checked" : "" ?>/>
                                                    學生需自備樂器

                                                    <div id="instrument_arrangement_Error" style="color:#F00; display:none;" class="error">
                                                        請最少選擇一種樂器安排
                                                    </div>
                                                </div>

                                                <br>

                                                <div id="instrument_arrangement_remark">
                                                    備註 :
                                                    <textarea rows="3" style="width: 100%;" name="instrument_arrangement_remark" class="form-control"><?= $row['instrument_arrangement_remark'] ?></textarea>
                                                </div>

                                            </div>
                                        </div>

                                        <div class="col-md-12 form-group">
                                            <label for="" class="col-sm-2 control-label"> 課堂簡介 </label>
                                            <div class="col-sm-10">
                                                <textarea name="detail_cn" class="form-control" style="height:150px;"><?= $row['detail_cn'] ?></textarea>
                                            </div>
                                        </div>
                                        <div class="col-md-12 form-group">
                                            <label for="" class="col-sm-2 control-label required_field"> 預留學生 </label>
                                            <div class="col-sm-4">
                                                <select name="reserved_people_count" class="form-control">
                                                    <? for ($i = 0; $i <= 2; $i++) { ?>
                                                        <option value="<?= $i ?>" <? if ($i == $row['reserved_people_count']){ ?>selected<? } ?>>
                                                            <?= $i ?>
                                                        </option>
                                                    <? } ?>
                                                </select> <span style="font-size: 12px; color: #0012ff;">導師可能於其他途徑已收取希望參加小組班的同學，為了增加組成音樂班的機會，導師可於音樂班中預留名額給已知有興趣的同學 </span>

                                                <div id="reservedPeopleError" style="color:#F00; display:none;" class="error">
                                                    預留學生不能大於或等於報名上限
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-md-12 form-group">
                                            <label for="" class="col-sm-2 control-label required_field"> 學生報名上限 </label>
                                            <div class="col-sm-4">
                                                <select name="people_count" class="form-control" id="people_count">
                                                    <? for ($i = 2; $i <= 3; $i++) { ?>
                                                        <option value="<?= $i ?>" <? if ($i == $row['people_count']){ ?>selected<? } ?>>
                                                            <?= $i ?>
                                                        </option>
                                                    <? } ?>
                                                </select>
                                                <span style="font-size: 12px; color: #0012ff;">報名人數足夠2人必須開班</span>
                                            </div>
                                        </div>
                                        <div class="col-md-12 form-group">
                                            <label for="" class="col-sm-2 control-label required_field"> 課堂堂數 </label>
                                            <div class="col-sm-4">
                                                <select name="course_count" class="form-control">
                                                    <option value="4">4</option>
                                                    <option value="8">8</option>
                                                    <option value="12">12</option>
                                                </select>
                                            </div>
                                        </div>
                                        <? $week_array = explode(',', $row['week']); ?>
                                        <div class="col-md-12 form-group">
                                            <label for="" class="col-sm-2 control-label required_field"> 每週上課星期 </label>
                                            <div class="col-sm-10">
                                                <label>
                                                    <input type="checkbox" name="week[]" value="1" <? if (in_array('1', $week_array)){ ?>checked<? } ?>/>
                                                    星期一 </label> <label>
                                                    <input type="checkbox" name="week[]" value="2" <? if (in_array('2', $week_array)){ ?>checked<? } ?>/>
                                                    星期二 </label> <label>
                                                    <input type="checkbox" name="week[]" value="3" <? if (in_array('3', $week_array)){ ?>checked<? } ?>/>
                                                    星期三 </label> <label>
                                                    <input type="checkbox" name="week[]" value="4" <? if (in_array('4', $week_array)){ ?>checked<? } ?>/>
                                                    星期四 </label> <label>
                                                    <input type="checkbox" name="week[]" value="5" <? if (in_array('5', $week_array)){ ?>checked<? } ?>/>
                                                    星期五 </label> <label>
                                                    <input type="checkbox" name="week[]" value="6" <? if (in_array('6', $week_array)){ ?>checked<? } ?>/>
                                                    星期六 </label> <label>
                                                    <input type="checkbox" name="week[]" value="0" <? if (in_array('0', $week_array)){ ?>checked<? } ?>/>
                                                    星期日 </label>
                                                <div id="weekError" style="color:#F00; display:none;" class="error">
                                                    請選擇每週上課星期
                                                </div>
                                            </div>

                                        </div>
                                        <div class="col-md-12 form-group">
                                            <label for="" class="col-sm-2 control-label required_field"> 每週上課時間 </label>
                                            <div class="col-sm-2">
                                                <select name="time_h" class="form-control">
                                                    <? for ($i = 0; $i < 14; $i++) { ?>
                                                        <option value="<?= (9 + $i) ?>" <? if ((9 + $i) == $row['time_h']){ ?>selected<? } ?>><?= sprintf("%02d", (9 + $i)) ?></option>
                                                    <? } ?>
                                                </select>
                                            </div>
                                            <div class="col-sm-2" style="padding-left:0px;">
                                                <select name="time_m" class="form-control">
                                                    <? for ($i = 0; $i < 12; $i++) { ?>
                                                        <option value="<?= ($i * 5) ?>" <? if ($i == $row['time_m']){ ?>selected<? } ?>><?= sprintf("%02d", ($i * 5)) ?></option>
                                                    <? } ?>
                                                </select>
                                            </div>
                                        </div>
                                        <div class="col-md-12 form-group">
                                            <label for="" class="col-sm-2 control-label required_field"> 每週上課時數 </label>
                                            <div class="col-sm-2">
                                                <select name="course_hours" class="form-control">
                                                    <option value="30" <? if (30 == $row['course_hours']){ ?>selected<? } ?>>
                                                        30分鐘
                                                    </option>
                                                    <option value="45" <? if (45 == $row['course_hours']){ ?>selected<? } ?>>
                                                        45分鐘
                                                    </option>
                                                    <option value="60" <? if (60 == $row['course_hours']){ ?>selected<? } ?>>
                                                        60分鐘
                                                    </option>
                                                </select>
                                            </div>
                                        </div>
                                        <div class="col-md-12 form-group">
                                            <label for="" class="col-sm-2 control-label required_field"> 上課日期 </label>
                                            <div class="col-sm-4" id="LiDate">
                                                <? foreach ($rows_postjob_date as $index => $row_postjob_date) { ?>
                                                    <div style="margin-bottom:10px;">
                                                        <div>
                                                            <input name="date[]" type="text" class="form-control datetimepicker" value="<?= substr($row_postjob_date['date'], 0, -9) ?>" maxlength="10">
                                                        </div>
                                                        <div id="date<?= $index ?>Error" style="color:#F00; display:none;" class="error">
                                                            請選擇上課
                                                        </div>
                                                        <div id="date<?= $index ?>Error2" style="color:#F00; display:none;" class="error">
                                                            上課日期不能重複
                                                        </div>
                                                    </div>
                                                <? } ?>
                                            </div>
                                        </div>
                                        <div class="col-md-12 form-group">
                                            <label for="" class="col-sm-2 control-label required_field">
                                                <?= _lang('上課地區') ?>
                                            </label>
                                            <div class="col-sm-10">
                                                <select class="form-control" id="sel1" name="classlocation">
                                                    <option value="">-
                                                        <?= _lang('Please Select') ?>
                                                        -
                                                    </option>
                                                    <? foreach ($rows_area as $row_area) { ?>
                                                        <?
                                                        $sql           = "select * from master_type_code where typeid = ? and extra1 = ? and deleted = ?";
                                                        $parameters    = array('RESIDENCE_POSITIONCODE', $row_area['code'], 0);
                                                        $rows_position = bind_pdo($sql, $parameters, "selectall");
                                                        ?>
                                                        <optgroup label="<?= $row_area['name_' . get_langcode()] ?>">
                                                            <? foreach ($rows_position as $row_position) { ?>
                                                                <option value="<?= $row_position['id'] ?>" <? if ($row_position['id'] == $row['classlocation']){ ?>selected<? } ?>>
                                                                    <?= $row_position['name_' . get_langcode()] ?>
                                                                </option>
                                                            <? } ?>
                                                        </optgroup>
                                                    <? } ?>
                                                </select>
                                                <div style="color:#F00; display:none;" class="error" id="classlocationError">
                                                    請選擇上課地區
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-md-12 form-group">
                                            <label for="" class="col-sm-2 control-label required_field"> 上課地址 </label>
                                            <div class="col-sm-10">
                                                <input name="address_cn" type="text" class="form-control" style="display:inline-block;" value="<?= $row['address_cn'] ?>">
                                                <div id="addressError" style="color:#F00; display:none;" class="error">
                                                    <?= _lang('請輸入地址') ?>
                                                </div>
                                            </div>
                                        </div>

                                        <? if ($row_profile['profile_id'] == 1 || $row_profile['profile_id'] == 2) { ?>
                                            <div class="col-md-12 form-group">
                                                <label for="" class="col-sm-2 control-label required_field"> 上課地址<br>(管理員專用)
                                                </label>
                                                <div class="col-sm-10">
                                                    <input name="address_admin_cn" type="text" class="form-control" style="display:inline-block;" value="<?= $row['address_admin_cn'] ?>">
                                                    <div id="addressAdminError" style="color:#F00; display:none;" class="error">
                                                        <?= _lang('請輸入地址 (管理員專用)') ?>
                                                    </div>
                                                </div>
                                            </div>
                                        <? } ?>
                                        <div class="col-md-12 form-group">
                                            <label for="" class="col-sm-2 control-label required_field">
                                                每名學生全課程費用 </label>
                                            <div class="col-sm-4">
                                                <input name="fee" type="number" class="form-control" style="display:inline-block;" value="<?= $row['fee'] ?>" id="individual_fee">
                                                <div id="feeError" style="color:#F00; display:none;" class="error">
                                                    <?= _lang('請輸入每名學生全課程費用') ?>
                                                </div>
                                            </div>
                                        </div>

                                        <div class="col-md-12 form-group">
                                            <label for="" class="col-sm-2 control-label"> 導師預算收入 </label>
                                            <div class="col-sm-4">
                                                $<span id="class_total_amt_for_2"></span> (2人) /
                                                $<span id="class_total_amt_for_3"></span> (3人)
                                            </div>
                                        </div>

                                        <? if ($row_profile['profile_id'] == 1 || $row_profile['profile_id'] == 2) { ?>
                                            <div class="col-md-12 form-group">
                                                <label for="" class="col-sm-2 control-label required_field">已滿額</label>
                                                <div class="col-sm-10">
                                                    <input name="is_full" type="checkbox" style="display:inline-block;" value="1" <?= $row['is_full'] == 1 ? "checked" : "" ?>>
                                                </div>
                                            </div>
                                        <? } ?>

                                        <div class="col-md-12 form-group" style="color: #F00;">
                                            <label for="" class="col-sm-2 control-label">
                                                <?= lang("* Required Field") ?>
                                            </label>
                                        </div>

                                        <div class="col-xs-12 tc">
                                            <div class="btn-group">
                                                <?
                                                    $is_save = true;
                                                    if ($row['id']) {
                                                        $sql        = "select id from `order` where job_id = ? and deleted = ? and order_type = ?";
                                                        $parameters = array($row['id'], 0, "course");
                                                        $row_order  = bind_pdo($sql, $parameters, "selectone");
                                                        if ($row_order['id']) {
                                                            $is_save = false;
                                                        }
                                                    }
                                                ?>
                                                <? if ($is_save) { ?>
                                                    <button type="button" class="btn btn-primary" id="LiSaveBtn">
                                                        <i class="fa fa-floppy-o" aria-hidden="true"></i>
                                                        <?= _lang('Save') ?>
                                                    </button>

                                                    <?php if(!empty($row['id'])){ ?>
                                                        <button type="button" class="btn btn-danger" style="margin-left: 20px;" onclick="if (confirm('<?=lang('Confirm Delete?')?>')) {location.href='<?= $page_settings['domain'] ?>_process.php?action=delete&id=<?= $row['id'] ?>';}">
                                                            <i class="fa fa-trash" aria-hidden="true"></i>
                                                            <?= _lang('Delete') ?>
                                                        </button>

                                                    <?php } ?>
                                                <? } ?>
                                            </div>
                                        </div>

                                        <br><br><br><br><br>
                                        <!-- End Content -->
                                    </div>
                                    <!-- /.box-body -->
                                </div>
                                <!-- /.box -->
                            </div>
                            <!-- /.col -->
                        </div>
                        <!-- /.row -->
                    </form>

                </div>

            </div>
        </div>
    </div>
</div>
<? include('_footer.php') ?>
<script type="text/javascript" src="webadmin/js/moment.min.js"></script>
<script type="text/javascript" src="webadmin/js/jquery-ui-1.11.4/jquery-ui.min.js"></script>
<link rel="stylesheet" href="webadmin/js/jquery-ui-1.11.4/jquery-ui.min.css">
<script type="text/javascript" src="webadmin/js/jquery-ui-sliderAccess.js"></script>
<script type="text/javascript" src="webadmin/js/jquery-ui-timepicker-addon.js"></script>
<script type="text/javascript" src="webadmin/js/datepicker-zh-TW.js"></script><!-- 繁體中文 -->
<link type="text/css" href="webadmin/css/jquery-ui-timepicker-addon.css" rel="stylesheet"/>

<link rel="stylesheet" href="js/fancybox/jquery.fancybox.css?v=2.1.5" type="text/css" media="screen"/>
<script type="text/javascript" src="js/fancybox/jquery.fancybox.pack.js?v=2.1.5"></script>

<script type="text/javascript">
    function instrument_arrangement(num) {
        //console.log(num);
        if ($("#instrument_arrangement_" + num).prop("checked")) {
            $("#instrument_arrangement_" + num + "_container").show();
        } else {
            $("#instrument_arrangement_" + num + "_container").hide();
        }

    }

    $(function () {

        <?php
        if (!empty($row["instrument_arrangement_1"])) {
            echo 'instrument_arrangement(1);';
        }

        if (!empty($row["instrument_arrangement_2"])) {
            echo 'instrument_arrangement(2);';
        }
        ?>

        $("#instrument_arrangement_1, #instrument_arrangement_2").on("click change", function () {
            instrument_arrangement($(this).attr("data-value"))
        });


        $("._fancybox").fancybox({
            fitToView: false,
            width: '90%',
            height: '90%',
            autoSize: false,
            closeClick: false,
            openEffect: 'none',
            closeEffect: 'none'
        });

        var total = 2 * parseFloat($("#individual_fee").val());
        if (!isNaN(total)) {
            $("#class_total_amt_for_2").text(total);
        }

        var total = parseFloat($("#people_count").val()) * parseFloat($("#individual_fee").val());
        if (!isNaN(total)) {
            $("#class_total_amt_for_3").text(total);
        }
        //calculate class total amt
        $("#people_count, #individual_fee").on("keyup change", function () {

            var total = 2 * parseFloat($("#individual_fee").val());
            if (!isNaN(total)) {
                $("#class_total_amt_for_2").text(total);
            }

            var total = parseFloat($("#people_count").val()) * parseFloat($("#individual_fee").val());
            if (!isNaN(total)) {
                $("#class_total_amt_for_3").text(total);
            }
        });

        function change_date() {
            var mindate = moment(moment($("input[name='end_date']").val(), "YYYY-MM-DD"));
            var maxdate = moment(moment($("input[name='end_date']").val(), "YYYY-MM-DD").add(182, 'days').calendar()).format("YYYY-MM-DD");
            var week = new Array;
            $('input[name="week[]"]:checked').each(function (index, element) {
                week[index] = $(this).val();
            });
            if (mindate && maxdate) {
                var a = moment(moment($("input[name='end_date']").val()).add(182, 'days').calendar());
                var b = moment($("input[name='end_date']").val());
                var d = a.diff(b, 'days');
                var array = new Array();

                for (var i = 0; i <= d; i++) {
                    var v = moment(moment($("input[name='end_date']").val(), "YYYY-MM-DD").add(i, 'days').calendar()).format("YYYY-MM-DD");
                    if (v == 'Invalid date') {
                        v = b.format("YYYY-MM-DD");
                        var w = b.day();
                    } else {
                        var w = moment(moment($("input[name='end_date']").val(), "YYYY-MM-DD").add(i, 'days').calendar()).day();
                    }
                    var e = true;
                    for (var i2 = 0; i2 < week.length; i2++) {
                        if (Number(week[i2]) === Number(w)) {
                            e = false;
                        }
                    }
                    if (e == true) {
                        if (v == 'Invalid date') {
                            //console.log(b.format("YYYY-MM-DD"));
                            v = b.format("YYYY-MM-DD");
                        }
                        array[array.length] = v;
                    }
                }
                //var array = ["2016-11-03","2016-11-13","2016-11-23"];
                var opt2 = {
                    minDate: new Date(mindate),
                    maxDate: new Date(maxdate),
                    beforeShowDay: function (date) {
                        if ($.inArray($.datepicker.formatDate('yy-mm-dd', date), array) > -1) {
                            return [false, "", ""];
                        } else {
                            return [true, '', ""];
                        }
                    }
                }
                $("input[name='date[]']").datepicker("destroy");
                $("input[name='date[]']").datepicker(opt2);
            }
        }

        function end_date() {
            var mindate = new Date(moment(moment($("input[name='start_date']").val(), "YYYY-MM-DD").add(7, 'days').calendar()));
            var maxdate = new Date(moment(moment($("input[name='start_date']").val(), "YYYY-MM-DD").add(28, 'days').calendar()));
            var opt = {
                minDate: mindate,
                maxDate: maxdate
            }
            $("input[name='end_date']").datetimepicker("destroy");
            $("input[name='end_date']").datetimepicker(opt).on('change', function () {
                change_date();
            });
        }

        if ($("input[name='end_date']").val()) {
            end_date();
            change_date();
        }
        $('input[name="week[]"]').click(
            function () {
                change_date();
            }
        );
        $('textarea[name="detail_cn"]').keydown(
            function () {
                if ($(this).val().length >= 600) {
                    return false;
                }
            }
        );
        var opt = {
            minDate: new Date(<?=date('Y,m,d', mktime(0, 0, 0, date("m") - 1, date("d"), date("Y")))?>),
            beforeShowDay: function (date) {
                //console.log(date);
                var highlight = '';
                if (highlight) {
                    return [true, "event", highlight];
                } else {
                    return [true, '', ''];
                }
            }
        }
        $("input[name='start_date']").datetimepicker(opt).on('change', function (ev) {
            end_date();
        });
        $('select[name="course_count"]').change(
            function () {
                var code = '<div><input name="date[]" type="text" class="form-control datetimepicker" value=""></div>';
                var html = '';
                for (var i = 0; i < $(this).val(); i++) {
                    html += '<div style="margin-bottom:10px;">' + code + '<div id="date' + i + 'Error" style="color:#F00; display:none;" class="error">請選擇上課日期</div><div id="date' + i + 'Error2" style="color:#F00; display:none;" class="error">上課日期不能重複</div></div>';
                }
                $('#LiDate').html(html);
                change_date();
            }
        );
        <? if(!$row['id']){?>
        $('select[name="course_count"]').change();
        <? }?>
        /**/
        $("#LiSaveBtn").click(
            function () {
                var error = false;
                var thisform = $("#myform");
                var focus_array = new Array();
                $('.error').hide();
                <?php if($_SESSION["cmsrole"] == "supler_admin" || $_SESSION["cmsrole"] == "admin"){ ?>
                if (!$('select[name="tutormain_id"]', thisform).val()) {
                    $("#studentmainidError").show();
                    focus_array[focus_array.length] = $('select[name="tutormain_id"]', thisform);
                    error = true;
                    console.log("tutormain_id");
                }
                <?php } ?>
                if (!$('input[name="start_date"]', thisform).val()) {
                    $("#startdateError").show();
                    focus_array[focus_array.length] = $('input[name="start_date"]', thisform);
                    error = true;
                    console.log("start_date");
                }
                if (!$('input[name="end_date"]', thisform).val()) {
                    $("#enddateError").show();
                    focus_array[focus_array.length] = $('input[name="end_date"]', thisform);
                    error = true;
                    console.log("end_date");
                }
                if (!$('select[name="mas_instrument"]', thisform).val()) {
                    $("#instrumentError").show();
                    focus_array[focus_array.length] = $('select[name="mas_instrument"]', thisform);
                    error = true;
                    console.log("mas_instrument");
                }
                if (!$('select[name="level"]', thisform).val()) {
                    $("#levelError").show();
                    focus_array[focus_array.length] = $('select[name="level"]', thisform);
                    error = true;
                    console.log("level");
                }
                if (!$('select[name="student_age"]', thisform).val()) {
                    $("#student_age_Error").show();
                    focus_array[focus_array.length] = $('select[name="student_age"]', thisform);
                    error = true;
                    console.log("student_age");
                }

                var has_image = false;
                $(".base64_img").each(function () {
                    if ($(this).val()) {
                        has_image = true;
                    }
                });

                if (!has_image && $(".existed_image").length <= 0) {
                    $("#upload_photo_Error").show();
                    focus_array[focus_array.length] = $('#inputImage_1', thisform);
                    error = true;
                    console.log("upload_photo");
                }

                if ($(".instrument_arrangement:checked").length <= 0) {
                    $("#instrument_arrangement_Error").show();
                    focus_array[focus_array.length] = $('input[name="instrument_arrangement_1"]', thisform);
                    error = true;
                    console.log("instrument_arrangement");
                } else {
                    if ($("#instrument_arrangement_1").prop("checked")) {
                        //check deposit 1
                        if (!$('input[name="instrument_deposit_1"]', thisform).val()) {
                            $("#instrument_deposit_1_Error").show();
                            focus_array[focus_array.length] = $('input[name="instrument_deposit_1"]', thisform);
                            error = true;
                            console.log("instrument_deposit_1");
                        } else {
                            if (parseFloat($('input[name="instrument_deposit_1"]', thisform).val()) <= 0) {
                                $("#instrument_deposit_1_Error2").show();
                                focus_array[focus_array.length] = $('input[name="instrument_deposit_1"]', thisform);
                                error = true;
                                console.log("instrument_deposit_1");
                            }
                        }
                    }

                    if ($("#instrument_arrangement_2").prop("checked")) {
                        //check deposit 2
                        if (!$('input[name="instrument_deposit_2"]', thisform).val()) {
                            $("#instrument_deposit_2_Error").show();
                            focus_array[focus_array.length] = $('input[name="instrument_deposit_2"]', thisform);
                            error = true;
                            console.log("instrument_deposit_2");
                        } else {
                            if (parseFloat($('input[name="instrument_deposit_2"]', thisform).val()) <= 0) {
                                $("#instrument_deposit_2_Error2").show();
                                focus_array[focus_array.length] = $('input[name="instrument_deposit_2"]', thisform);
                                error = true;
                                console.log("instrument_deposit_2");
                            }
                        }

                        //check rent fee
                        if (!$('input[name="instrument_rent_fee_2"]', thisform).val()) {
                            $("#instrument_rent_fee_2_Error").show();
                            focus_array[focus_array.length] = $('input[name="instrument_rent_fee_2"]', thisform);
                            error = true;
                            console.log("instrument_rent_fee_2");
                        } else {
                            if (parseFloat($('input[name="instrument_rent_fee_2"]', thisform).val()) <= 0) {
                                $("#instrument_rent_fee_2_Error2").show();
                                focus_array[focus_array.length] = $('input[name="instrument_rent_fee_2"]', thisform);
                                error = true;
                                console.log("instrument_rent_fee2");
                            }
                        }


                    }
                }

                /*if (!$('select[name="instrument_arrangement"]', thisform).val()) {
                 $("#instrument_arrangement_Error").show();
                 focus_array[focus_array.length] = $('select[name="instrument_arrangement"]', thisform);
                 error = true;
                 console.log("instrument_arrangement");
                 }else{
                 if($('select[name="instrument_arrangement"]', thisform).val() == "2"){
                 if (!$('input[name="instrument_rent_fee"]', thisform).val()) {
                 $("#instrument_rent_fee_Error").show();
                 focus_array[focus_array.length] = $('input[name="instrument_rent_fee"]', thisform);
                 error = true;
                 console.log("instrument_rent_fee");
                 }else{
                 if(isNaN($('input[name="instrument_rent_fee"]', thisform).val())){
                 $("#instrument_rent_fee_Error2").show();
                 focus_array[focus_array.length] = $('input[name="instrument_rent_fee"]', thisform);
                 error = true;
                 console.log("instrument_rent_fee2");
                 }
                 }
                 }

                 if($('select[name="instrument_arrangement"]', thisform).val() == "1" || $('select[name="instrument_arrangement"]', thisform).val() == "2"){
                 if (!$('input[name="instrument_deposit"]', thisform).val()) {
                 $("#instrument_deposit_Error").show();
                 focus_array[focus_array.length] = $('input[name="instrument_deposit"]', thisform);
                 error = true;
                 console.log("instrument_deposit");
                 }else{
                 if(isNaN($('input[name="instrument_deposit"]', thisform).val())){
                 $("#instrument_deposit_Error2").show();
                 focus_array[focus_array.length] = $('input[name="instrument_deposit"]', thisform);
                 error = true;
                 console.log("instrument_deposit2");
                 }
                 }
                 }
                 }*/

                if (Number($('select[name="reserved_people_count"]', thisform).val()) >= Number($('select[name="people_count"]', thisform).val())) {
                    $("#reservedPeopleError").show();
                    focus_array[focus_array.length] = $('select[name="reserved_people_count"]', thisform);
                    error = true;
                    console.log("reserved_people_count");
                }

                var selected_date = [];

                $('input[name="date[]"]', thisform).each(
                    function (index) {
                        if (!$(this).val()) {
                            $("#date" + index + "Error").show();
                            focus_array[focus_array.length] = $(this);
                            error = true;
                            console.log("date");
                        } else {
                            selected_date.push($(this).val());

                            var count_duplicate = 0;
                            for (var i = 0; i < selected_date.length; i++) {
                                if (selected_date[i] === $(this).val()) {
                                    count_duplicate++;
                                }
                            }

                            if (count_duplicate > 1) {
                                $("#date" + index + "Error2").show();
                                focus_array[focus_array.length] = $(this);
                                error = true;
                                console.log("date2");
                            }
                        }
                    }
                );
                if ($('input[name="week[]"]:checked').size() == 0) {
                    $("#weekError").show();
                    focus_array[focus_array.length] = $('.tab-pane.active .areabox').eq(0);
                    error = true;
                    console.log("week");
                }
                <?php if ($row_profile['profile_id'] == 1 || $row_profile['profile_id'] == 2) { ?>
                if (!$('input[name="address_admin_cn"]', thisform).val()) {
                    $("#addressAdminError").show();
                    focus_array[focus_array.length] = $('.tab-pane.active .areabox').eq(0);
                    error = true;
                    console.log("address_admin_cn");
                }
                <?php } ?>
                if (!$('input[name="address_cn"]', thisform).val()) {
                    $("#addressError").show();
                    focus_array[focus_array.length] = $('.tab-pane.active .areabox').eq(0);
                    error = true;
                    console.log("address_cn");
                }
                if (!$('select[name="classlocation"]', thisform).val()) {
                    $("#classlocationError").show();
                    focus_array[focus_array.length] = $('.tab-pane.active .areabox').eq(0);
                    error = true;
                    console.log("classlocation");
                }
                if (!$('input[name="fee"]', thisform).val()) {
                    $("#feeError").show();
                    focus_array[focus_array.length] = $('.tab-pane.active .areabox').eq(0);
                    error = true;
                    console.log("fee");
                }
                //console.log(error);
                console.log(focus_array);
                if (!error) {
                    thisform.submit();
                    //return true;
                } else {
                    //focus_array[0].focus();
                    //console.log(focus_array[0]);
                    //console.log(focus_array[0].offset());
                    if (focus_array[0]) {
                        $('html, body').animate({
                            scrollTop: focus_array[0].offset().top - 200
                        }, 500);
                    }
                    return false;
                }
            }
        );

    });
</script>

<!-- crop image -->
<link href="js/cropper/cropper.css" rel="stylesheet">
<script src="js/cropper/cropper.js"></script>

<script type="text/javascript">
    $(function () {
        var $image = $('#image');

        $(".crop_image").on("click", function () {
            var canvas = $image.cropper('getCroppedCanvas');
            var photo = canvas.toDataURL('image/jpeg');

            $(this).closest(".crop_image_container").find("#cropped_img").attr("src", photo);
            $(this).closest(".crop_image_container").find("#base64_img").attr("value", photo);
            $(this).closest(".crop_image_container").find("#cropped_img_container").show();
            $(this).closest(".crop_image_container").find(".ori_image").hide();

            $("#image_container").hide();
            //console.log(photo);
        });

        var options = {
            aspectRatio: 250 / 270,
            autoCropArea: 0,
            strict: false,
            guides: false,
            highlight: false,
            dragCrop: false,
            cropBoxMovable: true,
            cropBoxResizable: false,
            built: function () {
                // Width and Height params are number types instead of string
                $image.cropper("setCropBoxData", {width: 400, height: 432});
            }
            /*crop: function (e) {

             }*/
        };

        // Cropper
        $image.on({
            'build.cropper': function (e) {
                //console.log(e.type);
            },
            'built.cropper': function (e) {
                //console.log(e.type);
            },
            'cropstart.cropper': function (e) {
                //console.log(e.type, e.action);
            },
            'cropmove.cropper': function (e) {
                //console.log(e.type, e.action);
            },
            'cropend.cropper': function (e) {
                //console.log(e.type, e.action);
            },
            'crop.cropper': function (e) {
                //console.log(e.type, e.x, e.y, e.width, e.height, e.rotate, e.scaleX, e.scaleY);
            },
            'zoom.cropper': function (e) {
                //console.log(e.type, e.ratio);
            }
        }).cropper(options);

        for (var i = 1; i <= 6; i++) {
            $("#inputImage_" + i).on("change", function () {
                $("#image_container").show();
                location.href = "#image_container";
            });

            // Import image
            crop_function($("#inputImage_" + i), $image);
        }
    });

    function crop_function(_this, $image) {
        var $inputImage = _this;
        var URL = window.URL || window.webkitURL;
        var blobURL;

        if (URL) {
            $inputImage.change(function () {
                var files = this.files;
                var file;

                if (!$image.data('cropper')) {
                    return;
                }

                if (files && files.length) {
                    file = files[0];

                    if (/^image\/\w+$/.test(file.type)) {

                        var img = new Image();
                        img.src = window.URL.createObjectURL(file);
                        img.onload = function () {
                            if (parseInt(img.width) > 1500 || parseInt(img.height) > 1500) {
                                //window.alert('The resolution of image is too large. Please resize your image file under 1024px X 1024px.');
                                alert('圖片解析度過高，請將圖片縮放至少於1500px X 1500px。');
                                $image.cropper('reset');
                                $inputImage.val('');
                            } else {
                                $("#image_container").css("height", "500px");

                                blobURL = URL.createObjectURL(file);
                                $image.one('built.cropper', function () {

                                    // Revoke when load complete
                                    URL.revokeObjectURL(blobURL);
                                }).cropper('reset').cropper('replace', blobURL);
                                $inputImage.val('');
                            }
                        }
                    } else {
                        alert('請選擇圖片上傳。');
                    }
                }
            });
        } else {
            $inputImage.prop('disabled', true).parent().addClass('disabled');
        }
    }
</script>
</body>
</html>