trying to refesh DynamicTexture - drawText

[Zimbofly]

I'm learning lots about Babylon with my little project to make yellow stickies on the wall of my 3D room....

 

so far I can display the stickies fine and edit the text by double clicking on a sticky and typing in text.

On hitting submit button - saves fine to the database...

BUT -  how to refresh the text in the yellow sticky after popup closes?

 var CreateSticky = function (pos, farWall, stkyContent, stkyID) {    	var sign = pos.x ? pos.x < 0 ? -1 : 1 : 0    	//if (width && height) {    	//	ratio = width / height;    	//}    	//use this to resize sticky    	var sticky = new BABYLON.Mesh.CreateBox("sticky", 0.5, scene);    	if (farWall) {    		sticky.rotation.x = sign * (Math.PI);    		sticky.scaling = new BABYLON.Vector3(1, 1, 0.01);    	} else {    		sticky.scaling = new BABYLON.Vector3(0.01, 1, 1);    		sticky.rotation.x = sign * (-Math.PI / 2);    	}    	sticky.position = new BABYLON.Vector3(pos.x, pos.y, pos.z);    	sticky.material = new BABYLON.StandardMaterial("matPaint", scene);    	sticky.material.diffuseTexture = new BABYLON.Texture("./GalleryAssets/sticky1_tmp.png", scene);    	sticky.material.specularColor = new BABYLON.Color3(0, 0, 0);    	sticky.material.diffuseColor = new BABYLON.Color3(0, 0, 0);    	sticky.material.emissiveColor = new BABYLON.Color3(0.6, 0.6, 0.6);    	var content = new BABYLON.Mesh.CreateBox("content", 0.5, scene);    	if (farWall) {    		//sticky.rotation.x = sign * (Math.PI);    		content.scaling = new BABYLON.Vector3(1, 1, 0.01);    	} else {    		content.scaling = new BABYLON.Vector3(0.01, 1, 1);    		content.rotation.x = sign * (-Math.PI / 2);    	}    	content.position = new BABYLON.Vector3(pos.x, pos.y, pos.z);    	content.material = new BABYLON.StandardMaterial("matPaint", scene);    	content.material.specularColor = new BABYLON.Color3(0, 0, 0);    	content.material.diffuseColor = new BABYLON.Color3(0, 0, 0);    	content.material.emissiveColor = new BABYLON.Color3(0.6, 0.6, 0.6);    	var backgroundTexture = new BABYLON.DynamicTexture("dynamic texture", 512, scene, true);    	content.material.diffuseTexture = backgroundTexture;    	    	backgroundTexture.drawText(stkyContent, null, 80, "40px Arial", "black", "#F7FAA9");    	//hover over image    	sticky.actionManager = new BABYLON.ActionManager(scene);    	sticky.actionManager.registerAction(new BABYLON.InterpolateValueAction(BABYLON.ActionManager.OnPointerOutTrigger, sticky, "visibility", 1, 100));    	sticky.actionManager.registerAction(new BABYLON.InterpolateValueAction(BABYLON.ActionManager.OnPointerOverTrigger, sticky, "visibility", 0.6, 100));    	/**         * Register a babylon event to watch out for a pointer over trigger. When this happens set selectedPic to the ID of the ele we've hovered over         * so that when a dblclick event happens, we know what pic we're meant to show.         * Additionally, when there is a pointer out trigger, set selectedPic to null, so we don't do anything on dblclick         */    	sticky.actionManager.registerAction(new BABYLON.ExecuteCodeAction(BABYLON.ActionManager.OnPointerOverTrigger, function (ele) {    		selectedPic = ele.source;    		text = stkyContent;    		stickyID = stkyID;    		isSticky = true;    	}));    	sticky.actionManager.registerAction(new BABYLON.ExecuteCodeAction(BABYLON.ActionManager.OnPointerOutTrigger, function () {    		selectedPic = null;    		isSticky = false;    	}));		//attempted zoom    	//if ($ && $.fn.zoom) {    	//	$('backgroundTexture').zoom({ on: 'grab' });    	//}    	//$('backgroundTexture img')    	//	.wrap('<span style=""></span>')    	//	.css('display', 'block')    	//	.parent()    	//	.zoom();    	//sticky.actionManager.registerAction(action);    	//sticky.actionManager.registerAction(action2);    	allC.push(sticky);    }

 brings in sticky text (from DB) - places it over an image

on double click - opens popup for editing

which then allows edit and submit to DB of text...

    var LoadForegroundStky = function () {    	hotkeys = false;    	$("#BabylonDiv").prepend("<div id='Babylon_loading'><div id='posterContainer'></div></div>");    	$("#posterContainer").append("<div id='stickyContainer'><div id='stickyHeader'><img src='./GalleryAssets/close_BtnSmall.png' alt='close' width='28' id='stickyClose' onClick='babylonPopupClose();' /></div><div id='stickyPanel'><textarea id='stkyEdit'></textarea></div><div id='stickyFooter'><input type='submit' id='submit' class='submit' value='submit' /></div></div>");		$('textarea').val(text);    	var posterContainer = document.getElementById('posterContainer');    	posterContainer.style.display = "block";    	$("#submit").click(function () {    		updateSticky(stickyID, stkyEdit.value);    		babylonPopupClose();    	});    	//get img from 3DGallery    	//var firstChild = true;    	$("#3DGallery").children('img').each(function (i, element) {    		babylonPopup2Close = function () {    			$('#posterContainer').remove();    			hotkeys = true;    		}    	});    	//adding image to HTML    	var img = $('<img class="posterImg" />'); //Equivalent: $(document.createElement('img'))    	//Changed selectedPic to only hold the URL(id) of the image we are trying to load.     	img.attr('src', selectedPic.material.diffuseTexture.url);    	//img.attr('src', selectedPic);    	img.appendTo('#poster');    	//backgroundResize();    }

do I need to send the text BACK to the CreateSticky() function before it refreshes?

 

attached - a few screen shots - might help

 

apologies for the long post - so close to making this work....

[GameMonetize]

Could you give us a link where we can see it live?