Fixed context menu, reworked and restyled option page, updated Makefile
This commit is contained in:
4
.gitignore
vendored
4
.gitignore
vendored
@@ -1,2 +1,2 @@
|
|||||||
/target
|
*.zip
|
||||||
**/*.rs.bk
|
*.crx
|
||||||
|
@@ -1,4 +1,4 @@
|
|||||||
import { updateBrowserAction, openInMPV } from "./common.js";
|
import { getOptions, openInMPV, updateBrowserAction } from "./common.js";
|
||||||
|
|
||||||
updateBrowserAction();
|
updateBrowserAction();
|
||||||
|
|
||||||
@@ -8,7 +8,13 @@ updateBrowserAction();
|
|||||||
id: `open${item}inmpv`,
|
id: `open${item}inmpv`,
|
||||||
contexts: [item],
|
contexts: [item],
|
||||||
onclick: (info, tab) => {
|
onclick: (info, tab) => {
|
||||||
openInMPV(tab.id, info[linkType]);
|
getOptions((options) => {
|
||||||
|
console.log("Got options: ", options);
|
||||||
|
openInMPV(tab.id, info[linkType], {
|
||||||
|
mode: options.iconActionOption,
|
||||||
|
...options,
|
||||||
|
});
|
||||||
|
});
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
@@ -18,12 +18,16 @@ body {
|
|||||||
margin: 0;
|
margin: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.item:not(:last-child) {
|
||||||
|
margin-bottom: 0.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
.option {
|
.option {
|
||||||
padding: 1rem;
|
padding: 1rem;
|
||||||
|
border-top: 1px solid #e4e4e4;
|
||||||
}
|
}
|
||||||
|
|
||||||
.option:not(:last-child) {
|
.option:not(:last-child) {
|
||||||
border-top: 1px solid #e4e4e4;
|
|
||||||
border-bottom: 1px solid #e4e4e4;
|
border-bottom: 1px solid #e4e4e4;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -32,8 +36,28 @@ body {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.option .option-details {
|
.option .option-details {
|
||||||
|
padding-left: 0.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.option .option-details:not(:first-child) {
|
||||||
margin-top: 0.5rem;
|
margin-top: 0.5rem;
|
||||||
padding-left: 1rem;
|
}
|
||||||
|
|
||||||
|
.option .option-details:not(:last-child) {
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.option-details > p {
|
||||||
|
color: rgb(70, 70, 70);
|
||||||
|
margin-block: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
input[type="text"] {
|
||||||
|
font-family: monospace;
|
||||||
|
border: 1px solid rgb(169, 169, 169);
|
||||||
|
margin: 0 0 0.5rem 0;
|
||||||
|
padding: 0.2rem;
|
||||||
|
border-radius: 6px;
|
||||||
}
|
}
|
||||||
|
|
||||||
select {
|
select {
|
||||||
@@ -41,12 +65,4 @@ select {
|
|||||||
padding: 0.2rem;
|
padding: 0.2rem;
|
||||||
border-radius: 6px;
|
border-radius: 6px;
|
||||||
background-color: #fff;
|
background-color: #fff;
|
||||||
}
|
|
||||||
|
|
||||||
input[type="text"] {
|
|
||||||
font-family: monospace;
|
|
||||||
border: 1px solid rgb(169, 169, 169);
|
|
||||||
margin: 0.1rem;
|
|
||||||
padding: 0.2rem;
|
|
||||||
border-radius: 6px;
|
|
||||||
}
|
}
|
@@ -10,7 +10,7 @@
|
|||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<h2 class="title">Player options:</h2>
|
<h2 class="title">Player options</h2>
|
||||||
<div class="option">
|
<div class="option">
|
||||||
<label class="option-title"> Select the mpv-based player to use</label>
|
<label class="option-title"> Select the mpv-based player to use</label>
|
||||||
<br>
|
<br>
|
||||||
@@ -23,31 +23,37 @@
|
|||||||
<label class="option-title"><input type="checkbox" name="useCustomFlags"> Use custom command line flags</label>
|
<label class="option-title"><input type="checkbox" name="useCustomFlags"> Use custom command line flags</label>
|
||||||
<div class="option-details" id="customFlagsContainer">
|
<div class="option-details" id="customFlagsContainer">
|
||||||
<input type="text" name="customFlags">
|
<input type="text" name="customFlags">
|
||||||
<p style="color: rgb(70, 70, 70);"> Note: do include hyphens (e.g.<span style="font-family: monospace;">'--fs'</span>)</p>
|
<p> Note: do include hyphens (e.g.<span style="font-family: monospace;">'--fs'</span>)</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<h2 class="title">When clicking on the extension icon:</h2>
|
<h2 class="title">When clicking on the extension icon</h2>
|
||||||
<div class="option">
|
<div class="option">
|
||||||
<label class="option-title"><input type="radio" name="iconAction" value="clickOnly"> Open current page in mpv</label>
|
<div class="item">
|
||||||
<div class="option-details">
|
<label><input type="radio" name="iconAction" value="clickOnly"> Open current page in mpv</label>
|
||||||
<div class="item">
|
</div>
|
||||||
<label><input type="radio" name="iconActionOption" value="direct"> Open directly</label>
|
<div class="item">
|
||||||
</div>
|
<label><input type="radio" name="iconAction" value="menu"> Show a menu to select action</label>
|
||||||
<div class="item">
|
|
||||||
<label><input type="radio" name="iconActionOption" value="fullScreen"> Enter full screen</label>
|
|
||||||
</div>
|
|
||||||
<div class="item">
|
|
||||||
<label><input type="radio" name="iconActionOption" value="pip"> Enter Picture-in-Picture</label>
|
|
||||||
</div>
|
|
||||||
<div class="item">
|
|
||||||
<label><input type="radio" name="iconActionOption" value="enqueue"> Add to queue</label>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="container">
|
||||||
|
<h2 class="title">Default open action</h2>
|
||||||
<div class="option">
|
<div class="option">
|
||||||
<label class="option-title"><input type="radio" name="iconAction" value="menu"> Show a menu to select action</label>
|
<div class="option-details"><p>Applies to "Open current page in mpv" and the right click context menu</p></div>
|
||||||
|
<div class="item">
|
||||||
|
<label><input type="radio" name="iconActionOption" value="direct"> Open directly</label>
|
||||||
|
</div>
|
||||||
|
<div class="item">
|
||||||
|
<label><input type="radio" name="iconActionOption" value="fullScreen"> Enter full screen</label>
|
||||||
|
</div>
|
||||||
|
<div class="item">
|
||||||
|
<label><input type="radio" name="iconActionOption" value="pip"> Enter Picture-in-Picture</label>
|
||||||
|
</div>
|
||||||
|
<div class="item">
|
||||||
|
<label><input type="radio" name="iconActionOption" value="enqueue"> Add to queue</label>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<script src="options.js" type="module"></script>
|
<script src="options.js" type="module"></script>
|
||||||
|
4
Makefile
4
Makefile
@@ -7,7 +7,7 @@ SRCS = src/curl.hpp \
|
|||||||
src/main.cpp
|
src/main.cpp
|
||||||
|
|
||||||
all:
|
all:
|
||||||
$(CXX) $(CXXFLAGS) -o open-in-mpv src/main.cpp
|
$(CXX) $(CXXFLAGS) -march=x86-64 -mtune=generic -O2 -pipe -fno-plt -o open-in-mpv src/main.cpp
|
||||||
|
|
||||||
install: all
|
install: all
|
||||||
cp open-in-mpv /usr/bin
|
cp open-in-mpv /usr/bin
|
||||||
@@ -21,4 +21,4 @@ firefox:
|
|||||||
@rm Firefox/{*.html,*.js,*.png,*.css}
|
@rm Firefox/{*.html,*.js,*.png,*.css}
|
||||||
|
|
||||||
clean:
|
clean:
|
||||||
@rm open-in-mpv Firefox.zip
|
@rm -f open-in-mpv Firefox.zip Chrome.crx
|
Reference in New Issue
Block a user