@mescius/dsimageviewer
Version:
Document Solutions Image Viewer
56 lines (47 loc) • 17.8 kB
HTML
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<meta name="theme-color" content="#000000" />
<title>Document Solutions Image Viewer Localization Demo</title>
<script>
// Here's example how to fetch localization strings
// (Note, you need to run the page on a web server for the fetch to work.)
/*
async function fetchLocalizationStrings() {
try {
const response1 = await fetch("en-viewer-base.json");
const response2 = await fetch("en-image-viewer.json");
const data1 = await response1.json();
const data2 = await response2.json();
return { ...data1, ...data2 };
} catch (error) {
console.error("An error occurred:", error);
}
}
const translationJson = await fetchLocalizationStrings();
*/
function loadImageViewer(selector) {
//DsImageViewer.LicenseKey = "your_license_key";
// In this example, we have translated the strings into German using Google Translate.
const translationJson = {"error":{"details":"Details","dismiss":"Schließen","dismiss-all":"Alle schließen"},"menu":{"toogleText":"Menü erweitern","aria-label":"Menü","pin-button-title":"Anheften"},"sidebar":{"expand-btn":"Erweitern","collapse-btn":"Zusammenklappen","aria-label":"Seitenleiste"},"cancel-btn":"Abbrechen","toolbar":{"zoom-fitwidth":"Breite anpassen","zoom-fitpage":"Seite anpassen","zoom-zoomout":"Verkleinern","zoom-zoomin":"Vergrößern","zoom-menu-header":"Zoom-Modus","gotofirst":"Zum Anfang","gotoprevious":"Zum Vorherigen","gotonext":"Zum Nächsten","gotolast":"Zum Letzten","hist-parent":"Verlauf: Zurück zum übergeordneten Element","hist-back":"Verlauf: Zurück","hist-fwd":"Verlauf: Vorgehen","movetool":"Verschiebewerkzeug","fullscreen":"Vollbildmodus","refresh":"Aktualisieren","cancel":"Abbrechen","expand":"Symbolleiste erweitern","aria-label":"Symbolleiste","cycle-themes":"Verfügbare Designs durchsuchen","save-as-menu":{"header":"SPEICHERN UNTER","save-as-item-format":"Speichern als {{format}}"},"save":"Speichern","save-as":"Speichern unter","zoom-wholeimage":"Ganzes Bild","save-document":"Speichern","print":"Drucken","rotate-document":"Drehen","open":"Öffnen","undo-changes":"Änderungen rückgängig machen","redo-changes":"Änderungen wiederherstellen","about":"Über","document-properties":"Dokumenteigenschaften","image-filter-tools":"Bildeffekte","page-tools":"Seitenwerkzeuge","paint-tools":"Malwerkzeuge","text-tools":"Textwerkzeuge"},"errors":{"noHostElement":"Das Host-Element konnte nicht gefunden werden.","cannot-save-document-format":"Das Dokument kann nicht gespeichert werden. {{reason}}","base-viewer-dispose-warn":"","image-dnd-error":{"details-download-url":"Das Bild kann nicht von der URL heruntergeladen werden.","message":"Fehler beim Drag & Drop."},"error-opening-document":"Fehler beim Öffnen des Dokuments","proLicenseRequired":{"message":"Eine professionelle Lizenz ist erforderlich, um die Bearbeitungsfunktionen zu verwenden."},"print-canceled-by-user":"Abgebrochen durch Benutzer"},"top-bottom-panel":{"aria-label":"Zusätzliche Steuerleiste"},"document-view":{"aria-label":"Dokumentansicht"},"progress":{"page":"Seite"},"search":{"match-case":"Groß-/Kleinschreibung beachten","whole-word":"Ganzes Wort","cancel-btn":"Abbrechen","start-search-btn":"Suche","clear-btn":"Leeren","more-results-btn":"Weitere Ergebnisse","search-results":"Suchergebnisse","search-cancelled-msg":"Suche auf Seite {{page}} abgebrochen","didn-find-msg":"Nichts gefunden.","paneltitle":"Suche"},"dialogs":{"confirmation-dialog":{"title":"Bestätigung","buttons":{"details":"Details","yes":"Ja","no":"Nein","ok":"OK","cancel":"Abbrechen","close":"Schließen","dismiss":"Schließen","confirm":"Bestätigen"}},"print-progress":{"message":"Das Dokument wird für den Druck vorbereitet ..."},"cancel-btn":{"title":"Abbrechen","label":"Abbrechen"}},"floating-bar":{"aria-label":"Symbolleiste","text-selection-mode":"Textauswahlmodus","pan-mode":"Panning-Modus"},"messages":{"confirm-convert-to-png-with-transparency":{"message":"Das aktuelle Bildformat unterstützt keine Transparenz. Wenn Sie fortfahren, wird das Bild in das PNG-Format konvertiert. Möchten Sie fortfahren?","title":"Bildformatkonvertierung"},"eraser-confirm-convert-to-png-with-transparency":{"message":"Bei Verwendung des Radiergummis, wenn die Option 'Originelles Bild verwenden' aktiviert ist, werden transparente Pixel erstellt. Das aktuelle Bildformat unterstützt keine Transparenz. Wenn Sie fortfahren, wird das Bild in das PNG-Format konvertiert. Möchten Sie fortfahren?"},"delete-region-confirm-convert-to-png-with-transparency":{"message":"Das Ausschneiden oder Löschen einer Region erstellt transparente Pixel. Das aktuelle Bildformat unterstützt keine Transparenz. Wenn Sie fortfahren, wird das Bild in das PNG-Format konvertiert. Möchten Sie fortfahren?"}},"panels":{"layers":{"list":{"item":{"label-format":"Ebene {{layerNum}}"}}},"image-filters":{"label":"Bildeffekte","title":"Vorschau von Bildeffekten"}},"about":{"line1":{"span1":"Document Solutions Image Viewer v{{version}}."},"line3":"Wir laden Sie ein, unsere anderen Document API Solutions zu testen:","list-item-1":"{{anchorStart}}Document Solutions für Excel, .NET Edition{{anchorEnd}}","list-item-2":"{{anchorStart}}Document Solutions für Excel, Java Edition{{anchorEnd}}","list-item-3":"{{anchorStart}}Document Solutions für Imaging{{anchorEnd}}","list-item-4":"{{anchorStart}}Document Solutions für PDF{{anchorEnd}}","list-item-5":"{{anchorStart}}Document Solutions für PDF Viewer{{anchorEnd}}","list-item-6":"{{anchorStart}}Document Solutions für Word{{anchorEnd}}"},"warnings":{"securityDoesNotAllowPrinting":"Sicherheitsberechtigungen erlauben keinen Druck."},"license":{"invalidlicensekey":{"message":{"line1":"Ungültiger Lizenzschlüssel.","line2":"","line3":"Kontaktieren Sie uns.sales@mescius.com, um eine Lizenz zu erwerben."}},"nolicensekey":{"message":{"line1":"Lizenz nicht gefunden","line2":"","line3":"Sie benötigen einen gültigen Lizenzschlüssel, um Document Solutions Image Viewer auszuführen.","line4":"Temporäre Schlüssel sind zur Bewertung verfügbar.","line5":"Wenn Sie eine Lizenz erworben haben, finden Sie Ihren Schlüssel in Ihrer Kaufbestätigungs-E-Mail.","line6":"Kontaktieren Sie uns.sales@mescius.com, wenn Sie Unterstützung benötigen."},"watermark":{"line1":"Powered by Document Solutions Image Viewer.","line2":"Sie können diese EVALUATION-Version nur lokal bereitstellen.","line3":"Temporäre Bereitstellungsschlüssel stehen zum Testen zur Verfügung.","line4":"Kontaktieren Sie uns.sales@mescius.com."}},"evallicense":{"watermark":{"line1":"Powered by Document Solutions Image Viewer.","line2":"Ihr temporärer Bereitstellungsschlüssel läuft in {{expiresInDays}} Tag(en) ab."}},"evalexpiredlicense":{"message":{"line1":"Powered by Document Solutions Image Viewer.","line2":"","line3":"Ihr temporärer Bereitstellungsschlüssel ist abgelaufen.","line4":"Kontaktieren Sie uns.sales@mescius.com, um Hilfe zu erhalten."}},"localhostonly":{"message":{"line1":"Lizenz nicht gefunden","line2":"","line3":"Sie benötigen einen gültigen Lizenzschlüssel, um Document Solutions Image Viewer auszuführen.","line4":"Temporäre Schlüssel sind zur Bewertung verfügbar.","line5":"Wenn Sie eine Lizenz erworben haben, finden Sie Ihren Schlüssel in Ihrer Kaufbestätigungs-E-Mail.","line6":"Kontaktieren Sie uns.sales@mescius.com, wenn Sie Unterstützung benötigen."}},"keyforanotherproduct":{"message":{"line1":"Dieser Lizenzschlüssel gilt für ein anderes Mescius-Produkt.","line2":"","line3":"Kontaktieren Sie uns.sales@mescius.com, um eine Lizenz zu erwerben."}},"keyforanotherdomain":{"message":{"line1":"Es wurde eine gültige Lizenz angewendet. Diese Lizenz gilt jedoch nicht für diese Domain.","line2":"","line3":"Kontaktieren Sie uns.sales@mescius.com, um eine neue Lizenz zu erwerben."}},"licensenotfound":{"message":"Lizenz nicht gefunden"},"oldproductlicensekey":{"message":{"line1":"Dieser Lizenzschlüssel gilt für eine frühere ({{oldProductVer}}) Version von Document Solutions Image Viewer.","line2":"","line3":"Kontaktieren Sie uns.sales@mescius.com, um Ihre Lizenz zu aktualisieren."}}},"editors":{"color-editor":{"text-palettes":"Paletten","text-color-picker":"Farbauswahl","text-web-colors":"Webfarben","text-opacity":"Deckkraft","text-standard-colors":"Standardfarben","text-hue":"Farbton","text-saturation":"Sättigung","text-lightness":"Helligkeit","text-hex":"Hex","text-r":"R","text-g":"G","text-b":"B","webColorNames":{"transparent":"Transparent","black":"Schwarz","darkslategray":"Dunkles Schieferschwarz","slategray":"Schiefergrau","lightslategray":"Helles Schiefergrau","dimgray":"Dunkelgrau","gray":"Grau","darkgray":"Dunkelgrau","silver":"Silber","lightgrey":"Hellgrau","gainsboro":"Gainsboro","whitesmoke":"Weißrauch","white":"Weiß","snow":"Schnee","honeydew":"Honigtau","mintcream":"Minzcreme","azure":"Azur","aliceblue":"Alice Blau","ghostwhite":"Geisterweiß","seashell":"Muschelweiß","beige":"Beige","oldlace":"Alte Spitze","floralwhite":"Blütenweiß","ivory":"Elfenbein","antiquewhite":"Antikweiß","linen":"Leinenweiß","lavenderblush":"Lavendelhauch","mistyrose":"Rosenhauch","pink":"Pink","lightpink":"Hell-Pink","hotpink":"Leuchtendes Pink","deeppink":"Tiefrosa","palevioletred":"Blassviolettrot","mediumvioletred":"Mittelviolettrot","lightsalmon":"Helles Lachsrosa","salmon":"Lachsrosa","darksalmon":"Dunkles Lachsrosa","lightcoral":"Helles Korallenrot","indianred":"Indischrot","crimson":"Karmesinrot","firebrick":"Brandziegelrot","darkred":"Dunkelrot","red":"Rot","orangered":"Orangerot","tomato":"Tomate","coral":"Koralle","darkorange":"Dunkelorange","orange":"Orange","yellow":"Gelb","lightyellow":"Hellgelb","lemonchiffon":"Zitronenchiffon","lightgoldenrodyellow":"Hellgoldgelb","papayawhip":"Papajaweich","moccasin":"Mokassin","peachpuff":"Pfirsichton","palegoldenrod":"Blassgoldgelb","khaki":"Khaki","darkkhaki":"Dunkelkhaki","gold":"Gold","cornsilk":"Kornblumenweiß","blanchedalmond":"Mandelweiß","bisque":"Knochenweiß","navajowhite":"Navajoweiß","wheat":"Weizenfarben","burlywood":"Burlywood","tan":"Braun","rosybrown":"Rosig-Braun","sandybrown":"Sandbraun","goldenrod":"Goldrute","darkgoldenrod":"Dunkelgoldrute","peru":"Peru","chocolate":"Schokolade","saddlebrown":"Sattelbraun","sienna":"Sienna","brown":"Braun","maroon":"Kastanienbraun","darkolivegreen":"Dunkel-Olivgrün","olive":"Olivgrün","olivedrab":"Olivgraubraun","yellowgreen":"Gelbgrün","limegreen":"Limettengrün","lime":"Limettengelb","lawngreen":"Grüngelb","chartreuse":"Gelbgrün","greenyellow":"Grüngelb","springgreen":"Frühlingsgrün","mediumspringgreen":"Mittelfrühlingsgrün","lightgreen":"Helles Grün","palegreen":"Blasse Grüntöne","darkseagreen":"Dunkles Seegrün","mediumaquamarine":"Mittelaquamarin","mediumseagreen":"Mittelseegrün","seagreen":"Seegrün","forestgreen":"Waldbewohner-Grün","green":"Grün","darkgreen":"Dunkelgrün","aqua":"Aquamarin","cyan":"Cyan","lightcyan":"Helles Cyan","paleturquoise":"Blass-türkis","aquamarine":"Aquamarin","turquoise":"Türkis","mediumturquoise":"Mitteltürkis","darkturquoise":"Dunkeltürkis","lightseagreen":"Hellseegrün","cadetblue":"Kadettenblau","darkcyan":"Dunkelcyan","teal":"Teal","lightsteelblue":"Helles Stahlblau","powderblue":"Pulverblau","lightblue":"Hellblau","skyblue":"Himmelblau","lightskyblue":"Helles Himmelblau","deepskyblue":"Tieftes Himmelblau","dodgerblue":"Dodger-Blau","cornflowerblue":"Kornblumenblau","steelblue":"Stahlblau","royalblue":"Königsblau","blue":"Blau","mediumblue":"Mittelblau","darkblue":"Dunkelblau","navy":"Marineblau","midnightblue":"Mitternachtsblau","lavender":"Lavendel","thistle":"Distel","plum":"Pflaume","violet":"Lila","orchid":"Orchidee","fuchsia":"Fuchsia","magenta":"Magenta","mediumorchid":"Mittelviolettorchidee","mediumpurple":"Mittelpurpur","blueviolet":"Blauviolett","darkviolet":"Dunkelviolett","darkorchid":"Dunkles Violett","darkmagenta":"Dunkles Magenta","purple":"Purpur","indigo":"Indigo","darkslateblue":"Dunkles Schieferblau","rebeccapurple":"Rebeccalila","slateblue":"Schieferblau","mediumslateblue":"Mittelschieferblau"}}},"paint-tools":{"text-tool":{"type-here-placeholder":"Geben Sie hier ein"},"dialogs":{"text-tools-exit-confirm":{"message":"Möchten Sie den Text-Tools-Editor wirklich ohne Speichern Ihrer Änderungen verlassen?"},"paint-tools-exit-confirm":{"message":"Möchten Sie den Paint-Tools-Editor wirklich ohne Speichern Ihrer Änderungen verlassen?"},"clone-stamp-no-source":{"message":"Um das Klonstempelwerkzeug zu verwenden, definieren Sie zuerst den Quellpunkt durch Klicken bei gedrückter Alt-Taste.","title":"Klonstempel-Werkzeug"}},"paint-toolbar":{"pen":{"title":"Bleistift"},"brush":{"title":"Bürste"},"clone-stamp":{"title":"Klonen"},"eraser":{"title":"Radiergummi"},"use-original":{"text":"Original verwenden","title":"Das Originalbild als Quelle verwenden bei Anwendung von Bearbeitungen."},"buttons":{"undo":{"title":"Rückgängig"},"redo":{"title":"Wiederherstellen"},"crop":{"title":"Anwenden"},"cancel":{"title":"Abbrechen"},"pencil-width-dd":{"value-format":"{{pencilWidth}}px"},"pen-size":{"placeholder":"Größe"}},"text":{"title":"Text"},"font-bold":{"title":"Fett"},"font-italic":{"title":"Kursiv"},"font-name":{"placeholder":"Schriftart"},"font-size":{"placeholder":"Größe"},"filters-dd":{"intencity-header":"Intensität","chevron-title":"Optionen auswählen"},"filter-btn":{"blur":"Unschärfe","pixelate":"Verpixeln"}},"selection-tool":{"tool-type":{"color-selection":"Farbauswahl","elliptical-selection":"Ellipsoid Marquee","free-selection":"Lasso","polygonal-selection":"Polygonal Lasso","quick-selection":"Schnelle Auswahl","rectangular-selection":"Rechteck-Marquee","subject-selection":"Subjekt-Auswahl","none":"Keine auswahl"},"types":{"color-selection-title":"Farbauswahl - Wählt in einem Bild ähnlich gefärbte Bereiche aus.","elliptical-selection-title":"Ellipsoid-Auswahl - Erstellt runde und ellipsoide Auswahlen.","free-selection-title":"Lasso-Werkzeug - Ermöglicht freiformartige Auswahlen durch Zeichnen um den gewünschten Bereich.","polygonal-selection-title":"Polygonale Auswahl - Ermöglicht das Zeichnen polygonyler, Zacken-Auswahlen.","quick-selection-title":"Schnellauswahl - Wählt Objekte in einem Bild aus, während Sie über sie zeichnen.","rectangular-selection-title":"Rechteckauswahl - Erstellt quadratische und rechteckige Auswahlen.","subject-selection-title":"Subjektauswahl - Wählt automatisch das Hauptmotiv im Bild aus.","none-title":"Keine Auswahl"}},"tool-settings":{"tooltip":"Werkzeugeinstellungen"}},"labels":{"relative-date":{"right-now":"Jetzt gleich","seconds-ago-format":"vor {{sec}} Sekunden","minutes-ago-format":"vor {{min}} Minuten"},"fileSize":{"b":"B","kb":"KB","mb":"MB","gb":"GB","tb":"TB"}},"annotation-defaults":{"default-user-name":"Anonym"},"page-tools":{"imagefilter-preview-dialog":{"original-filter":{"title":"Original","text":"Original"},"title":"Bildeffekte anwenden","buttons":{"cancel":{"text":"Abbrechen"},"apply":{"text":"Anwenden"}},"label-intensity":"Intensität","preview-toggle":{"label":"Vorschau"},"intensity":{"label":"Intensität:"}},"crop-toolbar":{"buttons":{"crop":{"title":"Anwenden"},"cancel":{"title":"Abbrechen"}},"aspect-ratio":{"custom":"Benutzerdefiniertes Seitenverhältnis","original":"Original ({{originalRatio}})","9_12":"9:12 (0,75:1)","1_1":"1:1 (Quadrat)","5_4":"5:4 (1,25:1)","4_3":"4:3 (1,33:1)","3_2":"3:2 (1,5:1)","16_9":"16:9 (1,78:1)"},"label-position-x":"X","label-position-y":"Y","label-width":"Breite","label-height":"Höhe"},"crop-dialog":{"aspect-ratio":{"custom":"Benutzerdefiniert","original":"Original ({{originalRatio}})","1_1":"1:1 (Quadrat)","5_4":"5:4 (1,25:1)","4_3":"4:3 (1,33:1)","3_2":"3:2 (1,5:1)","16_9":"16:9 (1,78:1)"},"title":"Beschneiden","buttons":{"cancel":{"text":"Abbrechen"},"crop":{"text":"Beschneiden"}},"label-position-x":"X-Position (px)","label-position-y":"Y-Position (px)","label-width":"Breite (px)","label-height":"Höhe (px)","label-aspect-ratio":"Seitenverhältnis","reset":"Zurücksetzen","reset-title":"Auf Anfangswerte zurücksetzen"},"resize-dialog":{"title":"Größe ändern","buttons":{"cancel":{"text":"Abbrechen"},"resize":{"text":"Ändern"}},"label-width":"Breite (px)","label-height":"Höhe (px)","keep-aspect-ratio":"Seitenverhältnis beibehalten"},"resize-toolbar":{"buttons":{"keep-aspect-ratio":{"text":"Seitenverhältnis beibehalten","title":"Beibehaltung des Seitenverhältnisses"},"resize":{"title":"Anwenden"},"cancel":{"title":"Abbrechen"}},"label-width":"Breite","label-height":"Höhe"}},"image-filters":{"image-filters-toolbar":{"buttons":{"crop":{"title":"Anwenden"},"cancel":{"title":"Abbrechen"}}}}};
const options = {
language: "German"
};
DsImageViewer.i18n.init({
resources: { "German": { viewer: translationJson } },
defaultNS: "viewer"
}).then(function () {
const viewer = new DsImageViewer(selector, options);
// Uncomment the next line to open an image file
// viewer.open("sample.jpg");
});
}
</script>
<script defer="defer" src="../dsimageviewer.js"></script>
</head>
<body onload="loadImageViewer('#root')">
<div id="root"></div>
</body>
</html>