8 votes

Fortnightly Programming Q&A Thread

Automatically posted
Tags: programming, recurring.biweekly

General Programming Q&A thread! Ask any questions about programming, answer the questions of other users, or post suggestions for future threads.

Don't forget to format your code using the triple backticks or tildes: 

Here is my schema:

```sql
CREATE TABLE article_to_warehouse (
  article_id   INTEGER
, warehouse_id INTEGER
)
;
```

How do I add a `UNIQUE` constraint?

15 comments

  1. [12]
    unknown user
    (edited )
    Link
    I'm trying to figure out a proper HTML structure for the nodes in Intergrid. The issue comes down to the fact that I'm using checkboxes to provide folding as part of the multi-layered node...

    I'm trying to figure out a proper HTML structure for the nodes in Intergrid.

    The issue comes down to the fact that I'm using checkboxes to provide folding as part of the multi-layered node structure. What I currently have is:

    <div class="wrapper">
	<input type="checkbox">
	<div class="node">
		<span class="content">some sort of content</span>
	</div>
	<div class="children">
		<!-- some amount of .wrapper+.node+.children structures downstream -->
	</div>
</div>

    Activating the checkbox makes the nearby .children element become display: none;. Since it's done via CSS, it's quick, and I have no need to mess with any more JS than I have to.

    The issue here is minimizing the amount of HTML I have to use to display and make interactable the same thing: a node with some content (not necessarily a separate element), its children, and (if the node has children) the folding toggle (here: the checkbox) that lets me collapse and expand the subnodes.

    The way I used to solve it was only having the .node and the .children, and putting the folding inside .children, then magic-numbering its position to the appropriate node. It's inelegant and creates its own issues when navigating the code, but it let me write and move around less HTML when manipulating the nodes.

    Right now, I'm looking at Web Components and trying to see whether it can solve my problem of using the fewest elements possible – or, at least, making their manipulation streamlined (i.e. using the fewest commands). Apparently, you can define a Web Component in a way that keeps it as a native HTML element while adding functionality? I'm still unclear on this one. I know there's a lot of libraries that allow for this, but I have no mental model on how to use them, let alone on how to use them well.

    I've also considered using pure-JS folding, since the app I'm working on is very much JS to begin with. It might make the code management easier, but with potentially thousands of nodes in use at any given point, speed takes priority. Anywhere I can cut down on some performance issues without sacrificing much of code simplicity is somewhere I'd like to explore.

    EDIT: I did consider using the native HTML <details> element, which provides folding perfectly on its own. Except... it would fold and unfold whenever I clicked on it. Which is an issue when you have an element within the incessant folder that's activated by clicking on it – which, given that it's a part of the <details>, also triggers the <details> click – and so, it folds.

    Not a good strategy, but one I had to try out.

    3 votes
    1. [9]
      unknown user
      Link Parent
      Not sure that I have fully understood what you're trying to make, but here is an idea: <style> input[type="checkbox"]:checked ~ fieldset { display: none; } </style> <!-- … --> <fieldset> <input...

      Not sure that I have fully understood what you're trying to make, but here is an idea: 

      <style>
