Editor Cerdas Label Putih

ClippingMagic.js memungkinkan Anda dengan mudah mengintegrasikan editor Clipping Magic ke situs web Anda sendiri. Anda dapat mengedit gambar tunggal seperti di halaman depan, atau urutan gambar seperti di kliping massal.

Langkah-langkah Integrasi

Pastikan untuk membaca Mulai Cepat terlebih dahulu.

  1. Unggah gambar menggunakan API Server.

  2. Sematkan Editor Cerdas Label Putih sebagaimana dijelaskan dibawah ini.

  3. Bereaksi terhadap panggilan balik yang diterima oleh kode Anda saat Operator Manusia Anda klip gambar, mis. dengan menginstruksikan backend Anda untuk mengunduh hasil baru yang tersedia.

Opsi integrasi ini memberi Anda kendali penuh, tetapi membutuhkan integrasi front-end yang lebih dalam. Jika Anda menginginkan opsi integrasi yang lebih sederhana, silakan lihat Cerdas yang Dihosting.

Aturan

Untuk menggunakan ClippingMagic.js, mulailah dengan memasukkan dan menginisialisasinya pada halaman di mana Anda ingin mengizinkan pengeditan:

<script src="https://clippingmagic.com/api/v1/ClippingMagic.js" type="text/javascript"></script>
<script type="text/javascript">
  function myCallback(opts) {
    // TODO: Replace this with your own functionality
    switch (opts.event) {
      case "error":
          alert("An error occurred: " + opts.error.status + ", " + opts.error.code + ", " + opts.error.message);
          break;

      case "result-generated":
          alert("Generated a result for " + opts.image.id + ", " + opts.image.secret);
          break;

      case "editor-exit":
          alert("The editor dialog closed");
          break;
    }
  }
  var errorsArray = ClippingMagic.initialize({apiId: 123});
  if (errorsArray.length > 0) alert("Sorry, your browser is missing some required features: \n\n " + errorsArray.join("\n "));
</script>

Edit Gambar Tunggal

Anda dapat menampilkan editor untuk satu gambar seperti ini:

ClippingMagic.edit({
    "image" : {
      "id" : 2345,
      "secret" : "image_secret"
    },
    "useStickySettings" : true,
    "locale" : "id-ID"
  }, myCallback);

Fungsi panggilan balik akan dipanggil dengan baik result-generated atau editor-exit, tetapi tidak kedua-duanya. Masing-masing menunjukkan bahwa editor telah ditutup.

Hilangkan atau teruskan false untuk useStickySettings untuk menggunakan setelan default pabrik.

Pastikan untuk melakukan panggilan ini setelah peristiwa siap dokumen karena merujuk ke DOM.


Edit Beberapa Gambar Secara Berurutan

Anda dapat menampilkan editor untuk mengedit banyak gambar seperti:

ClippingMagic.edit({
    "images" : [ {
      "id" : 2345,
      "secret" : "image_secret"
    }, {
      "id" : 2346,
      "secret" : "image_secret2"
    } ],
    "useStickySettings" : true,
    "locale" : "id-ID"
  }, myCallback);

Fungsi panggilan balik akan dipanggil dengan result-generated satu kali untuk setiap hasil yang dibuat oleh pengguna (= sekali per klik on 'Done'). Akan ada satu panggilan editor-exit di bagian akhir yang menunjukkan bahwa editor telah ditutup, baik oleh pengguna mengeklik X, atau dengan kehabisan gambar untuk diedit. Tidak ada panggilan balik saat pengguna melewatkan gambar.

Hilangkan atau teruskan false untuk useStickySettings untuk menggunakan setelan default pabrik.

Pastikan untuk melakukan panggilan ini setelah peristiwa siap dokumen karena merujuk ke DOM.


Telepon Balik function(opts)

Fungsi edit menggunakan fungsi callback sebagai parameter. Panggilan balik ini memungkinkan Anda merespons tindakan pengguna dan memberi tahu server backend Anda tentang kemajuan pengeditan gambar.

