Skip to content

Commit

Permalink
map size and map number can be modified
Browse files Browse the repository at this point in the history
  • Loading branch information
@dip000
dip000 committed Feb 18, 2022
1 parent dad703d commit 54b347f
Show file tree
Hide file tree
Showing 7 changed files with 99 additions and 231 deletions.
2 changes: 2 additions & 0 deletions MapBuilderForWeb/BuilderCalculations.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,8 @@
}

function OccupancyMapToCoordenates(occupancyMap){
if(occupancyMap == null) return;

let coordenates = new Vector2Array();
let k = 0;
let mapLengthX = occupancyMap.length;
Expand Down
10 changes: 4 additions & 6 deletions MapBuilderForWeb/BuilderVisuals.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@
if(isShapeEditorActive)
PlaceDotAtPoint(currentItemPlacingInfo.positionX, currentItemPlacingInfo.positionY);
else{
OnGridClickAndDrag(currentItemPlacingInfo.positionX, currentItemPlacingInfo.positionY);
OnGridClickAndDrag();
}
}

Expand All @@ -44,15 +44,13 @@

function AddClickListenerToElement(element, callback){
element.addEventListener('mousedown', function(e) {
//console.log("Clicked at: " + e.target.parentElement.rowIndex + "," + e.target.cellIndex);
let x = e.target.parentElement.rowIndex;
let y = e.target.cellIndex;
topValue.innerHTML = getStatisticsTopValue(value);

isClicking = true;

if(x == null || y == null) return;
callback(x, y);
if(currentItemPlacingInfo.positionX == null || currentItemPlacingInfo.positionY == null) return;

callback();

}, false);
}
Expand Down
86 changes: 17 additions & 69 deletions MapBuilderForWeb/MapBuilder.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -73,19 +73,6 @@
historyOfPlacements[itemPlacingInfo.indexInHistory].undoFromHistory();
}

function UndoActionFromHistory(itemPlacingInfo){
if(itemPlacingInfo == null) return;

itemPlacingInfo.deleted = ! (itemPlacingInfo.deleted);

if(itemPlacingInfo.deleted == true){
return ActionTypes.deleted;
}
else{
return ActionTypes.replaced;
}
}

function GetInformationFromHistoryIndex(index){
if(index < 0) return null;
if(index > historyOfPlacements.length-1) return null;
Expand Down Expand Up @@ -211,54 +198,9 @@

document.body.removeChild(element);
}
/////////////////////////////////////////////////////////////////////////


//UNDO MECHANICS ////////////////////////////////////////////////////////
/*document.onkeyup = function(e) {
//Ctrl+Z is Undo
if( e.ctrlKey && e.which == 90 && !e.shiftKey){
UndoAction(-1);
}
//Ctrl+Y is Redo
else if( e.ctrlKey && e.which == 89 ){
UndoAction(1);
}
//Ctrl+Shift+Z is Redo as well
else if( e.ctrlKey && e.shiftKey && e.which == 90 ){
UndoAction(1);
}
};
const ActionTypes = Object.freeze({
deleted: 0,
replaced: 1
});
var chainedUndoneIndex = 0;
function UndoAction(direction){
//Test input
let test = chainedUndoneIndex + direction + historyIndex;
if(test > historyIndex || test < 0 ) return;
chainedUndoneIndex += direction;
//console.log("Undone direction: " + direction + "; undone index: " + chainedUndoneIndex + "; global position: " + (historyIndex + chainedUndoneIndex))
let itemPlacingInfo = GetInformationFromHistoryIndex(historyIndex + chainedUndoneIndex);
if(itemPlacingInfo == null) return;
let actionResult = UndoActionFromHistory(itemPlacingInfo);
if(actionResult == ActionTypes.deleted){
printVisualsOfCoordenates(itemPlacingInfo.coordenates, clearedGridColor);
UpdateOccupancy(itemPlacingInfo.coordenates, FREE);
}
else{
printVisualsOfCoordenates(itemPlacingInfo.coordenates, itemPlacedColor);
UpdateOccupancy(itemPlacingInfo.coordenates, OCCUPIED);
}
}*/
////////////////////////////////////////////////////////////////////////////////////
/////////////////////////////////////////////////////////////////////////////////////

/////////// KEY COMBOS //////////////////////////////////////////////////////////////
const keyLog = {}
const handleKeyboard = ({ type, key, repeat, metaKey }) => {
if (repeat) return
Expand All @@ -269,24 +211,24 @@ const handleKeyboard = ({ type, key, repeat, metaKey }) => {
//Create cuts on rows and cols with Ctrl + arrow keys
if(keyLog.Control){
if (key === "ArrowLeft")
cols(ncols-1);
cols(gridCols-1);
if (key === "ArrowRight")
cols(ncols+1);
cols(gridCols+1);
if (key === "ArrowDown")
rows(nrows-1);
rows(gridRows+1);
if (key === "ArrowUp")
rows(nrows+1);
rows(gridRows-1);
}
else{
//Rebuild map rows and cols with arrow keys
if (key === "ArrowLeft")
map( occupancyMap.length, occupancyMap[0].length-1 );
map( gridSize.x, gridSize.y-1 );
if (key === "ArrowRight")
map( occupancyMap.length, occupancyMap[0].length+1 );
map( gridSize.x, gridSize.y+1 );
if (key === "ArrowDown")
map( occupancyMap.length+1, occupancyMap[0].length );
map( gridSize.x+1, gridSize.y );
if (key === "ArrowUp")
map( occupancyMap.length-1, occupancyMap[0].length );
map( gridSize.x-1,gridSize.y );
}
}

Expand All @@ -303,6 +245,7 @@ function initailizeKeyCombos(){
events.forEach(name => document.removeEventListener(name, handleKeyboard))
}

////////////////////////////////////////////////////////////////////////////////////

// TYPES AND CONSTRUCTORS //////////////////////////////////////////////////////////
function Vector2Array(x, y) {
Expand All @@ -328,7 +271,7 @@ function Vector2Array(x, y) {
this.y = [];
}
else{
//console.error("Constructor of Vector2Array did not found an overload for input");
console.error("Constructor of Vector2Array did not found an overload for input");
}
}

Expand Down Expand Up @@ -442,6 +385,11 @@ function OutputData(){

}

function Point(x, y){
this.x = x;
this.y = y;
}

////////////////////////////////////////////////////////////////////////////////////

/////////////////////////// UPLOAD /////////////////////////////////////////////////
Expand Down
28 changes: 11 additions & 17 deletions MapBuilderForWeb/MapBuilderForWeb.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -52,7 +52,7 @@
const itemShadowColor = "#9CDCFE";
const itemPlacedColor = "#569CD6";
const clearedGridColor = "white";
const itemSelectedColor = "#D69D85";
const itemSelectedColor = "#D8A0D1";
const itemDefaultColor = "#1E1E1E";
const mapCutColor = "#1E1E1E";

Expand All @@ -79,10 +79,10 @@

//Everything starts here
window.onload = function() {
//Both share same stuff
//Both editors share these behaviors
initializeMapEditorStatistics();
initializeMapEditorShapes();
//initailizeKeyCombos();
initailizeKeyCombos();

//Initialize Map editor
initializeMapEditorGrid(25, 60);
Expand All @@ -92,24 +92,20 @@
initializeShapesEditorGrid(10, 10);
initializeShapesEditorMenu();

/*document.addEventListener('dragstart', (e) => {
document.addEventListener('dragstart', (e) => {
e.preventDefault()
})*/
})

//Starts showing map editor while hidning shapes editor
GoToMapEditor();
//GoToShapesEditor();

//FOR DEBUGGING ONLY
//rows(3);
//cols(3);
}


var gridRows = 1;
var gridCols = 1;
var gridSize = {x:20, y:40};
var shapesGridSize = {x:10, y:10};
var gridSize = new Point();
var shapesGridSize = new Point();
var levels = new Array();
var gridMap;

Expand All @@ -121,7 +117,7 @@
gridSize.x = x;
gridSize.y = y;
}

//Creates levels holder (map)
let placingLcation = document.getElementById("GridGraphics");
gridMap = generate_table( gridRows, gridCols, 5);
Expand Down Expand Up @@ -309,8 +305,6 @@
UpdateItemPlacingInfo();
state = GetOccupancyOfPlacingInfo();

console.log(state)

if (state == FREE){
PlaceCurrentItemInfo();
}
Expand Down Expand Up @@ -338,11 +332,11 @@
else if (state == MAP_CUT){
//console.log("MAP_CUT");
}
else if (state == MAP_CUT){
//console.log("MAP_CUT");
}
else if (state == NULL){
//console.log("NULL");
}
else if (state == FREE){
//console.log("FREE");
PlaceCurrentItemInfo();
}
}
Expand Down
28 changes: 15 additions & 13 deletions MapBuilderForWeb/MapBuilderStyles.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,29 +10,29 @@
--lighter: #B9F51B;
*/

/* VISUAL STUDIO PALETTE
--TITLE: VISUAL STUDIO PALETTE;
--blue: #569CD6;
--light-blue: #9CDCFE;
--green: #57A64A;
--light-green: #4EC9B0;
--yellow: #DCDCAA;
--pink: #D8A0D1;
--orange: #D69D85;
*/


--background: #1E1E1E;
--table-shadow: #111111;
--item-hover: #D69D85;
--item-shadow: #D69D85;
--item-click: #D69D85;
--item-hover: #D8A0D1;
--item-shadow: #D8A0D1;
--item-click: #D8A0D1;
--lateral-menu-background: #353535;
--side-button: #D8A0D1;
--side-button-hover: #D69D85;
--download-button: #D8A0D1;
--download-button-hover: #D69D85;
--side-button: #D69D85;
--side-button-hover: #D8A0D1;
--download-button: #D69D85;
--download-button-hover: #D8A0D1;
--white:#ffffff;
--light-gray:#DCDCDC;
--delete-icon: #DCDCAA;
--light-gray:#302f2f3b;
--delete-icon: #D69D85;
}

html {
Expand Down Expand Up @@ -68,7 +68,7 @@
.items .item{
display: inline-block;
padding: 5px;
margin-right: 20px;
margin-left: 20px;
cursor: pointer;
box-shadow: none;
border-radius: 5px;
Expand All @@ -93,7 +93,7 @@
.stats {
position: absolute;
text-align: right;
right: 100px;
right: 45px;
bottom: 20px;
color: gray;
}
Expand Down Expand Up @@ -182,6 +182,7 @@
}
.sideButton:hover {
background-color: var(--side-button-hover);
box-shadow: 0px 0px 10px var(--item-shadow);
}

.downloadButton{
Expand All @@ -190,6 +191,7 @@

.downloadButton:hover {
background-color: var(--download-button-hover);
box-shadow: 0px 0px 10px var(--item-shadow);
}

.inputName {
Expand Down
Loading

0 comments on commit 54b347f

Please sign in to comment.