Skip to content
This repository was archived by the owner on Jun 3, 2024. It is now read-only.

Submission: Added GH profile picture import option #6

Open
wants to merge 1 commit into
base: main
Choose a base branch
from
Open

Submission: Added GH profile picture import option #6

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
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: 2 additions & 1 deletion _i18n/messages.properties
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,4 +10,5 @@ Toolbar3=Edit and Download Final Image
Upload=Enhance Your Picture
placeholder=Choose File for Upload...
gui.loading=Processing Picture
gui.loadingLong=Please wait ...Processing Picture
gui.loadingLong=Please wait ...Processing Picture
btnGHImport=Import From Github
248 changes: 165 additions & 83 deletions app/profilePic/profilePic/controller/App.controller.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,98 +1,180 @@
/* eslint-disable no-undef */
/*eslint-env es6 */
"use strict";
sap.ui.define([
sap.ui.define(
[
"profilePic/controller/BaseController",
"sap/m/MessageToast",
"sap/ui/core/Core",
"sap/ui/model/json/JSONModel",
"sap/ui/Device",
"sap/suite/ui/commons/library"
],
function (BaseController, MessageToast, oCore, JSONModel, Device, SuiteLibrary) {
"sap/suite/ui/commons/library",
"sap/m/Dialog",
],
function (
BaseController,
MessageToast,
oCore,
JSONModel,
Device,
SuiteLibrary,
Dialog
) {
return BaseController.extend("profilePic.controller.App", {
onInit: function () {
var oImageEditor = this.getView().byId("image"),
oModel = new JSONModel({
blocked: true,
username: "",
ghRateLimit: {},
});

return BaseController.extend("profilePic.controller.App", {
onInit: function () {
var oImageEditor = this.getView().byId("image"),
oModel = new JSONModel({
blocked: true
})
this.getView().setModel(oModel);
if (!Device.browser.msie) {
// svg files are not supported in Internet Explorer
oImageEditor.setCustomShapeSrc(
sap.ui.require.toUrl("sap/suite/ui/commons/statusindicator") +
"/shapes/bulb.svg"
);
}
},

this.getView().setModel(oModel)
if (!Device.browser.msie) {
// svg files are not supported in Internet Explorer
oImageEditor.setCustomShapeSrc(sap.ui.require.toUrl("sap/suite/ui/commons/statusindicator") + "/shapes/bulb.svg")
}
},

uploadPressed: async function (oEvent) {
let view = this.getView()
let controller = view.getController()
let oFileUploader = view.byId("fileToUpload")
if (!oFileUploader.getValue()) {
MessageToast.show("Choose a file first")
return
}
let param = view.byId("uploadParam")
//param.setValue(oInput.getActivePage())
oFileUploader.getParameters()
var oImageEditor = this.getView().byId("image")
oImageEditor.applyVisibleCrop()
console.log(oImageEditor.getMode())
oFileUploader.getProcessedBlobsFromArray = async function (oBlobs) {
return new Promise(async (resolve, reject) => {
let newBlob = await oImageEditor.getImageAsBlob()
resolve([newBlob])
})
}
controller.startBusy()
oFileUploader.upload(true)
},

uploadStart: async function (oEvent) {
let view = this.getView()
let controller = view.getController()
controller.startBusy()
},
uploadPressed: async function (oEvent) {
let view = this.getView();
let controller = view.getController();
let oFileUploader = view.byId("fileToUpload");
if (!oFileUploader.getValue()) {
MessageToast.show("Choose a file first");
return;
}
let param = view.byId("uploadParam");
//param.setValue(oInput.getActivePage())
oFileUploader.getParameters();
var oImageEditor = this.getView().byId("image");
oImageEditor.applyVisibleCrop();
oFileUploader.getProcessedBlobsFromArray = async function (oBlobs) {
return new Promise(async (resolve, reject) => {
let newBlob = await oImageEditor.getImageAsBlob();
resolve([newBlob]);
});
};
controller.startBusy();
oFileUploader.upload(true);
},

uploadComplete: async function (oEvent) {
let view = this.getView()
let controller = view.getController()
let dataURL = "data:image/png;base64," + oEvent.getParameters().responseRaw
let oImageEditor = view.byId("image")
await oImageEditor.setSrc(dataURL)
controller.endBusy(controller)
},
uploadStart: async function (oEvent) {
let view = this.getView();
let controller = view.getController();
controller.startBusy();
},

onSaveAsPress: async function () {
let view = this.getView()
let controller = view.getController()
let oImageEditor = view.byId("image")
oImageEditor.openSaveDialog()
controller.openUrl('https://people.sap.com/', true)
uploadComplete: async function (oEvent) {
let view = this.getView();
let controller = view.getController();
let dataURL =
"data:image/png;base64," + oEvent.getParameters().responseRaw;
let oImageEditor = view.byId("image");
await oImageEditor.setSrc(dataURL);
controller.endBusy(controller);
},

},
onImageLoaded: async function (oEvent) {
let view = this.getView()
let oImageEditor = view.byId("image")
oImageEditor.zoomToFit()
oImageEditor.setCropAreaByRatio(1, 1)
oImageEditor.setMode(SuiteLibrary.ImageEditorMode.CropEllipse)
console.log(oImageEditor.getMode())



},
onFileChange: async function (oEvent) {
var oFile = oEvent.getParameter("files")[0],
oImageEditor = this.getView().byId("image")
if (!oFile) {
return
onSaveAsPress: async function () {
let view = this.getView();
let controller = view.getController();
let oImageEditor = view.byId("image");
oImageEditor.openSaveDialog();
controller.openUrl("https://people.sap.com/", true);
},
onImageLoaded: async function (oEvent) {
let view = this.getView();
let oImageEditor = view.byId("image");
oImageEditor.zoomToFit();
oImageEditor.setCropAreaByRatio(1, 1);
oImageEditor.setMode(SuiteLibrary.ImageEditorMode.CropRectangle);
},
onFileChange: async function (oEvent) {
var oFile = oEvent.getParameter("files")[0],
oImageEditor = this.getView().byId("image");
if (!oFile) {
return;
}
this.getView().getModel().setProperty("/blocked", true);
await oImageEditor.setSrc(oFile);
},
onGHImportPressed: async function (oEvent) {
var oModel = this.getView().getModel();
// Get Rate Limit
$.get(
"/gh_rate_limit",
function (resp) {
oModel.setProperty("/ghRateLimit", resp);
this.askForGHUsername();
}.bind(this)
);
},
askForGHUsername: function () {
var oModel = this.getView().getModel();
if (!this.oUsernameDialog) {
this.oUsernameDialog = new Dialog({
title: "Enter Github Username",
content: new sap.m.VBox({
justifyContent: "Center",
items: [
new sap.m.Input({
value: "{/username}",
}).addStyleClass("sapUiTinyMarginBottom"),
new sap.m.MessageStrip({
type: "Information",
showIcon: true,
text: "Github api rate limit {/ghRateLimit/rate/remaining} / {/ghRateLimit/rate/limit}",
}),
],
}).addStyleClass("sapUiTinyMargin"),
beginButton: new sap.m.Button({
type: sap.m.ButtonType.Emphasized,
text: "OK",
press: function () {
// Check Username
let username = oModel.getProperty("/username");
if (username && username.length > 0) {
this.getGHProfilePicture(username);
} else {
MessageToast.show("Please provide a username");
}
this.getView().getModel().setProperty("/blocked", true)
await oImageEditor.setSrc(oFile)
this.oUsernameDialog.close();
}.bind(this),
}),
endButton: new sap.m.Button({
text: "Close",
press: function () {
this.oUsernameDialog.close();
}.bind(this),
}),
});
// to get access to the controller's model
this.getView().addDependent(this.oUsernameDialog);
}

this.oUsernameDialog.open();
},

}
})
}
)
getGHProfilePicture: function (username) {
let view = this.getView();
let controller = view.getController();
let oImageEditor = view.byId("image");
controller.startBusy();
// Get URL
let dataURL;
// Get processed image and set to image editor src
$.post(`/gh_profile_pic/${username}`, function (resp) {
dataURL = "data:image/png;base64," + resp;
oImageEditor.setSrc(dataURL);
controller.endBusy(controller);
}).fail(function () {
controller.endBusy(controller);
MessageToast.show("error");
});
},
});
}
);
5 changes: 1 addition & 4 deletions app/profilePic/profilePic/view/App.view.xml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,15 +14,12 @@
<unified:FileUploaderParameter id="uploadParam" name="selectedPic"/>
</unified:parameters>
</unified:FileUploader>
<Button id="btnGHImport" text="{i18n>btnGHImport}" press="onGHImportPressed"></Button>
<Button id="button" text="{i18n>Upload}" press="uploadPressed"></Button>
<Button type="Emphasized" text="Save As" press="onSaveAsPress" />
</e:customToolbarControls>
<e:customEllipseCropItems>
<e:CustomSizeItem width="1" height="1" label="1:1" relative="true"/>

</e:customEllipseCropItems>



</e:ImageEditorContainer>
</mvc:View>
41 changes: 41 additions & 0 deletions package-lock.json
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -34,6 +34,7 @@
"@sap/logging": "^6.1.0",
"@sap/textbundle": "^4.1.0",
"accept-language-parser": "^1.5.0",
"axios": "^0.26.0",
"event-loop-lag": "^1.4.0",
"express": "^4.17.2",
"glob": "^7.2.0",
Expand Down
Loading