mirrors/puter
1
0
Fork 0
mirror of https://github.com/HeyPuter/puter synced 2024-11-14 22:06:00 +00:00
Code Issues Packages Projects Releases Wiki Activity

Temporal commit for issue #432

Browse Source
This commit is contained in:
Koppeks 2024-07-19 19:42:47 -03:00
parent eae51e945b
commit f897e84498
5 changed files with 143 additions and 44 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/gui/src/globals.js
View File

@ -231,6 +231,8 @@ window.is_auto_arrange_enabled = true;
window.desktop_item_positions = {};
window.reset_item_positions = true; // The variable decides if the item positions should be reset when the user enabled auto arrange
window.file_templates = []
// default language
window.locale = 'en';

54
src/gui/src/helpers.js
View File

@ -837,6 +837,60 @@ window.create_file = async(options)=>{
}
}
window.available_templates = async () => {
console.log(window.user.username)
const baseRoute = `/${window.user.username}`
const keywords = ["template", "templates", i18n('template')]
//make sure all its lowercase
const lowerCaseKeywords = keywords.map(keywords => keywords.toLowerCase())
//create file
try{
// search the folder name i18n("template"), "template" or "templates"
const files = await puter.fs.readdir(baseRoute)
const hasTemplateFolder = files.find(file => lowerCaseKeywords.includes(file.name.toLowerCase()))
console.log(hasTemplateFolder)
if(!hasTemplateFolder){
console.log("No template folder")
return []
}
const hasTemplateFiles = await puter.fs.readdir(baseRoute + "/" + hasTemplateFolder.name)
console.log(hasTemplateFiles)
if(hasTemplateFiles.length == 0) {
console.log("There are no templates")
return []
}
let result = []
hasTemplateFiles.forEach(element => {
console.log(element)
const elementInformation = element.name.split(".")
const name = elementInformation[0]
let extension = elementInformation[1]
console.log(extension)
if(extension == "txt") extension = "text"
const itemStructure = {
html: `${extension.toUpperCase()} ${name}`,
extension:extension,
name: element.name
}
console.log(extension)
result.push(itemStructure)
});
// return result
return result
} catch (err) {
console.log(err)
}
}
window.create_shortcut = async(filename, is_dir, basedir, appendto_element, shortcut_to, shortcut_to_path)=>{
let dirname = basedir;
const extname = path.extname(filename);

118
src/gui/src/helpers/new_context_menu_item.js
View File

@ -27,52 +27,82 @@
*/
const new_context_menu_item = function(dirname, append_to_element){
const baseItems = [
// New Folder
{
html: i18n('new_folder'),
icon: `<img src="${html_encode(window.icons['folder.svg'])}" class="ctx-item-icon">`,
onClick: function() {
window.create_folder(dirname, append_to_element);
},
},
// divider
'-',
// Text Document
{
html: i18n('text_document'),
icon: `<img src="${html_encode(window.icons['file-text.svg'])}" class="ctx-item-icon">`,
onClick: async function() {
window.create_file({dirname: dirname, append_to_element: append_to_element, name: 'New File.txt'});
}
},
// HTML Document
{
html: i18n('html_document'),
icon: `<img src="${html_encode(window.icons['file-html.svg'])}" class="ctx-item-icon">`,
onClick: async function() {
window.create_file({dirname: dirname, append_to_element: append_to_element, name: 'New File.html'});
}
},
// JPG Image
{
html: i18n('jpeg_image'),
icon: `<img src="${html_encode(window.icons['file-image.svg'])}" class="ctx-item-icon">`,
onClick: async function() {
var canvas = document.createElement("canvas");
canvas.width = 800;
canvas.height = 600;
canvas.toBlob((blob) => {
window.create_file({dirname: dirname, append_to_element: append_to_element, name: 'New Image.jpg', content: blob});
});
}
},
// divider
'-'
];
//Show file_templates on the lower part of "New"
if (window.file_templates.length > 0) {
baseItems.push({
html: "User templates",
icon: `<img src="${html_encode(window.icons['file-template.svg'])}" class="ctx-item-icon">`,
items: window.file_templates.map(template => ({
html: template.html,
icon: `<img src="${html_encode(window.icons[`file-${template.extension}.svg`])}" class="ctx-item-icon">`,
onClick: function() {
window.create_file({dirname: dirname, append_to_element: append_to_element, name: template.name});
}
}))
});
} else {
baseItems.push({
html: "No templates found",
icon: `<img src="${html_encode(window.icons['file-template.svg'])}" class="ctx-item-icon">`,
//Add function to ask user to create new template folder
// onClick: function() {
// window.create_file({dirname: dirname, append_to_element: append_to_element, name: template.name});
// }
});
}
//Conditional rendering for the templates
return {
html: i18n('new'),
items: [
// New Folder
{
html: i18n('new_folder'),
icon: `<img src="${html_encode(window.icons['folder.svg'])}" class="ctx-item-icon">`,
onClick: function(){
window.create_folder(dirname, append_to_element);
}
},
// divider
'-',
// Text Document
{
html: i18n('text_document'),
icon: `<img src="${html_encode(window.icons['file-text.svg'])}" class="ctx-item-icon">`,
onClick: async function(){
window.create_file({dirname: dirname, append_to_element: append_to_element, name: 'New File.txt'});
}
},
// HTML Document
{
html: i18n('html_document'),
icon: `<img src="${html_encode(window.icons['file-html.svg'])}" class="ctx-item-icon">`,
onClick: async function(){
window.create_file({dirname: dirname, append_to_element: append_to_element, name: 'New File.html'});
}
},
// JPG Image
{
html: i18n('jpeg_image'),
icon: `<img src="${html_encode(window.icons['file-image.svg'])}" class="ctx-item-icon">`,
onClick: async function(){
var canvas = document.createElement("canvas");
canvas.width = 800;
canvas.height = 600;
canvas.toBlob((blob) =>{
window.create_file({dirname: dirname, append_to_element: append_to_element, name: 'New Image.jpg', content: blob});
});
}
},
]
}
items: baseItems
};
}
export default new_context_menu_item;

