Tech Tangents:Sandbox: Difference between revisions

From Tech Tangents
Jump to navigation Jump to search
No edit summary
No edit summary
Line 4: Line 4:
function get_media_format()
function get_media_format()
{
{
    let result = "";
let result = "";
    const inputs = document.querySelectorAll("#sc-Media_Format input[type='checkbox']");


    inputs.forEach((input) => {
// Standad format checkboxes
        if (input.checked) result += input.value + ",";
const inputs = document.querySelectorAll("#sc-Media_Format input[type='checkbox']");
    });


    if (result.length > 0)
inputs.forEach((input) => {
    {
if (input.checked) result += input.value + ",";
        result = result.substring(0, result.length - 1);
});
    }
 
    return result;
// Custom Value for usuual formats
let element = document.getElementById("fmt-custom");
        if ( element.value !== "" )
        {
result += element.value + ",";
        }
 
        // Trim off last comma
if (result.length > 0)
{
result = result.substring(0, result.length - 1);
}
return result;
}
}


function get_platform()
function get_platform()
{
{
    let result = "";
let result = "";
    const inputs = document.querySelectorAll("#sc-Platform input[type='checkbox']");
 
// Standad platform checkboxes
const inputs = document.querySelectorAll("#sc-Platform input[type='checkbox']");
 
inputs.forEach((input) => {
if (input.checked) result += input.value + ",";
});


    inputs.forEach((input) => {
// Custom Value for usuual platforms
         if (input.checked) result += input.value + ",";
let element = document.getElementById("platform-custom");
    });
         if ( element.value !== "" )
        {
result += element.value + ",";
        }


    if (result.length > 0)
        // Trim off last comma
    {
if (result.length > 0)
        result = result.substring(0, result.length - 1);
{
    }
result = result.substring(0, result.length - 1);
    return result;
}
return result;
}
}


function get_paramter(parameter)
function get_paramter(parameter)
{
{
    if ( parameter == "Media Format")
        // Multiple input parameters
    {
if ( parameter == "Media Format")
        return get_media_format();
{
    }
return get_media_format();
}
if ( parameter == "Platform")
{
return get_platform();
}


// Get IDs using parameter as name
parameter = parameter.replace(" ", "_")
let element = document.getElementById("sc-"+parameter);


    if ( parameter == "Platform")
        // Add extension to filename of Photo
    {
if ( parameter == "Photo")
        return get_platform();
{
    }
file = document.getElementById("sc-file");
ext_pos = file.value.lastIndexOf('.');
ext = file.value.substring(ext_pos,file.value.length);


    parameter = parameter.replace(" ", "_")
return element.value !== "" ? element.value + ext : false ;
    let element = document.getElementById("sc-"+parameter);
}


    if ( parameter == "Photo")
         // Return value if it was set
    {
return element.value !== "" ? element.value : false ;
         file = document.getElementById("sc-file");
        ext_pos = file.value.lastIndexOf('.');
        ext = file.value.substring(ext_pos,file.value.length);
 
        return element.value !== "" ? element.value + ext : false ;
    }
 
    return element.value !== "" ? element.value : false ;
}
}


Line 65: Line 87:
function make_page()
function make_page()
{
{
    let wikitext="{{InfoboxMedia";
        // Init page contents with template name
    parameters = [
let wikitext="{{InfoboxMedia";
        "Title",
 
        "Photo",
// Template parameters
        "Release Year",
parameters = [
        "Notes",
"Title",
        "Notes Condition",
"Photo",
        "UPC",
"Release Year",
        "Location",
"Notes",
        "Box Condition",
"Notes Condition",
        "Media Format",
"UPC",
        "Platform",
"Location",
        "Media Type"
"Box Condition",
    ];
"Media Format",
"Platform",
"Media Type"
];


    parameters.forEach(parameter => {
// Iterate all parameters to get input values as template text
        value = get_paramter(parameter)
parameters.forEach(parameter => {
        if (value)
value = get_paramter(parameter)
        {
if (value)
            wikitext+="|"+parameter+"="+value;
{
        }
wikitext+="|"+parameter+"="+value;
    });
}
});


    wikitext+="}}";
// End template
    console.log( wikitext );
wikitext+="}}";


    let params = {
// Log final wikitext for page
        action: 'edit',
console.log( wikitext );
        title: get_paramter("Title"),
        text: wikitext,
        format: 'json'
    };


    api = new mw.Api();
        // Setup API data
let params = {
action: 'edit',
title: get_paramter("Title"), // New page title
text: wikitext, // Page Contents
format: 'json'
};


    api.postWithToken( 'csrf', params ).done( function ( data ) {
        // Get Mediawiki API
        console.log( data );
api = new mw.Api();
    } );


    window.location.replace("https://wiki.techtangents.net/wiki/"+get_paramter("Title"));
        // Submit API request to create new page
api.postWithToken( 'csrf', params ).done( function ( data ) {
console.log( data );
// Redirect to new page after creating it
window.location.replace("https://wiki.techtangents.net/wiki/"+get_paramter("Title").replace(" ", "_"));
} );
}
}


