Skip to content

Commit

Permalink
Got some more buttons connected in the main toolbar
Browse files Browse the repository at this point in the history
  • Loading branch information
@FruitfulApproach
FruitfulApproach committed Dec 6, 2023
1 parent 9a5af21 commit 6414f30
Show file tree
Hide file tree
Showing 10 changed files with 107 additions and 52 deletions.
Binary file modified QuiverBee.bsdesign
View file
Binary file not shown.
Binary file added Quiver🐝.bsdesign
View file
Binary file not shown.
73 changes: 44 additions & 29 deletions assets/css/Navbar-Right-Links-icons.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -55,24 +55,12 @@
border-radius: 50%;
}

@media (max-width: 768px) {
@media (max-width: 1079px) {
#quiver-buttons span {
display: none;
}
}

@media (min-width: 768px) {
#quiver-buttons span {
margin-right: 8px;
}
}

@media (max-width: 768px) {
#quiver-buttons > button > span {
display: none;
}
}

.btn-group-vertical > .btn, .btn-group > .btn {
position: relative;
flex: 1 1 auto;
Expand All @@ -83,38 +71,65 @@
}
}

#quiver-buttons .btn:hover {
box-shadow: 0px 0px 5px 3px var(--bs-primary);
}

.border {
border: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color)!important;
}