11
src/gui/src/icons/file-template.svg Normal file
View File

@ -0,0 +1,11 @@
<svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
<path opacity="0.2" d="M10 5C8.892 5 8 5.892 8 7V43C8 44.108 8.892 45 10 45H38C39.108 45 40 44.108 40 43V17L28 5H10Z" fill="black"/>
<path d="M10 4C8.892 4 8 4.892 8 6V42C8 43.108 8.892 44 10 44H38C39.108 44 40 43.108 40 42V16L30 14L28 4H10Z" fill="#E4E4E4"/>
<path opacity="0.2" d="M40 17L28 5V15C28 16.108 28.892 17 30 17H40Z" fill="black"/>
<path d="M40 16L28 4V14C28 15.108 28.892 16 30 16H40Z" fill="#FAFAFA"/>
<path opacity="0.2" d="M10 4C8.892 4 8 4.892 8 6V7C8 5.892 8.892 5 10 5H28V4H10Z" fill="white"/>
<path opacity="0.2" d="M23.5294 42.4706L14 36.827V24.3529L14.4706 23.8178L24 18L33.5294 23.8235L34 24.3529V36.7094L24.4706 42.4706L24 42.7647L23.5294 42.4706Z" fill="black"/>
<path d="M14 24.3529L23.5294 30.2353V41.7647L14 36.1176V24.3529Z" fill="#2664EB"/>
<path d="M34 24.3529L24.4706 30.2353V41.7647L34 36.1176V24.3529Z" fill="#2664EB"/>
<path d="M24 18L14.4706 23.8235L24 29.6471L33.5294 23.8235L24 18Z" fill="#2664EB"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.0 KiB

2
src/gui/src/initgui.js
View File

@ -108,6 +108,8 @@ const launch_services = async function (options) {
const svc_process = globalThis.services.get('process');
svc_process.get_init().chstatus(PROCESS_RUNNING);
}
// Search and store user templates
window.file_templates = await window.available_templates()
};
// This code snippet addresses the issue flagged by Lighthouse regarding the use of