Managing Properties in HTML

[PullJosh]

How do we want to deal with properties of objects?

My thought was to have infinite inputs, like in the join block from Snap!

Each of these inputs would be "property inputs", which could contain "property blocks". Each property block would have two inputs, and look something like this:

(Images created with Snap! custom blocks and "save scripts pic" in rt. click menu)

The only difference, though, would be that the first input in the property block could must be a dropdown.

[quat1024]

It would be super super cool if there was a dropdown menu on the left half of the block (class, id, etc), but because of the sheer number of html attributes, how do we make the menu not fill the whole screen? There's a loooooooooooooot of attributes in html.

[PullJosh]

Hmm... how about a searchable dropdown, that only shows up to, say, 10 items at a time. You can scroll through it like the scratch key press block dropdown, or you can type to filter out attributes. :D

[quat1024]

Yeahhhh

It would be sorted in alphabetical order, starting from the second page. The most commonly used ones would be on the first page too for easier access. 😄

[towerofnix]

Make it so that the input is a text-dropdown so that you can type in it, say, data-line-id.

[PullJosh]

Like the list blocks in scratch (item [EPIC DROPDOWN] of list [bleh dropdown]), but searchable.

[matthewr6]

I've made searchable dropdowns before in HTML (React.js is amazing), but do we plan to use canvas or the dom?

[quat1024]

^ Good question

[matthewr6]

What does pixie use?
IMO, dom would be easier.

I think.

But if we do DOM, I would suggest that everybody play with Riot.js and React.js because they're really good for components (blocks, in this case) - especially Riot, since it's easier.

[PullJosh]

I'm not sure what's best, in this case, but DOM seems to make a bit more sense...

I'll check out Riot.

[quat1024]

What does pixie use?

Some quick Inspect-Elementing tells me that pixie uses a separate for every block, and absolutely-positions them in the DOM. http://imgur.com/j5edLt5

[matthewr6]

I vote using the DOM.

[PullJosh]

@quat1024 Huh... That's pretty neat, actually. Surprised it's still fast.

Ohwait. This isn't Scratch. Everything is fast.

[matthewr6]

lol
until you do any sort of database query on thousands to tens of thousands of entries.

[an-OK-squirrel]

Here's an idea! (I would help with stuff once you get going :P)

[an-OK-squirrel]

(bad drawing lelz)

[glacialcascade]

I like drop down idea

[an-OK-squirrel]

I bet you would like mine if I drew it in more than a minute :P

[matthewr6]

I like both :P

[an-OK-squirrel]

I feel mine would feel cleaner.

[matthewr6]

It certainly doesn't based on the drawing xD

[an-OK-squirrel]

xD

[PullJosh]

Will do original suggestion, with searchable dropdown for first input.