Tanda tangan panggilan balik adalah function(opts) dan pengecualian atau nilai apa pun yang dikembalikan akan diabaikan. Parameter opts adalah PlainObject yang berisi:

event

String yang menunjukkan apa yang baru saja terjadi, lihat tabel di bawah.

image Pilihan. Sebuah Objek JSON Gambar (hanya id dan rahasia yang disertakan).
error Pilihan. Sebuah Kesalahan Objek JSON.
AcaraAda gambar?Ada kesalahan?Makna
result-generatedYaTidak Pengguna telah mengklik 'Selesai', hasilnya telah dibuat dan tersedia untuk diunduh langsung menggunakan API backend. Dalam mode gambar tunggal, editor telah ditutup.
editor-exitTidakTidak Pengguna telah menutup editor dengan mengklik X merah di pojok kanan atas, atau pengguna kehabisan gambar untuk diedit dalam mode multi-gambar. Editor telah ditutup.
errorTidakYa Terjadi kesalahan. Periksa nilai error untuk informasi selengkapnya. Editor telah ditutup.

Segera setelah editor ditutup, Anda dapat memanggil edit() lagi (panggilan yang dibuat sebelumnya mengarah ke pengecualian).

Contoh permintaan panggilan balik

callback({
  "event" : "result-generated",
  "image" : {
    "id" : 2345,
    "secret" : "image_secret"
  }
}); 

Definisi Fungsi

ClippingMagic.initialize(opts) -> array_of_missing_features

Fungsi initialize mengambil PlainObject yang berisi pasangan kunci/nilai yang mengonfigurasi inisialisasi:

apiId
Diperlukan
Identitas API Anda.

Fungsi mengembalikan Array JavaScript dengan string yang mendeskripsikan fitur yang hilang di browser saat ini, tetapi diperlukan untuk menjalankan editor. Jika larik ini kosong, Anda bisa melanjutkan dan memanggil fungsi edit.

ClippingMagic.edit(opts, callback)

Fungsi edit mengambil parameter berikut:

opts

Diperlukan. Sebuah PlainObject yang berisi pasangan kunci/nilai yang mengkonfigurasi inisialisasi:

image

Pilihan. Sebuah Image JSON Object (hanya dibutuhkan identitas dan kunci rahasia).

images

Pilihan. Array dari Image JSON Objects (hanya identitas dan kunci rahasia yang dibutuhkan).

useStickySettings

Pilihan. Boolean, trueberarti pengguna API's pengaturan lengket akan digunakan, false atau dihilangkan berarti default pabrik akan digunakan.

Ini memungkinkan Anda mengonfigurasi pengaturan pemotongan dasar sekali, dan kemudian menerapkannya di semua gambar yang Anda edit.

Read about how to configure the sticky settings

Pra-Pangkas tidak tersedia melalui API, tetapi Anda dapat membuat konfigurasi Batas Ukuran Gambar dalam panggilan unggah API.

locale

Pilihan. Bahasa tampilan yang digunakan untuk editor. Defaultnya adalah bahasa Inggris jika dihilangkan. Nilai yang sah adalah:

KodeTampilan Bahasa
en-US English (Inggris)
de-DE Deutsch (Jerman)
es-ES Español (Spanyol)
fr-FR Français (Prancis)
hi-IN हिन्दी (Hindi)
id-ID Indonesia
it-IT Italiano (Italia)
ja-JP 日本語 (Jepang)
ko-KR 한국어 (Korea)
pl-PL Polski
pt-BR Português (Portugis)
ru-RU Русский (Rusia)
th-TH ไทย (Thai)
tr-TR Türkçe (Turki)
vi-VN Tiếng Việt (Vietnam)
zh-Hans-CN 简体中文 (Tionghoa)
zh-Hant-TW 繁體中文 (Tionghoa)
callback

Diperlukan. Lihat bagian Panggilan Balik di atas untuk detailnya.

Metode ini tidak mengembalikan nilai. Jika initialize belum dipanggil sebelum memanggil metode ini, atau jika initialize mengembalikan larik yang tidak kosong, atau jika jendela editor sudah terbuka, kemudian pengecualian dibuat.