@panoramax/web-viewer 3.2.2 → 3.2.3-develop-557df57a

package/src/translations/ja.json

@@ -0,0 +1,182 @@
+{
+    "gvs": {
+        "metadata_general_picid": "画像識別子",
+        "loading_labels_fun": [
+            "🦌 鹿の横断標識の検出",
+            "🚘 Panoramax Car ©を検索",
+            "☕ カフェインの注入",
+            "😀 笑ってください、あなたは地図に載っています！",
+            "🐈 猫の写真を共有する",
+            "😴 先延ばしを減らす",
+            "🫖 お茶を淹れる",
+            "🐧 ソースコードを公開",
+            "🚇 地下鉄駅の索引",
+            "🧹 メタデータのクリーンアップ",
+            "🚒 消防署の写真を送信",
+            "🚲 グリーンウェイズの更新",
+            "🚉 駅のホームのウォークスルー",
+            "🛰️ 衛星の探索",
+            "👥 ペルソナを書く",
+            "🐟 チップショップの場所",
+            "🧑‍💻 デバッグインターフェース",
+            "📈 統計の増加"
+        ],
+        "share_embed_docs": "埋め込み設定の詳細を読む",
+        "filter_zoom_in": "このフィルターを表示するには拡大してください",
+        "metadata_camera_type": "タイプ",
+        "minimize": "このウィジェットを非表示にするには、左下のボタンを使用して再度表示します",
+        "error_psv": "Photo Sphere Viewer が正しく読み込まれませんでした",
+        "error_josm": "JOSM が応答しません。実行されていて、リモートが有効になっていますか?",
+        "filter_user": "ユーザー",
+        "qualityscore_doc_3": "これは GPS の精度と画像の解像度に基づいて計算されます。プロ仕様のシステムは A 評価、360° アクション カメラは B 評価、スマートフォンは C/D/E 評価になります。",
+        "report_nature": {
+            "inappropriate": "写真が不適切です（無関係、ヌードなど）",
+            "": "問題の性質を選択してください…",
+            "blur_missing": "人の顔や車のナンバープレートが見える",
+            "blur_excess": "ぼかす必要のないオブジェクトがぼやけている",
+            "privacy": "プライベートパスまたはプロパティが表示されます",
+            "picture_low_quality": "画像の品質が悪い",
+            "mislocated": "地図上の写真の位置が適切ではありません",
+            "copyright": "画像は著作権を侵害しています",
+            "other": "その他の問題"
+        },
+        "sequence_next": "次の画像",
+        "sequence_play": "このシーケンスに沿ってプレイしてください",
+        "sequence_pause": "一時停止シーケンス",
+        "sequence_prev": "前の画像",
+        "sequence_more": "より多くのプレイオプション",
+        "sequence_speed": "プレイヤーのスピード",
+        "legend_license": "ライセンス: {l}",
+        "legend_title": "写真の詳細を表示",
+        "edit_osm": "OSMに貢献する",
+        "josm_live": "画像読み込み時にJOSM自動同期を有効にする",
+        "loading_labels_serious": [
+            "🗺️ マップデータの読み込み",
+            "🖥️ クエリAPI",
+            "🖼️ サムネイルを読み込んでいます",
+            "🔍 EXIFメタデータの分析",
+            "🏘️ 3Dレンダリング",
+            "📷 360°写真を初期化しています",
+            "🟠 色のバランス",
+            "💯 コンピューティング品質スコア ©"
+        ],
+        "error_pic": "要求された写真が見つかりませんでした",
+        "error_nopic": "指定された位置には画像がありません",
+        "error_api": "写真サーバーが利用できません",
+        "error_webgl": "WebGLはブラウザでサポートされていません",
+        "error_api_compatibility": "画像サーバーはこのビューアのバージョンと互換性がありません",
+        "filter_date": "日付",
+        "filter_date_1month": "1ヶ月",
+        "filter_date_1year": "1年",
+        "filter_user_mypics": "私の写真",
+        "filter_picture": "画像タイプ",
+        "picture_flat": "クラシック",
+        "picture_360": "360°",
+        "filter_qualityscore": "品質スコア",
+        "filter_qualityscore_help": "クリックして有効または無効にします",
+        "qualityscore_title": "品質スコアについて",
+        "qualityscore_doc_1": "Panoramax は、各写真に品質スコアを提供します。これにより、地図フィルタリングが簡単になり、高品質の写真の可用性を包括的に表示できます。",
+        "qualityscore_doc_2": "評価は A/B/C/D/E スコア (A が最高、E が最低) としてユーザーに表示され、次のスケールでグラフ表示されます。",
+        "qualityscore_doc_link": "品質スコアの計算の詳細については、ドキュメントをご覧ください。",
+        "map_background": "地図の背景",
+        "map_background_aerial": "航空写真",
+        "map_background_streets": "通り",
+        "map_theme": "マップテーマ",
+        "map_theme_default": "クラシック",
+        "map_theme_age": "撮影日",
+        "map_theme_age_1": "2歳以上",
+        "map_theme_age_2": "2歳未満",
+        "map_theme_age_3": "1歳未満",
+        "map_theme_age_4": "1か月未満",
+        "map_theme_type": "カメラタイプ",
+        "map_theme_score": "品質スコア",
+        "contrast": "より高い画像コントラストを有効にする",
+        "metadata": "画像メタデータ",
+        "metadata_general_seqid": "シーケンス識別子",
+        "metadata_general_picid_link": "画像のJSON説明へ移動",
+        "metadata_general_seqid_link": "シーケンスのJSON記述へ移動",
+        "metadata_general_author": "著者",
+        "metadata_general_license": "ライセンス",
+        "metadata_general_license_link": "ライセンスの完全な説明を見る",
+        "metadata_general_date": "撮影日",
+        "metadata_camera": "カメラ",
+        "metadata_camera_make": "メーカー",
+        "metadata_camera_model": "モデル",
+        "metadata_camera_resolution": "解像度",
+        "metadata_camera_focal_length": "焦点距離",
+        "metadata_location": "位置",
+        "metadata_location_longitude": "経度",
+        "metadata_location_latitude": "緯度",
+        "metadata_location_orientation": "撮影方向",
+        "metadata_location_precision": "位置決め精度",
+        "metadata_quality": "品質スコア",
+        "metadata_quality_help": "品質スコアについて詳しく知る",
+        "metadata_quality_score": "グローバルスコア",
+        "metadata_quality_gps_score": "ポジショニングスコア",
+        "metadata_quality_resolution_score": "解決スコア",
+        "metadata_quality_missing": "画像に値が設定されていません",
+        "metadata_exif": "EXIF / XMP",
+        "metadata_exif_name": "タグ",
+        "metadata_exif_value": "価値",
+        "report": "写真を報告する",
+        "report_auth": "このレポートはあなたのアカウント「{a}」を使用して送信されます",
+        "report_nature_label": "問題の性質",
+        "report_whole_sequence": "これはシーケンス全体に関係する",
+        "report_details": "追加の詳細",
+        "report_details_placeholder": "オプションとして、問題の詳細とそれがどのように関係しているかを追加できます",
+        "report_email": "あなたのメール",
+        "report_email_placeholder": "オプション",
+        "report_submit": "送信",
+        "report_wait": "レポートを送信しています…",
+        "report_success": "レポートは正常に送信されました。できるだけ早く確認されます。",
+        "report_failure": "レポートの作成中にエラーが発生しました: {e}。しばらくしてからもう一度お試しください。",
+        "zoom": "ズーム",
+        "zoomOut": "ズームアウト",
+        "zoomIn": "ズームイン",
+        "moveUp": "上に移動",
+        "moveDown": "下に移動",
+        "moveLeft": "左に移動",
+        "moveRight": "右に移動",
+        "moveMiddle": "ビューを中央に配置する",
+        "expand": "拡大する",
+        "expand_info": "ウィジェットを全ページに表示する",
+        "show_psv": "画像ビューアを表示する",
+        "show_map": "地図を表示",
+        "minimize_short": "隠れる",
+        "options": "オプション",
+        "filters": "フィルター",
+        "layers": "レイヤー",
+        "search": "検索",
+        "search_empty": "結果なし",
+        "search_address": "住所、市区町村などを検索",
+        "search_user": "ユーザー名を検索…",
+        "share": "共有",
+        "share_links": "リンク",
+        "share_page": "このページへのリンク",
+        "share_image": "HD画像",
+        "share_rss": "RSSフィード",
+        "share_rss_title": "現在表示されているマップエリア内の新しいシーケンスの RSS フィード",
+        "share_embed": "ウェブサイトに埋め込む",
+        "share_print": "印刷",
+        "copy": "コピー",
+        "copied": "コピーしました",
+        "error": "問題が発生しました…",
+        "error_click": "続く",
+        "error_retry": "後でもう一度お試しください"
+    },
+    "map": {
+        "loading": "読み込み中…",
+        "thumbnail": "ホバーした画像のサムネイル",
+        "not_public": "公開されない",
+        "slow_loading": "マップの読み込みが遅く、壊れているように見える場合があります"
+    },
+    "psv": {
+        "twoFingers": "2本の指で移動します",
+        "ctrlZoom": "Ctrl + スクロールで画像を拡大します",
+        "loadError": "画像を読み込めません"
+    },
+    "maplibre": {
+        "GeolocateControl.FindMyLocation": "自分の位置を表示",
+        "GeolocateControl.LocationNotAvailable": "GPSは利用できません"
+    }
+}

