mirror of
https://github.com/not-kennethreitz/convore.json.git
synced 2026-06-05 15:10:17 +00:00
Kenneth Reitz
1 line
5.3 KiB
JSON
1 line
5.3 KiB
JSON
[{"user_id": 12843, "stars": [], "topic_id": 38346, "date_created": 1307388367.834482, "message": "But I wonder what patterns exist to, for example, decide when to create in-memory objects to help organize code. Or when to create and insert DOM elements instead of creating them in HTML", "group_id": 160, "id": 1309768}, {"user_id": 12843, "stars": [], "topic_id": 38346, "date_created": 1307388289.897444, "message": "In client-side JavaScript you have the DOM wich is a tree of objects ... you can get a lot done just by attaching event handlers to those objects", "group_id": 160, "id": 1309730}, {"user_id": 12843, "stars": [], "topic_id": 38346, "date_created": 1307388156.6428671, "message": "Hopefully I can articulate a question here without sounding stupid: As I try to improve my JavaScript (client side), I'm having a little trouble conceptualizing it as a programming language in the context of the DOM", "group_id": 160, "id": 1309674}, {"user_id": 12843, "stars": [], "topic_id": 38346, "date_created": 1307388241.5761051, "message": "In a typical programming language it's pretty clear that you create everything (objects/functions/variables) that exist in a given scope and in memory, and you interact with them as your program executes", "group_id": 160, "id": 1309709}, {"user_id": 2630, "stars": [], "topic_id": 38346, "date_created": 1307391207.760664, "message": "I get where you're going, but need more context. Maybe you can give some concrete examples and ask questions that illustrate your concerns?", "group_id": 160, "id": 1310741}, {"user_id": 12843, "stars": [], "topic_id": 38346, "date_created": 1307422558.008404, "message": "@polotek ok - lets say it's a panel that slides open with a textbox and a submit button. Two click events to handle (slide open, and submit ajax post). Now we want to reuse the panel on various places on the page, among different parts of the DOM - and the slide-open click doesn't necessarily happen within the panel itself.", "group_id": 160, "id": 1316987}, {"user_id": 12843, "stars": [], "topic_id": 38346, "date_created": 1307422666.9526329, "message": "So the simplest level of abstraction is maybe to create a container object for functions (to avoid namespace clutter) and bind those functions to click events wherever needed (as opposed to passing anonymous functions to event handlers).", "group_id": 160, "id": 1316992}, {"user_id": 12843, "stars": [], "topic_id": 38346, "date_created": 1307422959.7739811, "message": "To turn that into a question: Would you abstract that further? Is there a pattern that you typically use for re-usable \"widgets\" like that (where the functionality might be spread across different parts of the DOM)?", "group_id": 160, "id": 1317013}, {"user_id": 8327, "stars": [], "topic_id": 38346, "date_created": 1307478220.5807719, "message": "Assuming all elements are loaded on the page (but some are hidden, ready to appear on slide), you might select your container using their class name, then attach the same event handlers on their children (the textbox and button).", "group_id": 160, "id": 1327424}, {"user_id": 8327, "stars": [], "topic_id": 38346, "date_created": 1307478284.6894059, "message": "An alternative to that would be to attach a single handler on a parent element containing all the instances <body> for example, and listen for click events. Then use the event properties to determine what was clicked, and which action (if any) should be taken.", "group_id": 160, "id": 1327439}, {"user_id": 12843, "stars": [], "topic_id": 38346, "date_created": 1307508573.2115769, "message": "@mal thanks. I don't think I'm articulating my question very well. But your suggestion of putting a single handler on a parent element is what I would call a *pattern* in the context of DOM+JavaScript", "group_id": 160, "id": 1333847}, {"user_id": 32812, "stars": [], "topic_id": 38346, "date_created": 1307513035.311723, "message": "data- attributes and live() are very much good friends I think in a situation like this.", "group_id": 160, "id": 1334285}, {"user_id": 28768, "stars": [], "topic_id": 38346, "date_created": 1307546617.466645, "message": "For the example you gave, sounds like you'd want to create a widget object that would be capable of managing its own state (i.e., open/closed), store references to its container and children, and wire up the events.. ? Unless any data used is actually relevant to the DOM elements, I'd argue against storing it in data-attrs and just store it in JS.", "group_id": 160, "id": 1338252}, {"user_id": 12843, "stars": [], "topic_id": 38346, "date_created": 1307597992.2534201, "message": "@garann right! I had the same instinct, but as I worked on it I thought I could keep it leaner by just sticking event handlers here and there. That's really what sparked the question - sticking event handlers everywhere gets messy - wondering about best practices, and clean maintainable code.", "group_id": 160, "id": 1346610}, {"user_id": 28768, "stars": [], "topic_id": 38346, "date_created": 1307630078.0896809, "message": "@ethanmiller I think that probably is leaner, but less maintainable. If you know the container of the widget, you could possibly delegate event handlers to it, and abstract out the event handler behavior with functions within the widget or pub/sub if you need the events to trigger multiple changes..", "group_id": 160, "id": 1350544}] |