Некоторые проблемы при создании сценария JavaScript для создания списка закладок в расширении Google Chrome - PullRequest
Новая
       14

Некоторые проблемы при создании сценария JavaScript для создания списка закладок в расширении Google Chrome

0 голосов
/ 23 января 2011

Я пытаюсь создать скрипт JavaScript, который создаст контекстное меню закладок пользователя. Я рассмотрел код различных расширений, доступных в галерее расширений Chrome, но все они очень сложны и, в некоторой степени, несовершенны (большинство из них только заглянут внутрь определенного количества подпапок и затем остановятся). Я пытаюсь сделать простой сценарий, который будет работать для всех возможных элементов (даже если они скрыты в очень глубокой иерархии папок).

Следующий скрипт не работает, но он демонстрирует возможное решение, о котором я думал: 

bookmarkObject = ITEM_FROM_ARRAY_OF_ALL_BOOKMARK_OBJECTS;
var OBJECT_NUMBER = chrome.contextMenus.create({
    "contexts": ["all"],
    "onclick": function() {
        return function() {
            if (bookmarkObject.url) {
                chrome.tabs.create({
                    "url": bookmarkObject.url
                });
            }
            else {
                return null;
            };
        };
    }(bookmarkObject),
    "parentId": bookmarkObject.parentId,
    "title": bookmarkObject.title,
    "type": "normal"
});

Я считаю, что если все элементы имеют значение Id (OBJECT_NUMBER), установленное сценарием в качестве переменной, сценарий должен автоматически использовать эту переменную в качестве значения bookmark.parentId для любых возможных дочерних элементов и, таким образом, автоматически вкладывать дерево соответствующим образом. (Это всего лишь предположение; если я ошибаюсь, пожалуйста, дайте мне знать.)

Однако я не могу понять, как получить массив всех объектов закладок (мне удается только получить массив объектов закладок в определенной папке). Кроме того, я не могу понять, как динамически запускать код, который я написал для каждого полученного элемента, автоматически устанавливая для OBJECT_NUMBER значение Id соответствующего объекта.

Может кто-нибудь предложить какую-нибудь помощь?

РЕДАКТИРОВАТЬ : я внес много изменений в соответствии с демонстрационным сценарием Мохамеда Мансура и получил следующий сценарий: 

window.addEventListener("load", function() {
    init();
}, false);

function init() {
    chrome.bookmarks.getTree(function(children) {
        addBookmarks(children);
    });
};

function addBookmarks(bookmarks, parent) {
    bookmarks.forEach(function(bookmarkObject) {
        var bookmarkObject =    chrome.contextMenus.create({
            "contexts": ["all"],
            "onclick": function() {
                return function() {
                    if (bookmarkObject.url && bookmarkObject.url.length) {
                        chrome.tabs.create({
                            "url": bookmarkObject.url
                        });
                    };
                };
            }(bookmarkObject),
            "parentId": parent,
            "title": function() {
                if (bookmarkObject.url && bookmarkObject.url.length) {
                    return bookmarkObject.title;
                }
                else {
                    return chrome.i18n.getMessage("contextmenu_label");
                };
            }(bookmarkObject),
            "type": "normal"
        });
        if (bookmarkObject.children) {
            addBookmarks(bookmarkObject.children, bookmarkObject);
        };
    });
};

В некоторой степени это работает, так как не возвращает никаких ошибок в консоли JavaScript. Однако, хотя корневой элемент отображается в виде контекстного меню (имя которого извлекается командой chrome.i18n.getMessage("contextmenu_label")), дочерние элементы не вкладываются и не появляются вообще. Может ли кто-нибудь помочь определить, что я сделал не так?

1 Ответ

0 голосов
/ 23 января 2011

Вы смотрели на API закладок getTree? http://code.google.com/chrome/extensions/bookmarks.html#method-getTree

Это позволит вам получить все закладки из всей иерархии. 

chrome.bookmarks.getTree(function(children) {

});

Затем вам нужно проанализировать этот результат, так как у каждого узла есть список закладок. Вы можете сделать это рекурсивно (даже итеративно, если хотите).

Вот как я получаю все закладки и показываю их во всплывающем окне (взятом из моей внутренней библиотеки примеров, которую я использую, чтобы помочь пользователям): 

var prefix = 'bookmark_';

function addBookmark(bookmark, parent) {
  var child = document.createElement('li');
  child.className = 'bookmark';
  child.id = prefix + bookmark.id;
  if (bookmark.url && bookmark.url.length) {
    var link = document.createElement('a');
    link.href = bookmark.url;
    link.innerHTML = bookmark.title;
    link.className = 'bookmark_title';
    link.onclick = function() {
       chrome.tabs.create({url: bookmark.url});
       return false;
    };

    child.appendChild(link);
  } else {
    var title = document.createElement('div');
    title.innerHTML = bookmark.title;
    title.className = 'bookmark_title';
    child.appendChild(title);
  }
  parent.appendChild(child);
}

function addBookmarks(bookmarks, parent) {
  var list = document.createElement('ul');
  parent.appendChild(list);
  bookmarks.forEach(function(bookmark) {
    addBookmark(bookmark, list);
    if (bookmark.children)
      addBookmarks(bookmark.children, list);
  });
}

function loadBookmarks() {
  var container = document.getElementById('container');
  var rootElement = document.createElement('div');

  var rootId = 0;
  rootElement.id = prefix + rootId;

  container.appendChild(rootElement);
  chrome.bookmarks.getTree(function(children) {
    console.log(children);
    addBookmarks(children, rootElement);
  });
}

Вы можете изменить это, чтобы исправить ваши потребности контекстного меню.

...