input[type="checkbox"]:checked ~ fieldset {
	display: none;
}
</style>
<!-- … -->
<fieldset>
<input type="checkbox"/>
<div>content 1</div>
<fieldset>
<input type="checkbox"/>
<div>content 2</div>
<fieldset>
<input type="checkbox"/>
<div>content 3</div>
</fieldset>
</fieldset>
</fieldset>

      Demo: https://codepen.io/Ainar-G/pen/pooWgdZ.

      2 votes
      1. [8]
        unknown user
        Link Parent
        Oh, I have the folding mechanism locked-down. It's all in working order. The goal right now is to minimize the markup I already use, which hopefully also simplifies the JS-side management of it:...

        Oh, I have the folding mechanism locked-down. It's all in working order. The goal right now is to minimize the markup I already use, which hopefully also simplifies the JS-side management of it: adding, moving, removing, and editing the HTML part of the content.

        In other words, what I'm trying to figure out is how to turn the markup from my comment into the markup from your comment (which looks much simpler, the issues though it has) without making a mess out of it.

        Kudos for the effort, nevertheless.

        1 vote
        1. [7]
          unknown user
          Link Parent
          What does your current mark-up do that something like mine can't do? I'm asking because I still don't get what you're trying to achieve and why your current solution isn't good enough, but it...

          What does your current mark-up do that something like mine can't do? I'm asking because I still don't get what you're trying to achieve and why your current solution isn't good enough, but it sounds interesting enough for a Tuesday evening puzzle :-)

          1. [6]
            unknown user
            Link Parent
            I have a steady feeling that what I have can be further reduced by number of elements involved. I'm looking for whether I can do the same thing with fewer parts. My solution seems to be the 20% of...

            I still don't get <...> why your current solution isn't good enough

            I have a steady feeling that what I have can be further reduced by number of elements involved. I'm looking for whether I can do the same thing with fewer parts.

            My solution seems to be the 20% of the effort that does 80% of the work. I'm looking into whether I can go the extra mile and refactor the HTML into something smaller and more efficient.

            I can maybe move the toggle functionality onto the .node itself somehow while still utilizing the CSS to hide the .children. Like I said, HTML+CSS is preferably to adding any more JS, and [type="checkbox"] is a good solution in this regard.

            Is that clear? I feel like I'm not expressing my intent clearly here. If you need further elaboration, just say the word.

            1. [5]
              unknown user
              Link Parent
              I'm probably too tired after a day of work at the office. If you like your current mark-up and you just want to reduce it then I don't really see why you need the .wrapper class in the first...

              I'm probably too tired after a day of work at the office. If you like your current mark-up and you just want to reduce it then I don't really see why you need the .wrapper class in the first place, since most of your .children blocks will probably only contain one .wrapper block?

              1 vote
              1. [4]
                unknown user
                Link Parent
                .wrapper is there to host the .node's checkbox. That way – within an external container – the checkbox could be safely positioned just outside the .node so I could position: absolute; the checkbox...

                .wrapper is there to host the .node's checkbox. That way – within an external container – the checkbox could be safely positioned just outside the .node so I could position: absolute; the checkbox and be sure it will "land" (end up within the box of its container) just about on the same baseline as .node.

                It's about both the positioning of the checkbox and the fact that it's "attached" to the .node it serves the folding for.

                Without the .wrapper, moving the elements around (which is a thing in Intergrid) would be more complicated. I'd have to account for whether there's a checkbox before .node if I'm moving the .node up the chain etc.

                1 vote
                1. [3]
                  unknown user
                  Link Parent
                  You mean something like this? Why not float?

                  You mean something like this? Why not float?

                  1. [2]
                    unknown user
                    Link Parent
                    You mean, just like what fieldset does, except with a hint of semanticity? ;) What's the benefit of float over position: absolute in this scenario?

                    You mean, just like what fieldset does, except with a hint of semanticity? ;)

                    What's the benefit of float over position: absolute in this scenario?

                    1. unknown user
                      Link Parent
                      Well, you are trying to reduce the number of moving parts, and float allows you to throw the wrapper away. It also seems more semantically correct to me, after all, what you need is for other...

                      Well, you are trying to reduce the number of moving parts, and float allows you to throw the wrapper away. It also seems more semantically correct to me, after all, what you need is for other content to wrap around it. And thirdly, position: absolute is almost always a hack, at least in “interactive documents” as opposed to “web applications”.

                      2 votes
    2. [2]
      Deimos
      (edited )
      Link Parent
      I don't think you'll be able to reduce it much beyond that. The CSS framework that I use as a base for Tildes (Spectre.css) usually does a good job with its HTML, and has a similar sort of...

      I don't think you'll be able to reduce it much beyond that. The CSS framework that I use as a base for Tildes (Spectre.css) usually does a good job with its HTML, and has a similar sort of functionality with its "Accordions". Its HTML looks very similar to yours, except that it's hiding the checkbox and using an icon:

      <!-- standard Accordions example -->
<div class="accordion">
  <input type="checkbox" id="accordion-1" name="accordion-checkbox" hidden>
  <label class="accordion-header" for="accordion-1">
    <i class="icon icon-arrow-right mr-1"></i>
    Title
  </label>
  <div class="accordion-body">
    <!-- Accordions content -->
  </div>
</div>

      The main difference is probably that it's using a <label>, which would be more correct if you want people to be able to click on the node's content to fold/unfold.

      2 votes
      1. unknown user
        Link Parent
        I used to have <label> as part of the structure. Removed it in an effort to reduce the quantity of elements, replacing it with a [type="checkbox"]:before displaying a + or a −, depending on the...

        I used to have <label> as part of the structure. Removed it in an effort to reduce the quantity of elements, replacing it with a [type="checkbox"]:before displaying a + or a −, depending on the folding status.

        Would you be surprised to learn that while it worked fine in Chrome, Firefox took none of my shit and refused to display the pseudo-element?

        I might be going back to <label>.

        1 vote
  2. [2]
    rogue_cricket
    Link
    Is there a way to see if two MySQL queries are equivalent after an optimizer pass? There's a particular bizarre little expression that keeps popping up in an awful query that I'm editing and I...

    Is there a way to see if two MySQL queries are equivalent after an optimizer pass? There's a particular bizarre little expression that keeps popping up in an awful query that I'm editing and I suspect it just gets optimized out anyway. I'm just curious, and I'm not really planning on basing my work on the answer, I'm just wondering if there's a way for me to check.

    2 votes
    1. Macil
      Link Parent
      Using an EXPLAIN statement might be useful for this.

      Using an EXPLAIN statement might be useful for this.

      2 votes
  3. unknown user
    (edited )
    Link
    Vim question: If I set my $TERM to xterm-mono then my Vim doesn't show menus, e.g. for <C-x><C-n> and other auto-complete stuff. Is there a way to make it show the menu again? EDIT: Apparently, if...

    Vim question: If I set my $TERM to xterm-mono then my Vim doesn't show menus, e.g. for <C-x><C-n> and other auto-complete stuff. Is there a way to make it show the menu again?

    EDIT: Apparently, if your terminal has less than eight colours, you're kind of screwed:

    The menu is used when:

    • The 'completeopt' option contains "menu" or "menuone".
    • The terminal supports at least 8 colors.
    • There are at least two matches. One if "menuone" is used.

    Bother. Looking for a way to force it.