UserScript:ワンポイント

code:script.js

(() => {

'use strict';

// --- Configuration ---

const MODE_ID = '__one__';

const MAIN_MENU_TITLE = 'ワンポイント';

const SUB_MENU_TITLE = 'ワンポイント補助';

const LIST_URL = '/api/table/suto3/UserScript:ワンポイント/list.csv';

const MAIN_ICON = '/api/pages/suto3/user-03/icon';

const SUB_ICON = '/api/pages/suto3/user-04/icon';

// --- DOM Manipulation ---

const changeStyle = (css) => {

let style = document.getElementById(MODE_ID);

if (!style) {

style = document.createElement('style');

style.id = MODE_ID;

document.head.appendChild(style);

}

style.textContent = css;

};

const removeStyle = () => {

const style = document.getElementById(MODE_ID);

if (style) style.remove();

};

// --- CSS Generators ---

const getCssTemplate = (type) => {

switch (type) {

case 1:

return (url) => `

.page {

background-image:

linear-gradient(to right, var(--assort-color, white), 70%, transparent, 90%, transparent),

url("${url}");

background-repeat: no-repeat , repeat-y;

background-attachment: fixed , scroll;

background-position: center top, right top;

background-size: 100% auto, 50% auto;

}

`;

case 2:

return (url) => `

.page {

background-image:

linear-gradient(to right, var(--assort-color, white), 70%, transparent, 90%, transparent),

url("${url}");

background-repeat: no-repeat, no-repeat;

background-attachment: fixed, fixed;

background-position: center top, center top;

background-size: 100% auto, 100% auto;

}`;

case 3:

return (url) => `

.page {

background-image:

linear-gradient(to bottom, transparent, 0%, transparent, 20%, var(--assort-color, white), 40%, var(--assort-color, white), 70%, transparent, 90%, transparent), url("${url}");

background-repeat: no-repeat, repeat-y;

background-attachment: fixed, scroll;

background-position: center top, center top;

background-size: 100% auto, 100% auto;

}`;

default:

}

};

// --- Utility ---

const choice = (arr) => {

if (!arr || arr.length === 0) return null;

};

// --- Data Fetching ---

const fetchImageLists = new Promise((resolve, reject) => {

fetch(LIST_URL)

.then(res => res.ok ? res.text() : Promise.reject(new Error('Network response was not ok')))

.then(text => resolve(text.split('\n').slice(1).map(line => line.replace(/^,/, "")).filter(Boolean)))

.catch(reject);

});

// --- Menu Setup ---

scrapbox.PageMenu.addMenu({

title: MAIN_MENU_TITLE,

image: MAIN_ICON,

onClick: async () => {

scrapbox.PageMenu(MAIN_MENU_TITLE).addItem({ title: 'Now loading...', onClick: () => {} });

try {

const lines = await fetchImageLists;

const urls = lines.map(line => {

return { name, url: cleanedUrl };

})

.filter(item => IMAGE_URL_REGEX.test(item.url));

scrapbox.PageMenu(MAIN_MENU_TITLE).removeAllItems();

scrapbox.PageMenu(MAIN_MENU_TITLE).addItem({ title: '消す', onClick: removeStyle });

urls.forEach(item => {

scrapbox.PageMenu(MAIN_MENU_TITLE).addItem({

title: item.name,

onClick: () => changeStyle(getCssTemplate(1)(item.url)),

});

});

const imageUrls = urls.map(item => item.url);

if (imageUrls.length > 0) {

scrapbox.PageMenu(MAIN_MENU_TITLE).addItem({

title: 'ランダム',

onClick: () => changeStyle(getCssTemplate(1)(choice(imageUrls))),

});

}

} catch (err) {

console.error('Failed to build main menu:', err);

scrapbox.PageMenu(MAIN_MENU_TITLE).removeAllItems();

scrapbox.PageMenu(MAIN_MENU_TITLE).addItem({

title: '❌ 取得失敗',

onClick: () => alert('リストの取得に失敗しました。'),

});

}

},

});

scrapbox.PageMenu.addMenu({

title: SUB_MENU_TITLE,

image: SUB_ICON,

});

const addManualMenuItem = (title, styleType) => {

scrapbox.PageMenu(SUB_MENU_TITLE).addItem({

title,

onClick: () => {

const imageUrl = prompt('画像URLを入力してください');

if (!imageUrl) return; // Cancelled

if (IMAGE_URL_REGEX.test(imageUrl)) {

changeStyle(getCssTemplate(styleType)(imageUrl));

} else {

alert('無効なURLです。画像ファイルのURLを入力してください。');

}

},

});

};

scrapbox.PageMenu(SUB_MENU_TITLE).addItem({ title: '消す', onClick: removeStyle });

addManualMenuItem('ワンポイント1', 1);

addManualMenuItem('ワンポイント2', 2);

addManualMenuItem('ワンポイント3', 3);

// --- Export for testing ---

if (typeof module !== 'undefined' && module.exports) {

module.exports = {

MODE_ID,

IMAGE_URL_REGEX,

changeStyle,

removeStyle,

getCssTemplate,

choice,

};

}

})();

アイコン画像

https://svg-hosting.vercel.app/api/svg?url=https://scrapbox.io/api/code/suto3/snowman/s01.svg

以下はダークテーマに対応していない

アイコン画像1

https://gyazo.com/374de20e6cae168b155e87cf7a6d0737

アイコン画像2

https://gyazo.com/f21247f531de8607fb8662368d103ea6

table:listx

ラベル URL

table:list

ラベル URL コメント

UserCSS.icon

UserScript.icon