function upload_file()
function upload_file()
{
{
    let fileInput = document.getElementById("sc-file");
        // Get file input
    let license = "=={{int:license-header}}==\n{{Non-free game cover}}",
let fileInput = document.getElementById("sc-file");
// Licesne for all software boxes are set to Non-free game cover
let license = "=={{int:license-header}}==\n{{Non-free game cover}}",


    api = new mw.Api();
        // Get Mediawiki API
api = new mw.Api();


    name_input = get_paramter("Photo");
        // Get name for file page
name_input = get_paramter("Photo");


    if (name_input == false)
        // If a custom filename was not set use actual filename
    {
if (name_input == false)
        file_name = fileInput.files[0].name;
{
    }else{
file_name = fileInput.files[0].name;
        file_name = name_input;
}else{
    }
file_name = name_input;
}


    let param = {
        // Setup API data
        filename: file_name,
let param = {
        format: "json",
filename: file_name,
        ignorewarnings: 1,
format: "json",
        text: license
ignorewarnings: 1,
    };
text: license
    api.upload(fileInput.files[0], param)
};
        .done(make_page)
 
        .fail(function (data) {
// Submit API request to upload file
            console.log(data);
api.upload(fileInput.files[0], param)
        });
.done(make_page) // Make page after upload finished
.fail(function (data) {
console.log(data);
});
}
}




window.addEventListener("load", () => {
window.addEventListener("load", () => {
    let button = document.getElementById("tt-button");
        // Hook button click to JS code
 
let button = document.getElementById("tt-button");
    //button.addEventListener("click", () => {make_page()});
button.addEventListener("click", () => {upload_file()});
    button.addEventListener("click", () => {upload_file()});
});
});
</script>
</script>
Line 147: Line 186:


<form>
<form>
    <fieldset id="photo-info">
<fieldset id="photo-info">
        <legend>Photo</legend>
<legend>Photo</legend>
        <div>
<div>
            <input type="file" id="sc-file"/>
<input type="file" id="sc-file"/>
        </div>
</div>
        <div>
<div>
            <label for="sc-Photo">Photo Name : </label>
<label for="sc-Photo">Photo Name : </label>
            <input type="text" id="sc-Photo"/>
<input type="text" id="sc-Photo"/>
        </div>
</div>
    </fieldset>
</fieldset>


    <fieldset id="software-info">
<fieldset id="software-info">
        <legend>Software Info</legend>
<legend>Software Info</legend>
        <div>
<div>
            <label for="sc-Title">Title : </label>
<label for="sc-Title">Title : </label>
            <input type="text" id="sc-Title"/>
<input type="text" id="sc-Title"/>
        </div>
</div>
        <div>
<div>
            <label for="sc-Release_Year">Release Year : </label>
<label for="sc-Release_Year">Release Year : </label>
            <input type="number" id="sc-Release_Year" value="1999"/>
<input type="number" id="sc-Release_Year" value="1999"/>
        </div>
</div>
        <div>
<div>
            <label for="sc-Notes">Notes : </label>
<label for="sc-Notes">Notes : </label>
            <input type="text" id="sc-Notes"/>
<input type="text" id="sc-Notes"/>
        </div>
</div>
        <div>
<div>
            <label for="sc-Notes_Condition">Notes Condition : </label>
<label for="sc-Notes_Condition">Notes Condition : </label>
            <input type="text" id="sc-Notes_Condition"/>
<input type="text" id="sc-Notes_Condition"/>
        </div>
</div>
        <div>
<div>
            <label for="sc-UPC">UPC : </label>
<label for="sc-UPC">UPC : </label>
            <input type="number" id="sc-UPC"/>
<input type="number" id="sc-UPC"/>
        </div>
</div>
        <div>
<div>
            <label for="sc-Location">Location : </label>
<label for="sc-Location">Location : </label>
            <input type="text" id="sc-Location"/>
