MontoyaTech/ignite-html-material
MontoyaTech/ignite-html-material
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Fixed bugs within editable image and working on making it more material like.

Browse Source
This commit is contained in:
Matt Mo 2021-08-17 18:59:56 -07:00
parent 48c8b6573a
commit 01c1dfa0c6
1 changed files with 13 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

37
editable-image.js
View File

@ -24,21 +24,8 @@ class EditableImage extends IgniteElement {
flex: 1;
}
mt-editable-image.source:hover:after {
position: absolute;
font-family: 'Font Awesome 5 Pro';
font-weight: 900;
content: '\\f332';
color: #fff;
font-size: 2.2em;
display: flex;
align-items: center;
justify-content: center;
}
mt-editable-image.source:hover {
cursor: pointer;
filter: brightness(0.9);
}
`;
}
@ -89,20 +76,22 @@ class EditableImage extends IgniteElement {
event.stopPropagation();
//Get the uploaded file from the file input.
var file = this.fileInput.files[0];
if (this.fileInput.files.length > 0) {
var file = this.fileInput.files[0];
//Create a reader to read in the file.
var reader = new FileReader();
reader.onload = (event) => {
this.source = event.target.result;
//Create a reader to read in the file.
var reader = new FileReader();
reader.onload = (event) => {
this.source = event.target.result;
//Invoke a native change event now that we have
//the image file ready.
this.dispatchEvent(new Event("change"));
};
//Invoke a native change event now that we have
//the image file ready.
this.dispatchEvent(new Event("change"));
};
//Read it.
reader.readAsDataURL(file);
//Read it.
reader.readAsDataURL(file);
}
}
onClick() {