W3C home > Mailing lists > Public > public-webapps@w3.org > January to March 2015

Re: oldNode.replaceWith(...collection) edge case

From: Glen Huang <curvedmark@gmail.com>
Date: Sun, 18 Jan 2015 12:17:02 +0800
Cc: public-webapps@w3.org
Message-Id: <E30B9CA4-F244-4865-8779-029556B53ABB@gmail.com>
To: Anne van Kesteren <annevk@annevk.nl>
Oh crap. Just realized saving index won’t work if context node’s previous siblings are passed as arguments. Looks like inserting transient node is still the best way.

> On Jan 18, 2015, at 11:40 AM, Glen Huang <curvedmark@gmail.com> wrote:
> 
> To generalize the use case, when you have a bunch of nodes, some of which need to be inserted before a node, and some of which after it, you are likely to want `replaceWith` could accept the context node as an argument.
> 
> I just realized another algorithm: Before running the macro, save the context node’s index and its parent, and after running it, pre-insert node into parent before parent’s index’th child (could be null). No transient node involved and no recursive finding.
> 
> Hope you can reconsider if this edge case should be accepted.
> 
>> On Jan 16, 2015, at 5:04 PM, Glen Huang <curvedmark@gmail.com> wrote:
>> 
>> Oh, right. Trying to be smart and it just proved otherwise. :P
>> 
>>> I don't really see a good reason to complicate the algorithm for this scenario, personally.
>> 
>> This edge case may seem absurd at first sight. Let me provide a use case:
>> 
>> Imagine you have this simple site
>> 
>> ```
>> <ul>
>> 	<li><a href=“blog.html”>Blog</li>
>> 	<li><a href=“blog.html”>About</li>
>> 	<li><a href=“blog.html”>Contact</li>
>> </ul>
>> <main>About page content</main>
>> ```
>> 
>> You are currently at the about page. What you are trying to do is that when the user clicks a nav link, the corresponding page is fetched via ajax, and inserted before or after the current main element, depending on whether the clicked nav link exists before or after the current nav link.
>> 
>> So when the page is first loaded, you first loop over the nav links to create empty mains for placeholder purposes.
>> 
>> ```
>> <ul>
>> 	<li><a href=“blog.html”>Blog</li>
>> 	<li><a href=“about.html”>About</li>
>> 	<li><a href=“contact.html”>Contact</li>
>> </ul>
>> <main></main>
>> <main>About page content</main>
>> <main></main>
>> ```
>> 
>> How do you do that? Well, ideally, you should be able to just do (in pseudo code):
>> 
>> ```
>> currentMain = get the main element
>> links = get all a elements
>> mains = []
>> 
>> for i, link in links
>> 	if link is current link
>> 		mains[i] = currentMain
>> 	else
>> 		mains[i] = clone currentMain shallowly
>> 
>> currentMain.replaceWith(…mains)
>> ```
>> 
>> This way you are inserting nodes in batch, and not having to deal with choosing insertBefore or appendChild.
>> 
>> Without `replaceWith` supporting it, in order to do batch insertions (nav links could be a large list, imagining a very long TOC links), you are forced to manually do the steps I mentioned in the first mail.
>> 
>>> On Jan 16, 2015, at 4:22 PM, Anne van Kesteren <annevk@annevk.nl> wrote:
>>> 
>>> On Fri, Jan 16, 2015 at 8:47 AM, Glen Huang <curvedmark@gmail.com> wrote:
>>>> Another way to do this is that in mutation method macro, prevent `oldNode` from being added to the doc frag, and after that, insert the doc frag before `oldNode`, finally remove `oldNode`. No recursive finding of next sibling is needed this way.
>>> 
>>> But then d2 would no longer be present?
>>> 
>>> I don't really see a good reason to complicate the algorithm for this
>>> scenario, personally.
>>> 
>>> 
>>> -- 
>>> https://annevankesteren.nl/
>> 
> 
Received on Sunday, 18 January 2015 04:17:34 UTC

This archive was generated by hypermail 2.3.1 : Friday, 27 October 2017 07:27:25 UTC