[CB]Редактировать размеры диалога добавления закладок звёздочки

bunda1 · №1

Редактировать размеры поля выбора вкладок в диалоге добавления закладки звёздочки( Firefox45+ )
Автор: bunda1, turbot
Версия: от 28.03.2016.
Описание: код автоматически раскрывает поле выбора вкладок после того как открылся диалог добавления закладки звёздочки и даёт возможность перетягиванием правого уголка поля выбора вкладок редактировать его размеры в диалоге добавления закладки звёздочки. Дополнительно код добавляет в диалог добавления закладки звёздочки текстовое поле для редактирования адреса, текстовое поле краткого имени и чекбокс загрузки закладки в боковой панели.

Скриншот:

Использование: положите код в любую Custom Buttons кнопку, в инициализацию. Не обязательно создавать новую CB кнопку, можно использовать уже существующую.

Выделить код

Код:

// Редактировать размеры поля выбора вкладок в окне добавления закладки звёздочки, от 28.03.2016. .............
((h, w)=> {
   cbu.isPref(h, 150); cbu.isPref(w, 150);

   addEventListener('popupshowing', (e, el = e.target)=> {
      if (el !== StarUI.panel) return;

      var tree = document.getElementById('editBMPanel_folderTree');
      tree.height = cbu.getPrefs(h); tree.width = cbu.getPrefs(w);
      setTimeout(()=> gEditItemOverlay.toggleFolderTreeVisibility(), 0);
   
      el.addEventListener('popuphidden', function c() {
         el.removeEventListener('popuphidden', c);           
         cbu.setPrefs(h, tree.height); cbu.setPrefs(w, tree.width);
      });   
   });

   var uri = makeURI('data:text/css,'+ encodeURIComponent('\
      #editBMPanel_folderTree { resize: both !important; overflow: hidden !important; }\
      #editBMPanel_folderTree > stack > treerows > scrollbar { display: none !important; }\
      #editBMPanel_locationRow, #editBMPanel_keywordRow, #editBMPanel_loadInSidebarCheckbox { visibility: visible !important; }\
   '));
   var sss = Cc["@mozilla.org/content/style-sheet-service;1"].getService(Ci.nsIStyleSheetService);
   sss.loadAndRegisterSheet(uri, 0);
   
   addDestructor(reason => {
      sss.unregisterSheet(uri, 0); 
      if (reason == "delete") cbu.clearPrefs(h), cbu.clearPrefs(w);
   }); 
})('CB.treeHeight', 'CB.treeWidth');

turbot · №2

bunda1
Может, стоит еще и скроллбар убрать у #editBMPanel_folderTree

Выделить код

Код:

tree.setAttribute('hidevscroll', "true");

, так как он все равно не работает (не прокрутка вообще, а именно полоса прокрутки) с этим стилем. Что с overflow: auto, что с hidden. Черт знает, почему.

Отредактировано turbot (17-03-2016 22:53:20)

bunda1 · №3

turbot пишет

bunda1
Может, стоит еще и скроллбар убрать, так как он все равно не работает (не прокрутка вообще, а именно полоса прокрутки)

И правда скроллбар не работает. Я изменил код так как ты предложил, спасибо.

voqabuhe · №4

bunda1
Что-то скрин не грузится.

bunda1 · №5

voqabuhe пишет

bunda1
Что-то скрин не грузится.

У меня вроде грузится

turbot · №6

bunda1

Выделить код

Код:

document.getElementById('editBMPanel_foldersExpander').click();

Приводит к тому, что при открытии #editBMPanel_folderMenuList дерево схлопывается/расхлопывается при повторном открытии.
А если

Выделить код

Код:

document.getElementById('editBMPanel_folderTreeRow').removeAttribute('collapsed');

- то после перезапуска браузера, при первом открытии, дерево пустое открывается. :rolleyes:

voqabuhe · №7

bunda1 пишет

У меня вроде грузится

Странно
Down For Everyone Or Just Me -> Check if your website is down or up?

It's not just you! http://i75.fastpic.ru looks down from here.
Check another site?

Dumby · №8

turbot пишет

Приводит к тому

Ну разумеется, если в обоих listener'ах не проверять,
что открывается/закрывается именно #editBookmarkPanel,
то ещё и не таких глюков обретёшь.

turbot · №9

Выделить код

Код:

if (e.target == document.getElementById('editBookmarkPanel')) gEditItemOverlay.toggleFolderTreeVisibility();

