Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

2807: Labels now have a 0.5 outline #2957

Merged
merged 17 commits into from
Aug 22, 2022
Merged

2807: Labels now have a 0.5 outline #2957

Show file tree
Hide file tree
Changes from 11 commits
Commits
Show all changes
17 commits
Select commit Hold shift + click to select a range
83ce984
Label icons now have a .5 outline
bnelson05 Jul 5, 2022
b961471
Final 0.5 label icon outline
bnelson05 Jul 8, 2022
71b26cc
Final label icon outlines
bnelson05 Jul 13, 2022
528f27b
Outline disappears when label is hidden, label size adjustment
bnelson05 Jul 14, 2022
8253f94
Working on referencing CSS classes
bnelson05 Jul 18, 2022
ed04a8c
Outlines working in Gallery and Validate, working on Explore
bnelson05 Jul 21, 2022
5fa9859
Outlines now use CSS class
bnelson05 Jul 26, 2022
7ca0b51
Merge branch 'develop' into 2807-outlines-for-new-label-icons
misaugstad Aug 1, 2022
1d1b0cf
Fixed hide/show label button issue and centered obstacle label
bnelson05 Aug 3, 2022
bb34d3e
Merge branch '2807-outlines-for-new-label-icons' of https://github.co…
bnelson05 Aug 3, 2022
245d9ed
Merge branch 'develop' into 2807-outlines-for-new-label-icons
misaugstad Aug 8, 2022
13ea256
Fixed Uncaught TypeError bug
bnelson05 Aug 10, 2022
f0a009b
Merge branch '2807-outlines-for-new-label-icons' of https://github.co…
bnelson05 Aug 10, 2022
e6a3a63
Merge branch 'develop' into 2807-outlines-for-new-label-icons
misaugstad Aug 22, 2022
7a40647
comment and whitespace updates
misaugstad Aug 22, 2022
fbb4cdc
adds outline to label icons on user dashboard
misaugstad Aug 22, 2022
84dd15d
moves some CSS
misaugstad Aug 22, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 3 additions & 0 deletions public/javascripts/Gallery/css/cards.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -156,6 +156,9 @@ with respect to the image holder. This allows the validation menu to be placed o
position: absolute;
width: 1.1vw;
z-index: 1;
border: 1px solid black;
border-radius: 100%;
outline: 0.5px solid white;
}

.validation-button, .validation-button-selected {
Expand Down
2 changes: 1 addition & 1 deletion public/javascripts/Gallery/src/modal/GalleryPanorama.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -176,7 +176,7 @@
pano: self.panorama,
position: {heading: pos.heading, pitch: pos.pitch},
icon: url,
size: new google.maps.Size(20, 20),
size: new google.maps.Size(22, 22),
anchor: new google.maps.Point(10, 10)
})
};
Expand Down
11 changes: 11 additions & 0 deletions public/javascripts/SVLabel/src/SVLabel/label/Label.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -423,6 +423,17 @@ function Label (svl, pathIn, params) {
// Renders the label image.
path.render2(ctx, pov);

//Draws label outline
misaugstad marked this conversation as resolved.
Show resolved Hide resolved
ctx.lineWidth = .7;
misaugstad marked this conversation as resolved.
Show resolved Hide resolved
ctx.beginPath();
ctx.arc(getCoordinate().x, getCoordinate().y, 15.3, 0, 2 * Math.PI);
ctx.strokeStyle = 'black';
ctx.stroke();
ctx.beginPath();
ctx.arc(getCoordinate().x, getCoordinate().y, 16.2, 0, 2 * Math.PI);
ctx.strokeStyle = 'white';
ctx.stroke();

// Only render severity warning if there's a severity option.
if (properties.labelType !== 'Occlusion' && properties.labelType !== 'Signal') {
if (properties.severity === null) {
Expand Down
4 changes: 4 additions & 0 deletions public/javascripts/SVValidate/src/label/LabelVisibilityControl.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -40,6 +40,8 @@ function LabelVisibilityControl () {
htmlString = `<img src="assets/javascripts/SVValidate/img/HideLabel.svg" class="label-visibility-control-button-icon" alt="Hide Label">
<br /><u>H</u>ide Label</button>`;
labelVisibilityControlButton.html(htmlString);
let marker = document.getElementById('validate-pano-marker');
marker.classList.add('icon-outline');
}

/**
Expand All @@ -55,6 +57,8 @@ function LabelVisibilityControl () {
htmlString = `<img src="assets/javascripts/SVValidate/img/ShowLabel.svg" class="label-visibility-control-button-icon" alt="Hide Label">
<br />S<u>h</u>ow Label</button>`;
labelVisibilityControlButton.html(htmlString);
let marker = document.getElementById('validate-pano-marker');
marker.classList.remove('icon-outline');
}

/**
Expand Down
2 changes: 1 addition & 1 deletion public/javascripts/SVValidate/src/panorama/Panorama.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -238,7 +238,7 @@ function Panorama (label) {
pano: panorama,
position: {heading: pos.heading, pitch: pos.pitch},
icon: url,
size: new google.maps.Size(currentLabel.getRadius() * 2, currentLabel.getRadius() * 2),
size: new google.maps.Size(currentLabel.getRadius() * 2 + 2, currentLabel.getRadius() * 2 + 2),
anchor: new google.maps.Point(currentLabel.getRadius(), currentLabel.getRadius()),
zIndex: 2
});
Expand Down
1 change: 1 addition & 0 deletions public/javascripts/common/Panomarker.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -400,6 +400,7 @@
}

var marker = document.createElement('div');
marker.classList.add('icon-outline');

// Basic style attributes for every marker
marker.style.position = 'absolute';
Expand Down
6 changes: 6 additions & 0 deletions public/stylesheets/main.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -71,6 +71,12 @@ footer {
* Custom styles
*/

.icon-outline {
border: 1px solid black;
border-radius: 25px;
outline: .5px solid white;
}

.stats-grid{
display: flex;
}
Expand Down