package/src/translations/zh_Hant.json

@@ -137,7 +137,7 @@
         },
         "share_embed_docs": "深入了解嵌入設定值",
         "error_retry": "請稍後再試",
-        "error_click": "點擊以繼續",
+        "error_click": "繼續",
         "legend_title": "顯示相片的詳細資料",
         "report_email_placeholder": "選填",
         "report_whole_sequence": "這個問題影響整個序列",
@@ -165,7 +165,8 @@
         "qualityscore_doc_link": "關於品質分數的計算方式，請參閱我們的文件。",
         "qualityscore_title": "關於品質分數",
         "qualityscore_doc_1": "Panoramax 為每張相片提供品質分數，這能幫助我們輕鬆地在地圖上篩選和顯示高品質相片。",
-        "qualityscore_doc_3": "它根據 GPS 精確度和相片解析度計算得出，專業設備的等級為 A、360° 運動相機的等級為 B、智慧型手機的等級為 C/D/E。"
+        "qualityscore_doc_3": "它根據 GPS 精確度和相片解析度計算得出，專業設備的等級為 A、360° 運動相機的等級為 B、智慧型手機的等級為 C/D/E。",
+        "minimize_short": "隱藏"
     },
     "map": {
         "loading": "正在載入…",

package/src/utils/API.js

@@ -1,4 +1,5 @@
 import { TILES_PICTURES_ZOOM } from "./Map";
+import { BASE_PANORAMA_ID } from "./Utils";
 
 /**
  * API contains various utility functions to communicate with the backend
@@ -336,13 +337,29 @@ export default class API {
 	 * Get sequence GeoJSON representation
 	 * 
 	 * @param {string} seqId The sequence ID
+	 * @param {string} [next] The next link URL (only for internals)
+	 * @param {object} [data] The previous dataset (only for internals)
 	 * @returns {Promise} Resolves on sequence GeoJSON
 	 */
-	async getSequenceItems(seqId) {
+	async getSequenceItems(seqId, next = null, data = null) {
 		if(!this.isReady()) { throw new Error("API is not ready to use"); }
 		try {
 			API.isIdValid(seqId);
-			return fetch(`${this._endpoints.collections}/${seqId}/items`, this._getFetchOptions()).then(res => res.json());
+			return fetch(
+				next || `${this._endpoints.collections}/${seqId}/items`,
+				this._getFetchOptions()
+			)
+				.then(res => res.json())
+				.then(res => {
+					// Merge previous data with current page
+					let nextData = res;
+					if(data) { nextData.features = data.features.concat(nextData.features); }
+
+					// Handle pagination for next link
+					const nextLink = res.links.find(l => l.rel === "next");
+					if(nextLink) { return this.getSequenceItems(seqId, nextLink.href, nextData); }
+					else { return nextData; }
+				});
 		}
 		catch(e) {
 			return Promise.reject(e);
@@ -722,7 +739,7 @@ export default class API {
 	 * @throws {Error} If not valid
 	 */
 	static isIdValid(id) {
-		if(!id || typeof id !== "string" || id.length === 0) {
+		if(!id || typeof id !== "string" || id.length === 0 || id === BASE_PANORAMA_ID) {
 			throw new Error("id should be a valid picture unique identifier");
 		}
 		return true;

package/src/utils/Utils.js

@@ -3,6 +3,8 @@ import { getSphereCorrection, getCroppedPanoData } from "./Exif";
 import ArrowTriangleSVG from "../img/arrow_triangle.svg";
 import ArrowTurnSVG from "../img/arrow_turn.svg";
 
+export const BASE_PANORAMA_ID = "geovisio-fake-id-0";
+
 export const COLORS = {
 	BASE: "#FF6F00",
 	SELECTED: "#1E88E5",
@@ -294,7 +296,20 @@ export function getNodeCaption(metadata, t) {
  */
 export function linkMapAndPhoto(parent) {
 	// Switched picture
-	const onPicLoad = e => parent.map.displayPictureMarker(e.detail.lon, e.detail.lat, parent.psv.getXY().x);
+	const onPicLoad = e => {
+		if(!e.detail.picId || e.detail.picId === BASE_PANORAMA_ID) {
+			parent.map.displayPictureMarker();
+			if(parent?.isMapWide()) {
+				parent?.setUnfocusedVisible(false);
+			}
+		}
+		else {
+			parent.map.displayPictureMarker(e.detail.lon, e.detail.lat, parent.psv.getXY().x);
+			if(parent?.isMapWide()) {
+				parent?.setUnfocusedVisible(true);
+			}
+		}
+	};
 	parent.addEventListener("psv:picture-loading", onPicLoad);
 	parent.addEventListener("psv:picture-loaded", onPicLoad);
 

package/src/viewer/URLHash.js

@@ -274,9 +274,13 @@ export default class URLHash extends EventTarget {
 			}
 			this._viewer.select(null, picIds[0]);
 		}
+		else {
+			this._viewer.select();
+		}
 
 		// Change focus
 		if(vals.focus && ["map", "pic"].includes(vals.focus)) {
+			this._viewer.setPopup(false);
 			this._viewer.setFocus(vals.focus);
 		}
 		if(vals.focus && vals.focus == "meta") {
@@ -434,11 +438,18 @@ export default class URLHash extends EventTarget {
 			const prevPic = this._getCurrentHash().pic || "";
 			const nextPic = this._viewer?.psv?.getPictureMetadata()?.id || "";
 
+			const prevFocus = this._getCurrentHash().focus || "";
+			const nextFocus = nextUrl.hash.includes("focus=meta") ? "meta" : (nextUrl.hash.includes("focus=map") ? "map" : "pic");
+
 			try {
 				// If different pic, add entry in browser history
 				if(prevPic != nextPic) {
 					window.history.pushState(window.history.state, null, nextUrl.href);
 				}
+				// If metadata popup is open, come back to pic/map
+				else if(prevFocus != nextFocus && nextFocus == "meta") {
+					window.history.pushState(window.history.state, null, nextUrl.href);
+				}
 				// If same pic, just update viewer params
 				else {
 					window.history.replaceState(window.history.state, null, nextUrl.href);

package/src/viewer/Widgets.js

@@ -1336,12 +1336,12 @@ export default class Widgets {
 		const btnShare = createButton("gvs-share", fa(faShareNodes), this._t.gvs.share, ["gvs-btn-large"]);
 		const pnlShare = createPanel(this, btnShare, []);
 		pnlShare.innerHTML = `
-			<div class="gvs-hidden">
+			<div class="gvs-hidden gvs-needs-picture">
 				<p id="gvs-share-license" style="margin: 0 0 10px 0;"></p>
 			</div>
 			<h4 style="margin-top: 0">${fat(faLink)} ${this._t.gvs.share_links}</h4>
 			<div id="gvs-share-links" class="gvs-input-btn">
-				<a id="gvs-share-image" class="gvs-link-btn gvs-hidden" download target="_blank">${fat(faCloudArrowDown)} ${this._t.gvs.share_image}</a>
+				<a id="gvs-share-image" class="gvs-link-btn gvs-hidden gvs-needs-picture" download target="_blank">${fat(faCloudArrowDown)} ${this._t.gvs.share_image}</a>
 				<button id="gvs-share-url" data-copy="true" style="flex-basis: 100%; flex-grow: 2; flex-shrink: 2;">${fat(faCopy)} ${this._t.gvs.share_page}</button>
 				<button id="gvs-share-print" style="flex-basis: 100%; flex-grow: 2; flex-shrink: 2;">${fat(faPrint)} ${this._t.gvs.share_print}</button>
 			</div>
@@ -1358,8 +1358,8 @@ export default class Widgets {
 				<textarea id="gvs-share-iframe" readonly></textarea>
 				<button data-input="gvs-share-iframe">${fat(faCopy)} ${this._t.gvs.copy}</button>
 			</div>
-			<h4 class="gvs-hidden">${fat(faPen)} ${this._t.gvs.edit_osm}</h4>
-			<div class="gvs-input-btn gvs-hidden" style="justify-content: center">
+			<h4 class="gvs-hidden gvs-needs-picture">${fat(faPen)} ${this._t.gvs.edit_osm}</h4>
+			<div class="gvs-input-btn gvs-hidden gvs-needs-picture" style="justify-content: center">
 				<a id="gvs-edit-id" class="gvs-link-btn" target="_blank">${fat(faLocationDot)} ${this._t.gvs.id}</a>
 				<button id="gvs-edit-josm" title="${this._t.gvs.josm_live}">${fat(faSatelliteDish)} ${this._t.gvs.josm}</button>
 			</div>
@@ -1391,14 +1391,20 @@ export default class Widgets {
 		// Update picture download links
 		this._viewer.addEventListener("psv:picture-loaded", () => {
 			const picMeta = this._viewer.psv.getPictureMetadata();
-			hdLink.href = picMeta.panorama.hdUrl;
+			hdLink.href = picMeta?.panorama?.hdUrl;
 
 			const lblLicense = document.getElementById("gvs-share-license");
 			lblLicense.innerHTML = picMeta?.caption?.license ? this._t.gvs.legend_license.replace("{l}", picMeta.caption.license) : "";
 
-			while(pnlShare.getElementsByClassName("gvs-hidden").length > 0) {
-				const h = pnlShare.getElementsByClassName("gvs-hidden")[0];
-				h.classList.remove("gvs-hidden");
+			const picElems = pnlShare.getElementsByClassName("gvs-needs-picture");
+			for(let i=0; i < picElems.length; i++) {
+				const h = picElems[i];
+				if(picMeta) {
+					h.classList.remove("gvs-hidden");
+				}
+				else {
+					h.classList.add("gvs-hidden");
+				}
 			}
 		});
 

package/tests/components/Map.test.js

@@ -143,13 +143,13 @@ describe("setBackground", () => {
 });
 
 describe("getVisibleUsers", () => {
-	it("works", () => {
+	it("works", async () => {
 		const p = createParent();
 		const c = document.createElement("div");
 		const m = new Map(p, c);
 		m.getSource = () => true;
 		m.setPaintProperty = jest.fn();
-		m._fire("load");
+		await m._postLoad();
 		m.getLayoutProperty = () => "visible";
 		expect(m.getVisibleUsers()).toStrictEqual(["geovisio"]);
 	});
@@ -177,14 +177,14 @@ describe("setVisibleUsers", () => {
 		m.getLayer = () => true;
 		let cptlCount = 0;
 		let deCalls = [];
-		return new Promise(resolve => {
+		return new Promise(async (resolve) => {
 			p.dispatchEvent = (e) => {
 				deCalls.push(e);
 				if(e.type == "map:users-changed") {
 					resolve();
 				}
 			};
-			m._fire("load");
+			await m._postLoad();
 		}).then(() => {
 			m.setLayoutProperty = jest.fn();
 			m._createPicturesTilesLayer = () => { cptlCount++; return Promise.resolve(); };
@@ -199,7 +199,7 @@ describe("setVisibleUsers", () => {
 });
 
 describe("filterUserLayersContent", () => {
-	it("works", () => {
+	it("works", async () => {
 		const p = createParent();
 		p._options.users = ["blabla", "geovisio"];
 		const c = document.createElement("div");
@@ -207,7 +207,7 @@ describe("filterUserLayersContent", () => {
 		m.getSource = () => true;
 		m.setPaintProperty = jest.fn();
 		m.getLayer = () => true;
-		m._fire("load");
+		await m._postLoad();
 		m.setFilter = jest.fn();
 		m.filterUserLayersContent("pictures", [["test", "true"]]);
 		expect(m.setFilter.mock.calls).toMatchSnapshot();
@@ -215,14 +215,14 @@ describe("filterUserLayersContent", () => {
 });
 
 describe("reloadLayersStyles", () => {
-	it("works", () => {
+	it("works", async () => {
 		const p = createParent();
 		p._options.users = ["blabla", "geovisio"];
 		const c = document.createElement("div");
 		const m = new Map(p, c);
 		m.getSource = () => true;
 		m.setPaintProperty = jest.fn();
-		m._fire("load");
+		await m._postLoad();
 		m.setLayoutProperty = jest.fn();
 		m.setPaintProperty = jest.fn();
 		m.reloadLayersStyles();

package/tests/viewer/URLHash.test.js

@@ -319,6 +319,7 @@ describe("_onHashChange", () => {
 			select: jest.fn(),
 			setFocus: jest.fn(),
 			setFilters: jest.fn(),
+			setPopup: jest.fn(),
 		};
 		const uh = new URLHash(v);
 		uh._getCurrentHash = () => ({
@@ -383,6 +384,7 @@ describe("_onHashChange", () => {
 			select: jest.fn(),
 			setFocus: jest.fn(),
 			setFilters: jest.fn(),
+			setPopup: jest.fn(),
 		};
 		const uh = new URLHash(v);
 		uh._getCurrentHash = () => ({
@@ -391,7 +393,7 @@ describe("_onHashChange", () => {
 		});
 		uh._onHashChange();
 
-		expect(v.select.mock.calls.length).toEqual(0);
+		expect(v.select.mock.calls).toEqual([[]]);
 		expect(v.setFocus.mock.calls).toEqual([["map"]]);
 		expect(v.map.jumpTo.mock.calls).toEqual([[{ center: [-12.5, 48.7], zoom: 15, pitch: 0 }]]);
 		expect(v.psv.setXYZ.mock.calls.length).toEqual(0);
@@ -414,6 +416,7 @@ describe("_onHashChange", () => {
 			select: jest.fn(),
 			setFocus: jest.fn(),
 			setFilters: jest.fn(),
+			setPopup: jest.fn(),
 		};
 		const uh = new URLHash(v);
 		uh._getCurrentHash = () => ({

package/tests/viewer/__snapshots__/Widgets.test.js.snap

@@ -335,12 +335,12 @@ exports[`constructor works 1`] = `
 				<svg aria-hidden=\\"true\\" focusable=\\"false\\" data-prefix=\\"fas\\" data-icon=\\"lightbulb\\" class=\\"svg-inline--fa fa-lightbulb\\" role=\\"img\\" xmlns=\\"http://www.w3.org/2000/svg\\" viewBox=\\"0 0 384 512\\"><path fill=\\"currentColor\\" d=\\"M272 384c9.6-31.9 29.5-59.1 49.2-86.2c0 0 0 0 0 0c5.2-7.1 10.4-14.2 15.4-21.4c19.8-28.5 31.4-63 31.4-100.3C368 78.8 289.2 0 192 0S16 78.8 16 176c0 37.3 11.6 71.9 31.4 100.3c5 7.2 10.2 14.3 15.4 21.4c0 0 0 0 0 0c19.8 27.1 39.7 54.4 49.2 86.2l160 0zM192 512c44.2 0 80-35.8 80-80l0-16-160 0 0 16c0 44.2 35.8 80 80 80zM112 176c0 8.8-7.2 16-16 16s-16-7.2-16-16c0-61.9 50.1-112 112-112c8.8 0 16 7.2 16 16s-7.2 16-16 16c-44.2 0-80 35.8-80 80z\\"></path></svg>
 			</button>
 		</div><button id=\\"gvs-player-more\\" class=\\"gvs-btn gvs-widget-bg gvs-xs-hidden\\" title=\\"Plus d'options de lecture\\"><svg aria-hidden=\\"true\\" focusable=\\"false\\" data-prefix=\\"fas\\" data-icon=\\"ellipsis-vertical\\" class=\\"svg-inline--fa fa-ellipsis-vertical\\" role=\\"img\\" xmlns=\\"http://www.w3.org/2000/svg\\" viewBox=\\"0 0 128 512\\"><path fill=\\"currentColor\\" d=\\"M64 360a56 56 0 1 0 0 112 56 56 0 1 0 0-112zm0-160a56 56 0 1 0 0 112 56 56 0 1 0 0-112zM120 96A56 56 0 1 0 8 96a56 56 0 1 0 112 0z\\"></path></svg></button></div></div><div id=\\"gvs-corner-main-top-middle\\" class=\\"gvs-corner\\"></div><div id=\\"gvs-corner-main-top-right\\" class=\\"gvs-corner\\"></div></div><div id=\\"gvs-corner-main-bottom\\" class=\\"gvs-corner-space\\"><div id=\\"gvs-corner-main-bottom-left\\" class=\\"gvs-corner\\"><div id=\\"gvs-widget-legend\\" class=\\"gvs-group gvs-widget-bg\\" title=\\"\\"><a href=\\"https://panoramax.fr/\\" target=\\"_blank\\">Panoramax</a></div></div><div id=\\"gvs-corner-main-bottom-middle\\" class=\\"gvs-corner\\"></div><div id=\\"gvs-corner-main-bottom-right\\" class=\\"gvs-corner\\"><div id=\\"gvs-widget-share\\" class=\\"gvs-group gvs-group-large gvs-group-btnpanel gvs-mobile-hidden gvs-print-hidden\\"><button id=\\"gvs-share\\" class=\\"gvs-btn gvs-widget-bg gvs-btn-large\\" title=\\"Partager\\"><svg aria-hidden=\\"true\\" focusable=\\"false\\" data-prefix=\\"fas\\" data-icon=\\"share-nodes\\" class=\\"svg-inline--fa fa-share-nodes\\" role=\\"img\\" xmlns=\\"http://www.w3.org/2000/svg\\" viewBox=\\"0 0 448 512\\"><path fill=\\"currentColor\\" d=\\"M352 224c53 0 96-43 96-96s-43-96-96-96s-96 43-96 96c0 4 .2 8 .7 11.9l-94.1 47C145.4 170.2 121.9 160 96 160c-53 0-96 43-96 96s43 96 96 96c25.9 0 49.4-10.2 66.6-26.9l94.1 47c-.5 3.9-.7 7.8-.7 11.9c0 53 43 96 96 96s96-43 96-96s-43-96-96-96c-25.9 0-49.4 10.2-66.6 26.9l-94.1-47c.5-3.9 .7-7.8 .7-11.9s-.2-8-.7-11.9l94.1-47C302.6 213.8 326.1 224 352 224z\\"></path></svg></button><div id=\\"gvs-share-panel\\" class=\\"gvs-panel gvs-widget-bg gvs-hidden\\">
-			<div class=\\"gvs-hidden\\">
+			<div class=\\"gvs-hidden gvs-needs-picture\\">
 				<p id=\\"gvs-share-license\\" style=\\"margin: 0 0 10px 0;\\"></p>
 			</div>
 			<h4 style=\\"margin-top: 0\\"><svg aria-hidden=\\"true\\" focusable=\\"false\\" data-prefix=\\"fas\\" data-icon=\\"link\\" class=\\"svg-inline--fa fa-link\\" role=\\"img\\" xmlns=\\"http://www.w3.org/2000/svg\\" viewBox=\\"0 0 640 512\\"><path fill=\\"currentColor\\" d=\\"M579.8 267.7c56.5-56.5 56.5-148 0-204.5c-50-50-128.8-56.5-186.3-15.4l-1.6 1.1c-14.4 10.3-17.7 30.3-7.4 44.6s30.3 17.7 44.6 7.4l1.6-1.1c32.1-22.9 76-19.3 103.8 8.6c31.5 31.5 31.5 82.5 0 114L422.3 334.8c-31.5 31.5-82.5 31.5-114 0c-27.9-27.9-31.5-71.8-8.6-103.8l1.1-1.6c10.3-14.4 6.9-34.4-7.4-44.6s-34.4-6.9-44.6 7.4l-1.1 1.6C206.5 251.2 213 330 263 380c56.5 56.5 148 56.5 204.5 0L579.8 267.7zM60.2 244.3c-56.5 56.5-56.5 148 0 204.5c50 50 128.8 56.5 186.3 15.4l1.6-1.1c14.4-10.3 17.7-30.3 7.4-44.6s-30.3-17.7-44.6-7.4l-1.6 1.1c-32.1 22.9-76 19.3-103.8-8.6C74 372 74 321 105.5 289.5L217.7 177.2c31.5-31.5 82.5-31.5 114 0c27.9 27.9 31.5 71.8 8.6 103.9l-1.1 1.6c-10.3 14.4-6.9 34.4 7.4 44.6s34.4 6.9 44.6-7.4l1.1-1.6C433.5 260.8 427 182 377 132c-56.5-56.5-148-56.5-204.5 0L60.2 244.3z\\"></path></svg> Liens utiles</h4>
 			<div id=\\"gvs-share-links\\" class=\\"gvs-input-btn\\">
-				<a id=\\"gvs-share-image\\" class=\\"gvs-link-btn gvs-hidden\\" download=\\"\\" target=\\"_blank\\"><svg aria-hidden=\\"true\\" focusable=\\"false\\" data-prefix=\\"fas\\" data-icon=\\"cloud-arrow-down\\" class=\\"svg-inline--fa fa-cloud-arrow-down\\" role=\\"img\\" xmlns=\\"http://www.w3.org/2000/svg\\" viewBox=\\"0 0 640 512\\"><path fill=\\"currentColor\\" d=\\"M144 480C64.5 480 0 415.5 0 336c0-62.8 40.2-116.2 96.2-135.9c-.1-2.7-.2-5.4-.2-8.1c0-88.4 71.6-160 160-160c59.3 0 111 32.2 138.7 80.2C409.9 102 428.3 96 448 96c53 0 96 43 96 96c0 12.2-2.3 23.8-6.4 34.6C596 238.4 640 290.1 640 352c0 70.7-57.3 128-128 128l-368 0zm79-167l80 80c9.4 9.4 24.6 9.4 33.9 0l80-80c9.4-9.4 9.4-24.6 0-33.9s-24.6-9.4-33.9 0l-39 39L344 184c0-13.3-10.7-24-24-24s-24 10.7-24 24l0 134.1-39-39c-9.4-9.4-24.6-9.4-33.9 0s-9.4 24.6 0 33.9z\\"></path></svg> Image HD</a>
+				<a id=\\"gvs-share-image\\" class=\\"gvs-link-btn gvs-hidden gvs-needs-picture\\" download=\\"\\" target=\\"_blank\\"><svg aria-hidden=\\"true\\" focusable=\\"false\\" data-prefix=\\"fas\\" data-icon=\\"cloud-arrow-down\\" class=\\"svg-inline--fa fa-cloud-arrow-down\\" role=\\"img\\" xmlns=\\"http://www.w3.org/2000/svg\\" viewBox=\\"0 0 640 512\\"><path fill=\\"currentColor\\" d=\\"M144 480C64.5 480 0 415.5 0 336c0-62.8 40.2-116.2 96.2-135.9c-.1-2.7-.2-5.4-.2-8.1c0-88.4 71.6-160 160-160c59.3 0 111 32.2 138.7 80.2C409.9 102 428.3 96 448 96c53 0 96 43 96 96c0 12.2-2.3 23.8-6.4 34.6C596 238.4 640 290.1 640 352c0 70.7-57.3 128-128 128l-368 0zm79-167l80 80c9.4 9.4 24.6 9.4 33.9 0l80-80c9.4-9.4 9.4-24.6 0-33.9s-24.6-9.4-33.9 0l-39 39L344 184c0-13.3-10.7-24-24-24s-24 10.7-24 24l0 134.1-39-39c-9.4-9.4-24.6-9.4-33.9 0s-9.4 24.6 0 33.9z\\"></path></svg> Image HD</a>
 				<button id=\\"gvs-share-url\\" data-copy=\\"http://localhost\\" style=\\"flex-basis: 100%; flex-grow: 2; flex-shrink: 2;\\"><svg aria-hidden=\\"true\\" focusable=\\"false\\" data-prefix=\\"fas\\" data-icon=\\"copy\\" class=\\"svg-inline--fa fa-copy\\" role=\\"img\\" xmlns=\\"http://www.w3.org/2000/svg\\" viewBox=\\"0 0 448 512\\"><path fill=\\"currentColor\\" d=\\"M208 0L332.1 0c12.7 0 24.9 5.1 33.9 14.1l67.9 67.9c9 9 14.1 21.2 14.1 33.9L448 336c0 26.5-21.5 48-48 48l-192 0c-26.5 0-48-21.5-48-48l0-288c0-26.5 21.5-48 48-48zM48 128l80 0 0 64-64 0 0 256 192 0 0-32 64 0 0 48c0 26.5-21.5 48-48 48L48 512c-26.5 0-48-21.5-48-48L0 176c0-26.5 21.5-48 48-48z\\"></path></svg> Lien de la page</button>
 				<button id=\\"gvs-share-print\\" style=\\"flex-basis: 100%; flex-grow: 2; flex-shrink: 2;\\"><svg aria-hidden=\\"true\\" focusable=\\"false\\" data-prefix=\\"fas\\" data-icon=\\"print\\" class=\\"svg-inline--fa fa-print\\" role=\\"img\\" xmlns=\\"http://www.w3.org/2000/svg\\" viewBox=\\"0 0 512 512\\"><path fill=\\"currentColor\\" d=\\"M128 0C92.7 0 64 28.7 64 64l0 96 64 0 0-96 226.7 0L384 93.3l0 66.7 64 0 0-66.7c0-17-6.7-33.3-18.7-45.3L400 18.7C388 6.7 371.7 0 354.7 0L128 0zM384 352l0 32 0 64-256 0 0-64 0-16 0-16 256 0zm64 32l32 0c17.7 0 32-14.3 32-32l0-96c0-35.3-28.7-64-64-64L64 192c-35.3 0-64 28.7-64 64l0 96c0 17.7 14.3 32 32 32l32 0 0 64c0 35.3 28.7 64 64 64l256 0c35.3 0 64-28.7 64-64l0-64zM432 248a24 24 0 1 1 0 48 24 24 0 1 1 0-48z\\"></path></svg> Imprimer</button>
 			</div>
@@ -354,8 +354,8 @@ exports[`constructor works 1`] = `
 				<textarea id=\\"gvs-share-iframe\\" readonly=\\"\\"></textarea>
 				<button data-input=\\"gvs-share-iframe\\"><svg aria-hidden=\\"true\\" focusable=\\"false\\" data-prefix=\\"fas\\" data-icon=\\"copy\\" class=\\"svg-inline--fa fa-copy\\" role=\\"img\\" xmlns=\\"http://www.w3.org/2000/svg\\" viewBox=\\"0 0 448 512\\"><path fill=\\"currentColor\\" d=\\"M208 0L332.1 0c12.7 0 24.9 5.1 33.9 14.1l67.9 67.9c9 9 14.1 21.2 14.1 33.9L448 336c0 26.5-21.5 48-48 48l-192 0c-26.5 0-48-21.5-48-48l0-288c0-26.5 21.5-48 48-48zM48 128l80 0 0 64-64 0 0 256 192 0 0-32 64 0 0 48c0 26.5-21.5 48-48 48L48 512c-26.5 0-48-21.5-48-48L0 176c0-26.5 21.5-48 48-48z\\"></path></svg> Copier</button>
 			</div>
-			<h4 class=\\"gvs-hidden\\"><svg aria-hidden=\\"true\\" focusable=\\"false\\" data-prefix=\\"fas\\" data-icon=\\"pen\\" class=\\"svg-inline--fa fa-pen\\" role=\\"img\\" xmlns=\\"http://www.w3.org/2000/svg\\" viewBox=\\"0 0 512 512\\"><path fill=\\"currentColor\\" d=\\"M362.7 19.3L314.3 67.7 444.3 197.7l48.4-48.4c25-25 25-65.5 0-90.5L453.3 19.3c-25-25-65.5-25-90.5 0zm-71 71L58.6 323.5c-10.4 10.4-18 23.3-22.2 37.4L1 481.2C-1.5 489.7 .8 498.8 7 505s15.3 8.5 23.7 6.1l120.3-35.4c14.1-4.2 27-11.8 37.4-22.2L421.7 220.3 291.7 90.3z\\"></path></svg> Contribuer sur OSM</h4>
-			<div class=\\"gvs-input-btn gvs-hidden\\" style=\\"justify-content: center\\">
+			<h4 class=\\"gvs-hidden gvs-needs-picture\\"><svg aria-hidden=\\"true\\" focusable=\\"false\\" data-prefix=\\"fas\\" data-icon=\\"pen\\" class=\\"svg-inline--fa fa-pen\\" role=\\"img\\" xmlns=\\"http://www.w3.org/2000/svg\\" viewBox=\\"0 0 512 512\\"><path fill=\\"currentColor\\" d=\\"M362.7 19.3L314.3 67.7 444.3 197.7l48.4-48.4c25-25 25-65.5 0-90.5L453.3 19.3c-25-25-65.5-25-90.5 0zm-71 71L58.6 323.5c-10.4 10.4-18 23.3-22.2 37.4L1 481.2C-1.5 489.7 .8 498.8 7 505s15.3 8.5 23.7 6.1l120.3-35.4c14.1-4.2 27-11.8 37.4-22.2L421.7 220.3 291.7 90.3z\\"></path></svg> Contribuer sur OSM</h4>
+			<div class=\\"gvs-input-btn gvs-hidden gvs-needs-picture\\" style=\\"justify-content: center\\">
 				<a id=\\"gvs-edit-id\\" class=\\"gvs-link-btn\\" target=\\"_blank\\"><svg aria-hidden=\\"true\\" focusable=\\"false\\" data-prefix=\\"fas\\" data-icon=\\"location-dot\\" class=\\"svg-inline--fa fa-location-dot\\" role=\\"img\\" xmlns=\\"http://www.w3.org/2000/svg\\" viewBox=\\"0 0 384 512\\"><path fill=\\"currentColor\\" d=\\"M215.7 499.2C267 435 384 279.4 384 192C384 86 298 0 192 0S0 86 0 192c0 87.4 117 243 168.3 307.2c12.3 15.3 35.1 15.3 47.4 0zM192 128a64 64 0 1 1 0 128 64 64 0 1 1 0-128z\\"></path></svg> iD</a>
 				<button id=\\"gvs-edit-josm\\" title=\\"Active la synchronisation automatique de JOSM lors du chargement d'une photo\\"><svg aria-hidden=\\"true\\" focusable=\\"false\\" data-prefix=\\"fas\\" data-icon=\\"satellite-dish\\" class=\\"svg-inline--fa fa-satellite-dish\\" role=\\"img\\" xmlns=\\"http://www.w3.org/2000/svg\\" viewBox=\\"0 0 512 512\\"><path fill=\\"currentColor\\" d=\\"M192 32c0-17.7 14.3-32 32-32C383.1 0 512 128.9 512 288c0 17.7-14.3 32-32 32s-32-14.3-32-32C448 164.3 347.7 64 224 64c-17.7 0-32-14.3-32-32zM60.6 220.6L164.7 324.7l28.4-28.4c-.7-2.6-1.1-5.4-1.1-8.3c0-17.7 14.3-32 32-32s32 14.3 32 32s-14.3 32-32 32c-2.9 0-5.6-.4-8.3-1.1l-28.4 28.4L291.4 451.4c14.5 14.5 11.8 38.8-7.3 46.3C260.5 506.9 234.9 512 208 512C93.1 512 0 418.9 0 304c0-26.9 5.1-52.5 14.4-76.1c7.5-19 31.8-21.8 46.3-7.3zM224 96c106 0 192 86 192 192c0 17.7-14.3 32-32 32s-32-14.3-32-32c0-70.7-57.3-128-128-128c-17.7 0-32-14.3-32-32s14.3-32 32-32z\\"></path></svg> JOSM</button>
 			</div>
@@ -373,12 +373,12 @@ exports[`constructor works with iframeBaseURL option 1`] = `
 				<svg aria-hidden=\\"true\\" focusable=\\"false\\" data-prefix=\\"fas\\" data-icon=\\"lightbulb\\" class=\\"svg-inline--fa fa-lightbulb\\" role=\\"img\\" xmlns=\\"http://www.w3.org/2000/svg\\" viewBox=\\"0 0 384 512\\"><path fill=\\"currentColor\\" d=\\"M272 384c9.6-31.9 29.5-59.1 49.2-86.2c0 0 0 0 0 0c5.2-7.1 10.4-14.2 15.4-21.4c19.8-28.5 31.4-63 31.4-100.3C368 78.8 289.2 0 192 0S16 78.8 16 176c0 37.3 11.6 71.9 31.4 100.3c5 7.2 10.2 14.3 15.4 21.4c0 0 0 0 0 0c19.8 27.1 39.7 54.4 49.2 86.2l160 0zM192 512c44.2 0 80-35.8 80-80l0-16-160 0 0 16c0 44.2 35.8 80 80 80zM112 176c0 8.8-7.2 16-16 16s-16-7.2-16-16c0-61.9 50.1-112 112-112c8.8 0 16 7.2 16 16s-7.2 16-16 16c-44.2 0-80 35.8-80 80z\\"></path></svg>
 			</button>
 		</div><button id=\\"gvs-player-more\\" class=\\"gvs-btn gvs-widget-bg gvs-xs-hidden\\" title=\\"Plus d'options de lecture\\"><svg aria-hidden=\\"true\\" focusable=\\"false\\" data-prefix=\\"fas\\" data-icon=\\"ellipsis-vertical\\" class=\\"svg-inline--fa fa-ellipsis-vertical\\" role=\\"img\\" xmlns=\\"http://www.w3.org/2000/svg\\" viewBox=\\"0 0 128 512\\"><path fill=\\"currentColor\\" d=\\"M64 360a56 56 0 1 0 0 112 56 56 0 1 0 0-112zm0-160a56 56 0 1 0 0 112 56 56 0 1 0 0-112zM120 96A56 56 0 1 0 8 96a56 56 0 1 0 112 0z\\"></path></svg></button></div></div><div id=\\"gvs-corner-main-top-middle\\" class=\\"gvs-corner\\"></div><div id=\\"gvs-corner-main-top-right\\" class=\\"gvs-corner\\"></div></div><div id=\\"gvs-corner-main-bottom\\" class=\\"gvs-corner-space\\"><div id=\\"gvs-corner-main-bottom-left\\" class=\\"gvs-corner\\"><div id=\\"gvs-widget-legend\\" class=\\"gvs-group gvs-widget-bg\\" title=\\"\\"><a href=\\"https://panoramax.fr/\\" target=\\"_blank\\">Panoramax</a></div></div><div id=\\"gvs-corner-main-bottom-middle\\" class=\\"gvs-corner\\"></div><div id=\\"gvs-corner-main-bottom-right\\" class=\\"gvs-corner\\"><div id=\\"gvs-widget-share\\" class=\\"gvs-group gvs-group-large gvs-group-btnpanel gvs-mobile-hidden gvs-print-hidden\\"><button id=\\"gvs-share\\" class=\\"gvs-btn gvs-widget-bg gvs-btn-large\\" title=\\"Partager\\"><svg aria-hidden=\\"true\\" focusable=\\"false\\" data-prefix=\\"fas\\" data-icon=\\"share-nodes\\" class=\\"svg-inline--fa fa-share-nodes\\" role=\\"img\\" xmlns=\\"http://www.w3.org/2000/svg\\" viewBox=\\"0 0 448 512\\"><path fill=\\"currentColor\\" d=\\"M352 224c53 0 96-43 96-96s-43-96-96-96s-96 43-96 96c0 4 .2 8 .7 11.9l-94.1 47C145.4 170.2 121.9 160 96 160c-53 0-96 43-96 96s43 96 96 96c25.9 0 49.4-10.2 66.6-26.9l94.1 47c-.5 3.9-.7 7.8-.7 11.9c0 53 43 96 96 96s96-43 96-96s-43-96-96-96c-25.9 0-49.4 10.2-66.6 26.9l-94.1-47c.5-3.9 .7-7.8 .7-11.9s-.2-8-.7-11.9l94.1-47C302.6 213.8 326.1 224 352 224z\\"></path></svg></button><div id=\\"gvs-share-panel\\" class=\\"gvs-panel gvs-widget-bg gvs-hidden\\">
-			<div class=\\"gvs-hidden\\">
+			<div class=\\"gvs-hidden gvs-needs-picture\\">
 				<p id=\\"gvs-share-license\\" style=\\"margin: 0 0 10px 0;\\"></p>
 			</div>
 			<h4 style=\\"margin-top: 0\\"><svg aria-hidden=\\"true\\" focusable=\\"false\\" data-prefix=\\"fas\\" data-icon=\\"link\\" class=\\"svg-inline--fa fa-link\\" role=\\"img\\" xmlns=\\"http://www.w3.org/2000/svg\\" viewBox=\\"0 0 640 512\\"><path fill=\\"currentColor\\" d=\\"M579.8 267.7c56.5-56.5 56.5-148 0-204.5c-50-50-128.8-56.5-186.3-15.4l-1.6 1.1c-14.4 10.3-17.7 30.3-7.4 44.6s30.3 17.7 44.6 7.4l1.6-1.1c32.1-22.9 76-19.3 103.8 8.6c31.5 31.5 31.5 82.5 0 114L422.3 334.8c-31.5 31.5-82.5 31.5-114 0c-27.9-27.9-31.5-71.8-8.6-103.8l1.1-1.6c10.3-14.4 6.9-34.4-7.4-44.6s-34.4-6.9-44.6 7.4l-1.1 1.6C206.5 251.2 213 330 263 380c56.5 56.5 148 56.5 204.5 0L579.8 267.7zM60.2 244.3c-56.5 56.5-56.5 148 0 204.5c50 50 128.8 56.5 186.3 15.4l1.6-1.1c14.4-10.3 17.7-30.3 7.4-44.6s-30.3-17.7-44.6-7.4l-1.6 1.1c-32.1 22.9-76 19.3-103.8-8.6C74 372 74 321 105.5 289.5L217.7 177.2c31.5-31.5 82.5-31.5 114 0c27.9 27.9 31.5 71.8 8.6 103.9l-1.1 1.6c-10.3 14.4-6.9 34.4 7.4 44.6s34.4 6.9 44.6-7.4l1.1-1.6C433.5 260.8 427 182 377 132c-56.5-56.5-148-56.5-204.5 0L60.2 244.3z\\"></path></svg> Liens utiles</h4>
 			<div id=\\"gvs-share-links\\" class=\\"gvs-input-btn\\">
-				<a id=\\"gvs-share-image\\" class=\\"gvs-link-btn gvs-hidden\\" download=\\"\\" target=\\"_blank\\"><svg aria-hidden=\\"true\\" focusable=\\"false\\" data-prefix=\\"fas\\" data-icon=\\"cloud-arrow-down\\" class=\\"svg-inline--fa fa-cloud-arrow-down\\" role=\\"img\\" xmlns=\\"http://www.w3.org/2000/svg\\" viewBox=\\"0 0 640 512\\"><path fill=\\"currentColor\\" d=\\"M144 480C64.5 480 0 415.5 0 336c0-62.8 40.2-116.2 96.2-135.9c-.1-2.7-.2-5.4-.2-8.1c0-88.4 71.6-160 160-160c59.3 0 111 32.2 138.7 80.2C409.9 102 428.3 96 448 96c53 0 96 43 96 96c0 12.2-2.3 23.8-6.4 34.6C596 238.4 640 290.1 640 352c0 70.7-57.3 128-128 128l-368 0zm79-167l80 80c9.4 9.4 24.6 9.4 33.9 0l80-80c9.4-9.4 9.4-24.6 0-33.9s-24.6-9.4-33.9 0l-39 39L344 184c0-13.3-10.7-24-24-24s-24 10.7-24 24l0 134.1-39-39c-9.4-9.4-24.6-9.4-33.9 0s-9.4 24.6 0 33.9z\\"></path></svg> Image HD</a>
+				<a id=\\"gvs-share-image\\" class=\\"gvs-link-btn gvs-hidden gvs-needs-picture\\" download=\\"\\" target=\\"_blank\\"><svg aria-hidden=\\"true\\" focusable=\\"false\\" data-prefix=\\"fas\\" data-icon=\\"cloud-arrow-down\\" class=\\"svg-inline--fa fa-cloud-arrow-down\\" role=\\"img\\" xmlns=\\"http://www.w3.org/2000/svg\\" viewBox=\\"0 0 640 512\\"><path fill=\\"currentColor\\" d=\\"M144 480C64.5 480 0 415.5 0 336c0-62.8 40.2-116.2 96.2-135.9c-.1-2.7-.2-5.4-.2-8.1c0-88.4 71.6-160 160-160c59.3 0 111 32.2 138.7 80.2C409.9 102 428.3 96 448 96c53 0 96 43 96 96c0 12.2-2.3 23.8-6.4 34.6C596 238.4 640 290.1 640 352c0 70.7-57.3 128-128 128l-368 0zm79-167l80 80c9.4 9.4 24.6 9.4 33.9 0l80-80c9.4-9.4 9.4-24.6 0-33.9s-24.6-9.4-33.9 0l-39 39L344 184c0-13.3-10.7-24-24-24s-24 10.7-24 24l0 134.1-39-39c-9.4-9.4-24.6-9.4-33.9 0s-9.4 24.6 0 33.9z\\"></path></svg> Image HD</a>
 				<button id=\\"gvs-share-url\\" data-copy=\\"http://localhost\\" style=\\"flex-basis: 100%; flex-grow: 2; flex-shrink: 2;\\"><svg aria-hidden=\\"true\\" focusable=\\"false\\" data-prefix=\\"fas\\" data-icon=\\"copy\\" class=\\"svg-inline--fa fa-copy\\" role=\\"img\\" xmlns=\\"http://www.w3.org/2000/svg\\" viewBox=\\"0 0 448 512\\"><path fill=\\"currentColor\\" d=\\"M208 0L332.1 0c12.7 0 24.9 5.1 33.9 14.1l67.9 67.9c9 9 14.1 21.2 14.1 33.9L448 336c0 26.5-21.5 48-48 48l-192 0c-26.5 0-48-21.5-48-48l0-288c0-26.5 21.5-48 48-48zM48 128l80 0 0 64-64 0 0 256 192 0 0-32 64 0 0 48c0 26.5-21.5 48-48 48L48 512c-26.5 0-48-21.5-48-48L0 176c0-26.5 21.5-48 48-48z\\"></path></svg> Lien de la page</button>
 				<button id=\\"gvs-share-print\\" style=\\"flex-basis: 100%; flex-grow: 2; flex-shrink: 2;\\"><svg aria-hidden=\\"true\\" focusable=\\"false\\" data-prefix=\\"fas\\" data-icon=\\"print\\" class=\\"svg-inline--fa fa-print\\" role=\\"img\\" xmlns=\\"http://www.w3.org/2000/svg\\" viewBox=\\"0 0 512 512\\"><path fill=\\"currentColor\\" d=\\"M128 0C92.7 0 64 28.7 64 64l0 96 64 0 0-96 226.7 0L384 93.3l0 66.7 64 0 0-66.7c0-17-6.7-33.3-18.7-45.3L400 18.7C388 6.7 371.7 0 354.7 0L128 0zM384 352l0 32 0 64-256 0 0-64 0-16 0-16 256 0zm64 32l32 0c17.7 0 32-14.3 32-32l0-96c0-35.3-28.7-64-64-64L64 192c-35.3 0-64 28.7-64 64l0 96c0 17.7 14.3 32 32 32l32 0 0 64c0 35.3 28.7 64 64 64l256 0c35.3 0 64-28.7 64-64l0-64zM432 248a24 24 0 1 1 0 48 24 24 0 1 1 0-48z\\"></path></svg> Imprimer</button>
 			</div>
@@ -392,8 +392,8 @@ exports[`constructor works with iframeBaseURL option 1`] = `
 				<textarea id=\\"gvs-share-iframe\\" readonly=\\"\\"></textarea>
 				<button data-input=\\"gvs-share-iframe\\"><svg aria-hidden=\\"true\\" focusable=\\"false\\" data-prefix=\\"fas\\" data-icon=\\"copy\\" class=\\"svg-inline--fa fa-copy\\" role=\\"img\\" xmlns=\\"http://www.w3.org/2000/svg\\" viewBox=\\"0 0 448 512\\"><path fill=\\"currentColor\\" d=\\"M208 0L332.1 0c12.7 0 24.9 5.1 33.9 14.1l67.9 67.9c9 9 14.1 21.2 14.1 33.9L448 336c0 26.5-21.5 48-48 48l-192 0c-26.5 0-48-21.5-48-48l0-288c0-26.5 21.5-48 48-48zM48 128l80 0 0 64-64 0 0 256 192 0 0-32 64 0 0 48c0 26.5-21.5 48-48 48L48 512c-26.5 0-48-21.5-48-48L0 176c0-26.5 21.5-48 48-48z\\"></path></svg> Copier</button>
 			</div>
-			<h4 class=\\"gvs-hidden\\"><svg aria-hidden=\\"true\\" focusable=\\"false\\" data-prefix=\\"fas\\" data-icon=\\"pen\\" class=\\"svg-inline--fa fa-pen\\" role=\\"img\\" xmlns=\\"http://www.w3.org/2000/svg\\" viewBox=\\"0 0 512 512\\"><path fill=\\"currentColor\\" d=\\"M362.7 19.3L314.3 67.7 444.3 197.7l48.4-48.4c25-25 25-65.5 0-90.5L453.3 19.3c-25-25-65.5-25-90.5 0zm-71 71L58.6 323.5c-10.4 10.4-18 23.3-22.2 37.4L1 481.2C-1.5 489.7 .8 498.8 7 505s15.3 8.5 23.7 6.1l120.3-35.4c14.1-4.2 27-11.8 37.4-22.2L421.7 220.3 291.7 90.3z\\"></path></svg> Contribuer sur OSM</h4>
-			<div class=\\"gvs-input-btn gvs-hidden\\" style=\\"justify-content: center\\">
+			<h4 class=\\"gvs-hidden gvs-needs-picture\\"><svg aria-hidden=\\"true\\" focusable=\\"false\\" data-prefix=\\"fas\\" data-icon=\\"pen\\" class=\\"svg-inline--fa fa-pen\\" role=\\"img\\" xmlns=\\"http://www.w3.org/2000/svg\\" viewBox=\\"0 0 512 512\\"><path fill=\\"currentColor\\" d=\\"M362.7 19.3L314.3 67.7 444.3 197.7l48.4-48.4c25-25 25-65.5 0-90.5L453.3 19.3c-25-25-65.5-25-90.5 0zm-71 71L58.6 323.5c-10.4 10.4-18 23.3-22.2 37.4L1 481.2C-1.5 489.7 .8 498.8 7 505s15.3 8.5 23.7 6.1l120.3-35.4c14.1-4.2 27-11.8 37.4-22.2L421.7 220.3 291.7 90.3z\\"></path></svg> Contribuer sur OSM</h4>
+			<div class=\\"gvs-input-btn gvs-hidden gvs-needs-picture\\" style=\\"justify-content: center\\">
 				<a id=\\"gvs-edit-id\\" class=\\"gvs-link-btn\\" target=\\"_blank\\"><svg aria-hidden=\\"true\\" focusable=\\"false\\" data-prefix=\\"fas\\" data-icon=\\"location-dot\\" class=\\"svg-inline--fa fa-location-dot\\" role=\\"img\\" xmlns=\\"http://www.w3.org/2000/svg\\" viewBox=\\"0 0 384 512\\"><path fill=\\"currentColor\\" d=\\"M215.7 499.2C267 435 384 279.4 384 192C384 86 298 0 192 0S0 86 0 192c0 87.4 117 243 168.3 307.2c12.3 15.3 35.1 15.3 47.4 0zM192 128a64 64 0 1 1 0 128 64 64 0 1 1 0-128z\\"></path></svg> iD</a>
 				<button id=\\"gvs-edit-josm\\" title=\\"Active la synchronisation automatique de JOSM lors du chargement d'une photo\\"><svg aria-hidden=\\"true\\" focusable=\\"false\\" data-prefix=\\"fas\\" data-icon=\\"satellite-dish\\" class=\\"svg-inline--fa fa-satellite-dish\\" role=\\"img\\" xmlns=\\"http://www.w3.org/2000/svg\\" viewBox=\\"0 0 512 512\\"><path fill=\\"currentColor\\" d=\\"M192 32c0-17.7 14.3-32 32-32C383.1 0 512 128.9 512 288c0 17.7-14.3 32-32 32s-32-14.3-32-32C448 164.3 347.7 64 224 64c-17.7 0-32-14.3-32-32zM60.6 220.6L164.7 324.7l28.4-28.4c-.7-2.6-1.1-5.4-1.1-8.3c0-17.7 14.3-32 32-32s32 14.3 32 32s-14.3 32-32 32c-2.9 0-5.6-.4-8.3-1.1l-28.4 28.4L291.4 451.4c14.5 14.5 11.8 38.8-7.3 46.3C260.5 506.9 234.9 512 208 512C93.1 512 0 418.9 0 304c0-26.9 5.1-52.5 14.4-76.1c7.5-19 31.8-21.8 46.3-7.3zM224 96c106 0 192 86 192 192c0 17.7-14.3 32-32 32s-32-14.3-32-32c0-70.7-57.3-128-128-128c-17.7 0-32-14.3-32-32s14.3-32 32-32z\\"></path></svg> JOSM</button>
 			</div>