当サイトはアフィリエイト広告を利用してます

営業時間外を表示するjavascript

ホームページやウェブサービスは24時間動いていますが、問い合わせフォームなどからメッセージが来た場合の対応は自社の営業時間内になるケースが多いでしょう。そのような場合に役立つプログラムを作成しました。

営業時間外を明示する

営業時間外に対応するのは一見良さそうですが、社員に過度な負担をかけることにもなるため、弊社では時間外対応を基本的に行わないことにしています。

しかし一方で、問い合わせを送る側からすれば、なるべく早く対応してもらえると嬉しいですね。即対応でない場合に、いつ頃になるのか？が分かっていると大分違うだろう、と考えました。

なので、会社ホームページの問い合わせフォームのすぐ上に、時間外メッセージを表示するようにしました。

営業時間外にメッセージ

以下のように、営業開始前、営業中、営業終了後、休業日のメッセージをそれぞれ設定できるようにしました。

<!-- This file is using the UTF-8 encoding. -->
<!-- コピーするコード ここから↓↓ -->
<span id="calculatorjpBusinessHour"></span>
<script>
<!--
Copyright 2019 Fumito MIZUNO

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
-->
    // デバッグのとき、日時指定する。
    //var debugTime = '2019-03-21T14:24:00';

    // 表示する文言を指定する。
    var beforeMessage = '営業開始は10時です。問い合わせへの回答は10時～となります。';
    var openMessage = '';
    var closedMessage = '本日の営業は終了しました。問い合わせへの回答は、翌営業日以降になります。';
    var holidayMessage = '本日は休業日です。問い合わせへの回答は、翌営業日以降になります。';

    // 営業時間を指定する。例: 9:30
    var openTime = '10:00';
    var closeTime = '18:00';

    // 営業日を指定する。例: 月火水木金
    var businessDay = '月火水木金';

    // 祝日を指定する。
    //var holidayList = {} // 祝日が休みでない場合は空にする
    var holidayList = {
    "2024/1/1":"元日",
    "2024/1/8":"成人の日",
    "2024/2/11":"建国記念の日",
    "2024/2/12":"休日",
    "2024/2/23":"天皇誕生日",
    "2024/3/20":"春分の日",
    "2024/4/29":"昭和の日",
    "2024/5/3":"憲法記念日",
    "2024/5/4":"みどりの日",
    "2024/5/5":"こどもの日",
    "2024/5/6":"休日",
    "2024/7/15":"海の日",
    "2024/8/11":"山の日",
    "2024/8/12":"休日",
    "2024/9/16":"敬老の日",
    "2024/9/22":"秋分の日",
    "2024/9/23":"休日",
    "2024/10/14":"スポーツの日",
    "2024/11/3":"文化の日",
    "2024/11/4":"休日",
    "2024/11/23":"勤労感謝の日"
    }
</script>
<script>
    // デバッグ時にdebugTimeが指定可能
    if(typeof debugTime != "undefined"){
        var now = new Date(debugTime);
    }else{
        var now = new Date();
    }
    function isHoliday(now, businessDay, holidayList){
        var holidayFlag = false;

        // 営業日に入っていない曜日は休みと判定する
        if(typeof businessDay == "undefined"){
            console.log("businessDay: invalid");
        } else {
            var weekValue = now.getDay();
            switch (weekValue) {
                case 0:
                    if (businessDay.indexOf('日') == -1) {
                        holidayFlag = true;
                    }
                    break;
                case 1:
                    if (businessDay.indexOf('月') == -1) {
                        holidayFlag = true;
                    }
                    break;
                case 2:
                    if (businessDay.indexOf('火') == -1) {
                        holidayFlag = true;
                    }
                    break;
                case 3:
                    if (businessDay.indexOf('水') == -1) {
                        holidayFlag = true;
                    }
                    break;
                case 4:
                    if (businessDay.indexOf('木') == -1) {
                        holidayFlag = true;
                    }
                    break;
                case 5:
                    if (businessDay.indexOf('金') == -1) {
                        holidayFlag = true;
                    }
                    break;
                case 6:
                    if (businessDay.indexOf('土') == -1) {
                        holidayFlag = true;
                    }
            }
        }

        // 祝日に記載されていれば休みと判定する
        // 2019-1-1 または 2019/1/1
        var day_slash = now.toLocaleDateString('ja-JP',options);
        var day_hyphen = day_slash.replace('/','-').replace('/','-'); // /を-に置き換える。2つ出てくるので、2回処理する
        var options = { year: 'numeric', month: '2-digit', day: '2-digit' }
        // 2019-01-01 または 2019/01/01
        var day_slash_2 = now.toLocaleDateString('ja-JP',options);
        var day_hyphen_2 = day_slash_2.replace('/','-').replace('/','-'); // /を-に置き換える。2つ出てくるので、2回処理する
        if(typeof holidayList == "undefined"){
            console.log("holidayList: invalid");
        } else if (holidayList[day_slash] || holidayList[day_hyphen] || holidayList[day_slash_2] || holidayList[day_hyphen_2]) {
            holidayFlag = true;
        }
        return holidayFlag;
    }

    function str2Min(str) {
        var minutes = 0;
        var strs = str.split(':');
        minutes += parseInt(strs[0]) * 60;
        if (strs[1]) {
            minutes += parseInt(strs[1]);
        } else {
            console.log("str2Min: maybe invalid");
        }
        return minutes;
    }

    //メインの処理
    var output = '';
    if (isHoliday(now, businessDay, holidayList)) {
        output = holidayMessage;
    } else {
        var nowMinutes = str2Min(now.getHours() + ':' + now.getMinutes());
        var openMinutes = str2Min(openTime);
        var closeMinutes = str2Min(closeTime);
        if(nowMinutes < openMinutes) {
            output = beforeMessage;
        } else if (nowMinutes <= closeMinutes) {
            output = openMessage;
        } else {
            output = closedMessage;
        }
    }
    document.getElementById("calculatorjpBusinessHour").innerText = output;
</script>
<!-- コピーするコード ここまで↑↑ -->