getting frame to appear in the correct spot.

nodeEditor/src/components/nodeList/nodeList.scss

@@ -94,6 +94,10 @@
                         position: absolute;
                         right: 10px;
                         top: 10px;
+
+                        &:hover {
+                            cursor: pointer;
+                        }
                     }
 
                     .buttonLine {

nodeEditor/src/graphEditor.tsx

@@ -545,11 +545,35 @@ export class GraphEditor extends React.Component<IGraphEditorProps, IGraphEditor
         var data = event.dataTransfer.getData("babylonjs-material-node") as string;
         let newNode: GraphNode;
 
+        
         if(data.indexOf("Custom") > -1) {
             let storageData = localStorage.getItem(data);
             if(storageData) {   
-                const frameData = JSON.parse(storageData);
-                SerializationTools.AddFrameToMaterial(frameData, this.props.globalState, this.props.globalState.nodeMaterial);
+                let frameData = JSON.parse(storageData);
+
+                let x = event.clientX - event.currentTarget.offsetLeft - this._graphCanvas.x - this.NodeWidth;
+                let y = event.clientY - event.currentTarget.offsetTop - this._graphCanvas.y - 20;
+                
+                let newX= x / this._graphCanvas.zoom;
+                let newY= y / this._graphCanvas.zoom;
+                let oldX = frameData.editorData.frames[0].x;
+                let oldY = frameData.editorData.frames[0].y;
+                frameData.editorData.frames[0].x = newX;
+                frameData.editorData.frames[0].y = newY;
+
+                for (var location of frameData.editorData.locations) 
+                {
+                    location.x +=  newX- oldX;
+                    location.y +=  newY- oldY;       
+                }
+                SerializationTools.AddFrameToMaterial(frameData, this.props.globalState, this.props.globalState.nodeMaterial); 
+
+                
+                let newFrame = this._graphCanvas.frames[this._graphCanvas.frames.length -1];
+                newFrame.cleanAccumulation();
+                this.props.globalState.onSelectionChangedObservable.notifyObservers(null);
+                this.props.globalState.onSelectionChangedObservable.notifyObservers(newFrame);
+
                 this.forceUpdate();
                 return;
             }

nodeEditor/src/sharedComponents/lineWithFileButtonContainerComponent.tsx

@@ -43,11 +43,11 @@ export class LineWithFileButtonContainerComponent extends React.Component<ILineW
     render() {
         return (
             <div className="nonDraggableLine withButton" title="add">
-                Add
-                <div className="icon" title="Upload Custom">
+                Add...
+                <div className="icon" title="Upload Custom Frame">
                 <img src={addButton}/>
                 </div>
-                <div className="buttonLine" title="Upload Custom">
+                <div className="buttonLine" title="Upload Custom Frame">
                     <label htmlFor={this.props.uploadName ? this.props.uploadName : "file-upload"} className="file-upload"/>   
                     <input ref={this.uploadRef} id={this.props.uploadName ? this.props.uploadName : "file-upload"} type="file" accept={this.props.accept} onChange={evt => this.onChange(evt)} />
                 </div>