Gazetteer Template

DST Source Code

HTML Template <div class="wrapper csx"> <div class="uicontainer"> <div class="formatBar"> <button type="button" class="boldButton" title="Bold (Ctrl+B)"></button> <button type="button" class="italicButton" title="Italic (Ctrl+I)"></button> <button type="button" class="underlineButton" title="Underline (Ctrl+U)"></button> <button type="button" class="indentButton" title="Indent (Ctrl+Tab)"></button> </div> <div class="gazetteer_wrapper"> <div class="gazetteer_grid-item left"> <span class="dsf dsf_location_description"></span> </div> <div class="gazetteer_grid-item right"> <div class="section" > <div > <div class="caption"> <span class="dsf dsf_location_name"></span> <br> <span class="dsf dsf_type"></span> </div> <span class="interface trash"></span> <span class="interface add addto_regionStats" title="Add Statistic"></span> </div> </div> <ul class="group list list_regionStats" > <li class="proto item justify"> <div class="handle"> <div></div> </div> <span class="edit dslf dslf_stat " defaultString="Nation" ><b>Nation</b></span> <span class="edit dslf dslf_stat_name " defaultString="Ankh-Morpork" >Ankh-Morpork</span> </li> <span class="oldfields hidden">[{"stat":"stat","stat_name":"stat_name"}]</span> <span class="dsf dsf_regionStats readonly hidden"></span> </ul> </div> </div> <hr> <div class="section" > <div > <h3><span class="dsf dsf_subregion_name"></span></h3> <span class="interface trash"></span> <span class="interface add addto_subRegions" title="Add Region"></span> </div> </div> <ul class="group list list_subRegions" > <li class="proto item"> <div class="handle"> <div></div> </div> <span class="edit dslf dslf_subRegion fullcolumn" defaultString="Sub Region" ><b>Sub Region</b></span> <br> <span class="edit dslf dslf_subRegion_description fullcolumn" defaultString="Description" >Description</span> </li> <span class="oldfields hidden">[{"region":"region","region_description":"region_description"}]</span> <span class="dsf dsf_subRegions readonly hidden"></span> </ul> </div> </div>

CSS @import url(https://chainsawxiv.github.io/DST/common/css/csx_dd4e_common.css); .ds_gazetteerTemplate .wrapper { width: 100%; } .ds_gazetteerTemplate .dslf_subRegion_description { min-width: 100%; } .ds_gazetteerTemplate .dslf_subRegion { margin-bottom: 5px; } .ds_gazetteerTemplate .section{ margin-bottom: 10px; } .ds_gazetteerTemplate .gazetteer_grid-item .section{ width: 100%; } .ds_gazetteerTemplate .list { font-size: 12pt; margin-left: 0; width: 100%; } .ds_gazetteerTemplate .item{ margin: 5px 0 5px 0; } .ds_gazetteerTemplate .gazetteer_grid-item{ display: inline-grid; margin: 5px; text-align: center; } .ds_gazetteerTemplate .left{ width: 60%; } .ds_gazetteerTemplate .right{ width: 33%; } .ds_gazetteerTemplate table { border-collapse: collapse; } .ds_gazetteerTemplate .gazetteer_table { flex-flow: row wrap; max-width: 300px; } .ds_gazetteerTemplate .gazetteer_table tbody { background-color: rgb(40 53 25 / 35%); width: 100%; } .ds_gazetteerTemplate .caption { background-color: rgb(40 53 25 / 85%); color: white; flex: 1 100%; font-weight: bold; max-width: 100%; } .ds_gazetteerTemplate .gazetteer_table tr:nth-child(even) { background-color: rgb(40 53 25 / 40%) !important; } .ds_gazetteerTemplate tr { flex: 1 50%; min-width: 100%; } .ds_gazetteerTemplate td{ min-width: 100%; } .ds_gazetteerTemplate .justify { align-items: center !important; display: flex !important; justify-content: space-between !important; }

JavaScript csx_opts = { 'setupCallback': function(item) { gazetteerTemplate_setup(item); }, 'uiContainer': function() { return document; }, 'defaultFieldValue': 'Click to edit', 'imagePath': 'https://chainsawxiv.github.io/DST/common/images/', 'preloadFiles': [ 'add.png', 'add_hover.png', 'balance.png', 'balance_hover.png', 'bold_active.png', 'bold_hover.png', 'bullet.png', 'crunch.png', 'crunch_hover.png', 'equipment.png', 'equipment_hover.png', 'fb_back_bottom.png', 'fb_back_main.png', 'fb_back_top.png', 'fluff.png', 'fluff_hover.png', 'grab.png', 'grab_hover.png', 'indent.png', 'indent_active.png', 'indent_hover.png', 'italic.png', 'italic_active.png', 'italic_hover.png', 'magic.png', 'magic_hover.png', 'tip.png', 'tip_hover.png', 'trash.png', 'trash_active.png', 'trash_hover.png', 'underline.png', 'underline_active.png', 'underline_hover.png', 'solar/pip_off.png', 'solar/pip_off_hover.png', 'solar/pip_on.png', 'solar/pip_on_hover.png', 'solar/tab01_active.png', 'solar/tab01_inactive.png', 'solar/tab02_active.png', 'solar/tab02_inactive.png', 'solar/tab03_active.png', 'solar/tab03_inactive.png', 'solar/tab04_active.png', 'solar/tab04_inactive.png', 'solar/check_off.png', 'solar/check_off_hover.png', 'solar/check_on.png', 'solar/check_on_hover.png', ], }; function gazetteerTemplate_dataPreSave() { // Default the context if not set var context = csx_opts.defaultContext; // Bake everything down to its field values var edits = context.querySelectorAll('.dsf:not(.readonly),.edit'); for (var i = 0; i < edits.length; i++) edits[i].unrender(); var lists = context.querySelectorAll('.list'); for (var i = 0; i < lists.length; i++) lists[i].unrender(); } function gazetteerTemplate_dataPostLoad(data) { console.log(data); csx_opts.defaultContext = document.getElementById(data.containerId); csx_opts.uiContainer = csx_opts.defaultContext.querySelector('.uicontainer'); csx_opts.isEditable = data.isEditable; console.log(csx_opts); var includes = document.createElement('script'); includes.type = 'text/javascript'; includes.src = 'https://chainsawxiv.github.io/DST/common/js/csx_dd4e_common.js'; includes.onload = function() { // Callback to use what you just loaded csx_opts.setupCallback(); }; document.body.appendChild(includes); } function gazetteerTemplate_setup(context) { // Provide default context if (context == undefined) context = csx_opts.defaultContext; // Do setup for interfaces console.log(context); csx_edit(context); csx_list(context); document.getElementById("content").style.minWidth = "80%"; csx_firstParentWithClass(csx_opts.defaultContext, 'main-content-container').style.minwidth = "33%"; }

Submit Notes This simple wiki page DST is valid for all(most) systems and allows for the quick creation of a gazetteer style wiki entry. This contains a Main body of text that occupies the top left of the page, to right of that is a dynamic table that can be used to house various statistics about the location or entity, and finally a lower section that houses a full width dynamic section for display of key areas within or attributes of that require more description or distinction.

Back