public function showJS($options = null, $options_compat = array())
    {
        if (!empty($options_compat)) {
            $options = $options_compat;
        }

        $loader_js = $this->url ?
            $this->js()->atk4_load(array($this->url)) : $options['open_js'] ?: null;

        $this->js(true)->dialog(array_extend(array(
            'modal' => true,
            'dialogClass' => ($options['class'] ?: 'atk-popover').$this->pop_class.
                            ' atk-popover-'.($options['tip'] ?: 'top-center'),
            'dragable' => false,
            'resizable' => false,
            'minHeight' => 'auto',
            'autoOpen' => false,
            'width' => 250,
            'open' => $this->js(null, array(
                $this->js()->_selector('.ui-dialog-titlebar:last')->hide(),
                $loader_js,
            ))->click(
                $this->js()->dialog('close')->_enclose()
            )->_selector('.ui-widget-overlay:last')->_enclose()->css('opacity', '0'),

        ), $options))->parent()->append('<div class="atk-popover-arrow"></div>')
        ;

        return $this->js()->dialog('open')->dialog('option', array(
            'position' => $p = array(
                'my' => $options['my'] ?: 'center top',
                'at' => $options['at'] ?: 'center bottom+8',
                'of' => $this->js()->_selectorThis(),
                //'using'=>$this->js(
                //    null,
                //    'function(position,data){ $( this ).css( position ); console.log("Position: ",data); '.
                //    'var rev={vertical:"horizontal",horizontal:"vertical"}; '.
                //    '$(this).find(".arrow").addClass(rev[data.important]+" "+data.vertical+" "+data.horizontal);}'
                //)
            ),
        ));
    }