nprapps / dailygraphics-templates

Graphic templates for the dailygraphics-next rig
9 stars 14 forks source link

improve table template to work better out of the box if data labels change #40

Open DanielJWood opened 8 months ago

DanielJWood commented 8 months ago

Is it worth writing a script that auto generates the columnheaders, and row syntax, instead of you doing it manually each time. Potentially this could be a script run in the google doc in an app script, or something run locally. Basically, ingest column names, spit out html. For instance, for the columns: foo, bar, baz you would get the following:

    <tr>
        <th role="columnheader">
          <div class="sorter"><div class="icon"></div></div>
          <div class="header"><%= COPY.labels.hdr_foo %></div>
        </hr>
        <th role="columnheader">
          <div class="sorter"><div class="icon"></div></div>
          <div class="header"><%= COPY.labels.hdr_bar %></div>
        </hr>
        <th role="columnheader">
          <div class="sorter"><div class="icon"></div></div>
          <div class="header"><%= COPY.labels.hdr_baz %></div>
        </hr>
    </tr>

and

<tr class="tk" role="row">
 <td role="cell" data-title="<%= COPY.labels.hdr_foo %><%= row.foo %></td>
 <td role="cell" data-title="<%= COPY.labels.hdr_bar %><%= row.bar %></td>
 <td role="cell" data-title="<%= COPY.labels.hdr_baz %><%= row.baz %></td>
</tr>

Of course there is always further customization that happens from this point but it could save a bit of time in reformatting the index.html

thomaswilburn commented 8 months ago

You may want to check out the way we handle this at Chalkbeat, where we have a columns sheet that specifies the field, class name, label, and template functions that can be applied the content. There's no need to get external scripts involved. https://github.com/Chalkbeat/dailygraphics-templates/blob/master/table/index.html

DanielJWood commented 8 months ago

Ah great! Will look. Thx.