Page 1 of 1

Topic Icons List in a popup

Posted: Wed May 22, 2019 9:44 pm
by eduardo_nl
I'm trying to find a way to "solve" it's been a while.

I have almost 500 unique icons being used in my forum and it is getting difficult to edit a post/topic, since every time I edit it, the list with all the icons appears on the page, and it's is getting a bit heavy to load. I already tried to uncheck the "Display on posting page" thing, but if/when I edit a topic that had a icon, the icon disappears (since it is no longer on the list).

Icons being locked to a topic IDs would already solve this, but I do not know if it's possible.

One solution would be to create a button that would open the icon list in a popup, like what already happens with the smilies list.

Something like this would be possible?

Re: Topic Icons List in a popup

Posted: Thu May 23, 2019 2:13 am
by EA117
Someone with extension experience should also comment on additional benefits that could be realized that way, but it seems like this feature could be successfully implemented simply as a function of the style, too.

In it's most basic form, changing the posting_editor.html template to use the topic_icon data differently. To construct a drop-down textual list form input field instead of the current radio buttons, and then through a JavaScript onChange handler update a single image element to display just the currently-selected icon and never "all of them".

The style could of course also get much fancier than that, using JQuery plug-ins or other approaches to make a slick non-textual image-based drop-down selection using the topic_icon data delivered through the template. With an appropriate delay-load to avoid retrieval except when actually needed for display. I presume a style-only change should even be able to achieve the "pop-up" approach, by building, hiding, and showing a foreground modal containing the available selections.

I'm not familiar with "like what already happens with the smilies list." For me the smilies behave just like you're seeing here on phpbb.com/community, and essentially "the same as topic icons" since they're always displayed. Do you possibly already have an extension installed that provides that pop-up behavior for smilies? Or maybe it's even a feature of the installed style, and could be duplicated into the topic icon handling.

Re: Topic Icons List in a popup

Posted: Thu May 23, 2019 2:27 am
by Lumpy Burgertushie
any smilies other than the ones that show on the posting form can be seen in a popup that is linked right below the smilies box.
that is default behaviour.

robert

Re: Topic Icons List in a popup

Posted: Thu May 23, 2019 7:45 am
by EA117
Lumpy Burgertushie wrote:
Thu May 23, 2019 2:27 am
any smilies other than the ones that show on the posting form can be seen in a popup that is linked right below the smilies box.
that is default behaviour.
Ah, thanks for that. edit: Didn't realize there was an alternate display, and hadn't yet had a reason to not "display on posting" for any smilies.

Re: Topic Icons List in a popup

Posted: Thu May 23, 2019 8:01 am
by david63
Out of curiosity why do you have almost 500 topic icons?

Re: Topic Icons List in a popup

Posted: Thu May 23, 2019 2:39 pm
by eduardo_nl
david63 wrote:
Thu May 23, 2019 8:01 am
Out of curiosity why do you have almost 500 topic icons?
We have a lot topics for games and movies. And almost each one of those has a topic icon.

Re: Topic Icons List in a popup

Posted: Thu May 23, 2019 2:39 pm
by Brf
Lumpy Burgertushie wrote:
Thu May 23, 2019 2:27 am
any smilies
Isn't this topic about Topics Icons, not smilies?

Re: Topic Icons List in a popup

Posted: Thu May 23, 2019 2:47 pm
by EA117
Brf wrote:
Thu May 23, 2019 2:39 pm
Isn't this topic about Topics Icons, not smilies?
Robert was educating me, in response to one of my questions.
Lumpy Burgertushie wrote:
Thu May 23, 2019 2:27 am
EA117 wrote:
Thu May 23, 2019 2:13 am
I'm not familiar with "like what already happens with the smilies list." For me the smilies behave just like you're seeing here on phpbb.com/community, and essentially "the same as topic icons" since they're always displayed. Do you possibly already have an extension installed that provides that pop-up behavior for smilies? Or maybe it's even a feature of the installed style, and could be duplicated into the topic icon handling.
any smilies other than the ones that show on the posting form can be seen in a popup that is linked right below the smilies box.
that is default behaviour.

Re: Topic Icons List in a popup / checkbox

Posted: Thu May 30, 2019 10:38 am
by Talk19Zehn
Hello, whether this idea is sufficient? In my case, I tried it with a checkbox / spoiler. And I test it now only on desktop mode with phpBB version 3.2.7, it works so far. Maybe it could be helpful. Nevertheless, with no guarantee ...

Test, test, test ==> Topic Icons List open /close with a checkbox (!):

CSS:

Code: Select all

/* threadssymbol box Show and Hide
---------------------------------------------------------*/
input.threadssymbol {
	display: inline-block;
	margin: 0px;
	padding: 0px;
	vertical-align: sub;
}

.threadsspoiler {
	padding: 0;
	margin: 10px 0px 12px;
	display: none;
}

input.threadssymbol:checked + .threadsspoiler {
	display: block;
}
HTML: here only the prosilver -> standard(!!)
posting_editor.html

search and delete

Code: Select all

	<!-- IF S_SHOW_TOPIC_ICONS or S_SHOW_PM_ICONS -->
	<dl>
		<dt><label for="icon">{L_ICON}{L_COLON}</label></dt>
		<dd>
			<label for="icon"><input type="radio" name="icon" id="icon" value="0" checked="checked" tabindex="1" /> <!-- IF S_SHOW_TOPIC_ICONS -->{L_NO_TOPIC_ICON}<!-- ELSE -->{L_NO_PM_ICON}<!-- ENDIF --></label>
			<!-- BEGIN topic_icon --><label for="icon-{topic_icon.ICON_ID}"><input type="radio" name="icon" id="icon-{topic_icon.ICON_ID}" value="{topic_icon.ICON_ID}" {topic_icon.S_ICON_CHECKED} tabindex="1" /><img src="{topic_icon.ICON_IMG}" width="{topic_icon.ICON_WIDTH}" height="{topic_icon.ICON_HEIGHT}" alt="{topic_icon.ICON_ALT}" title="{topic_icon.ICON_ALT}" /></label> <!-- END topic_icon -->
		</dd>
	</dl>
	<!-- ENDIF -->
search:

Code: Select all

	<div id="message-box" class="message-box">
		<textarea <!-- IF S_UCP_ACTION and not S_PRIVMSGS and not S_EDIT_DRAFT -->name="signature" id="signature" style="height: 9em;"<!-- ELSE -->name="message" id="message"<!-- ENDIF --> rows="15" cols="76" tabindex="4" onselect="storeCaret(this);" onclick="storeCaret(this);" onkeyup="storeCaret(this);" onfocus="initInsertions();" class="inputbox">{MESSAGE}{DRAFT_MESSAGE}{SIGNATURE}</textarea>
	</div>
and add after:

Code: Select all

<div>
	<!-- IF S_SHOW_TOPIC_ICONS or S_SHOW_PM_ICONS -->
	<input type="checkbox" class="threadssymbol" />&nbsp;{L_ICON}{L_COLON}&nbsp;{L_DISPLAY}
	<div class="threadsspoiler"><br />
	<dl>
		<dt><label for="icon">{L_ICON}{L_COLON}</label></dt>
		<dd>
			<label for="icon"><input type="radio" name="icon" id="icon" value="0" checked="checked" tabindex="1" /> <!-- IF S_SHOW_TOPIC_ICONS -->{L_NO_TOPIC_ICON}<!-- ELSE -->{L_NO_PM_ICON}<!-- ENDIF --></label>
			<!-- BEGIN topic_icon --><label for="icon-{topic_icon.ICON_ID}"><input type="radio" name="icon" id="icon-{topic_icon.ICON_ID}" value="{topic_icon.ICON_ID}" {topic_icon.S_ICON_CHECKED} tabindex="1" /><img src="{topic_icon.ICON_IMG}" width="{topic_icon.ICON_WIDTH}" height="{topic_icon.ICON_HEIGHT}" alt="{topic_icon.ICON_ALT}" title="{topic_icon.ICON_ALT}" /></label> <!-- END topic_icon -->
		</dd>
	</dl>
	<!-- ENDIF -->
	</div>
</div>
Regards