mirror of
https://github.com/System-End/Team_Website.git
synced 2026-04-19 22:05:15 +00:00
jhgfd
This commit is contained in:
parent
e9550e347b
commit
5262684f20
5 changed files with 116 additions and 33 deletions
43
Pages/Callback.html
Normal file
43
Pages/Callback.html
Normal file
|
|
@ -0,0 +1,43 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Authorization Callback</title>
|
||||
<script>
|
||||
// Parse the authorization code from the URL
|
||||
const urlParams = new URLSearchParams(window.location.search);
|
||||
const code = urlParams.get('code');
|
||||
|
||||
// Exchange the authorization code for an access token
|
||||
fetch('https://login.microsoftonline.com/common/oauth2/v2.0/token', {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/x-www-form-urlencoded'
|
||||
},
|
||||
body: new URLSearchParams({
|
||||
'client_id': 'c91a3691-c800-4aed-9e85-1a2c896327de',
|
||||
'scope': 'Files.ReadWrite.All',
|
||||
'code': code,
|
||||
'redirect_uri': 'http://localhost:5500/Pages/upload.html',
|
||||
'grant_type': 'authorization_code',
|
||||
'client_secret': 'ddba6e4e-62b1-4a13-b165-08b00ef6723f'
|
||||
})
|
||||
})
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
// Save the access token and optionally the refresh token
|
||||
const accessToken = data.access_token;
|
||||
const refreshToken = data.refresh_token;
|
||||
|
||||
// Use the access token to make API requests
|
||||
console.log('Access Token:', accessToken);
|
||||
console.log('Refresh Token:', refreshToken);
|
||||
})
|
||||
.catch(error => console.error('Error:', error));
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<p>Authorization successful. You can close this window.</p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -30,7 +30,7 @@
|
|||
<div id="navbar"></div>
|
||||
<h1></h1>
|
||||
<h1>Shuffled Photos and Videos</h1>
|
||||
<div id="mediaContainer"></div>
|
||||
<div id="photoGallery"></div>
|
||||
|
||||
<script src="/Pages/showcase.js"></script>
|
||||
</body>
|
||||
|
|
|
|||
|
|
@ -1,21 +1,37 @@
|
|||
async function fetchMedia() {
|
||||
const response = await fetch("/media");
|
||||
const media = await response.json();
|
||||
shuffle(media);
|
||||
const mediaContainer = document.getElementById("mediaContainer");
|
||||
media.forEach((item) => {
|
||||
const element = document.createElement("img"); // For images
|
||||
// const element = document.createElement('video'); // For videos
|
||||
element.src = item.url;
|
||||
mediaContainer.appendChild(element);
|
||||
});
|
||||
}
|
||||
window.addEventListener('load', function() {
|
||||
var photoGallery = document.getElementById('photoGallery');
|
||||
|
||||
function shuffle(array) {
|
||||
// You need to implement the OneDrive API to fetch the uploaded photos here
|
||||
Example:
|
||||
fetch('https://graph.microsoft.com/v1.0/me/drive/root:/Photos', {
|
||||
method: 'GET',
|
||||
headers: {
|
||||
'Authorization': 'Bearer ' + accessToken
|
||||
}
|
||||
})
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
data.value.forEach(photo => {
|
||||
var img = document.createElement('img');
|
||||
img.src = photo.thumbnailUrl; // or photo.webUrl, depending on your requirements
|
||||
photoGallery.appendChild(img);
|
||||
});
|
||||
})
|
||||
.catch(error => console.error('Error:', error));
|
||||
|
||||
// For demonstration purpose, here's some sample code to display shuffled photos
|
||||
var photos = ['photo1.jpg', 'photo2.jpg', 'photo3.jpg']; // Replace with actual photo URLs
|
||||
shuffleArray(photos);
|
||||
photos.forEach(photo => {
|
||||
var img = document.createElement('img');
|
||||
img.src = photo;
|
||||
photoGallery.appendChild(img);
|
||||
});
|
||||
});
|
||||
|
||||
function shuffleArray(array) {
|
||||
for (let i = array.length - 1; i > 0; i--) {
|
||||
const j = Math.floor(Math.random() * (i + 1));
|
||||
[array[i], array[j]] = [array[j], array[i]];
|
||||
}
|
||||
}
|
||||
|
||||
fetchMedia();
|
||||
|
|
|
|||
|
|
@ -29,13 +29,22 @@
|
|||
<div id="navbar"></div>
|
||||
<h1></h1>
|
||||
<h1></h1>
|
||||
<h1>Upload Photos and Videos</h1>
|
||||
<form id="uploadForm" enctype="multipart/form-data">
|
||||
<input type="file" name="file" id="fileInput" multiple />
|
||||
<button type="submit">Upload</button>
|
||||
</form>
|
||||
<a
|
||||
href="https://login.microsoftonline.com/common/oauth2/v2.0/authorize?
|
||||
client_id=c91a3691-c800-4aed-9e85-1a2c896327de
|
||||
&response_type=code
|
||||
&grant_type=authorization_code
|
||||
&redirect_uri=http://localhost:5500/Pages/Callback.html
|
||||
&scope=openid%20offline_access%20Files.ReadWrite.All"
|
||||
target="_blank"
|
||||
>
|
||||
Click here to sign in with Microsoft
|
||||
</a>
|
||||
<h1>Upload Photos to OneDrive</h1>
|
||||
<input type="file" id="fileInput" accept="image/*" />
|
||||
<button id="uploadButton">Upload</button>
|
||||
|
||||
<script src="/Pages/upload.js"></script>
|
||||
<script src="upload.js"></script>
|
||||
<!-- Footer -->
|
||||
<div id="socials"></div>
|
||||
</body>
|
||||
|
|
|
|||
|
|
@ -1,13 +1,28 @@
|
|||
document.getElementById("uploadForm").addEventListener("submit", async (e) => {
|
||||
e.preventDefault();
|
||||
const formData = new FormData();
|
||||
const files = document.getElementById("fileInput").files;
|
||||
for (let i = 0; i < files.length; i++) {
|
||||
formData.append("files", files[i]);
|
||||
document.getElementById('uploadButton').addEventListener('click', function() {
|
||||
var fileInput = document.getElementById('fileInput');
|
||||
var file = fileInput.files[0];
|
||||
if (file) {
|
||||
var formData = new FormData();
|
||||
formData.append('file', file);
|
||||
|
||||
// Include access token in the request header
|
||||
var accessToken = '0.ARwAw2-U4FdM706UscGv35A33ZE2GskAyO1KnoUaLIljJ97OAKE.AgABBAIAAADnfolhJpSnRYB1SVj-Hgd8AgDs_wUA9P-hUr5BU4lmnr4DEs3ouZjfl75d0wqoBoJGS_R9hgiFpCdVlC4HawyM5-B0iFUcA-z-QU8vxUK4aU8m-0zBm6UEZpWjZViQqJUoUQX0IC1DASg0P7w8_t9N77tcvm-8edmYqDchaRM3DFZsDCukNneKZuvRQEPDItZLguMG9U0T2YEG5tGRzjRnWla67XcbO7XxgkBh-mK4BpxNzNczNF54SShx8NAEz323Ye69oJb8S5bKmN2GSuBYgfgOUBzAzOwiVmE4KwZKIDxVObzC2ynX84Oiv32u4xKAtQYKoPykJCDoTdl7RRuyYOcq-dTq9nTHXzU8GuV0RFhYkqwP6q5bhCeCRCxQdnpei4KR-c8MesEC6Fl37tDwGgrf_ZWk8ldOrD8ld7NnjKa6V_LX8mDSCRB_yOdtLBOrKLDcSik4CCQxLPzDX0BrWc-MGF9Z4YjJSWNR6rPeF3wpEGI5vCFa7TPwojJsAG-Y5aE3qXbSkOe_Y-Z5iqJapnUWA7iIfLRROg97Fam4HUFKMLaA1lKmAbsDJi9Bbo7mvW1If2frASNiQ5gtJ5_UHojgiQS1Uj0KqPzkT3giqlHaIP96qXfWpteQdnhgM1kKpIqlbbETtvCDxzTEqIGwrhXZM3t80lp9w0v3eRtr3YeF4exwj0eSWz8LqOxitbsCzjOfbItOIOdQm407-udFqf0aiWRntkuEeWlhlfhWIR_2KGivnuSCiJdayM8ENsDI8MZDNU8NrPiuFOCu01NKyNzTOyIKu6Zbj6WTohVi2aYUL7oWy0G4zOCAQvOgsj9icEbolFttUL-_Ac5ISskzFbHXJnWrljK3FVjhDgCjWcMJOYJIUYaJxO6pPcyJHR_Q2vMXRWEkFuyyLARzP0ZBjevOKzS4YCN7HJLx6_c4W6CygOO3vNoYIJDt5iWCOHt__aD-XmgLbvgLDIczVFLWGPDd7Ddtql_GdvSPTONs8sO_5NAzwQNHwH2_odiz'; // Replace with your actual access token
|
||||
fetch('https://graph.microsoft.com/v1.0/me/drive/root:/Photos/' + file.name + ':/content', {
|
||||
method: 'PUT',
|
||||
body: formData,
|
||||
headers: {
|
||||
'Authorization': 'Bearer ' + accessToken
|
||||
}
|
||||
})
|
||||
.then(response => {
|
||||
if (response.ok) {
|
||||
alert('File uploaded successfully!');
|
||||
} else {
|
||||
alert('Error uploading file!');
|
||||
}
|
||||
})
|
||||
.catch(error => console.error('Error:', error));
|
||||
} else {
|
||||
alert('Please select a file to upload.');
|
||||
}
|
||||
await fetch("/upload", {
|
||||
method: "POST",
|
||||
body: formData,
|
||||
});
|
||||
alert("Files uploaded successfully!");
|
||||
});
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue