This builds upon Zhou's multi-instances branch, beginning the refactor of phenogrid.js/css that is necessary to support multiple instances. It is not complete, but it is better than before and the rest is an exercise left to the reader.
Basic strategy:
in `createPhenogridContainer', use the user-supplied element's ID to generate an 'address space' of derived IDs.
Replace REFERENCE occurrences of '#pg_XXX' with '#' + this.pgXXXId
Replace CREATION occurrences of '<div id="pg_XXX">' with '<div id="' + this.pgXXXId + '" class="pg_XXX">
Edit the CSS file so that #pg_XXX becomes .pg_XXX. Basically, use CSS class selectors for styling, don't use CSS IDs for styling.
Hopefully, you should be able to follow my lead and clean the code up by removing all use of IDs for styling and instead using the generated IDs from _createPhenogridContainer() to attach behavior.
This builds upon Zhou's multi-instances branch, beginning the refactor of phenogrid.js/css that is necessary to support multiple instances. It is not complete, but it is better than before and the rest is an exercise left to the reader.
Basic strategy:
'#pg_XXX'with'#' + this.pgXXXId'<div id="pg_XXX">'with'<div id="' + this.pgXXXId + '" class="pg_XXX">#pg_XXXbecomes.pg_XXX. Basically, use CSS class selectors for styling, don't use CSS IDs for styling.Hopefully, you should be able to follow my lead and clean the code up by removing all use of IDs for styling and instead using the generated IDs from _createPhenogridContainer() to attach behavior.