mirror of
https://github.com/zombieFox/nightTab.git
synced 2025-06-26 20:41:21 +02:00
[feature] add open all links control to groups
This commit is contained in:
Kombie
GitHub
parent
926bb35ed5
commit
80bb0f7a47
2
package-lock.json
generated
2
package-lock.json
generated
@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "nightTab",
|
||||
"version": "4.41.0",
|
||||
"version": "4.42.0",
|
||||
"lockfileVersion": 1,
|
||||
"requires": true,
|
||||
"dependencies": {
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "nightTab",
|
||||
"version": "4.41.0",
|
||||
"version": "4.42.0",
|
||||
"description": "A neutral new tab page accented with a chosen colour. Customise the layout, style, background and bookmarks in nightTab.",
|
||||
"main": "index.js",
|
||||
"scripts": {
|
||||
|
||||
@ -40,6 +40,62 @@
|
||||
transition: padding var(--layout-timing-extra-fast) var(--layout-duration-04);
|
||||
}
|
||||
|
||||
.group-header-item {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.is-group-area-justify-center .group-header-item:not(:only-child):not(:last-child),
|
||||
.is-group-area-justify-left .group-header-item:not(:only-child):not(:last-child) {
|
||||
margin-right: calc(var(--layout-space) * var(--layout-gutter));
|
||||
}
|
||||
|
||||
.is-group-area-justify-right .group-header-item:not(:only-child):not(:last-child) {
|
||||
margin-left: calc(var(--layout-space) * var(--layout-gutter));
|
||||
}
|
||||
|
||||
.group-header-item-name {
|
||||
flex-shrink: 1;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.group-header-item-control {
|
||||
height: 0;
|
||||
width: 0;
|
||||
overflow: hidden;
|
||||
flex-shrink: 0;
|
||||
transition:
|
||||
width var(--layout-timing-extra-fast),
|
||||
height var(--layout-timing-extra-fast) var(--layout-duration-04),
|
||||
margin var(--layout-timing-extra-fast);
|
||||
}
|
||||
|
||||
.is-edit .group-header-item-control {
|
||||
height: 2.5em;
|
||||
width: 15em;
|
||||
transition:
|
||||
width var(--layout-timing-extra-fast) var(--layout-duration-04),
|
||||
height var(--layout-timing-extra-fast),
|
||||
margin var(--layout-timing-extra-fast) var(--layout-duration-04);
|
||||
}
|
||||
|
||||
.is-group-area-justify-center .group-header-item-control:not(:only-child):not(:last-child),
|
||||
.is-group-area-justify-left .group-header-item-control:not(:only-child):not(:last-child) {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
.is-edit.is-group-area-justify-center .group-header-item-control:not(:only-child):not(:last-child),
|
||||
.is-edit.is-group-area-justify-left .group-header-item-control:not(:only-child):not(:last-child) {
|
||||
margin-right: calc(var(--layout-space) * var(--layout-gutter));
|
||||
}
|
||||
|
||||
.is-group-area-justify-right .group-header-item-control:not(:only-child):not(:last-child) {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.is-edit.is-group-area-justify-right .group-header-item-control:not(:only-child):not(:last-child) {
|
||||
margin-left: calc(var(--layout-space) * var(--layout-gutter));
|
||||
}
|
||||
|
||||
.is-edit .group-header {
|
||||
transition: padding var(--layout-timing-extra-fast);
|
||||
}
|
||||
@ -58,30 +114,25 @@
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.is-group-order-headerbody.is-group-openall-show .group-header,
|
||||
.is-group-order-headerbody.is-group-name-show .group-header,
|
||||
.is-group-order-headerbody.is-edit .group-header {
|
||||
padding-bottom: calc(var(--layout-space) * var(--layout-gutter));
|
||||
}
|
||||
|
||||
.is-group-order-bodyheader.is-group-openall-show .group-header,
|
||||
.is-group-order-bodyheader.is-group-name-show .group-header,
|
||||
.is-group-order-bodyheader.is-edit .group-header {
|
||||
padding-top: calc(var(--layout-space) * var(--layout-gutter));
|
||||
}
|
||||
|
||||
.group-name {
|
||||
margin-right: 0;
|
||||
height: 2.5em;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 0;
|
||||
max-width: 100%;
|
||||
overflow: hidden;
|
||||
font-size: var(--group-name-size);
|
||||
transition: height var(--layout-timing-extra-fast);
|
||||
}
|
||||
|
||||
.is-group-name-show .group-name {
|
||||
display: flex;
|
||||
height: 2.5em;
|
||||
}
|
||||
|
||||
.group-name-text {
|
||||
@ -91,41 +142,15 @@
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.group-control {
|
||||
margin-right: 0;
|
||||
margin-bottom: 0;
|
||||
overflow: hidden;
|
||||
height: 0;
|
||||
width: 0;
|
||||
flex-shrink: 0;
|
||||
transition:
|
||||
width var(--layout-timing-extra-fast),
|
||||
height var(--layout-timing-extra-fast) var(--layout-duration-04),
|
||||
margin var(--layout-timing-extra-fast);
|
||||
}
|
||||
|
||||
.is-edit .group-control {
|
||||
height: 2.5em;
|
||||
width: 16em;
|
||||
transition:
|
||||
width var(--layout-timing-extra-fast) var(--layout-duration-04),
|
||||
height var(--layout-timing-extra-fast),
|
||||
margin var(--layout-timing-extra-fast) var(--layout-duration-04);
|
||||
}
|
||||
|
||||
.is-edit.is-group-name-show.is-group-area-justify-left .group-control,
|
||||
.is-edit.is-group-name-show.is-group-area-justify-center .group-control {
|
||||
margin-right: 1em;
|
||||
}
|
||||
|
||||
.is-edit.is-group-name-show.is-group-area-justify-right .group-control {
|
||||
margin-left: 1em;
|
||||
}
|
||||
|
||||
.group-control-item {
|
||||
padding-left: 1.25em;
|
||||
padding-right: 1.25em;
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
flex-shrink: 0;
|
||||
width: 3em;
|
||||
}
|
||||
|
||||
.group-openall {
|
||||
font-size: var(--group-openall-size);
|
||||
}
|
||||
|
||||
.group-body {
|
||||
|
||||
@ -192,17 +192,6 @@
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.header-item-menu-baseline-alignment-character {
|
||||
width: 0;
|
||||
opacity: 0;
|
||||
pointer-events: none;
|
||||
visibility: hidden;
|
||||
padding: 0;
|
||||
clip: rect(0, 0, 0, 0);
|
||||
white-space: nowrap;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.header-item-body {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
@ -64,3 +64,14 @@
|
||||
flex-wrap: nowrap;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.baseline-alignment-icon-character {
|
||||
width: 0;
|
||||
opacity: 0;
|
||||
pointer-events: none;
|
||||
visibility: hidden;
|
||||
padding: 0;
|
||||
clip: rect(0, 0, 0, 0);
|
||||
white-space: nowrap;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
@ -90,6 +90,7 @@
|
||||
--header-transitional-size: 1em;
|
||||
/* group */
|
||||
--group-name-size: 1em;
|
||||
--group-openall-size: 1em;
|
||||
--group-border: 0;
|
||||
/* link */
|
||||
--link-area-width: 100%;
|
||||
|
||||
@ -1,4 +1,35 @@
|
||||
<div id="menu-content-groups" class="menu-content menu-content-overscroll menu-content-groups is-hidden">
|
||||
<div id="menu-content-groups-area" class="menu-content-item">
|
||||
<div class="menu-item-header">
|
||||
<h1 class="menu-item-header-text">Area</h1>
|
||||
</div>
|
||||
<div class="menu-item-form">
|
||||
<div class="form-wrap">
|
||||
<div class="form-wrap">
|
||||
<label class="control-group-area-justify-label">Group horizontal alignment</label>
|
||||
</div>
|
||||
<div class="form-wrap">
|
||||
<div class="form-grid form-grid-3x1 control-group-area-justify-grid">
|
||||
<div class="form-wrap">
|
||||
<input id="control-group-area-justify-left" class="control-group-area-justify-left" type="radio" name="control-group-area-justify" value="left" tabindex="-1">
|
||||
<label for="control-group-area-justify-left"><span class="label-icon"></span> <span class="sr-only">Left</span></label>
|
||||
</div>
|
||||
<div class="form-wrap">
|
||||
<input id="control-group-area-justify-center" class="control-group-area-justify-center" type="radio" name="control-group-area-justify" value="center" tabindex="-1">
|
||||
<label for="control-group-area-justify-center"><span class="label-icon"></span> <span class="sr-only">Center</span></label>
|
||||
</div>
|
||||
<div class="form-wrap">
|
||||
<input id="control-group-area-justify-right" class="control-group-area-justify-right" type="radio" name="control-group-area-justify" value="right" tabindex="-1">
|
||||
<label for="control-group-area-justify-right"><span class="label-icon"></span> <span class="sr-only">Right</span></label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-helper">
|
||||
<p class="control-group-area-justify-helper form-helper-item">Effects may not be visible if the Group Name is not shown.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="menu-content-groups-names" class="menu-content-item">
|
||||
<div class="menu-item-header">
|
||||
<h1 class="menu-item-header-text">Names</h1>
|
||||
@ -20,30 +51,40 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<hr>
|
||||
</div>
|
||||
</div>
|
||||
<div id="menu-content-groups-order" class="menu-content-item">
|
||||
<div class="menu-item-header">
|
||||
<h1 class="menu-item-header-text">Open all Bookmarks</h1>
|
||||
</div>
|
||||
<div class="menu-item-form">
|
||||
<div class="form-wrap">
|
||||
<div class="form-wrap">
|
||||
<label class="control-group-area-justify-label">Group name horizontal alignment</label>
|
||||
</div>
|
||||
<div class="form-wrap">
|
||||
<div class="form-grid form-grid-3x1 control-group-area-justify-grid">
|
||||
<div class="form-wrap">
|
||||
<input id="control-group-area-justify-left" class="control-group-area-justify-left" type="radio" name="control-group-area-justify" value="left" tabindex="-1">
|
||||
<label for="control-group-area-justify-left"><span class="label-icon"></span> <span class="sr-only">Left</span></label>
|
||||
</div>
|
||||
<div class="form-wrap">
|
||||
<input id="control-group-area-justify-center" class="control-group-area-justify-center" type="radio" name="control-group-area-justify" value="center" tabindex="-1">
|
||||
<label for="control-group-area-justify-center"><span class="label-icon"></span> <span class="sr-only">Center</span></label>
|
||||
</div>
|
||||
<div class="form-wrap">
|
||||
<input id="control-group-area-justify-right" class="control-group-area-justify-right" type="radio" name="control-group-area-justify" value="right" tabindex="-1">
|
||||
<label for="control-group-area-justify-right"><span class="label-icon"></span> <span class="sr-only">Right</span></label>
|
||||
<input id="control-group-openall-show" class="control-group-openall-show" type="checkbox" tabindex="-1">
|
||||
<label for="control-group-openall-show"><span class="label-icon"></span> Show</label>
|
||||
</div>
|
||||
<div class="form-wrap">
|
||||
<div class="form-indent">
|
||||
<div class="form-wrap">
|
||||
<label for="control-group-openall-size-range">Size</label>
|
||||
<div class="form-group form-group-block">
|
||||
<input id="control-group-openall-size-range" class="control-group-openall-size-range mr-3" type="range" value="0" tabindex="-1">
|
||||
<input class="control-group-openall-size-number form-group-item-medium form-group-radius-left" type="number" value="0" tabindex="-1">
|
||||
<button class="control-group-openall-size-default button" tabindex="-1" title="Reset to default"><span class="icon-replay"></span></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-helper">
|
||||
<p class="control-group-area-justify-helper form-helper-item">Effects may not be visible if the Group Name is not shown.</p>
|
||||
<hr>
|
||||
<div class="form-wrap">
|
||||
<label class="control-group-openall-style-label">Button style</label>
|
||||
</div>
|
||||
<div class="form-wrap">
|
||||
<input id="control-group-openall-style-box" class="control-group-openall-style-box" type="radio" name="control-group-openall-style" value="box" tabindex="-1">
|
||||
<label for="control-group-openall-style-box"><span class="label-icon"></span> Box</label>
|
||||
</div>
|
||||
<div class="form-wrap">
|
||||
<input id="control-group-openall-style-clear" class="control-group-openall-style-clear" type="radio" name="control-group-openall-style" value="clear" tabindex="-1">
|
||||
<label for="control-group-openall-style-clear"><span class="label-icon"></span> Clear</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -508,7 +508,9 @@
|
||||
</div>
|
||||
</div>
|
||||
<hr>
|
||||
<label class="control-header-search-style-label">Style</label>
|
||||
<div class="form-wrap">
|
||||
<label class="control-header-search-style-label">Input style</label>
|
||||
</div>
|
||||
<div class="form-wrap">
|
||||
<input id="control-header-search-style-box" class="control-header-search-style-box" type="radio" name="control-header-search-style" value="box" tabindex="-1">
|
||||
<label for="control-header-search-style-box"><span class="label-icon"></span> Box</label>
|
||||
@ -629,7 +631,9 @@
|
||||
</div>
|
||||
<div class="form-wrap">
|
||||
<div class="form-indent">
|
||||
<label class="control-header-editadd-style-label">Style</label>
|
||||
<div class="form-wrap">
|
||||
<label class="control-header-editadd-style-label">Button style</label>
|
||||
</div>
|
||||
<div class="form-wrap">
|
||||
<input id="control-header-editadd-style-box" class="control-header-editadd-style-box" type="radio" name="control-header-editadd-style" value="box" tabindex="-1">
|
||||
<label for="control-header-editadd-style-box"><span class="label-icon"></span> Box</label>
|
||||
@ -678,7 +682,9 @@
|
||||
<label for="control-header-coloraccent-dot-show"><span class="label-icon"></span> Show colour dots</label>
|
||||
</div>
|
||||
<hr>
|
||||
<label class="control-header-coloraccent-style-label">Style</label>
|
||||
<div class="form-wrap">
|
||||
<label class="control-header-coloraccent-style-label">Button style</label>
|
||||
</div>
|
||||
<div class="form-wrap">
|
||||
<input id="control-header-coloraccent-style-box" class="control-header-coloraccent-style-box" type="radio" name="control-header-coloraccent-style" value="box" tabindex="-1">
|
||||
<label for="control-header-coloraccent-style-box"><span class="label-icon"></span> Box</label>
|
||||
@ -713,7 +719,9 @@
|
||||
<h1 class="menu-item-header-text">Settings menu</h1>
|
||||
</div>
|
||||
<div class="menu-item-form">
|
||||
<label class="control-header-menu-style-label">Style</label>
|
||||
<div class="form-wrap">
|
||||
<label class="control-header-menu-style-label">Button style</label>
|
||||
</div>
|
||||
<div class="form-wrap">
|
||||
<input id="control-header-menu-style-box" class="control-header-menu-style-box" type="radio" name="control-header-menu-style" value="box" tabindex="-1">
|
||||
<label for="control-header-menu-style-box"><span class="label-icon"></span> Box</label>
|
||||
|
||||
@ -31,6 +31,7 @@
|
||||
<div class="menu-nav-item">
|
||||
<button class="control-menu-groups menu-nav-tab button" tabindex="-1">Groups</button>
|
||||
<div class="menu-nav-body menu-nav-body-groups active">
|
||||
<a href="#menu-content-groups-area" class="menu-nav-sub button button-small" tabindex="-1">Area</a>
|
||||
<a href="#menu-content-groups-names" class="menu-nav-sub button button-small" tabindex="-1">Names</a>
|
||||
<a href="#menu-content-groups-order" class="menu-nav-sub button button-small" tabindex="-1">Order</a>
|
||||
<a href="#menu-content-groups-border" class="menu-nav-sub button button-small" tabindex="-1">Border</a>
|
||||
|
||||
@ -2857,6 +2857,27 @@ var control = (function() {
|
||||
func: function() {
|
||||
render.class();
|
||||
}
|
||||
}, {
|
||||
element: ".control-group-area-justify-left",
|
||||
path: "group.area.justify",
|
||||
type: "radio",
|
||||
func: function() {
|
||||
render.class();
|
||||
}
|
||||
}, {
|
||||
element: ".control-group-area-justify-center",
|
||||
path: "group.area.justify",
|
||||
type: "radio",
|
||||
func: function() {
|
||||
render.class();
|
||||
}
|
||||
}, {
|
||||
element: ".control-group-area-justify-right",
|
||||
path: "group.area.justify",
|
||||
type: "radio",
|
||||
func: function() {
|
||||
render.class();
|
||||
}
|
||||
}, {
|
||||
element: ".control-group-name-show",
|
||||
path: "group.name.show",
|
||||
@ -2922,7 +2943,7 @@ var control = (function() {
|
||||
}
|
||||
}],
|
||||
func: function() {
|
||||
link.render.group.size();
|
||||
link.render.group.name.size();
|
||||
}
|
||||
}, {
|
||||
element: ".control-group-name-size-number",
|
||||
@ -2941,7 +2962,7 @@ var control = (function() {
|
||||
valueConvert: ["float"]
|
||||
}],
|
||||
func: function() {
|
||||
link.render.group.size();
|
||||
link.render.group.name.size();
|
||||
}
|
||||
}, {
|
||||
element: ".control-group-name-size-default",
|
||||
@ -2957,30 +2978,127 @@ var control = (function() {
|
||||
}],
|
||||
func: function() {
|
||||
mod.default("group.name.size");
|
||||
link.render.group.size();
|
||||
link.render.group.name.size();
|
||||
render.update.control.header();
|
||||
render.update.control.menu();
|
||||
}
|
||||
}, {
|
||||
element: ".control-group-area-justify-left",
|
||||
path: "group.area.justify",
|
||||
type: "radio",
|
||||
element: ".control-group-openall-show",
|
||||
path: "group.openAll.show",
|
||||
type: "checkbox",
|
||||
func: function() {
|
||||
link.groupAndItems();
|
||||
render.class();
|
||||
render.dependents();
|
||||
}
|
||||
}, {
|
||||
element: ".control-group-area-justify-center",
|
||||
path: "group.area.justify",
|
||||
type: "radio",
|
||||
element: ".control-group-openall-size-range",
|
||||
path: "group.openAll.size",
|
||||
type: "range",
|
||||
valueConvert: ["float"],
|
||||
valueModify: {
|
||||
min: 10,
|
||||
max: 500,
|
||||
step: 10
|
||||
},
|
||||
mirrorElement: [{
|
||||
element: ".control-group-openall-size-number",
|
||||
path: "group.openAll.size",
|
||||
type: "number",
|
||||
valueConvert: ["float"]
|
||||
}],
|
||||
additionalEvents: [{
|
||||
event: "input",
|
||||
func: function() {
|
||||
edge.box.open({
|
||||
element: helper.e(".group-openall"),
|
||||
});
|
||||
}
|
||||
}, {
|
||||
event: "mousedown",
|
||||
func: function() {
|
||||
edge.box.open({
|
||||
element: helper.e(".group-openall"),
|
||||
});
|
||||
}
|
||||
}, {
|
||||
event: "mouseup",
|
||||
func: function() {
|
||||
edge.box.close();
|
||||
}
|
||||
}, {
|
||||
event: "touchend",
|
||||
func: function() {
|
||||
edge.box.close();
|
||||
}
|
||||
}, {
|
||||
event: "keydown",
|
||||
func: function() {
|
||||
if (event.keyCode == 37 || event.keyCode == 38 || event.keyCode == 39 || event.keyCode == 40) {
|
||||
edge.box.open({
|
||||
element: ".header-item-coloraccent",
|
||||
});
|
||||
};
|
||||
}
|
||||
}, {
|
||||
event: "keyup",
|
||||
func: function() {
|
||||
edge.box.close();
|
||||
}
|
||||
}],
|
||||
func: function() {
|
||||
render.class();
|
||||
link.render.group.openall.size();
|
||||
}
|
||||
}, {
|
||||
element: ".control-group-area-justify-right",
|
||||
path: "group.area.justify",
|
||||
element: ".control-group-openall-size-number",
|
||||
path: "group.openAll.size",
|
||||
type: "number",
|
||||
valueConvert: ["float"],
|
||||
valueModify: {
|
||||
min: 10,
|
||||
max: 500,
|
||||
step: 10
|
||||
},
|
||||
mirrorElement: [{
|
||||
element: ".control-group-openall-size-range",
|
||||
path: "group.openAll.size",
|
||||
type: "range",
|
||||
valueConvert: ["float"]
|
||||
}],
|
||||
func: function() {
|
||||
link.render.group.openall.size();
|
||||
}
|
||||
}, {
|
||||
element: ".control-group-openall-size-default",
|
||||
type: "button",
|
||||
additionalEvents: [{
|
||||
event: "click",
|
||||
func: function() {
|
||||
edge.box.open({
|
||||
element: helper.e(".group-openall"),
|
||||
delay: 500
|
||||
});
|
||||
}
|
||||
}],
|
||||
func: function() {
|
||||
mod.default("group.openAll.size");
|
||||
link.render.group.openall.size();
|
||||
render.update.control.header();
|
||||
render.update.control.menu();
|
||||
}
|
||||
}, {
|
||||
element: ".control-group-openall-style-box",
|
||||
path: "group.openAll.style",
|
||||
type: "radio",
|
||||
func: function() {
|
||||
render.class();
|
||||
link.groupAndItems();
|
||||
}
|
||||
}, {
|
||||
element: ".control-group-openall-style-clear",
|
||||
path: "group.openAll.style",
|
||||
type: "radio",
|
||||
func: function() {
|
||||
link.groupAndItems();
|
||||
}
|
||||
}, {
|
||||
element: ".control-group-order-headerbody",
|
||||
@ -6199,6 +6317,15 @@ var control = (function() {
|
||||
},
|
||||
name: "is-group-name-show"
|
||||
}],
|
||||
openall: [{
|
||||
remove: [
|
||||
"is-group-openall-show"
|
||||
],
|
||||
condition: function() {
|
||||
return state.get.current().group.openAll.show;
|
||||
},
|
||||
name: "is-group-openall-show"
|
||||
}],
|
||||
order: [{
|
||||
remove: [
|
||||
"is-group-order-headerbody",
|
||||
@ -6427,6 +6554,7 @@ var control = (function() {
|
||||
classCheck(all.header.position);
|
||||
classCheck(all.group.area);
|
||||
classCheck(all.group.name);
|
||||
classCheck(all.group.openall);
|
||||
classCheck(all.group.order);
|
||||
classCheck(all.group.border);
|
||||
classCheck(all.link);
|
||||
@ -6898,6 +7026,21 @@ var control = (function() {
|
||||
".control-group-name-size-default"
|
||||
];
|
||||
}
|
||||
}, {
|
||||
condition: function() {
|
||||
return state.get.current().group.openAll.show;
|
||||
},
|
||||
dependents: function() {
|
||||
return [
|
||||
"[for=control-group-openall-size-range]",
|
||||
".control-group-openall-size-range",
|
||||
".control-group-openall-size-number",
|
||||
".control-group-openall-size-default",
|
||||
".control-group-openall-style-label",
|
||||
".control-group-openall-style-box",
|
||||
".control-group-openall-style-clear"
|
||||
];
|
||||
}
|
||||
}],
|
||||
link: [{
|
||||
condition: function() {
|
||||
|
||||
@ -440,7 +440,7 @@ var header = (function() {
|
||||
},
|
||||
menu: function() {
|
||||
var button = helper.node("button|class:control-menu-open button,tabindex:1");
|
||||
var baselineAlignmentCharacter = helper.node("span:-|class:header-item-menu-baseline-alignment-character,aria-hidden:true");
|
||||
var baselineAlignmentCharacter = helper.node("span:-|class:baseline-alignment-icon-character,aria-hidden:true");
|
||||
var buttonIcon = helper.node("span|class:icon-settings");
|
||||
if (state.get.current().header.menu.style == "clear") {
|
||||
helper.addClass(button, "button-link");
|
||||
|
||||
138
src/js/link.js
138
src/js/link.js
@ -366,9 +366,17 @@ var link = (function() {
|
||||
|
||||
render.group = {
|
||||
area: function() {
|
||||
var copyStagedGroup = JSON.parse(JSON.stringify(stagedGroup));
|
||||
|
||||
var group = helper.node("div|class:group");
|
||||
|
||||
var groupHeader = helper.node("div|class:group-header");
|
||||
var groupHeaderItemControl = helper.node("div|class:group-header-item group-header-item-control");
|
||||
var groupHeaderItemName = helper.node("div|class:group-header-item group-header-item-name");
|
||||
var groupHeaderItemOpenall = helper.node("div|class:group-header-item group-header-item-openall");
|
||||
|
||||
var groupBody = helper.node("div|class:group-body");
|
||||
|
||||
var groupName = helper.node("div|class:group-name");
|
||||
var groupNameText = helper.makeNode({
|
||||
tag: "h1",
|
||||
@ -378,67 +386,104 @@ var link = (function() {
|
||||
value: "group-name-text"
|
||||
}]
|
||||
});
|
||||
groupName.appendChild(groupNameText);
|
||||
groupHeaderItemName.appendChild(groupName);
|
||||
|
||||
var groupControl = helper.node("div|class:group-control form-group");
|
||||
|
||||
groupHeader.appendChild(groupControl);
|
||||
group.appendChild(groupHeader);
|
||||
if (state.get.current().group.name.show) {
|
||||
groupName.appendChild(groupNameText);
|
||||
groupHeader.appendChild(groupName);
|
||||
};
|
||||
var groupControlItemUp = helper.node("button|class:button group-control-item group-control-item-up,tabindex:-1,title:Move this group up");
|
||||
var groupControlItemUpIcon = helper.node("span|class:icon-arrow-up");
|
||||
var groupControlItemUpBaselineAlignmentCharacter = helper.node("span:-|class:baseline-alignment-icon-character,aria-hidden:true");
|
||||
groupControlItemUp.appendChild(groupControlItemUpBaselineAlignmentCharacter);
|
||||
groupControlItemUp.appendChild(groupControlItemUpIcon);
|
||||
groupControl.appendChild(groupControlItemUp);
|
||||
|
||||
var groupBody = helper.node("div|class:group-body");
|
||||
group.appendChild(groupBody);
|
||||
var groupControlItemHandle = helper.node("div|class:button group-control-item group-control-item-handle,tabindex:-1,title:Drag group to reorder");
|
||||
var groupControlItemHandleIcon = helper.node("span|class:icon-reorder");
|
||||
var groupControlItemHandleBaselineAlignmentCharacter = helper.node("span:-|class:baseline-alignment-icon-character,aria-hidden:true");
|
||||
groupControlItemHandle.appendChild(groupControlItemHandleBaselineAlignmentCharacter);
|
||||
groupControlItemHandle.appendChild(groupControlItemHandleIcon);
|
||||
groupControl.appendChild(groupControlItemHandle);
|
||||
|
||||
var itemGroupControlItemUp = helper.node("button|class:button button-small group-control-item group-control-item-up,tabindex:-1,title:Move this group up");
|
||||
var itemGroupControlItemUpIcon = helper.node("span|class:button-icon icon-arrow-up");
|
||||
itemGroupControlItemUp.appendChild(itemGroupControlItemUpIcon);
|
||||
groupControl.appendChild(itemGroupControlItemUp);
|
||||
var groupControlItemDown = helper.node("button|class:button group-control-item group-control-item-down,tabindex:-1,title:Move this group down");
|
||||
var groupControlItemDownIcon = helper.node("span|class:icon-arrow-down");
|
||||
var groupControlItemDownBaselineAlignmentCharacter = helper.node("span:-|class:baseline-alignment-icon-character,aria-hidden:true");
|
||||
groupControlItemDown.appendChild(groupControlItemDownBaselineAlignmentCharacter);
|
||||
groupControlItemDown.appendChild(groupControlItemDownIcon);
|
||||
groupControl.appendChild(groupControlItemDown);
|
||||
|
||||
var itemGroupControlItemHandle = helper.node("div|class:button button-small group-control-item group-control-item-handle,tabindex:-1,title:Drag group to reorder");
|
||||
var itemGroupControlItemHandleIcon = helper.node("span|class:button-icon icon-reorder");
|
||||
itemGroupControlItemHandle.appendChild(itemGroupControlItemHandleIcon);
|
||||
groupControl.appendChild(itemGroupControlItemHandle);
|
||||
var groupControlItemEdit = helper.node("button|class:button group-control-item group-control-item-edit,tabindex:-1,title:Edit this group");
|
||||
var groupControlItemEditIcon = helper.node("span|class:icon-edit");
|
||||
var groupControlItemEditBaselineAlignmentCharacter = helper.node("span:-|class:baseline-alignment-icon-character,aria-hidden:true");
|
||||
groupControlItemEdit.appendChild(groupControlItemEditBaselineAlignmentCharacter);
|
||||
groupControlItemEdit.appendChild(groupControlItemEditIcon);
|
||||
groupControl.appendChild(groupControlItemEdit);
|
||||
|
||||
var itemGroupControlItemDown = helper.node("button|class:button button-small group-control-item group-control-item-down,tabindex:-1,title:Move this group down");
|
||||
var itemGroupControlItemDownIcon = helper.node("span|class:button-icon icon-arrow-down");
|
||||
itemGroupControlItemDown.appendChild(itemGroupControlItemDownIcon);
|
||||
groupControl.appendChild(itemGroupControlItemDown);
|
||||
|
||||
var itemGroupControlItemEdit = helper.node("button|class:button button-small group-control-item group-control-item-edit,tabindex:-1,title:Edit this group");
|
||||
var itemGroupControlItemEditIcon = helper.node("span|class:button-icon icon-edit");
|
||||
itemGroupControlItemEdit.appendChild(itemGroupControlItemEditIcon);
|
||||
groupControl.appendChild(itemGroupControlItemEdit);
|
||||
|
||||
var itemGroupControlItemRemove = helper.node("button|class:button button-small group-control-item group-control-item-remove,tabindex:-1,title:Remove this group");
|
||||
var itemGroupControlItemRemoveIcon = helper.node("span|class:button-icon icon-close");
|
||||
itemGroupControlItemRemove.appendChild(itemGroupControlItemRemoveIcon);
|
||||
groupControl.appendChild(itemGroupControlItemRemove);
|
||||
var groupControlItemRemove = helper.node("button|class:button group-control-item group-control-item-remove,tabindex:-1,title:Remove this group");
|
||||
var groupControlItemRemoveIcon = helper.node("span|class:icon-close");
|
||||
var groupControlItemRemoveBaselineAlignmentCharacter = helper.node("span:-|class:baseline-alignment-icon-character,aria-hidden:true");
|
||||
groupControlItemRemove.appendChild(groupControlItemRemoveBaselineAlignmentCharacter);
|
||||
groupControlItemRemove.appendChild(groupControlItemRemoveIcon);
|
||||
groupControl.appendChild(groupControlItemRemove);
|
||||
|
||||
if (state.get.current().search) {
|
||||
itemGroupControlItemUp.disabled = true;
|
||||
helper.addClass(itemGroupControlItemHandle, "disabled");
|
||||
itemGroupControlItemDown.disabled = true;
|
||||
groupControlItemUp.disabled = true;
|
||||
helper.addClass(groupControlItemHandle, "disabled");
|
||||
groupControlItemDown.disabled = true;
|
||||
};
|
||||
|
||||
var copyStagedGroup = JSON.parse(JSON.stringify(stagedGroup));
|
||||
groupHeaderItemControl.appendChild(groupControl);
|
||||
|
||||
itemGroupControlItemUp.addEventListener("click", function(event) {
|
||||
groupControlItemUp.addEventListener("click", function(event) {
|
||||
render.move.group.up(copyStagedGroup);
|
||||
}, false);
|
||||
|
||||
itemGroupControlItemDown.addEventListener("click", function() {
|
||||
groupControlItemDown.addEventListener("click", function() {
|
||||
render.move.group.down(copyStagedGroup);
|
||||
}, false);
|
||||
|
||||
itemGroupControlItemEdit.addEventListener("click", function() {
|
||||
groupControlItemEdit.addEventListener("click", function() {
|
||||
edit.group.open(copyStagedGroup);
|
||||
}, false);
|
||||
|
||||
itemGroupControlItemRemove.addEventListener("click", function() {
|
||||
groupControlItemRemove.addEventListener("click", function() {
|
||||
render.remove.group(copyStagedGroup);
|
||||
}, false);
|
||||
|
||||
|
||||
var groupOpenall = helper.node("div|class:group-openall form-group");
|
||||
|
||||
var groupOpenallItem = helper.node("button|class:button group-openall-item,tabindex:-1,title:Open all Bookmarks in this group");
|
||||
var groupOpenallItemText = helper.node("span:Open all|class:button-text");
|
||||
groupOpenallItem.appendChild(groupOpenallItemText);
|
||||
groupOpenall.appendChild(groupOpenallItem);
|
||||
|
||||
|
||||
if (state.get.current().group.openAll.style == "clear") {
|
||||
helper.addClass(groupOpenallItem, "button-link");
|
||||
};
|
||||
|
||||
groupOpenallItem.addEventListener("click", function() {
|
||||
console.log(copyStagedGroup.group.items);
|
||||
copyStagedGroup.group.items.forEach(function(arrayItem, index) {
|
||||
chrome.tabs.create({
|
||||
url: arrayItem.url
|
||||
});
|
||||
})
|
||||
});
|
||||
|
||||
groupHeaderItemOpenall.appendChild(groupOpenall);
|
||||
|
||||
groupHeader.appendChild(groupHeaderItemControl);
|
||||
if (state.get.current().group.name.show) {
|
||||
groupHeader.appendChild(groupHeaderItemName);
|
||||
};
|
||||
if (state.get.current().group.openAll.show && stagedGroup.group.items.length > 0) {
|
||||
groupHeader.appendChild(groupHeaderItemOpenall);
|
||||
};
|
||||
group.appendChild(groupHeader);
|
||||
group.appendChild(groupBody);
|
||||
|
||||
return group;
|
||||
},
|
||||
form: function(override) {
|
||||
@ -524,9 +569,17 @@ var link = (function() {
|
||||
|
||||
return form;
|
||||
},
|
||||
size: function() {
|
||||
var html = helper.e("html");
|
||||
html.style.setProperty("--group-name-size", state.get.current().group.name.size + "em");
|
||||
name: {
|
||||
size: function() {
|
||||
var html = helper.e("html");
|
||||
html.style.setProperty("--group-name-size", state.get.current().group.name.size + "em");
|
||||
}
|
||||
},
|
||||
openall: {
|
||||
size: function() {
|
||||
var html = helper.e("html");
|
||||
html.style.setProperty("--group-openall-size", state.get.current().group.openAll.size + "em");
|
||||
}
|
||||
},
|
||||
border: function() {
|
||||
var html = helper.e("html");
|
||||
@ -1811,7 +1864,8 @@ var link = (function() {
|
||||
mod.add.item.close();
|
||||
mod.add.group.close();
|
||||
groupAndItems();
|
||||
render.group.size();
|
||||
render.group.name.size();
|
||||
render.group.openall.size();
|
||||
render.group.border();
|
||||
render.item.color.custom();
|
||||
render.item.size();
|
||||
|
||||
@ -230,6 +230,11 @@ var state = (function() {
|
||||
show: true,
|
||||
size: 1
|
||||
},
|
||||
openAll: {
|
||||
show: true,
|
||||
size: 1,
|
||||
style: "box"
|
||||
},
|
||||
border: 0,
|
||||
order: "headerbody",
|
||||
add: false,
|
||||
@ -405,6 +410,9 @@ var state = (function() {
|
||||
name: {
|
||||
size: 1
|
||||
},
|
||||
openAll: {
|
||||
size: 1
|
||||
},
|
||||
border: 0
|
||||
},
|
||||
layout: {
|
||||
|
||||
@ -865,6 +865,14 @@ var update = (function() {
|
||||
"4.41.0": function(data) {
|
||||
data.state.header.search.newTab = false;
|
||||
return data;
|
||||
},
|
||||
"4.42.0": function(data) {
|
||||
data.state.group.openAll = {
|
||||
show: true,
|
||||
size: 1,
|
||||
style: "box"
|
||||
};
|
||||
return data;
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
var version = (function() {
|
||||
|
||||
var current = "4.41.0";
|
||||
var current = "4.42.0";
|
||||
|
||||
var name = "Naughty Goose";
|
||||
|
||||
|
||||
@ -2,7 +2,7 @@
|
||||
"name": "nightTab",
|
||||
"short_name": "nightTab",
|
||||
"description": "A neutral new tab page accented with a chosen colour. Customise the layout, style, background and bookmarks in nightTab.",
|
||||
"version": "4.41.0",
|
||||
"version": "4.42.0",
|
||||
"manifest_version": 2,
|
||||
"chrome_url_overrides": {
|
||||
"newtab": "index.html"
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user