Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Can this mod be made into a sugar? #14

Closed
figuerom16 opened this issue Feb 9, 2024 · 5 comments
Closed

Can this mod be made into a sugar? #14

figuerom16 opened this issue Feb 9, 2024 · 5 comments

Comments

@figuerom16
Copy link

figuerom16 commented Feb 9, 2024

This adds in a small modifier to pick up elementSiblings.
It's been great for picking up single tags at the same level like <input> and <img>. Putting some of the scripting outside of a tag like <td> is nice for for searching a table without creating a text node.

me(selector=null, start=document, warning=true) {
	if (selector == null) return $.sugar(start.currentScript.parentElement) // Just local me() in <script>
	if (selector instanceof Event) return selector.currentTarget ? $.me(selector.currentTarget) : (console.warn(`Surreal: Event currentTarget is null. Please save your element because async will lose it`), null) // Events try currentTarget
	// Goofy mod here.
	if (typeof selector == 'string') {
		if (selector === '<') return $.sugar(start.currentScript.previousElementSibling)
		if (selector === '>') return $.sugar(start.currentScript.nextElementSibling)
		if (isSelector(selector, start, warning)) return $.sugar(start.querySelector(selector)) // String selector.
	}
	if ($.isNodeList(selector)) return $.me(selector[0]) // If we got a list, just take the first element.
	if ($.isNode(selector)) return $.sugar(selector) // Valid element.
	return null // Invalid.
},

Is it possible to use the sugar system for this?

@gnat
Copy link
Owner

gnat commented Feb 10, 2024

Interesting. Might add next / previous to core.

As a chainable ex: me().next() and me().previous() it'd be no problem

@figuerom16
Copy link
Author

figuerom16 commented Feb 10, 2024

EDIT: refactor for clarity.

That unfortunately looks like it's going to grab the parent element then next/prev sibling which would dodge grabbing a void element.

What about having me() check if there is a previousElementSibling first if that doesn't exist then use the parent instead?

me(selector=null, start=document, warning=true) {
	if (!selector) return $.sugar(start.currentScript.previousElementSibling || start.currentScript.parentElement)  // Just local me() in <script>
	...
},

any(selector, start=document, warning=true) {
	if (!selector) return $.sugar([start.currentScript.previousElementSibling || start.currentScript.parentElement]) // Just local me() in <script>
        ...
},

That will allow for the capture void elements like input below.

<div class="flex">
	<input type="search" placeholder="Search">
	<script>me().on('input', e=>{search_table(me('#tmarkdown'), me(e))})</script>
        ...
</div>

me() would retrieve input instead of the current behavior of retrieving the div. Moving script directly below <div class="flex"> would cause it to get the parent element instead since no previous sibling exists.

@gazpachoking
Copy link

gazpachoking commented Feb 10, 2024

I was experimenting with some tree traversal over here. #6 With that system your case would be something like me.el('input').on(...) to grab the first input element of me (which would still be the div)

@figuerom16
Copy link
Author

@gazpachoking That looks interesting and is beyond what I'm looking for. My objective is to be as lazy as possible and retrieve previous adjacent element or the parent. Advanced traversal is beyond me other than using CSS selectors.

I refactored my previous comment for clarity.

@figuerom16
Copy link
Author

Closing this in favor of PR #17

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants