Skip to content

T
tutor-shot-extension
Commit 213f3378 by ramdayalmunda
Options

initial commit

parents
Showing with 304 additions and 0 deletions
background.js 0 → 100755
var getUserDetails = null
!function () {
var tutorShotId = null
var imageNumber = 0;
var recording = false;
var loggedIn = false;
var userDetails = {}
console.log('background.js registered', chrome)
function onMessage(request, sender, sendResponse) {
if (request.action === 'login') {
console.log('B: to logged in', request.userDetails)
userDetails = request.userDetails
// check if credentials changed.
if (request.userDetails.email != userDetails.email) {
imageNumber = 0
}
loggedIn = true
sendResponse({ message: "Logged In", success: true })
return
}
if (request.action === 'checkStatus') {
sendResponse({ userDetails, loggedIn, recording })
return
}
if (loggedIn && request.action === 'startRecording') {
imageNumber = 0
recording = true;
tutorShotId = request.tutorShotId
sendResponse({ userDetails, loggedIn, recording });
return
}
if (loggedIn && request.action === 'stopRecording') {
recording = false;
tutorShotId = null
sendResponse({ userDetails, loggedIn, recording });
return
}
if (request.action === 'captureSS') {
if (!loggedIn) {
console.log('not logged in for SS');
return;
}
if (!recording) {
console.log('recording not started for SS');
return;
}
if (!tutorShotId){
console.log('how to set not created');
return
}
chrome.tabs.query({ active: true, currentWindow: true }, function (tabs) {
if (tabs && tabs.length) { // if any tab is active
var activeTab = tabs[0]
chrome.tabs.captureVisibleTab({ format: "png" }, function (dataUrl) {
let message = {
...userDetails,
tutorShotOid: tutorShotId,
action: 'SSCaptured',
dataUrl: dataUrl, imageNumber: imageNumber++,
...request.captureInfo ? request.captureInfo : {}
}
console.log('SS captured', message)
// to send message to the content instance of the
chrome.tabs.sendMessage(activeTab.id, message);
})
}
})
return
}
}
chrome.runtime.onMessage.addListener(onMessage)
getUserDetails = function () {
let dataSet = {
userDetails: JSON.parse(JSON.stringify(userDetails)),
recording: JSON.parse(JSON.stringify(recording)),
loggedIn: JSON.parse(JSON.stringify(loggedIn)),
tutorShotId: JSON.parse(JSON.stringify(tutorShotId)),
imageNumber: JSON.parse(JSON.stringify(imageNumber)),
}
return dataSet
}
}()
content.js 0 → 100755
var loggedIn = false;
!function () {
let origin = "http://localhost:3039"
if (window.origin == origin) login()
}()
function login() {
let userDetails = {
uid: localStorage.getItem('userId'),
name: localStorage.getItem('name'),
email: localStorage.getItem('email')
}
if (userDetails?.uid || userDetails?.email) { // can login
console.log('logged in', userDetails)
chrome.runtime.sendMessage({ action: "login", userDetails })
}
}
var recording = false;
const api = axios.create({
baseURL: "http://localhost:3039/api",
headers: {
'Access-Control-Allow-Origin': '*', // Replace '*' with the origin you need
'Content-Type': 'application/json',
},
});
window.addEventListener('mousedown', function (e) {
if (e.button === 0) { // only left click allowed
console.log('click received')
let captureInfo = {
targetDimensions: e.target.getBoundingClientRect(), // this is for the backdrop
dimensions: { // this is for the main image
height: document.body.clientHeight,
width: document.body.clientWidth,
},
tagName: e.target.tagName,
outerText: e.target.outerText,
interText: e.target.interText,
url: location.href,
origin: location.origin,
}
chrome.runtime.sendMessage({ action: "captureSS", captureInfo })
}
})
// content.js
chrome.runtime.onMessage.addListener(function (message, sender, sendResponse) {
if (message.action == 'SSCaptured') {
console.log('SSCaptured', message)
api.post("/tutor-shot/screen-shot", message).then(res => {
console.log('response', res)
}).catch(err => {
console.log('err', err)
})
}
if (message.action == 'tabChanged') {
console.log('tabChanged', message)
}
});
js/axios.min.js 0 → 100755
This diff is collapsed. Click to expand it.
manifest.json 0 → 100755
{
"manifest_version": 3,
"name": "Click Capturer",
"version": "1.0",
"description": "A basic Chrome extension",
"permissions": [
"activeTab",
"scripting"
],
"host_permissions": [
"<all_urls>"
],
"background": {
"service_worker": "background.js"
},
"content_scripts": [
{
"matches": ["<all_urls>"],
"js": [
"js/axios.min.js",
"content.js"
]
}
],
"action": {
"default_popup": "popup.html",
"default_icon": {
"16": "images/icon-16.png",
"48": "images/icon-48.png"
}
},
"icons": {
"16": "images/icon-16.png",
"48": "images/icon-48.png"
}
}
\ No newline at end of file
popup.html 0 → 100644
This diff is collapsed. Click to expand it.
popup.js 0 → 100755
!function () {
console.log('popup', chrome);
const api = axios.create({
baseURL: "http://localhost:3039/api", // the base URL for nodeserver is okay but NGINX is giving error
headers: {
'Access-Control-Allow-Origin': '*', // Replace '*' with the origin you need
'Content-Type': 'application/json',
},
});
console.log('api',api)
let origin = "http://localhost:3039"
let recording = false;
let loggedIn = false;
let startBtn = document.getElementById('start-btn')
let stopBtn = document.getElementById('stop-btn');
let userDetailsDiv = document.getElementById('user-details')
let userName = document.getElementById('user-name')
let userEmail = document.getElementById('user-email')
let myCapturesBtn = document.getElementById('my-captures-btn')
myCapturesBtn.addEventListener('click',(e)=>{ window.open(origin+'/tutor-shot-list') })
let userDetails = {};
let inProgress = false;
let loginBtn = document.getElementById('login-btn')
loginBtn.addEventListener('click', () => { window.open(origin) })
startBtn.addEventListener('click', async function () {
if (inProgress){
console.log('something in progress');
return
}
inProgress = true
try{
console.log('apis', api)
let { data } = await api.post('/tutor-shot', { title: "Some random title" }, { headers: { userId: userDetails.uid } } )
console.log('creating reponse',data)
if (data.success){
chrome.runtime.sendMessage({ action: "startRecording", tutorShotId:data.tutorShot._id }, async function (response) {
recording = response.recording
console.log('to start. we need api', api)
modifyPopupUI()
inProgress = false
})
}
}catch(err){
console.log('error while starting to record', err)
inProgress = false
}
})
stopBtn.addEventListener('click', function () {
if (inProgress){
console.log('something in progress');
return
}
inProgress = true
chrome.runtime.sendMessage({ action: "stopRecording" }, function (response) {
recording = response.recording
modifyPopupUI()
inProgress = false
})
})
function modifyPopupUI() {
console.log('modify ui', userDetails)
loginBtn.style.display = loggedIn ? 'none' : ''
startBtn.style.display = loggedIn ? (recording ? 'none' : '') : 'none'
stopBtn.style.display = loggedIn ? (!recording ? 'none' : '') : 'none'
if (userDetails.email && userDetails.uid){
userDetailsDiv.style.display = 'block'
userEmail.innerHTML = userDetails.email
userName.innerHTML = userDetails.name
}else{
userDetailsDiv.style.display = 'none'
userEmail.innerHTML = ""
userName.innerHTML = ""
}
}
function domLoadHandler() {
chrome.runtime.sendMessage({ action: "checkStatus" }, function (response) {
userDetails = response.userDetails;
loggedIn = response.loggedIn,
recording = response.recording
modifyPopupUI()
})
}
// this code should run everytime the popup is opened
document.addEventListener("DOMContentLoaded", domLoadHandler);
}()
readme.md 0 → 100755
1. Clone the repository on your local system
2. Open your chrome browser and visit `chrome://extensions/`
3. Enable "Developer Mode"
4. Click on Load Unpacked and select this repository folder.
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment