Dynamic Tag list

DST Source Code

HTML Template <div class="entity_container"> <span class="dynamicTagList_info">This DST can create a dynamically generated list with links out to all of the pages of a given type that are tagged with the same custom tag.</span> <span class="dynamicTagList_info">Enter one of your custom tags from this campaign to build a list of all pages of the chosen type that have tag. For example: You have several Wiki Pages that have been given the custom tag "bestiary". You would enter "bestiary" in the first field and select Wiki Pages from the dropdown.</span> </br> </br> <span class="dsf dsf_sheet_tag dynamicTagList_editFields" defaultString="tag" >tag</span><span class="icon-edit"></span> </br> </br> <label for="pageTypes">Choose a page type:</label> <span class="dsf dsf_pageTypes" style="display:none">blog_posts</span> <select class="pageType" name="dsf_pageTypes"> <option value="blog_posts">Adventure Logs</option> <option value="game_characters">Characters</option> <option value="forum_topics">Forum Topics</option> <option value="game_items">Items</option> <option value="wiki_pages">Wiki Pages</option> </select> </br> </div> <div class="dsf_dynamicList" ></div>

CSS .dynamicTagList_editFields { border: 1px solid #CCC; height: 20px; margin: 0px 5px 5px 0px; overflow: hidden; padding: 5px; white-space: nowrap; } .dynamicTagList_info{ font-weight: bold; }

JavaScript let hasItems = false; function dynamicTagList_dataPreLoad(options) { var containerId = "#" + options['containerId']; var isEditable = options['isEditable']; $(containerId + " .pageType").change(function(event){ $('.dsf_pageTypes')[0].firstChild.data = event.target.value; dynamicTagList_prepData(); }); } function dynamicTagList_dataPostLoad(data) { if (!data.isEditable) { $(".entity_container").hide(); } if($('.dsf_pageTypes')[0].firstChild.data != '' && data.isEditable){ $("select[name='dsf_pageTypes']").val($('.dsf_pageTypes')[0].firstChild.data); } dynamicTagList_prepData(); } function dynamicTagList_dataChange(opts){ dynamicTagList_prepData(); } function dynamicTagList_prepData(){ let elem = $('.dsf_sheet_tag')[0]; let elemType = $('.dsf_pageTypes')[0]; if(elem.firstChild.data != '' && elemType.firstChild.data != ''){ let tag = elem.firstChild.data; let type = elemType.firstChild.data; dynamicTagList_getData(tag,type); } } async function dynamicTagList_getData(tag, type) { const response = await fetch("/content_summary_gm.json"); const data = await response.json(); hasItems = false; let elemAppend = $('div.dsf_dynamicList'); elemAppend.empty(); if(data){ console.log(data); elemAppend.append('<ul></ul>'); switch (type) { case 'blog_posts': if(data.blog_posts.length > 0){ data.blog_posts.forEach((item) => { dynamicTagList_appendLi(tag, item, elemAppend); }) if(!hasItems){ dynamicTagList_handleNone(tag, 'Adventure Logs', elemAppend); } }else{ dynamicTagList_handleNone(tag, 'Adventure Logs', elemAppend); } break; case 'forum_topics': if(data.forum_topics.length > 0){ data.forum_topics.forEach((item) => { dynamicTagList_appendLi(tag, item, elemAppend); }) if(!hasItems){ dynamicTagList_handleNone(tag, 'Forum Topics', elemAppend); } }else{ dynamicTagList_handleNone(tag, 'Forum Topics', elemAppend); } break; case 'game_characters': if(data.game_characters.length > 0){ data.game_characters.forEach((item) => { dynamicTagList_appendLi(tag, item, elemAppend); }) if(!hasItems){ dynamicTagList_handleNone(tag, 'Characters', elemAppend); } }else{ dynamicTagList_handleNone(tag, 'Characters', elemAppend); } break; case 'game_items': if(data.game_items.length > 0){ data.game_items.forEach((item) => { dynamicTagList_appendLi(tag, item, elemAppend); }) if(!hasItems){ dynamicTagList_handleNone(tag, 'Items', elemAppend); } }else{ dynamicTagList_handleNone(tag, 'Items', elemAppend); } break; case 'wiki_pages': if(data.wiki_pages.length > 0){ data.wiki_pages.forEach((item) => { dynamicTagList_appendLi(tag, item, elemAppend); }) if(!hasItems){ dynamicTagList_handleNone(tag, 'Wiki Pages', elemAppend); } }else{ dynamicTagList_handleNone(tag, 'Wiki Pages', elemAppend); } break; default: dynamicTagList_handleNone(tag, type, elemAppend); } } } function dynamicTagList_appendLi(tag, item, elemAppend){ if (item.tags.includes(tag) && !item.gm_only) { elemAppend.children(":first").append('<li><a href="' + item.path + '">'+item.title+'</a></li>'); hasItems = true; } } function dynamicTagList_handleNone(tag, type, elemAppend){ elemAppend.empty(); elemAppend.append('<strong>No ' + type + ' with the tag ' + tag + ' exist in this campaign. Please verify your entries and try again.</strong>'); }

Submit Notes Down and dirty way to pick a type from /content_summary_gm.json as well as a tag used on that type and then add a dynamic list to a page of that combo. Based on a feature request from the forums. I updated the helper text at the top and converted the type field to a picklist as well as adding in some error messaging to let users know why there migth not be anything displaying. Let me know if you have any other questions or concerns.

Back