javascriptのajax通信時の条件分岐

Question

Rails でLINEの様なメッセージアプリを使っています。
メッセージ受信時に
①もし一番下にスクロールバーがあるなら、下にスクロールしたい
②一番下でないなら、メッセージを受信しましたという信号(LINEの様な感じ)をユーザーに送りたい
と考えています。

// スクロールさせる要素を取得
var elm = document.getElementById('scrollElement');

// 要素の表示領域を取得
var height = elm.offsetHeight;

// スクロールイベントを定義
elm.onscroll = function() {
    // 要素のスクロール分を含めた高さを取得
    var scrollHeight = elm.scrollHeight;

    // 要素のスクロール位置を取得
    var scrollTop = elm.scrollTop;

    // 現在の表示位置の高さ 
    var scrollPosition = height + scrollTop;

    // どれだけ近づいたかを判断する値
    // 0に近いほど、スクロールの最終が近い
    var proximity = 0;

    if ((scrollHeight - scrollPosition) / scrollHeight <= proximity) {
        スクロール処理
    }
}

このif文をajax受信時に入れたのですが、どの位置でもスクロールされてしまいます。
ajax受信時に、条件分岐させるにはどの様にしたら良いのでしょうか？

ユーザーへのメッセージ受信の信号については、まだ全く分かりません。
分かれば教えて頂けると助かります。
下手な質問かもしれませんが、よろしくお願いします。

Comments

[Lhankor_Mhy]

スクロールイベントにハンドラを設定しているのは、どのような意図ですか？

個人的には、
通信終了→スクロール位置を検出→分岐してスクロールor通知表示
という処理になり、スクロールイベントが不要のように感じます。

Answer 1

以下の計算式がおかしいです。
その計算式では、scrollHeightからoffsetHeightを引いて更に、scrollTopを引くことになってしまいます。それでは、ほとんどの場合において、マイナスになってしまうでしょう。

    if ((scrollHeight - scrollPosition) / scrollHeight <= proximity) {
        スクロール処理
    }

本来、スクロールが一番下に来ているかどうかを判定したい場合、「scrollHeight - scrollTop」
思い浮かびますが、scrollTopはscrollHeightと同じになることがありません。

何故なら、スクロールを含めた高さが2000、画面で表示している範囲が1500-2000の部分の場合、scrollTopは1500を示すからです。ならば、画面で表示している高さを更に引いてあげればいいことに気づくでしょう。

つまり、スクロールが最も下の位置に来ているかは以下の式で判定できます。

    if ((elm.scrollHeight - elm.scrollTop - elm.clientHeight) <= 0) {
        // スクロール処理
    }