SuttaCentral
Cool, thanks so much Ayya.
For you and @blake, just to let you know I have updated the main spec above in line with the changes we discussed. Please check it out to make sure we’re all on the same page. Let me know if there are any issues, anything needing fixing, or whatever.
Try again at https://samanerivimala.github.io/polymer-mockup-sc/
Digha Nikaya list is now collapsible but still needs a lot of styling as per the specs above. Not implemented iron-list yet but this is only 12 items anyway so iron-list would not do anything.
Wonderful, the pieces are falling into place!
OK, have a look again at the DN list (open incognito window to make sure there is no cache). Now with language dropdown and some styling. (just realised you want the DN# before so I will do that tomorrow)
But this raises some questions:
You might have written it up there somewhere but I cannot see it right now.
I guess the language dropdown in the more-menu just has languages and just changes the whole page for that language.
Great, another step forward. So far we have:
So this is excellent! I notice you have an example of a suttaplex without a title (DN 6), and one with title in original language only (DN 5). This is good, can you extend this with some other variations?
To come back to DN 5, I would suggest that if the title is found only in the original language, that should not be greyed out, but should be black as in the other primary titles.
Yes, this should be styled with similar spacing to an icon in a three-line list. We will have issues when it comes to long IDs, but let’s worry about that later.
As per the spec: the description is visible, and will display a maximum of two lines (this is the same as Google search results). I will edit the spec to make this clearer.
The descriptions will be written short enough so that in most cases the whole description will fit on two lines. We haven’t defined yet what will happen if this is exceeded (say on mobile), but let’s worry about that later.
The expander is to reveal the parallels.
This should be to the right of the translator button, not at the right of the box as a whole, i.e.:
ANANDAJOTI SUJATO Other 🞃
This last option is correct. This dropdown is a fallback, especially for cases where there is no translation available in the chosen language, or if for some other reason a user wants to look at a translation in a different language. So it shouldn’t change the UI, the descriptions, or anything else.
Since it is a fallback, I would suggest to keep it simple, and not worry about having to make it adaptable. In other words, it just gives a list of all the translations of that sutta, including the ones already visible, i.e. it basically does what the translation selector on the current site does. If you prefer to make it so that it excludes the translations already visible—i.e. in the example above, “Anandajoti” and “Sujato” would be filtered out from the dropdown—that’s fine, I just wouldn’t worry about it if it’s complicated.
Since the “English” translations are already displayed, it doesn’t help to label the dropdown “English”. It is for selecting “other” languages, so best to call it “Other”.
It’s under “Suttaplex list”, but should be clearer, I’ll do that now.
I’m not sure what you mean by “more menu”: I assume you mean the menu in the toolbar? If so, yes, this is correct. This sets the UI for the site as a whole.
This shows that I need to be clearer in labelling this menu, which up till know I have referred to as a “vertical menu”, named after the icon. But we also plan to have a vertical menu icon in the suttaplexes, so this is confusing. I’ll go back and rename the menu in the toolbar as “Toolbar Menu”. Naming is hard!
Sadhu Ayya. Just a minor note here, I am quite sure that the PT translation for DN suttas (as 99% of the rest of suttas translated in Portuguese) was done by Michael Beisert!
This is all dummy data, ignore it.
If you look here: https://user-content-dot-custom-elements.appspot.com/PolymerElements/iron-list/v1.4.4/iron-list/demo/collapse.html, the title description is just 1 line but on mobile versions it wraps to become several lines. I suggest we do the same. It matters for me to think about this now because the choices I make in the coding will depend on it.
The description that we have on SC doesn’t behave like this: it is visible, not hidden. What is revealed by the expander is the details, not the description.
In MD lists as I understand it, there is a maximum of three lines of text, in the default view at least. So we have the title, and two lines for the description.
On the demo that you link to, the visible component (class="shortText") obeys this: it wraps to two lines on narrow screens, but no more than this.
If the element wraps the text to more lines than this, it is not a big deal.
But in any case, I don’t want the descriptions to be longer than this. Twenty words or so, max. Any more, and they are not easily scannable.
And BTW, I’ve linkified the headings in the spec, so we can more easily refer to the relevant bits. Like this. But it only works with inline links, One-boxing messes it up.
I’ve spent several days messing around with iron-list but that became very difficult so I reverted to a normal dom-repeat instead.
The iron-list gave problems with the z-index (drop-down box disappears behind the following iron-list elements), which is a well-known problem on github and stackexchange but without many real solutions (a few hacks). It has been filed as a bug by several people on github.
Then the second problem has to do with the iron-list not understanding how to resize itself when there are dropdown-boxes that have an invisible height. So what you get is that it shows the list, but the last 2 items are missing. When you click on the dropdown box, the last two items appear and the first two disappear. I’ve tried several possible solutions but they all sort of help but then create other problems instead.
A third problem had to do with the loading of suttas that are within vaggas within an iron list. We can overcome this by making the json files different and listing vaggas as an item of each sutta, but that is not very elegant and together with the other problems, I decided that it was not worth it. We don’t have lists of 2000+ items.
So now I have reverted back to a normal list (see https://samanerivimala.github.io/polymer-mockup-sc/) I’ll keep on messing around with that for a while.
Okay, thanks for the update.
With regards to the parallel-menu:
What does this mean exactly? What details are you referring to? Does it open the sutta? But the various translation options already do this.
Also, would it not be more consistent to have the authors of the translated language underneath and the other languages in a dropdown under “other” next to it (including Pali, Chinese)?
“Details” always means “Parallels and References”.
? Isn’t this what I said? Or am I misunderstanding you?
That’s not how the mockup looks.
Yeah, it’s out of date, I haven’t got around to fixing it.
I’ve run into a next problem with the Parallels. You want to have a table so it can easily be copied to something like Word or OpenOffice. However, I just found that this is problematic in Polymer. I suggest using something like iron-table but not sure what that is going to do to the the ability to copy. There is no demo to try it out.
Don’t worry about it, just code it the way that works best in polymer.
I’ve made an update to https://samanerivimala.github.io/polymer-mockup-sc/
It lists parallels for dn1 and dn2 now.
Wow, looking awesome, congratulations. That’s now got all the things in the suttaplex view, if I’m not mistaken.
Not quite yet. Still messing around with some things so this is just a first draft.