@media (max-width: 320px) {
@media (max-width: 1079px) {
.navbar-brand img {
display: none;
}
}

.navbar-brand {
display: none;
@media (min-width: 1080px) {
.navbar-brand span {
font-size: 31px;
}
}

@media (max-width: 768px) {
.navbar-brand img {
display: none;
#quiver-buttons .shortcut-text {
opacity: 0.5;
font-size: small;
}

.navbar .btn-group {
border: none!important;
}

@media (max-width: 1079px) {
.navbar .btn-group > .btn {
margin-right: 4px;
width: 37px;
height: 37px;
margin-top: 4px;
}
}

@media (min-width: 768px) {
.navbar-brand span {
font-size: 37px;
@media (max-width: 411px) {
.navbar .btn-group {
margin-right: -4px;
/*width: 40px;*/
height: 40px;
}
}

#quiver-buttons .shortcut-text {
opacity: 0.5;
font-size: small;
@media (min-width: 412px) {
.navbar .btn-group {
margin-right: auto;
}
}

@media (min-width: 1080px) {
.navbar .btn-group > .btn {
font-size: 12pt;
margin-right: 8px;
height: 37px;
margin-top: 8px;
}
}

#quiver-buttons .dropdown > a > svg, #quiver-buttons button > svg {
width: 100%;
height: auto;
}

Binary file added assets/img/Untitled.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/img/quiver-social-1280x640.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/img/quiver-social-source.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
2 changes: 2 additions & 0 deletions assets/js/jquery.min.js
View file

Large diffs are not rendered by default.

14 changes: 7 additions & 7 deletions index.html
View file
Original file line number Diff line number Diff line change
@@ -1,13 +1,13 @@
<!DOCTYPE html><html data-bs-theme="light" lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no"><title>QuiverBee</title><link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css"><link rel="stylesheet" href="assets/fonts/font-awesome.min.css"><link rel="stylesheet" href="assets/css/styles.min.css"><script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.9.2/dist/umd/popper.min.js" integrity="sha384-IQsoLXl5PILFhosVNubq5LC7Qb9DXgDA9i+tQ8Zj3iwWAwPtgFTxbJ8NT4GN1R8p" crossorigin="anonymous"></script>
</head><body class="d-sm-flex justify-content-sm-center" style="margin: 0;width: 100%;height: 100%;font-size: 37px;transform: perspective(0px);"><nav class="navbar navbar-expand sticky-top bg-body bg-opacity-10 bg-gradient d-flex justify-content-end py-0" style="width: 100%;pointer-events: none;z-index: 1;margin: 0;margin-top: 0px;height: auto;backdrop-filter: opacity(0) blur(0px) brightness(200%) contrast(200%) saturate(0%) sepia(0%);transform: scale(1);position: fixed;"><div class="container-fluid"><a class="navbar-brand d-flex align-items-center" href="https://github.com/enjoysmath/quiver-bee" style="width: auto;margin-right: -2px;pointer-events: all;"><span class="bounce animated" style="position: absolute;"><img src="assets/img/quiver.svg" width="95" height="75">🐝</span></a><div class="btn-group btn-group-sm border rounded-pill border-0 border-white shadow-none align-self-end border-0" role="group" id="quiver-buttons" style="border: none;pointer-events: all;position: sticky;height: 46px;margin-left: auto;margin-top: 1px;border-width: 0px;border-style: none;border-top-color: rgb(33,;border-right-color: 37,;border-bottom-color: 41);border-left-color: 37,;border-radius: 0;"><button class="btn btn-primary d-inline-flex float-start d-md-flex align-items-center align-items-md-center align-items-lg-center" type="button" style="border-radius: 8px;"><br><br><br><span>Save&nbsp;</span><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-cloud-arrow-up-fill" style="font-size: 30px;margin-left: 0px;">
</head><body class="d-sm-flex justify-content-sm-center" style="margin: 0;width: 100%;height: 100%;font-size: 37px;transform: perspective(0px);"><nav class="navbar navbar-expand sticky-top bg-body bg-opacity-10 bg-gradient d-flex justify-content-end py-0" style="width: 100%;pointer-events: none;z-index: 1;margin: 0;margin-top: 0px;height: auto;backdrop-filter: opacity(0) blur(0px) brightness(200%) contrast(200%) saturate(0%) sepia(0%);transform: scale(1);position: fixed;"><div class="container-fluid"><a class="navbar-brand d-flex align-items-center" href="https://github.com/enjoysmath/quiver-bee" style="width: auto;margin-right: -2px;pointer-events: all;"><span class="bounce animated" style="position: absolute;"><img src="assets/img/quiver.svg" width="95" height="75">🐝</span></a><div class="btn-group btn-group-sm border rounded-pill border-0 border-white shadow-none align-self-end border-0" role="group" id="quiver-buttons" style="border: none;pointer-events: all;position: sticky;height: 46px;margin-left: auto;margin-top: 1px;border-width: 0px;border-style: none;border-top-color: rgb(33,;border-right-color: 37,;border-bottom-color: 41);border-left-color: 37,;border-radius: 0;"><button class="btn btn-primary d-inline-flex float-start d-md-flex align-items-center align-items-md-center align-items-lg-center" type="button" style="border-radius: 8px;" onclick="quiverUi.user_save_action()"><br><br><br><span>Save&nbsp;</span><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-cloud-arrow-up-fill" style="font-size: 30px;margin-left: 0px;">
<path d="M8 2a5.53 5.53 0 0 0-3.594 1.342c-.766.66-1.321 1.52-1.464 2.383C1.266 6.095 0 7.555 0 9.318 0 11.366 1.708 13 3.781 13h8.906C14.502 13 16 11.57 16 9.773c0-1.636-1.242-2.969-2.834-3.194C12.923 3.999 10.69 2 8 2zm2.354 5.146a.5.5 0 0 1-.708.708L8.5 6.707V10.5a.5.5 0 0 1-1 0V6.707L6.354 7.854a.5.5 0 1 1-.708-.708l2-2a.5.5 0 0 1 .708 0l2 2z"></path>
</svg></button><button class="btn btn-primary d-inline-flex float-start d-md-flex align-items-center align-items-md-center align-items-lg-center" type="button" style="border-radius: 8px;"><span>Undo&nbsp;</span><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-arrow-90deg-left" style="font-size: 30px;margin-left: 0px;">
</svg></button><button class="btn btn-primary d-inline-flex float-start d-md-flex align-items-center align-items-md-center align-items-lg-center" type="button" style="border-radius: 8px;" onclick="quiverUi.user_undo_action()"><span>Undo&nbsp;</span><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-arrow-90deg-left" style="font-size: 30px;margin-left: 0px;">
<path fill-rule="evenodd" d="M1.146 4.854a.5.5 0 0 1 0-.708l4-4a.5.5 0 1 1 .708.708L2.707 4H12.5A2.5 2.5 0 0 1 15 6.5v8a.5.5 0 0 1-1 0v-8A1.5 1.5 0 0 0 12.5 5H2.707l3.147 3.146a.5.5 0 1 1-.708.708l-4-4z"></path>
</svg><br><br><br></button><button class="btn btn-primary d-inline-flex float-start d-md-flex align-items-center align-items-md-center align-items-lg-center" type="button" style="border-radius: 8px;"><br><br><br><span>Redo&nbsp;</span><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-arrow-90deg-right" style="font-size: 30px;margin-left: 0px;">
</svg><br><br><br></button><button class="btn btn-primary d-inline-flex float-start d-md-flex align-items-center align-items-md-center align-items-lg-center" type="button" style="border-radius: 8px;" onclick="quiverUi.user_redo_action()"><span>Redo&nbsp;</span><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-arrow-90deg-right" style="font-size: 31px;margin-left: 0px;" onclick="quiverUi.user_redo_action()">
<path fill-rule="evenodd" d="M14.854 4.854a.5.5 0 0 0 0-.708l-4-4a.5.5 0 0 0-.708.708L13.293 4H3.5A2.5 2.5 0 0 0 1 6.5v8a.5.5 0 0 0 1 0v-8A1.5 1.5 0 0 1 3.5 5h9.793l-3.147 3.146a.5.5 0 0 0 .708.708l4-4z"></path>
</svg></button><div class="dropdown btn-group d-lg-flex align-items-lg-center btn btn-primary" role="group" data-bs-theme="light" style="border-radius: 8px;"><a class="d-flex d-md-flex align-items-center align-items-md-center" aria-expanded="false" data-bs-toggle="dropdown" href="#" style="color: #ffffff;text-decoration: none;width: 100%;height: 100%;padding-top: 0px;padding-right: 0px;margin-right: 0px;padding-left: 0px;margin-left: 0px;margin-top: 0px;border-radius: 8px;"><span>Select&nbsp;</span><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-cursor" style="font-size: 32px;margin-left: 0px;width: 30px;height: 30px;">
</svg><br><br><br></button><div class="dropdown btn-group d-lg-flex align-items-lg-center btn btn-primary" role="group" data-bs-theme="light" style="border-radius: 8px;"><a class="d-flex d-md-flex align-items-center align-items-md-center" aria-expanded="false" data-bs-toggle="dropdown" href="#" style="color: #ffffff;text-decoration: none;width: 100%;height: 100%;padding-top: 0px;padding-right: 0px;margin-right: 0px;padding-left: 0px;margin-left: 0px;margin-top: 0px;border-radius: 8px;"><span>Select&nbsp;</span><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-cursor" style="font-size: 32px;margin-left: 0px;width: 30px;height: 30px;">
<path d="M14.082 2.182a.5.5 0 0 1 .103.557L8.528 15.467a.5.5 0 0 1-.917-.007L5.57 10.694.803 8.652a.5.5 0 0 1-.006-.916l12.728-5.657a.5.5 0 0 1 .556.103zM2.25 8.184l3.897 1.67a.5.5 0 0 1 .262.263l1.67 3.897L12.743 3.52 2.25 8.184z"></path>
</svg></a><div class="dropdown-menu dropdown-menu-start border-1 border-primary shadow-none" style="--bs-dropdown-min-width: 5em;margin-top: 10px;background: rgb(255, 255, 255);border-radius: 8px;border-width: 2px;margin-left: 0px;"><a class="dropdown-item d-md-flex align-items-md-center" href="#">All&nbsp;<span class="shortcut-text">(Ctrl+A)</span></a><a class="dropdown-item d-md-flex align-items-md-center" href="#">None&nbsp;<span class="shortcut-text">(Shift+Ctrl+A)</span></a></div></div><div class="dropdown btn-group d-lg-flex align-items-lg-center btn btn-primary" role="group" data-bs-theme="light" style="border-radius: 8px;"><a class="d-flex d-md-flex align-items-center align-items-md-center" aria-expanded="false" data-bs-toggle="dropdown" href="#" style="pointer-events: all;color: #ffffff;text-decoration: none;border-radius: 8px;"><span>Zoom&nbsp;</span><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-search" style="font-size: 0px;margin-top: 1px;position: static;display: inline;padding-bottom: 0px;width: 26px;height: 26px;margin-bottom: 3px;padding-right: 0px;margin-right: 5px;">
</svg></a><div class="dropdown-menu dropdown-menu-start border-1 border-primary shadow-none" style="--bs-dropdown-min-width: 5em;margin-top: 10px;background: rgb(255, 255, 255);border-radius: 8px;border-width: 2px;margin-left: 0px;"><a class="dropdown-item d-md-flex align-items-md-center" href="#" onclick="quiverUi.user_select_all_action()">All&nbsp;<span class="shortcut-text">(Ctrl+A)</span></a><a class="dropdown-item d-md-flex align-items-md-center" href="#" onclick="quiverUi.user_select_none_action()">None&nbsp;<span class="shortcut-text">(Shift+Ctrl+A)</span></a></div></div><div class="dropdown btn-group d-lg-flex align-items-lg-center btn btn-primary" role="group" data-bs-theme="light" style="border-radius: 8px;"><a class="d-flex d-md-flex align-items-center align-items-md-center" aria-expanded="false" data-bs-toggle="dropdown" href="#" style="pointer-events: all;color: #ffffff;text-decoration: none;border-radius: 8px;"><span>Zoom&nbsp;</span><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-search" style="font-size: 0px;margin-top: 1px;position: static;display: inline;padding-bottom: 0px;width: 26px;height: 26px;margin-bottom: 3px;padding-right: 0px;margin-right: 5px;">
<path d="M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001c.03.04.062.078.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1.007 1.007 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0z"></path>
</svg></a><div class="dropdown-menu dropdown-menu-end border-1 border-primary shadow-none" style="--bs-dropdown-min-width: 5em;margin-top: 10px;background: rgb(255, 255, 255);border-radius: 8px;border-width: 2px;margin-left: 0px;"><a class="dropdown-item d-md-flex align-items-md-center" href="#">In&nbsp;<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-zoom-in">
<path fill-rule="evenodd" d="M6.5 12a5.5 5.5 0 1 0 0-11 5.5 5.5 0 0 0 0 11zM13 6.5a6.5 6.5 0 1 1-13 0 6.5 6.5 0 0 1 13 0z"></path>
Expand All @@ -25,7 +25,7 @@
<line x1="3" y1="12" x2="5" y2="12"></line>
<line x1="12" y1="19" x2="12" y2="21"></line>
<line x1="19" y1="12" x2="21" y2="12"></line>
</svg>&nbsp;<span class="shortcut-text">(G)</span></a></div></div><div class="dropdown btn-group d-lg-flex align-items-lg-center btn btn-primary" role="group" data-bs-theme="light" style="border-radius: 8px;"><a class="d-flex d-md-flex align-items-center align-items-md-center" aria-expanded="false" data-bs-toggle="dropdown" href="#" style="pointer-events: all;color: #ffffff;text-decoration: none;border-radius: 8px;"><span>Share&nbsp;</span><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-share-fill" style="font-size: 30px;margin-left: 0px;">
</svg>&nbsp;<span class="shortcut-text">(G)</span></a></div></div><div class="dropdown btn-group d-lg-flex align-items-lg-center btn btn-primary" role="group" data-bs-theme="light" style="border-radius: 8px;"><a class="d-flex d-md-flex align-items-center align-items-md-center" aria-expanded="false" data-bs-toggle="dropdown" href="#" style="pointer-events: all;color: #ffffff;text-decoration: none;border-radius: 8px;"><span>Share&nbsp;</span><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-share-fill" style="font-size: 25px;margin-left: 0px;">
<path d="M11 2.5a2.5 2.5 0 1 1 .603 1.628l-6.718 3.12a2.499 2.499 0 0 1 0 1.504l6.718 3.12a2.5 2.5 0 1 1-.488.876l-6.718-3.12a2.5 2.5 0 1 1 0-3.256l6.718-3.12A2.5 2.5 0 0 1 11 2.5z"></path>
</svg></a><div class="dropdown-menu dropdown-menu-end border-1 border-primary shadow-none" style="--bs-dropdown-min-width: 5em;margin-top: 10px;background: rgb(255, 255, 255);border-radius: 8px;border-width: 2px;margin-left: 0px;"><a class="dropdown-item d-md-flex align-items-md-center" href="#">Shareable Link&nbsp;<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-link-45deg" style="font-size: 24px;">
<path d="M4.715 6.542 3.343 7.914a3 3 0 1 0 4.243 4.243l1.828-1.829A3 3 0 0 0 8.586 5.5L8 6.086a1.002 1.002 0 0 0-.154.199 2 2 0 0 1 .861 3.337L6.88 11.45a2 2 0 1 1-2.83-2.83l.793-.792a4.018 4.018 0 0 1-.128-1.287z"></path>
Expand All @@ -41,4 +41,4 @@
<path fill-rule="evenodd" d="M6.364 2.5a.5.5 0 0 1 .5-.5H13.5A1.5 1.5 0 0 1 15 3.5v10a1.5 1.5 0 0 1-1.5 1.5h-10A1.5 1.5 0 0 1 2 13.5V6.864a.5.5 0 1 1 1 0V13.5a.5.5 0 0 0 .5.5h10a.5.5 0 0 0 .5-.5v-10a.5.5 0 0 0-.5-.5H6.864a.5.5 0 0 1-.5-.5z"></path>
<path fill-rule="evenodd" d="M11 10.5a.5.5 0 0 1-.5.5h-5a.5.5 0 0 1 0-1h3.793L1.146 1.854a.5.5 0 1 1 .708-.708L10 9.293V5.5a.5.5 0 0 1 1 0v5z"></path>
</svg></a><a class="dropdown-item" href="#">Macros URL (?)</a><div class="dropdown-divider"></div><a class="dropdown-item d-md-flex align-items-md-center" href="#">Show Hints&nbsp;<span class="shortcut-text">(Shift+Ctrl+H)</span></a><a class="dropdown-item d-md-flex align-items-md-center" href="#">Show Queue&nbsp;<span class="shortcut-text"></span></a><a class="dropdown-item d-md-flex align-items-md-center" href="#">Shortcuts&nbsp;<span class="shortcut-text">(Ctrl+/)</span></a><a class="dropdown-item d-md-flex align-items-md-center" href="#">About</a></div></div></div></div></nav><div class="container" style="padding: 0px;width: 100%;height: 100%;margin: 0;max-width: 100%;"><iframe src="src/index.html" style="width:100vw;height:100vh;position:relative;display:flex;border:none;overflow:hidden" scrolling="yes" frameborder="0" allowTransparency="true"></iframe>
</div><script src="assets/bootstrap/js/bootstrap.min.js"></script><script src="assets/js/script.min.js"></script><script src="assets/js/quiver-interface.min.js"></script></body></html>
</div><script src="assets/js/jquery.min.js"></script><script src="assets/bootstrap/js/bootstrap.min.js"></script><script src="assets/js/script.min.js"></script><script src="assets/js/quiver-interface.min.js"></script></body></html>
Binary file removed src/QuiverBee Cartoon Flight Path Final.png
View file
Binary file not shown.
70 changes: 54 additions & 16 deletions src/ui.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -626,7 +626,53 @@ class UI {
{
const ui = this;
ui.history.undo(ui);
ui.toolbar.update(ui);
}

user_redo_action()
{
const ui = this;
ui.history.redo(ui);
}

user_save_action()
{
const ui = this;
const { data } = ui.quiver.export(
"base64",
ui.settings,
ui.options(),
ui.definitions(),
);
// `data` is the new URL.
history.pushState({}, "", data);

const url = window.location;

const index = url.indexOf("#q=");

if (index != -1)
{
const base64 = url.slice(index+3);

var test = base64;
}

parent.window.location = url;
}

user_select_all_action()
{
const ui = this;
ui.select(...ui.quiver.all_cells());
}

user_select_none_action()
{
const ui = this;
ui.deselect();
ui.panel.hide(ui);
ui.panel.label_input.parent.class_list.add("hidden");
ui.colour_picker.close();
}

/// Clear the current diagram. This also clears the history.
Expand Down Expand Up @@ -6107,47 +6153,39 @@ class Toolbar {
"Save",
[{ key: "S", modifier: true, context: Shortcuts.SHORTCUT_PRIORITY.Always }],
() => {
const { data } = ui.quiver.export(
"base64",
ui.settings,
ui.options(),
ui.definitions(),
);
// `data` is the new URL.
history.pushState({}, "", data);
ui.user_save_action();
},
);

add_action(
"Undo",
[{ key: "Z", modifier: true, context: Shortcuts.SHORTCUT_PRIORITY.Defer }],
ui.user_undo_action,
() => {
ui.user_undo_action();
}
);

add_action(
"Redo",
[{ key: "Z", modifier: true, shift: true, context: Shortcuts.SHORTCUT_PRIORITY.Defer }],
() => {
ui.history.redo(ui);
ui.user_redo_action();
},
);

add_action(
"Select all",
[{ key: "A", modifier: true, context: Shortcuts.SHORTCUT_PRIORITY.Defer }],
() => {
ui.select(...ui.quiver.all_cells());
ui.user_select_all_action();
},
);

add_action(
"Deselect all",
[{ key: "A", modifier: true, shift: true, context: Shortcuts.SHORTCUT_PRIORITY.Defer }],
() => {
ui.deselect();
ui.panel.hide(ui);
ui.panel.label_input.parent.class_list.add("hidden");
ui.colour_picker.close();
ui.user_select_none_action();
},
);

Expand Down

0 comments on commit 6414f30

Please sign in to comment.