? :rolleyes: Закрытие, вроде, не мешает.

_{А я думал, что если листенер итак на нее повешен, то и уточнять не надо. Эх, видать все-таки пора уже собрать волю, да поизучать теорию, а не продолжать тыкаться наугад.}

Отредактировано turbot (18-03-2016 02:33:01)

Dumby · №10

turbot пишет

Закрытие, вроде, не мешает

Не мешает чему?

скрытый текст

Код сделан так, что если, например, открылась #editBookmarkPanel,
то регистрируется новый listener на событие popuphidden ваще для окна браузера.

То есть, если после этого в окне браузера, например, навести мышь на что-либо,
имеющее tooltip (а tooltip есть даже, у #editBMPanel_foldersExpander),

то если tooltip появится, значит tooltip неизбежно закроется, и listener
добросовестно сработает по popuphidden, запишет width-height, и удалит себя сам.

После этого такого случая уже не сработает никакой cbu.setPrefs, ведь listener удалён.
Сколько не не делай ресайз, атрибуты теперь не будут сохраняться до нового popupshown'а.

Так что решай сам, мешает закрытие или не мешает.

bunda1 · №11

Dumby прав насчёт второго обработчика, я это исправил в коде. Спасибо.

turbot · №12

Dumby
Понятно, спасибо.

bunda1
А это не поправите?
И может, заодно, туда и

Выделить код

Код:

document.getElementById('editBMPanel_locationRow').removeAttribute('collapsed');

впиндюрить?

bunda1 · №13

turbot пишет

А это не поправите?
И может, заодно, туда и
Выделить код
Код:
document.getElementById('editBMPanel_locationRow').removeAttribute('collapsed');
впиндюрить?

Вроде разобрался с обработчиками и проблема про которую ты писал исчезла: Вчера 22:06:12 без removeAttribute('collapsed')

turbot · №14

bunda1
У меня в нынешнем виде кнопка, после рестарта, не берет при первом открытии попапа значения из конфига, плюс у tree не устанавливается атрибут hidevscroll.
А главное, после первого открытия попапа, не раскрываются папки закладок в дереве, при клике по ним.
Если первое исправляется возвращением popupshown, то что делать со вторым и третьим - не представляю.

А, похоже, проблема с папками и скроллбаром и в старом варианте есть. Мне таймаут помог:

скрытый текст

Выделить код

Код:

addEventListener('popupshown', (e)=> {
   document.getElementById('editBMPanel_locationRow').removeAttribute('collapsed');

   var tree = document.getElementById('editBMPanel_folderTree');
   tree.setAttribute('style', 'resize: both !important; overflow: auto !important;');

   var h = 'CB.treeHeight', w = 'CB.treeWidth';
   cbu.isPref(h, 150); cbu.isPref(w, 150);

   tree.height = cbu.getPrefs(h);
   tree.width = cbu.getPrefs(w);

   setTimeout(()=> {
      if (e.target == document.getElementById('editBookmarkPanel')) gEditItemOverlay.toggleFolderTreeVisibility();
      tree.setAttribute('hidevscroll', 'true');
   },100);

   document.getElementById('editBookmarkPanel').addEventListener('popuphidden', function() {
      cbu.setPrefs(h, tree.height); cbu.setPrefs(w, tree.width);
   }, false);
}, true, document.getElementById('editBookmarkPanel'));

Так нормально работает.

P.S.:

Выделить код

Код:

document.getElementById('editBMPanel_locationRow').removeAttribute('collapsed');

- это я про другое. Раскрывает строку редактирования адреса:

скрытый текст

Тож полезная штука.

bunda1 · №15

turbot пишет

bunda1
Тож полезная штука.

Действительно полезное я его добавил в код.

Добавлено 18-03-2016 21:14:43

turbot пишет

bunda1
У меня в нынешнем виде кнопка

Сейчас работает на Firefox48 без проблем: Вчера 22:06:12

Добавлено 18-03-2016 21:21:28

turbot пишет

Так нормально работает.

Да работает, но может рациональней было сделать код с одним editBookmarkPanel

Добавлено 18-03-2016 21:25:39
Неплохо бы исправить дёрганье диалога добавления закладки звёздочки при редактировании, но я не представляю как это сделать.

Отредактировано bunda1 (18-03-2016 21:25:39)

turbot · №16

bunda1 пишет

Сейчас работает на Firefox45 без проблем: Вчера 22:06:12

У меня именно с этой версией вышеописанные проблемы. Попробуйте после изменения размера, перезапустить браузер и открыть панель первый раз - размер сбрасывается на дефолтный, скролбар на месте, а папки с закладками в дереве - не реагируют на нажатия.

рациональней было сделать код с одним editBookmarkPanel

Я не придумал, как его один раз присобачить, если только из листенера переменную вытащить. :blush:

Отредактировано turbot (18-03-2016 21:27:22)

bunda1 · №17

turbot пишет

bunda1 пишет
Сейчас работает на Firefox45 без проблем: Вчера 22:06:12
У меня именно с этой версией вышеописанные проблемы. Попробуйте после изменения размера, перезапустить браузер и открыть панель первый раз - размер сбрасывается на дефолтный, скролбар на месте, а папки с закладками в дереве - не реагируют на нажатия.

Да, папки с закладками в дереве - не реагируют на нажатия, остальное на Firefox45 без проблем. Странно.

Добавлено 18-03-2016 21:38:03
А нет, иногда скролбар на месте и размер сбрасывается на дефолтный.

Отредактировано bunda1 (18-03-2016 21:38:03)

turbot · №18

bunda1
Таймаут помогает, как я писал.

bunda1 · №19

turbot пишет

bunda1
Таймаут помогает, как я писал.

Да, но хочется что бы всё раскрывало быстрее.

Dumby · №20

Разрешите тоже попробовать

скрытый текст

Выделить код

Код:

(({panel}, {prefs}, pref, listener = {
    handleEvent(e) {
        this.locationRow = panel.querySelector("#editBMPanel_locationRow");
        var tree = this.folderTree = panel.querySelector("#editBMPanel_folderTree");
        tree.style.resize = "both"; tree.style.overflow = "hidden";

        var treerows = tree.inputField.previousSibling;
        addEventListener("overflow", e => e.stopPropagation(), true, treerows);

        cbu.isPref(pref, "200 300");
        addEventListener("popuphidden", this, false, panel);

        this.handleEvent = e => e.target == panel && this[e.type]();
        setTimeout(() => {
            treerows.setAttribute("hidevscroll", true);
            this.popupshowing();
        }, 0);
    },
    popupshowing() {
        gEditItemOverlay.toggleFolderTreeVisibility();
        setTimeout(() => this.locationRow.collapsed = false, 0);
        var [width, height] = prefs.getCharPref(pref).split(" ");
        this.folderTree.width = this.width = width;
        this.folderTree.height = this.height = height;
    },
    popuphidden() {
        var {width, height} = this.folderTree;
        if (width != this.width || height != this.height) prefs.setCharPref(
            pref, width + " " + height
        );
    }
}) => {
    addEventListener("popupshowing", listener, false, panel);
    addDestructor(reason => {
        reason == "delete" && prefs.clearUserPref(pref);
        var tree = listener.folderTree; if (!tree) return;
        for(var prop of ["resize", "overflow"]) tree.style.removeProperty(prop);
        tree.getAttribute("style") || tree.removeAttribute("style");
        listener.locationRow.collapsed = true;
        tree.inputField.previousSibling.removeAttribute("hidevscroll");
        for(var attr of ["width", "height"]) tree.removeAttribute(attr);
        
    });
})(StarUI, Services, "CB.editBMPanel_folderTree_WidthHeight");

voqabuhe · №21

Dumby пишет

Разрешите тоже попробовать

Вещь. Спасибо.

turbot · №22

Dumby
Отлично работает, спасибо. :beer:

_{(А почему querySelector? Не то чтоб разница большая, но все ж...)}

difabor · №23

Dumby пишет

Разрешите тоже попробовать

скрытый текст

Выделить код

Код:

(({panel}, {prefs}, pref, listener = {
    handleEvent(e) {
        this.locationRow = panel.querySelector("#editBMPanel_locationRow");
        var tree = this.folderTree = panel.querySelector("#editBMPanel_folderTree");
        tree.style.resize = "both"; tree.style.overflow = "hidden";

        var treerows = tree.inputField.previousSibling;
        addEventListener("overflow", e => e.stopPropagation(), true, treerows);

        cbu.isPref(pref, "200 300");
        addEventListener("popuphidden", this, false, panel);

        this.handleEvent = e => e.target == panel && this[e.type]();
        setTimeout(() => {
            treerows.setAttribute("hidevscroll", true);
            this.popupshowing();
        }, 0);
    },
    popupshowing() {
        gEditItemOverlay.toggleFolderTreeVisibility();
        setTimeout(() => this.locationRow.collapsed = false, 0);
        var [width, height] = prefs.getCharPref(pref).split(" ");
        this.folderTree.width = this.width = width;
        this.folderTree.height = this.height = height;
    },
    popuphidden() {
        var {width, height} = this.folderTree;
        if (width != this.width || height != this.height) prefs.setCharPref(
            pref, width + " " + height
        );
    }
}) => {
    addEventListener("popupshowing", listener, false, panel);
    addDestructor(reason => {
        reason == "delete" && prefs.clearUserPref(pref);
        var tree = listener.folderTree; if (!tree) return;
        for(var prop of ["resize", "overflow"]) tree.style.removeProperty(prop);
        tree.getAttribute("style") || tree.removeAttribute("style");
        listener.locationRow.collapsed = true;
        tree.inputField.previousSibling.removeAttribute("hidevscroll");
        for(var attr of ["width", "height"]) tree.removeAttribute(attr);
        
    });
})(StarUI, Services, "CB.editBMPanel_folderTree_WidthHeight");

У меня на [firefox] 28 этот код не компилируется (иконка - "мутная"). Что в нём надо изменить, чтоб код работал?

bunda1 · №24

Я изменил код, теперь окошко добавления закладки звёздочки открывается быстрее: Редактировать размеры поля выбора вкладок в диалоге добавления закладки звёздочки

Добавлено 19-03-2016 23:11:12

Dumby пишет

Разрешите тоже попробовать

Спасибо, я опять из твоего кода узнал что то новое для себя.

Отредактировано bunda1 (19-03-2016 23:11:12)

Dumby · №25

difabor
Что-то у меня с overflow: hidden; ресайзер реагирует только от Firefox 31+.
С overflow: scroll; вроде хоть как-то, но работает на двадцатьвосьмой, наверно.

скрытый текст

Выделить код

Код:

(({panel}, {prefs}, pref, overlay, listener = {
    handleEvent: function(e) {
        if (e.defaultPrevented) return;
        cbu.isPref(pref, "200 300");
        this.tree = panel.querySelector("#editBMPanel_folderTree");

        this.uri = makeURI("data:text/css," + encodeURIComponent('\
            @namespace url(' + xulns + ');' + '\n\n\
            #editBMPanel_locationRow { visibility: visible; }\n\
            #editBMPanel_folderTree { resize: both; overflow: scroll; }\n\
            #editBMPanel_folderTree > stack > treerows > scrollbar { display: none; }\n\
            #editBMPanel_folderTree > scrollbar[orient="vertical"] { visibility: hidden; }\n\
            #editBMPanel_folderTree > scrollbar[orient="horizontal"] { display: none; }\n\
            #editBMPanel_folderTree, #editBMPanel_folderTreeRow, #editBookmarkPanelContent { -moz-box-flex: 1; }\n\
        '.replace(/;/g, " !important;")));

        this.dwu = QueryInterface(Ci.nsIInterfaceRequestor).getInterface(Ci.nsIDOMWindowUtils);
        this.dwu.loadSheet(this.uri, this.type = this.dwu.AGENT_SHEET);

        this.handleEvent = e => e.target == panel && this[e.type]();
        addEventListener("popuphidden", this, false, panel);
        overlay ? this.popupshowing() : setTimeout(() => this.popupshowing(), 0);
    },
    popupshowing: function() {
        var [width, height] = prefs.getCharPref(pref).split(" ");
        this.tree.width = this.width = width;
        this.tree.height = this.height = height;
        gEditItemOverlay.toggleFolderTreeVisibility();
        panel.adjustArrowPosition();
    },
    popuphidden: function() {
        var {width, height} = this.tree;
        if (width == this.width && height == this.height) return;
        prefs.setCharPref(pref, width + " " + height);
    }
}) => {
    addEventListener("popupshowing", listener, false, panel);
    addDestructor(reason => {
        reason == "delete" && prefs.clearUserPref(pref);
        var {tree} = listener; if (!tree) return;

        tree.removeAttribute("width"); tree.height = 150;
        listener.dwu.removeSheet(listener.uri, listener.type);
    });
})(StarUI, Services, "CB.editBMPanel_folderTree_WidthHeight", StarUI._overlayLoaded);

Полезная информация