<input type="text" id="sc-Location"/>
        </div>
</div>
        <div>
<div>
            <label for="sc-Media_Type">Media Type : </label>
<label for="sc-Media_Type">Media Type : </label>
            <input type="text" list="sc-Media_Type-data" id="sc-Media_Type" value="Software"/>
<input type="text" list="sc-Media_Type-data" id="sc-Media_Type" value="Software"/>
            <datalist id="sc-Media_Type-data">
<datalist id="sc-Media_Type-data">
                <option value="Software"></option>
<option value="Software"></option>
            </datalist>
</datalist>
        </div>
</div>
        <div>
<div>
            <label for="sc-Box_Condition">Box Condition:</label>
<label for="sc-Box_Condition">Box Condition:</label>


            <select id="sc-Box_Condition">
<select id="sc-Box_Condition">
                <option value="">Select Box Condition...</option>
<option value="">Select Box Condition...</option>
                <option value="5 - Like New">5 - Like New</option>
<option value="5 - Like New">5 - Like New</option>
                <option value="4 - Nice, but not perfect">4 - Nice, but not perfect</option>
<option value="4 - Nice, but not perfect">4 - Nice, but not perfect</option>
                <option value="3 - Creases, mild crushing, light fading">3 - Creases, mild crushing, light fading</option>
<option value="3 - Creases, mild crushing, light fading">3 - Creases, mild crushing, light fading</option>
                <option value="2 - Corner tears, bad crushing, bad fading">2 - Corner tears, bad crushing, bad fading</option>
<option value="2 - Corner tears, bad crushing, bad fading">2 - Corner tears, bad crushing, bad fading</option>
                <option value="1 - Water damage, missing parts, bleached">1 - Water damage, missing parts, bleached</option>
<option value="1 - Water damage, missing parts, bleached">1 - Water damage, missing parts, bleached</option>
            </select>
</select>


        </div>
</div>
        <div>
<div>
            <fieldset id="sc-Media_Format">
<fieldset id="sc-Media_Format">
                <legend>Media Format:</legend>
<legend>Media Format:</legend>
                <div>
<div>
                    <input type="checkbox" id="fmt-CDROM"
<input type="checkbox" id="fmt-CDROM"
                        value="CD-ROM"
value="CD-ROM"
                    />
/>
                    <label for="fmt-CDROM">CD-ROM</label>
<label for="fmt-CDROM">CD-ROM</label>
                </div>
</div>
                <div>
<div>
                    <input type="checkbox" id="fmt-DVD"
<input type="checkbox" id="fmt-DVD"
                        value="DVD"
value="DVD"
                    />
/>
                    <label for="fmt-DVD">DVD</label>
<label for="fmt-DVD">DVD</label>
                </div>
</div>
                <div>
<div>
                    <input type="checkbox" id="fmt-MFDD"
<input type="checkbox" id="fmt-MFDD"
                        value="3.5in 720KB DD Floppy Disk"
value="3.5in 720KB DD Floppy Disk"
                    />
/>
                    <label for="fmt-MFDD">3.5in 720KB DD Floppy Disk</label>
<label for="fmt-MFDD">3.5in 720KB DD Floppy Disk</label>
                </div>
</div>
                <div>
<div>
                    <input type="checkbox" id="fmt-MFHD"
<input type="checkbox" id="fmt-MFHD"
                        value="3.5in 1.44MB HD Floppy Disk"
value="3.5in 1.44MB HD Floppy Disk"
                    />
/>
                    <label for="fmt-MFHD">3.5in 1.44MB HD Floppy Disk</label>
<label for="fmt-MFHD">3.5in 1.44MB HD Floppy Disk</label>
                </div>
</div>
                <div>
<div>
                    <input type="checkbox" id="fmt-MDDD"
<input type="checkbox" id="fmt-MDDD"
                        value="5.25in 360KB DD Floppy Disk"
value="5.25in 360KB DD Floppy Disk"
                    />
/>
                    <label for="fmt-MDDD">5.25in 360KB DD Floppy Disk</label>
<label for="fmt-MDDD">5.25in 360KB DD Floppy Disk</label>
                </div>
</div>
                <div>
<div>
                    <input type="checkbox" id="fmt-MDHD"
<input type="checkbox" id="fmt-MDHD"
                        value="5.25in 1.2MB HD Floppy Disk"
value="5.25in 1.2MB HD Floppy Disk"
                    />
