https://github.com/shentengtu/query-bookmarks-tree
A little RequireJS module that genarate Google Chrome bookmarks tree DOM.
https://github.com/shentengtu/query-bookmarks-tree
Last synced: 3 months ago
JSON representation
A little RequireJS module that genarate Google Chrome bookmarks tree DOM.
- Host: GitHub
- URL: https://github.com/shentengtu/query-bookmarks-tree
- Owner: ShenTengTu
- License: mit
- Created: 2017-01-10T05:41:47.000Z (over 8 years ago)
- Default Branch: master
- Last Pushed: 2017-01-10T06:44:55.000Z (over 8 years ago)
- Last Synced: 2025-02-24T08:55:57.262Z (3 months ago)
- Language: JavaScript
- Size: 43.9 KB
- Stars: 0
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# query-bookmarks-tree
A little RequireJS module be used to Google Chrome extension API `chrome.bookmarks`, that genarate bookmarks tree DOM and load default css into the page of extension. This module reference origenal bookmarks manager and [basic bookmarks sample]. You can use **load unpacked extension** (choose `public_html` folder) to see the module sample.
[basic bookmarks sample]:
### Overview
After declare `require(['querybookmarkstree'], function (querybookmarkstree){})`, it will retrun a object contains two properties:
* `getTreeDOM`: a function that genarate DOM of bookmarks tree.
* `getTreeCSS`: CSSStyleSheet object form loaded default css.
##### getTreeDOM
The first parameter is jQuery element selector, bookmarks tree will append it.
```javascript
querybookmarkstree.getTreeDOM($('#bookmarks'), option);
```
Parameter `option` contains some properties:
* `onlyFolder`:If true, it will generate only bookmark folder.
* `queryId`: a callback function let you get bookmark id when click on a bookmark.
```javascript
var option = {
onlyFolder: false,
queryId: function(id){$("#getId").text("The id is : " + id);}
};
```
##### getTreeCSS
you can use `insertRule()` to override default css rule:
```javascript
var stylesheet = querybookmarkstree.getTreeCSS;
stylesheet.insertRule("span.node{color:green}", stylesheet.cssRules.length);
```
### Dependencies
This module require [RequireJS], [require-css] and [JQuery].
[RequireJS]:
[require-css]:
[JQuery]:
### Installation and Setup
You need to put dependencies and this module in your `libs` folder. Then in the *.html:
```html
```
In `main.js`, set config as below:
```javascript
require({
baseUrl:"js/libs",
paths: {
"jquery":"jquery/jquery.min",
"querybookmarkstree":"query-bookmarks-tree/querybookmarkstree"
//recommand named 'querybookmarkstree'
},
map:{
"*":{
"css":"require-css/css.min"//setup require-css
}
}
});
```