Fixed context menu, reworked and restyled option page, updated Makefile

This commit is contained in:
Baldomo
2020-12-22 19:20:22 +01:00
parent 47c646ce51
commit 98de7307d1
5 changed files with 62 additions and 34 deletions

4
.gitignore vendored
View File

@@ -1,2 +1,2 @@
/target *.zip
**/*.rs.bk *.crx

View File

@@ -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,
});
});
}, },
}); });
}); });

View File

@@ -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;
} }

View File

@@ -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>

View File

@@ -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