/>
                    <label for="fmt-MDHD">5.25in 1.2MB HD Floppy Disk</label>
<label for="fmt-MDHD">5.25in 1.2MB HD Floppy Disk</label>
                </div>
</div>


                <div>
<div>
                    <label for="fmt-custom">New Format : </label>
<label for="fmt-custom">New Format : </label>
                    <input type="text" id="fmt-custom"/>
<input type="text" id="fmt-custom"/>
                </div>
</div>
            </fieldset>
</fieldset>
        </div>
</div>


        <div>
<div>
            <fieldset id="sc-Platform">
<fieldset id="sc-Platform">
                <legend>Platform:</legend>
<legend>Platform:</legend>
                <div>
<div>
                    <input type="checkbox" id="platform-IBMPC"
<input type="checkbox" id="platform-IBMPC"
                        value="IBM PC"
value="IBM PC"
                    />
/>
                    <label for="platform-IBMPC">IBM PC</label>
<label for="platform-IBMPC">IBM PC</label>
                </div>
</div>
                <div>
<div>
                    <input type="checkbox" id="platform-MAC68K"
<input type="checkbox" id="platform-MAC68K"
                        value="Macintosh (M68000)"
value="Macintosh (M68000)"
                    />
/>
                    <label for="platform-MAC68K">Macintosh (M68000)</label>
<label for="platform-MAC68K">Macintosh (M68000)</label>
                </div>
</div>
                <div>
<div>
                    <input type="checkbox" id="platform-C64"
<input type="checkbox" id="platform-C64"
                        value="Commodore 64"
value="Commodore 64"
                    />
/>
                    <label for="platform-C64">Commodore 64</label>
<label for="platform-C64">Commodore 64</label>
                </div>
</div>
                <div>
<div>
                    <input type="checkbox" id="platform-MACPPC"
<input type="checkbox" id="platform-MACPPC"
                        value="Mac (PowerPC)"
value="Mac (PowerPC)"
                    />
/>
                    <label for="platform-MACPPC">Mac (PowerPC)</label>
<label for="platform-MACPPC">Mac (PowerPC)</label>
                </div>
</div>
                <div>
<div>
                    <input type="checkbox" id="platform-Linux"
<input type="checkbox" id="platform-Linux"
                        value="Linux"
value="Linux"
                    />
/>
                    <label for="platform-Linux">Linux</label>
<label for="platform-Linux">Linux</label>
                </div>
</div>
                <div>
<div>
                    <input type="checkbox" id="platform-AtariST"
<input type="checkbox" id="platform-AtariST"
                        value="Atari ST"
value="Atari ST"
                    />
/>
                    <label for="platform-AtariST">Atari ST</label>
<label for="platform-AtariST">Atari ST</label>
                </div>
</div>
                <div>
<div>
                    <input type="checkbox" id="platform-TRS80M1"
<input type="checkbox" id="platform-TRS80M1"
                        value="TRS-80 Model I"
value="TRS-80 Model I"
                    />
/>
                    <label for="platform-TRS80M1">TRS-80 Model I</label>
<label for="platform-TRS80M1">TRS-80 Model I</label>
                </div>
</div>
                <div>
<div>
                    <input type="checkbox" id="platform-TRS80M4"
<input type="checkbox" id="platform-TRS80M4"
                        value="TRS-80 Model 4"
value="TRS-80 Model 4"
                    />
/>
                    <label for="platform-TRS80M4">TRS-80 Model 4</label>
<label for="platform-TRS80M4">TRS-80 Model 4</label>
                </div>
</div>
                <div>
<div>
                    <input type="checkbox" id="platform-TRS80M2"
<input type="checkbox" id="platform-TRS80M2"
                        value="TRS-80 Model II"
value="TRS-80 Model II"
                    />
/>
                    <label for="platform-TRS80M2">TRS-80 Model II</label>
<label for="platform-TRS80M2">TRS-80 Model II</label>
                </div>
</div>


                <div>
<div>
                    <label for="platform-custom">New Platform : </label>
<label for="platform-custom">New Platform : </label>
                    <input type="text" id="platform-custom"/>
<input type="text" id="platform-custom"/>
                </div>
</div>


            </fieldset>
</fieldset>
        </div>
</div>
    </fieldset>
</fieldset>






    <input type="button" id="tt-button" value="Upload" />
<input type="button" id="tt-button" value="Upload" />
</form>
</form>




</html>
</html>

Revision as of 23:32, 7 September 2024

Photo
Software Info
Media Format:
Platform: