A - Z Artist / Profiles page - Audio Pro

MetalScene
MetalScene
@themetalscene
3 months ago
66 posts
Need a bit of asistance

i cant find any way to make a nice page A - z stle of every single artist profile on my site.

Be nice to have it sort able via

profile image,Band name - Genre, date formed, date split, status Hightest over all chart position, etc

Can i do this via the site builder and module or would i need to do ti via the templates. i am assuming once i have this page its a matter of a few tweaks to make it work for users, videos , albums etc


Also any assistance in how to get going or where in the docs to look, been reading a lot today haha


A second question is how to show the ALBUMS / Discography of an artists on their profile.

Thanks again, Jamroom and lock down has been a life saver
michael
@michael
3 months ago
7,232 posts
Ask the second question in its own thread, easier to explain one topic at a time.

The tool you're looking for is jrCore_list:

Docs: {jrCore_list}
https://www.jamroom.net/the-jamroom-network/documentation/module-developer-guide/89/jrcore-list

Its the swiss army knife of getting data from the database, so if you want something beginning with 'A' you'd have a url like:
site.com/some_template_name/a
or
site.com/some_template_name/letter=a

The difference in the two is what comes into the template in the $_post variable. on the second one you KNOW that $_post['letter'] is the variable you're looking for. for the first one, you'll need to look for 'A' using {debug} to find out what variable it comes in on, its probably {$_post['module']}.

Once you have the variable, you pass that to jrCore_list to get what you want.
{jrCore_list ...... search1="audio_title like %`$_post['letter']`" ........}
MetalScene
MetalScene
@themetalscene
3 months ago
66 posts
this is the page i want to make, except just to show all the bands in a paginated order. with alphabet about, a search bar too
michael
@michael
3 months ago
7,232 posts
Make a template in your cloned skin:
/skins/(YOUR-SKIN)/archives.tpl

make it by copying the header and footer structure of the index.tpl template to get the upper and lower sections.

something like:
{jrCore_include template="header.tpl"}

{jrCore_include template="footer.tpl"}

Then put your jrCore_list call in the middle.

It will be something like I outlined above


This template is a bare minimum type structure to just get a jrCore_list call of some profiles, no searching, just anything
{jrCore_include template="header.tpl"}

{jrCore_list module="jrProfile"}

{jrCore_include template="footer.tpl"}

From there customize the jrCore_list. This jrCore_list call gets "any profile beginning with the letter 'a' "
{jrCore_include template="header.tpl"}

{jrCore_list module="jrProfile" search1="profile_name like a%"}

{jrCore_include template="footer.tpl"}

If that is coming out correctly, then adjust it to receive the variable:
{jrCore_include template="header.tpl"}

{jrCore_list module="jrProfile" search1="profile_name like `$_post['letter']`%"}

{jrCore_include template="footer.tpl"}

Then call the url:
yoursite.com/archives/letter=a

and see if the same thing comes out, if it does, try the other letters to
yoursite.com/archives/letter=a
yoursite.com/archives/letter=b
yoursite.com/archives/letter=c
yoursite.com/archives/letter=d
.......

If they all work, then setup some navigation
{jrCore_include template="header.tpl"}

<a href="{$jamroom_url}/archives/letter=a">a</a>
<a href="{$jamroom_url}/archives/letter=b">b</a>
<a href="{$jamroom_url}/archives/letter=c">c</a>
<a href="{$jamroom_url}/archives/letter=d">d</a>
<a href="{$jamroom_url}/archives/letter=e">e</a>
.....
{jrCore_list module="jrProfile" search1="profile_name like `$_post['letter']`%"}

{jrCore_include template="footer.tpl"}

Running with development mode on will mean you dont need to reset your caches each time:
ACP -> MODULES -> DEVELOPER -> DEVELOPER TOOLS -> GLOBAL CONFIG -> Run in developer mode
MetalScene
MetalScene
@themetalscene
3 months ago
66 posts
@michael thank you very much for the help and your time, i will spend the weekend on this and see how i progress.
updated by @themetalscene: 07 May 2020 12:45:07PM
MetalScene
MetalScene
@themetalscene
3 months ago
66 posts
yeah thats working fantastic, i am just going to tweak it now, smaller images, columns etc
Thank you, it really is what i am looking for.

With regards to bands with Numbers or a # $ type symbol in the first part of the name, what character calls them up ?

And what would be the best way to deal with bands who THE in front their name.
As now they all pull up into the T section

Anyone following this is what i did in my archives.tpl of my cloned skin

{* archives.tpl *}

{jrCore_include template="header.tpl"}
<a href="{$jamroom_url}/archives/letter=a">a</a>
<a href="{$jamroom_url}/archives/letter=b">b</a>
<a href="{$jamroom_url}/archives/letter=c">c</a>
<a href="{$jamroom_url}/archives/letter=d">d</a>
<a href="{$jamroom_url}/archives/letter=e">e</a>
<a href="{$jamroom_url}/archives/letter=f">f</a>
<a href="{$jamroom_url}/archives/letter=g">g</a>
<a href="{$jamroom_url}/archives/letter=h">h</a>
<a href="{$jamroom_url}/archives/letter=i">i</a>
<a href="{$jamroom_url}/archives/letter=j">j</a>
<a href="{$jamroom_url}/archives/letter=k">k</a>
<a href="{$jamroom_url}/archives/letter=l">l</a>
<a href="{$jamroom_url}/archives/letter=m">m</a>
<a href="{$jamroom_url}/archives/letter=n">n</a>
<a href="{$jamroom_url}/archives/letter=o">o</a>
<a href="{$jamroom_url}/archives/letter=p">p</a>
<a href="{$jamroom_url}/archives/letter=q">q</a>
<a href="{$jamroom_url}/archives/letter=r">r</a>
<a href="{$jamroom_url}/archives/letter=s">s</a>
<a href="{$jamroom_url}/archives/letter=t">t</a>
<a href="{$jamroom_url}/archives/letter=u">u</a>
<a href="{$jamroom_url}/archives/letter=v">v</a>
<a href="{$jamroom_url}/archives/letter=w">w</a>
<a href="{$jamroom_url}/archives/letter=x">x</a>
<a href="{$jamroom_url}/archives/letter=y">y</a>
<a href="{$jamroom_url}/archives/letter=z">z</a>
{jrCore_list module="jrProfile" search1="profile_name like `$_post['letter']`%"}

{jrCore_include template="footer.tpl"}


once again, thank you, learning more daily about the new system, must say it has truly been awesome.
updated by @themetalscene: 07 May 2020 02:53:02PM
MetalScene
MetalScene
@themetalscene
3 months ago
66 posts
Looking at it now i may try to use the chart table on the front page of Audio pro as a layout template for this archives page, that way its is like a excel file sort able columns.

i think the layout that is going to work is the index_chart_item.tpl type idea i will look at how they did that for the front and try mimic it, using the information i have learnt here

{if isset($_items)}
    {$rank = 0}
    {foreach from=$_items item="item"}
        {$class = ''}
        {$rank = $rank+1}
        {if $rank%2 == 0}
            {$class = ' odd'}
        {/if}
        <div class="list_item{$class}">
            <div class="table">
                <div class="table-row">
                    {if strlen($item.audio_title) > 0}
                        {jrCore_module_url module="jrAudio" assign="murl"}
                        <div class="table-cell" style="width: 30px; text-align: center">
                            {$item.chart_position}
                        </div>
                        <div class="table-cell" style="width: 28px; text-align: center;">
                            {$color = '777777'}
                            {$icon = "chart_same"}

                            {if $item.chart_new_entry == 'yes'}
                                {$color = '339933'}
                                {$icon = 'chart_up'}
                            {elseif $item.chart_direction == 'same'}
                                {$icon = "chart_same"}
                            {elseif $item.chart_direction == 'up'}
                                {$icon = 'chart_up'}
                                {if $item.chart_change > 5}
                                    {$color = 'FF5500'}
                                {/if}
                            {else}
                                {$icon = 'chart_down'}
                                {if $item.chart_change > 5}
                                    {$color = '3393ff'}
                                {/if}
                            {/if}

                            {jrCore_icon icon=$icon size="24" color=$color title='hi'}
                        </div>
                        <div class="table-cell" style="width: 30px; text-align: center">

                            {if $item.chart_new_entry == 'yes'}
                                —
                            {elseif $item.chart_direction == 'same'}
                                {$item.chart_position}
                            {elseif $item.chart_direction == 'up'}
                                {$item.chart_position + $item.chart_change}
                            {else}
                                {$item.chart_position - $item.chart_change}
                            {/if}

                        </div>
                        <div class="table-cell desk" style="width: 30px; text-align: center">
                            <div class="image">
                                <a href="{$jamroom_url}/{$item.profile_url}/{$murl}/{$item._item_id}/{$item.audio_title_url}">
                                    {jrCore_module_function
                                    function="jrImage_display"
                                    module="jrAudio"
                                    type="audio_image"
                                    item_id=$item._item_id
                                    size="xlarge"
                                    crop="auto"
                                    class="img_scale"
                                    alt=$item.audio_title
                                    width=false
                                    height=false
                                    }</a>
                            </div>
                        </div>
                        <div class="table-cell" style="width: 22px">
                            {if $item.audio_active == 'on' && $item.audio_file_extension == 'mp3'}
                                {jrCore_media_player type="jrAudio_button" module="jrAudio" field="audio_file" item=$item}
                            {else}
                                 
                            {/if}
                        </div>
                        <div class="table-cell">
                                <span class="index_title"><a
                                            href="{$jamroom_url}/{$item.profile_url}/{$murl}/{$item._item_id}/{$item.audio_title_url}">{$item.audio_title|truncate:40}</a></span>
                        </div>
                        <div class="table-cell desk" style="width:200px;">
                                <span class="date"><a
                                            href="{$jamroom_url}/{$item.profile_url}">{$item.profile_name|truncate:24}</a></span>
                        </div>
                        <div class="table-cell desk" style="width: 100px">
                                <span class="date"><a
                                            href="{$jamroom_url}/{$item.profile_url}">{$item.audio_genre}</a></span>
                        </div>
                        <div class="table-cell desk" style="width: 60px; text-align: right">
                            <span class="date">{$item.chart_count|jrCore_number_format}</span>
                        </div>
                        <div class="table-cell chart_buttons" style="width: 130px">
                            {jrLike_button item=$item module="jrAudio" action="like"}
                            {jrCore_module_function function="jrFoxyCart_add_to_cart" module="jrAudio" field="audio_file" item=$item}
                        </div>
                    {/if}
                </div>
            </div>
        </div>
    {/foreach}
{else}
    <div class="no-items">
        <h1>{jrCore_lang skin="TMS" id="62" default="No items found"}</h1>
        {jrCore_module_url module="jrCore" assign="core_url"}
        {if $_conf.TMS_require_price_3 == 'on'}
            {jrCore_lang skin="TMS" id="63" default="This list currently requires items to have a price set."}
        {/if}
        <button class="form_button" style="display: block; margin: 2em auto;" onclick="jrCore_window_location('{$jamroom_url}/{$core_url}/skin_admin/global/skin={$_conf.jrCore_active_skin}/section=List+2')">{jrCore_lang skin="TMS" id="64" default="Edit Configuration"}</button>
    </div>
{/if}



Got a feeling i might need to do a lot of reading.
updated by @themetalscene: 07 May 2020 03:11:35PM
MetalScene
MetalScene
@themetalscene
3 months ago
66 posts
Going to try

# --- Image --- Name --- Genre --- City --- Province --- Country --- Date Formed --- Status --- Date Split

That way if a user clicks a name they can sort the columns in the archive, i have already created all the extra data points on the forms designer.
updated by @themetalscene: 07 May 2020 04:03:25PM
michael
@michael
3 months ago
7,232 posts
The MediaPro skin has the feature your after in it, you can use it for a guide:
http://demo.jamroom.net/jrMediaPro/music

So look in the /skins/jrMediaPro/music.tpl template.
michael
@michael
3 months ago
7,232 posts
MetalScene:......With regards to bands with Numbers or a # $ type symbol in the first part of the name, what character calls them up ?......

instead of 'profile_name' if you search on 'profile_url' that will not contain any weird characters.

{jrCore_list module="jrProfile" search1="profile_url like a%"}

'profile_url' is the profiles name converted to characters that are valid in a url, so "Crosby, Stills & Nash" would be converted to "crosby-stills-nash"
MetalScene
MetalScene
@themetalscene
3 months ago
66 posts
Thanks, yeah i think i nee that media pro.., need to upgrade my subscription after lockdown
michael
@michael
3 months ago
7,232 posts
Sorry, thought you were on our hosting. Its all-access to all the modules/skins we make so looking at it wouldn't involve purchasing anything. Just keep going with your existing structure, its working.
MetalScene
MetalScene
@themetalscene
3 months ago
66 posts
Yeah i want to do the upgrade, just not allowed to leave my house still. Currently on day 45 of lock down. Military and the cops will whip my ass if i go out on the street .
As soon as i can get to the bank, im in.. hoping by Wednesday they ease the lockdown for us.
updated by @themetalscene: 11 May 2020 11:56:59AM
MetalScene
MetalScene
@themetalscene
3 months ago
66 posts
michael:
MetalScene:......With regards to bands with Numbers or a # $ type symbol in the first part of the name, what character calls them up ?......

instead of 'profile_name' if you search on 'profile_url' that will not contain any weird characters.

{jrCore_list module="jrProfile" search1="profile_url like a%"}

'profile_url' is the profiles name converted to characters that are valid in a url, so "Crosby, Stills & Nash" would be converted to "crosby-stills-nash"

where would it list a band called for example "127 rockers" or "45Soil"
michael
@michael
3 months ago
7,232 posts
it would list them in the order they signed up in because there is no order by parameter set
{jrCore_list module="jrProfile" search1="profile_url like a%" order_by="profile_url asc"}
or the reverse:
{jrCore_list module="jrProfile" search1="profile_url like a%" order_by="profile_url desc"}

That wild card mean (and an other characters) so
" search1="profile_url like a%"}
means (beginning with the letter 'a' )

" search1="profile_url like %a%"}
means (has the letter 'a' somewhere in it)

" search1="profile_url like %a"}
means (ends with the letter 'a')

--edit--
You can order by anything that exists in the profile datastore, so you could "Get all profiles beginning with 'a' and order them by their phone number" if you wanted.
updated by @michael: 13 May 2020 05:03:23PM
MetalScene
MetalScene
@themetalscene
3 months ago
66 posts
@michael thank you, i busy messing with it this weekend again, been trying to understand it more and more . Your help is great.

{* archives.tpl *}

{jrCore_include template="header.tpl"}
<center><br></br>
<a href="{$jamroom_url}/archives/letter=a">A</a>
<a href="{$jamroom_url}/archives/letter=b">B</a>
<a href="{$jamroom_url}/archives/letter=c">C</a>
<a href="{$jamroom_url}/archives/letter=d">D</a>
<a href="{$jamroom_url}/archives/letter=e">E</a>
<a href="{$jamroom_url}/archives/letter=f">F</a>
<a href="{$jamroom_url}/archives/letter=g">G</a>
<a href="{$jamroom_url}/archives/letter=h">H</a>
<a href="{$jamroom_url}/archives/letter=i">I</a>
<a href="{$jamroom_url}/archives/letter=j">J</a>
<a href="{$jamroom_url}/archives/letter=k">K</a>
<a href="{$jamroom_url}/archives/letter=l">L</a>
<a href="{$jamroom_url}/archives/letter=m">M</a>
<a href="{$jamroom_url}/archives/letter=n">N</a>
<a href="{$jamroom_url}/archives/letter=o">O</a>
<a href="{$jamroom_url}/archives/letter=p">P</a>
<a href="{$jamroom_url}/archives/letter=q">Q</a>
<a href="{$jamroom_url}/archives/letter=r">R</a>
<a href="{$jamroom_url}/archives/letter=s">S</a>
<a href="{$jamroom_url}/archives/letter=t">T</a>
<a href="{$jamroom_url}/archives/letter=u">U</a>
<a href="{$jamroom_url}/archives/letter=v">V</a>
<a href="{$jamroom_url}/archives/letter=w">W</a>
<a href="{$jamroom_url}/archives/letter=x">X</a>
<a href="{$jamroom_url}/archives/letter=y">Y</a>
<a href="{$jamroom_url}/archives/letter=z">Z</a>
<br></br></center>
<section class="featured">
    <div class="row">
        <div class="col12">
            <div class="head">
                {jrCore_icon icon="stats" size="20" color="ff5500"} <span> {jrCore_lang skin="TMS" id=69 default="Top 200"}</span>
            </div>
            <div class="index_chart">
                <div class="list_item">
                    <div class="table center">
                        <div class="table-row">
                            <div class="table-cell desk" style="width: 200px">
                                {jrCore_lang skin="TMS" id="31" default="Artist"}
                            </div>

                            <div class="table-cell desk" style="width: 150px;">
                                Genre
                            </div>
                            <div class="table-cell desk" style="width: 150px;">
                                {jrCore_lang skin="TMS" id="58" default="Plays"}
                            </div>
                            <div class="table-cell desk" style="width: 50px;">
                                &nbsp;
                            </div>
                            <div class="table-cell" style="width: 150px;">
                               Origin 
                            </div>
                            <div class="table-cell desk" style="width: 50px;">
                                &nbsp;
                            </div>
                            <div class="table-cell" style="width: 150px;">
                               Formed
                            </div>
                            <div class="table-cell desk" style="width: 50px;">
                                &nbsp;
                            </div>
                            <div class="table-cell desk" style="width: 150px;">
                               Status
                            </div>
                            <div class="table-cell desk" style="width: 50px;">
                                &nbsp;
                            </div>
                            <div class="table-cell desk" style="width: 150px">
                              Fans
                            </div>
                            <div class="table-cell desk" style="width: 50px;">
                                &nbsp;
                            </div>
                            <div class="table-cell" style="width: 150px">
                              Updated
                            </div>

                            <div class="table-cell chart_buttons" style="width:150px; text-align: right; position: relative;">
                     {jrCore_module_url module="jrImage" assign="iurl"}
                                {if $_conf.TMS_require_price_3 == 'on'}
                                    {$s2 = "audio_file_item_price > 0"}
                                {/if}
                                {$days = $_conf.TMS_chart_days}
                                {if isset($_post.days) && strlen($_post.days) > 0}
                                    {$days = $_post.days}
                                {/if}
                                <div id="chartLoader" class="p10" style="display:none"><img src="{$jamroom_url}/skins/TMS/img/ajax-loader.gif" alt="{$working|jrCore_entity_string}"></div>
                                <select class="form_select" id="chart_days" onchange="jrCore_window_location('{$jamroom_url}/chart/days=' + this.value)">
                                    <option {if $days == '1'}selected="selected"{/if} value="1">1 {jrCore_lang skin="TMS" id=61 default="Days"}</option>
                                    <option {if $days == '7'}selected="selected"{/if} value="7">7 {jrCore_lang skin="TMS" id=61 default="Days"}</option>
                                    <option {if $days == '14'}selected="selected"{/if} value="14">14 {jrCore_lang skin="TMS" id=61 default="Days"}</option>
                                    <option {if $days == '30'}selected="selected"{/if} value="30">30 {jrCore_lang skin="TMS" id=61 default="Days"}</option>
                                    <option {if $days == '90'}selected="selected"{/if} value="90">90 {jrCore_lang skin="TMS" id=61 default="Days"}</option>
                                    <option {if $days == '365'}selected="selected"{/if} value="365">365 {jrCore_lang skin="TMS" id=61 default="Days"}</option>
                                </select>
                            </div>
                        </div>
                    </div>           
                </div>
                <div class="list" id="chart">
                    {jrCore_list module="jrProfile" search1="profile_name like `$_post['letter']`%"}
                </div>
            </div>
        </div>
    </div>
</section>
{jrCore_include template="footer.tpl"}


Busy trying to get it into columns now, and then so you can sort it via the column names.
remove that |chart thing on the right.

Learning, getting there, using the chart.tpl and what i am seeing on that other skin you mentioned

eish my poor old eyes hahahah
MetalScene
MetalScene
@themetalscene
3 months ago
66 posts
slow and steady, i know i need to still add some pieces to language file etc, thats why its still in the part above, right now i am trying to figure out to throw it into columns, sort able and and
updated by @themetalscene: 23 May 2020 02:12:08PM
michael
@michael
3 months ago
7,232 posts
Same thing as the ABC's put a link on the column headers with a sort by parameter
{$base_url = jrCore_strip_url_params(jrCore_get_current_url(), array('sort_by'));}
<a href="{$base_url}/sort_by=genre_desc">Genre</a>
That $base_url will be whatever the current url is, but will have the sort_by parameter stripped out of it.

Its better to do that kind of logic stuff in a module on the php side of things before getting to the template in order to keep the templates simpler, but it will work in a template too.

Then you'll need a couple of IF/ELSE to determine whether the link should be DESC or ASC

Docs: Template Blocks
https://www.jamroom.net/the-jamroom-network/documentation/module-developer-guide/3126/template-blocks

{if $_post['sort_by'] == 'genre_desc' }
<a href="{$base_url}/sort_by=genre_asc">Genre</a>
{else}
<a href="{$base_url}/sort_by=genre_desc">Genre</a>
{/if}

and use that sort_by in the jrCore_list

Docs: jrCore_list: Order By
https://www.jamroom.net/the-jamroom-network/documentation/module-developer-guide/89/jrcore-list#order-by

{jrCore_list ....... order_by="audio_genre desc"}
using the post variable:

{if $_post['sort_by'] == 'genre_asc'}
{jrCore_list ....... order_by="audio_genre asc"}
{elseif $_post['sort_by'] == 'genre_desc'}
{jrCore_list ....... order_by="audio_genre desc"}
{else}
{jrCore_list .......}
{/if}

updated by @michael: 24 May 2020 07:06:42PM
MetalScene
MetalScene
@themetalscene
3 months ago
66 posts
Thank you, i think i am going to look into getting some dev help in June when our lock down ends.

i have a few months of studying and learning to do on this system and the way it works to better make changes myself.

@michael i will take the time to go through what you posted and the linked doc, thank you for your help, sorry if the questions are basic, been on wordpress too many years myself and not used to this .:)
michael
@michael
3 months ago
7,232 posts
One thing that helped me get started were the developer books by O'Reilly publishing. Really like the way they get straight to the point.

Recommend this one:
Amazon: "Learning Php"
https://www.amazon.com/Learning-PHP-Introduction-Popular-Language-ebook/dp/B01E9LU2BM

Jamroom has a bit more to it than that, but it comes at the problem of: "How do I build a community website and keep it customizable" from the developers perspective.

Wordpress is a bit more focused on making configurations and customizations available in a non-developer setting.

In Jamroom the skins determine what functionality is available to the end user as well as the colors and fonts.

So areas that are useful for studying are:
* php
* html
* css

Thats the bones/skeleton of the system, then customization begins at:
* smarty (which is VERY similar to php, just slightly different syntax)
MetalScene
MetalScene
@themetalscene
3 months ago
66 posts
Yeah i am going to looking to hiring someone for the proper stuff, i am not a developer, i run a music archive, best to get some skills here that wont make a mess of it :)

I will start reading and learning in the mean time..
updated by @themetalscene: 25 May 2020 04:21:22AM
michael
@michael
3 months ago
7,232 posts
We've got a "Custom Project Form" here:
https://www.jamroom.net/form/project_overview

If you want to hire someone on our team to do the development for you.
MetalScene
MetalScene
@themetalscene
2 months ago
66 posts
2 more days of lockdown, then i can get out and to a bank hahaha

Tags