[PoC implemented] Display model and source img

[henryk86]

If you assign a tag a certain model but a different source (like model is the image of the tag and source is the actual content (e.g. model: yakari figurine, content: episode 7 (Cd with cover xyz))) it would be nice to represent that in the tonie card also. Like the model image as currently as cover and new the src image as a small overlay or hover image.

something like here mocked:

Mockup details

source code:

<div class="ant-card-cover">
<img class="modelImage" alt="Wickie - Custom Tag" src="http://teddycloud.local/custom_img/wickie_bullyland.png" style="padding: 8px;display: block;">
<img  class="sourceImage" alt="Wickie - Custom Tag" src="https://cdn.smehost.net/hcmssmeappscom-delabelsprod/wickie_klassik_cd01.jpg">
</div>

.sourceImage {
    padding: 8px;
    position: absolute;
    top: 40%;
    left: 50%;
    height: 25%;
    width: auto;
}

This also needs some backend modifications. Currently only one of them is attached to the uid, this must be extended to a second one (like adding a child tag with the src one and same structure). To be checked how this will work with Original ones, but I assume both will be equal.

or overwork it a little that there are multiple images available (model one for cover and a second image for src). All other stuff like tonieinfo should be fetched from source if available (and filled from model if not set on src level)

[henryk86]

As there seems to ne no capacity to extend the api, i prepared it without need of an adapted API on cost of some performance. as soon as the api is extended, the fetching part here can be reverted.

It looks as follows:

Tonies overview:

tonies information modal:

there is a tooltip stating that alternative source is assigned (as shown in second image)

[henryk86]

performance needs to be checked if its usable!

[cbob]

Hi Henryk, first of all thanks for your work. It is awesome. Here is some feedback I like to provide you in regards of travel/coin tonies, while testing this PoC implementation.

As a quick background: I copied the original tonies metadata from the tonies.json over to the tonies.custom.json and than only modified the pic with a local url to my replacement picture. So the new custom tonies also includes the audio_id and hash.

Without having a look at the code it seems that the original content seems to be switched to my custom one as you can see in the first picture here:

After I removed that from the tonies.custom.json it switch back to the original image:

So my original idea was to have a clear differentiation between the original and travel tonies which was ok for the time being. Maybe for that use case (as I think many using travel tonies) It found be cool to have it the other way around:

• big image: content in the background,
• small image: picture of the tonies.custom.json
  • which could than be just a generic coin or whatever is defined

Hope this feedback is helpful for the further steps.

[henryk86]

first thank you for your feedback!
This use case could be difficult to handle even if I fully understand the intent.

The big image is fetched from the model information. There should be no change at all.
The small image is taken from the information fetched from the source which is got by the audio id (the information which is available in the library view if you access the taf file).

If you duplicated the json entry with the same audio id and hash, and only changed the pictures then this causes some uncertainty. The system has now to choose between two entries for one tag. Actually I do not know which one it prefers, the one from the tonies.json or the one from the tonies.custom.json. It seems like the custom one, but I don’t know. Especially I am not aware from with source the information was fetched in the end.

how ever. I use indeed the picture to decide if the small image shall be shown or not. If the picture is the same, I do not show the small one (only in the tonies view, in the information modal I also check differences within series, episodes and tracks).
In your case the picture is different and so I show the small one too.

still quite complicated and I have currently no idea how to solve that using this feature.

your proposal sounds reasonable, but I still prefer the actual tonie (model) as bigger image and the content (source) as smaller one.

so maybe you should adapt your custom entry for travel tags in general. No tonie image, just the coin. No audio id nor hash. Assign that as model to the travel / coin tonie. The actual content then will be the small tonie image.

[henryk86]

I still think the label request would solve this much better.

—> toniebox-reverse-engineering/teddycloud#157

[henryk86]

@cbob : have a look here:

you can download the pic here:

[cbob]

The more I think about the current implementation the more I would agree to the current implementation. So for example (even if I don't think that is currently a use case for me): If some day I would like to assign an alternative content to the coin/travel tonie (which than also has still that image inside the coin capsule) I could select the new content and than the hole think makes much more sense like before:

Maybe (for my original intent) this label request would really make more sense than this feature. But somehow is there any chance to make this feature optional? So if I have the situation with same tonie content but different picture I could opt-out that feature and if I come back later I could enable it again.

Regarding your last comment this is also a good workaround. I will also try to play around it.

Thank you!

[henryk86]

as soon as its possible to store some settings in a db or what ever, I think this could be configurable, even in tag level. on global level it may get its own setting in the settingssection. but this will be a subject to be discussed.

@SciLor what do you think about making some teddycloud frontend features configurable? (like show sourceInfo)

[cbob]

@henryk86 do you think it would be convenient to decide based on the content. So for example if the alternative content matches the other one than also not display the small icon?

So the tooltip current shows:

This Tonie "Feuerwehrmann Sam - Eine Insel voller Abenteuer" has an alternative content assigned: "Feuerwehrmann Sam - Eine Insel voller Abenteuer"!

Which for me as a user would also look as the contents are the same.

[henryk86]

i would rename the custom tonies json element accordingly with "Traveltonie Feuerwehrmann Sam".

maybe I change the tooltip also, remove "alternative".

i will sleep on it.

[henryk86]

@cbob : I am currently trying to recreate this 1:1. But as soon as I have the entry from the tonies.json in the custom json and only change the image, only the image from the custom json is displayed. no two images. in the model search, only the image from the custom json is displayed... did you really only change the image?

[cbob]

@henryk86 this was the first picture I posted here. It seems that the custom tonie has priority. What I than changed (see second picture) was removing the audio_id and the hash on the tonies.custom.json (and no but not sure if necessary).

[henryk86]

In the first case you still have two images on the second tonie. I could not reproduce that.

(the original image is idefix, the guy is the "coin"/custom image)

[henryk86]

did you captured the screen directly after changing the source?
no reload?

In my version i changed here something so that the tonie is really updated in frontend... maybe thats the difference...

but still there would be the problem that you are not really able to distinct between both...

if i adapt the custom json as mentioned (+changing the modelnumber):
the same bevhaviour as described. Custom Travel tonie has the travel image and the small original image. The original one has the original image

[cbob]

So I quickly checked the necessary steps I did to reproduce the initial behavior. So originally the config in tonies.cusom.json looked like this:

  {
      "no": "0",
      "model": "c-10000524",
      "audio_id": [
          "1614018035"
      ],
      "hash": [
          "4E0BCB589462786C497457BFC3A05D24C8D813EC"
      ],
      "title": "Feuerwehrmann Sam - Eine Insel voller Abenteuer",
      "series": "Feuerwehrmann Sam",
      "episodes": "Eine Insel voller Abenteuer",
      "tracks": [
          "Fußball gegen Wissenschaft",
          "SOS auf Pontypandy Eiland",
          "Balance auf dem Baumhaus",
          "Gefangen in der Schlucht",
          "Ameisenalarm"
      ],
      "release": "1615420800",
      "language": "de-de",
      "category": "audio-play",
      "pic": "<url-to-images>/image-10000524.png"
  }

In that case the original content was also associated with that coin image (in my case).

To get the behavior of the second image I removed the audio_id, hash, release and no:

  {
      "model": "c-10000524",
      "title": "Feuerwehrmann Sam - Eine Insel voller Abenteuer",
      "series": "Feuerwehrmann Sam",
      "episodes": "Eine Insel voller Abenteuer",
      "tracks": [
          "Fußball gegen Wissenschaft",
          "SOS auf Pontypandy Eiland",
          "Balance auf dem Baumhaus",
          "Gefangen in der Schlucht",
          "Ameisenalarm"
      ],
      "language": "de-de",
      "category": "audio-play",
      "pic": "<url-to-images>/image-10000524.png"
  }

In both cases (hope I mentioned that) I added a prefix to the custom entry model (c-)

[henryk86]

okay. the model prefix is important. With that i can reproduce it:

so. identical entry, different model and image:

[henryk86]

the following cases are possible:

1. different picture but same title
2. different picture and different title
3. same picture and same title
4. same picture and different title

i would go the following:

for case 1: Show only model picture
for case 2: Show both (status quo)
for case 3: Show only model picture (status quo)
for case 4: Show both

but again...
the assumption is, that in case 1 it's the same content (but if not... bäm)
the tracks are completly left out.

but I think we can go with that...

[henryk86]

next develop version will have this change.

[cbob]

Yes, I think this should be not really a problem.

Thanks a lot!

[henryk86]

currently the case of Kreativ tonies are still unsolved. They are have by default a different model and content. So they appear like:

(this one is a boxine defined Kreative one...)

[cbob]

For this last topic I also found something strange in my setup:

The shown apperence is only the same for me if I look on the home view. On the tonies page this does not seem to be there:

Home:

Tonies:

Another think I found is that a tonie which doesn't have an audio_id assign from tonies.json (in my case "Tilda Apfelkern - Tilda Apfelkern - Das Drinnen-Picknick") is also shown as the kreative ones. So I would guess that the library depends on the audio_id to match the icon, title and so on:

Home:

Tonies:

Library:

This seems to be different from yours right?

[henryk86]

I overworked here a lot now. i rechecked and it looks now the same. lets wait for the merge and recheck then.

So I would guess that the library depends on the audio_id to match the icon, title and so on

Yes. Library and content depends on the audio_id

[henryk86]

@cbob so. Es ist im develop. Bitte einmal anschauen :)

[cbob]

@henryk86: Sieht gut aus. Jetzt ist es denke ich klarer verständlich. Vielen Dank!

Auch die Diskrepanz zwischen Home und Tonies ist jetzt verschwunden.

[henryk86]

PoC in Develop

[henryk86]

@cbob this was now moved to the backend api. May you check in latest develop if it still works fine for your setup?

[cbob]

As far as I see it works still fine in TeddyCloud vX.X.X (a5a6237)!

[henryk86]

Perfect!