Thank you Matt for help. I’ve customized 'adapt-contrib-media' component.

I've dropped the code and explained changes

 On line no 158 setupEventListeners function, checked ‘play’ instead of 'inview' for viewport assign.       

            //if (this.completionEvent === 'inview') 

            if (this.completionEvent === 'play') {

                this.$('.component-widget').on('inview', _.bind(this.inview, this));

            }

 And on line 241 inview function checked video is in viewport if no then call onMediaElementClick() function for video pause and for video play call onOverlayClick() function.

 inview: function(event, visible, visiblePartX, visiblePartY) {

            if (visible) {

                if (visiblePartY === 'top') {

                    this._isVisibleTop = true;

                } else if (visiblePartY === 'bottom') {

                    this._isVisibleBottom = true;

                } else {

                    this._isVisibleTop = true;

                    this._isVisibleBottom = true;

                }

                if (this._isVisibleTop && this._isVisibleBottom) {

                    this.$('.component-inner').off('inview');

                    this.setCompletionStatus();

                }

                this.onOverlayClick(); //play video

            }else{

                this.onMediaElementClick(); // pause video

            }

        },