mirror/pixel-editor
1
0
Fork 0
mirror of https://github.com/lospec/pixel-editor.git synced 2023-08-10 21:12:51 +03:00
Code Issues Projects Releases Wiki Activity

Various changes

Browse Source 
- added `/:paletteSlug/:resolution` functionality for localhost testing
	- created `currFile.sublayers` for *things that should zoom with the canvas layers*
	- `currFile.layers` now solely contains the canvas layers
	- added `getProjectData` to `FileManager`'s exported methods
	---
	- added `FileManager.localStorageSave` (it's basically just: localStorage.setItem("lpe-cache",FileManager.getProjectData()))
	- added `FileManager.localStorageCheck` (it's basically just: `!!localStorage.getItem("lpe-cache")`)
	- added `FileManager.localStorageLoad` (it's basically just: `return localStorage.getItem("lpe-cache")`)
	- added `FileManager.localStorageReset` (for debugging purity)
	---
	- calling `FileManager.localStorageSave()` on mouse up (we should stress test this)
	---
	- changed lpe file format to `{canvasWidth:number,canvasHeight:number,selectedLayer:number,colors:[],layers:[]}`
	- added backward compatibility for the old lpe file format
	---
	- added some canvas utility functions in `canvas_util`
	- added Unsettled's color similarity utility functions in `color_util2`
	---
	- html boilerplate - wang tiles
	-
	- POC - tiny text boilerplate
	- POC - tiny text font scraper
	---
	- WIP - added two optional url route parameters `/:paletteSlug/:resolution/:prefillWidth/:prefillBinaryStr`
	- WIP POC - hbs_parser.js (outputs tree data about hbs file relationships)
This commit is contained in:
pxlvxl
2022-02-23 11:16:23 -05:00
parent 40299853ca
commit a1757553cf
122 changed files with 4976 additions and 466 deletions
Download Patch File Download Diff File Expand all files Collapse all files

132
js/pixel-editor.js
View File

@ -77,59 +77,95 @@ window.onload = function () {
ToolManager.currentTool().updateCursor();
// Apply checkboxes
//check if there are any url parameters
if (window.location.pathname.replace('/pixel-editor/','').length <= 1) {
//show splash screen
Dialogue.showDialogue('splash', false);
}
//url parameters were specified
else {
let args = window.location.pathname.split('/');
let paletteSlug = args[2];
let dimentions = args[3];
////console.log('window.location.pathname === ',window.location.pathname);
//fetch palette via lospec palette API
fetch('https://lospec.com/palette-list/'+paletteSlug+'.json')
.then(response => response.json())
.then(data => {
//palette loaded successfully
palettes[paletteSlug] = data;
palettes[paletteSlug].specified = true;
////console.log('window.location === ',window.location);
let args = window.location.pathname.split('/');
let paletteSlug = args[2];
let dimensions = args[3];
// let prefillWidth = args[4] ?? 9; // TODO
// let prefill = args[5] ?? "110101111110100110111100110110101111";
// let customColors = args[6] ?? ""; // ex: "#ffffff,#000000"
// console.log('prefill === ',prefill);
if(paletteSlug && dimensions) {
//refresh list of palettes
document.getElementById('palette-menu-splash').refresh();
//if the dimentions were specified
if (dimentions && dimentions.length >= 3 && dimentions.includes('x')) {
let width = dimentions.split('x')[0];
let height = dimentions.split('x')[1];
//create new document
Startup.newPixel(width, height);
}
//dimentions were not specified -- show splash screen with palette preselected
else {
//show splash
Dialogue.showDialogue('new-pixel', false);
}
})
//error fetching url (either palette doesn't exist, or lospec is down)
.catch((error) => {
console.warn('failed to load palette "'+paletteSlug+'"', error);
//proceed to splash screen
Dialogue.showDialogue('splash', false);
});
}
};
//fetch palette via lospec palette API
fetch('https://lospec.com/palette-list/'+paletteSlug+'.json')
.then(response => response.json())
.then(data => {
//palette loaded successfully
palettes[paletteSlug] = data;
palettes[paletteSlug].specified = true;
////console.log('palettes[paletteSlug] === ',palettes[paletteSlug]);
//refresh list of palettes
document.getElementById('palette-menu-splash').refresh();
//if the dimensions were specified
if (dimensions && dimensions.length >= 3 && dimensions.includes('x')) {
let width = dimensions.split('x')[0];
let height = dimensions.split('x')[1];
const layers = [];
let selectedLayer;
// if(prefill && prefillWidth){ // TODO
// layers.push({
// id: "layer0",
// name: "Layer 0",
// prefillWidth,
// prefill
// });
// selectedLayer = 0;
// }
Startup.newPixel({
canvasWidth: width,
canvasHeight: height,
selectedLayer,
colors: data.colors.map(n=>"#"+n),
layers
});
}
//dimensions were not specified -- show splash screen with palette preselected
else {
//show splash
Dialogue.showDialogue('new-pixel', false);
}
prefill.split("").forEach((n,i) => {
let idx = 0;
const num = Number(n);
////console.log('num === ',num);
if(n && isNaN(num)) {
////console.log('n === ',n);
}
// prefillWidth
})
})
//error fetching url (either palette doesn't exist, or lospec is down)
.catch((error) => {
//console.warn('failed to load palette "'+paletteSlug+'"', error);
//proceed to splash screen
Dialogue.showDialogue('splash', false);
});
} else {
if(FileManager.localStorageCheck()) {
//load cached document
const lpe = FileManager.localStorageLoad();
Startup.newPixel(lpe);
}
//check if there are any url parameters
else if (window.location.pathname.replace('/pixel-editor/','').length <= 1) {
//show splash screen
Dialogue.showDialogue('splash', false);
}
}
}
//prevent user from leaving page with unsaved data
window.onbeforeunload = function() {
if (EditorState.documentCreated)
return 'You will lose your pixel if it\'s not saved!';
// window.onbeforeunload = function() {
// if (EditorState.documentCreated)
// return 'You will lose your pixel if it\'s not saved!';
else return;
};
// else return;
// };
// Compatibility functions
function closeCompatibilityWarning() {