<?php
$pushed = intval($item['push']) === 1 ? 'checked' : '';
?>
<script src="//cdn.rawgit.com/Eonasdan/bootstrap-datetimepicker/a549aa8780dbda16f6cff545aeabc3d71073911e/src/js/bootstrap-datetimepicker.js"></script>

<link href="//cdn.rawgit.com/Eonasdan/bootstrap-datetimepicker/a549aa8780dbda16f6cff545aeabc3d71073911e/build/css/bootstrap-datetimepicker.css" rel="stylesheet" />

<link href="//onesignal.github.io/emoji-picker/lib/css/emoji.css" rel="stylesheet" />
<script src="//onesignal.github.io/emoji-picker/lib/js/config.js"></script>
<script src="//onesignal.github.io/emoji-picker/lib/js/util.js"></script>
<script src="//onesignal.github.io/emoji-picker/lib/js/jquery.emojiarea.js"></script>
<script src="//onesignal.github.io/emoji-picker/lib/js/emoji-picker.js"></script>

<style>
    .lead.emoji-picker-container {
        width: 300px;
        display: block;
    }

    .emoji-wysiwyg-editor {
        min-height: 200px;
        padding: 10px 20px;
        outline: none;
        background: #fff;
    }
</style>

<h3 class="text-left">修改即時訊息</h3>

<ul class="table-toolbar" style="text-align: left;">
    <li><a class="toolbar-element btn btn-default btn-create" href="/messaging"><i class="fa fa-chevron-left" style="margin-right: 8px;"></i>返回</a></li>
</ul>

<?php echo form_open('/messaging/save', array("class" => "form-horizontal form-container")); ?>

<div class="form-group">
    <label for="title" class="col-sm-4 control-label">標題 (非必填)</label>
    <div class="col-sm-8">
        <input type="text" name="title" id="title" value="<?php echo $item['title'] ?>" />
    </div>
</div>
<div class="form-group">
    <label for="content" class="col-sm-4 control-label">內容</label>
    <div class="col-sm-8">
        <textarea id='content' name='content' rows='5' cols='70' style="width: 100%" data-emoji-input="unicode" data-emojiable="true"><?php echo $item['content'] ?></textarea>
    </div>
</div>
<div class="form-group">
    <label for="issuedt" class="col-sm-4 control-label">發佈日期</label>
    <div class="col-sm-8">
        <div class='input-group date' id='datetimepicker1'>
            <input id="issuedt" type='text' class="form-control" value="<?php echo $item['issued_date'] . ' ' . $item['issued_time'] ?>" />
            <span class="input-group-addon">
                <span class="glyphicon glyphicon-calendar"></span>
            </span>
        </div>
    </div>
</div>
<div class="form-group">
    <label for="published" class="col-sm-4 control-label">發佈狀態</label>
    <div class="col-sm-8">
        <label class="mas-text"><span class="text block" name="published"><?php echo $item['published'] >= 1 ? '已發佈' : '未發佈'; ?></span></label>
    </div>
</div>
<input type='hidden' name="push" id="push" value="1" />
<ul style="list-style: none;">
    <li><i>* 若要重覆執行推播，必須另外創建。</i></li>
    <li><i>* 發佈狀態為「未發佈 / 已發佈」，而且不能修改。</i></li>
    <li><i>* 發佈狀態為「已發佈」後，不能再進行推播。</i></li>
</ul>
<div class="form-group">
    <div class="">
        <button type='button' class="submit btn btn-success">儲存</button>
        <a href="/messaging" class="btn btn-cancel">取消</a>
    </div>
</div>

<?php echo form_close(); ?>


<script>
    $(document).ready(function() {
        $('#datetimepicker1').datetimepicker({
            format: 'YYYY-MM-DD HH:mm'
        });

        // Initializes and creates emoji set from sprite sheet
        window.emojiPicker = new EmojiPicker({
            emojiable_selector: '[data-emojiable=true]',
            assetsPath: 'http://onesignal.github.io/emoji-picker/lib/img/',
            popupButtonClasses: 'fa fa-smile-o'
        });
        // Finds all elements with `emojiable_selector` and converts them to rich emoji input fields
        // You may want to delay this step if you have dynamically created input fields that appear later in the loading process
        // It can be called as many times as necessary; previously converted input fields will not be converted again
        window.emojiPicker.discover();
    });

    $('.submit').on('click', function() {
        if (validform()) {
            $('.submit').attr('disabled', true);
            $.ajax({
                url: '/messaging/save',
                method: 'post',
                data: {
                    'title': $('#title').val().trim(),
                    'content': $('#content').val().trim(),
                    'issued_date': $('#issuedt').val().split(' ')[0].trim(),
                    'issued_time': $('#issuedt').val().split(' ')[1].trim(),
                    'mode': 'u',
                    'id': '<?php echo $item['id'] ?>'
                },
                dataType: 'json',
                success: function(response) {
                    if (response !== null) {
                        alert('儲存成功');
                        history.go(-1);
                    }
                }
            });
        }
        return false;
    });

    function validform() {
        var valid = true;
        var msg = '';
        if ($('#content').val() === '') {
            valid = false;
            msg += " Please input content!\n";
        }
        if ($('#issuedt').val() === '') {
            valid = false;
            msg += "Please input an issue datetime!\n";
        }
        if (msg !== '') alert(msg);
        return valid;
    }
</script>