Akıllı Beyaz Etiket Düzenleyicisi

ClippingMagic.js size Clipping Magic düzenleyicisini kendi internet sitenize kolayca entegre etme olanağı sunmaktadır. Ön sayfadaki gibi tek bir resmi düzenleyebilirsiniz veya toplu kırpmada olduğu gibi bir grup resmi düzenleyebilirsiniz.

Entegrasyon Aşamaları

Öncelikle Hızlı Başlangıç bölümünü okuyun.

  1. Sunucu API'si kullanarak bir resim yükleyin.

  2. Akıllı Beyaz Etiket Düzenleyicisini aşağıda belirtildiği şekilde ekleyin.

  3. İnsan olan Operatörünüz resimleri kırparken kodunuz tarafından alınan geri çağırmaya karşılık verin. Mesela arka ucunuza daha yeni hazır hale gelen sonuçları indirme talimatı vererek.

Bu entegrasyon seçeneği size tam kontrol sağlamakla birlikte daha derin bir ön uç entegrasyonu gerektirmektedir. Daha basit bir entegrasyon seçeneği isterseniz, lütfen Barındırılmış Akıllı Düzenleyici seçeneğine göz atın.

Kurulum

ClippingMagic.js kullanmak için, dosyayı düzenleme yapmasına izin vermek istediğiniz sayfalara dahil etmekle ve bu sayfalarda başlatmakla başlayabilirsiniz:

<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>

Tek Bir Resim Düzenle

Düzenleyiciyi tek bir resim için şu şekilde görüntüleyebilirsiniz:

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

Geri çağırma işlevi ya result-generated ya da editor-exit ile çağrılabilir, ancak ikisiyle birlikte çağrılamaz. Her biri düzenleyicinin kapandığını göstermektedir.

Fabrika çıkış ayarlarını kullanmak için geçin veya useStickySettings için false kodunu girin.

DOM'u kaynak gösterdiğinden bu işlemi belge hazır etkinliğinin ardından yapın.


Sırayla Çok Sayıda Resim Düzenle

Düzenleyiciyi çok sayıda resim için şu şekilde görüntüleyebilirsiniz:

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

Kullanıcı her bir sonucu oluşturduğunda (='Bitti' üzerine bir kez tıkladığında) result-generated ile geri çağırma işlevi çağrılacaktır. Sonda düzenleyicinin kapandığını belirten, ya X'e tıklayarak ya da düzenlenecek resim kalmaması ile gerçekleşen bir editor-exit çağrısı olacaktır. Kullanıcının bir resmi atladığı durumda geri çağırma yapılamamaktadır.

Fabrika çıkış ayarlarını kullanmak için geçin veya useStickySettings için false kodunu girin.

DOM'u kaynak gösterdiğinden bu işlemi belge hazır etkinliğinin ardından yapın.


Geri Arama function(opts)

Bu edit işlevi bir callback işlevini parametre olarak almaktadır. Bu geri çağırma size kullanıcı eylemlerine yanıt verme ve resim düzenlemenin ilerleyişi hakkında arka uç sunucusuna bildirimde bulunma imkanı vermektedir.

Geri çağırma işareti şöyledir: function(opts) ve geri dönen herhangi bir özel durum veya değer göz ardı edilmektedir. opts parametresi bir PlainObject içermektedir:

event

Az önce ne olduğunu belirten metin, aşağıdaki tabloya bakınız.

image İsteğe bağlı. Bir Resim JSON Nesnesi (yalnızca kimlik ve parola dahildir).
error İsteğe bağlı. Bir Hatalı JSON Nesnesi.
OlayResim var mı?Hata var mı?Anlamı
result-generatedEvetHayır Kullanıcı 'Bitti' butonunu tıkladı, bir sonuç oluşturuldu ve sonuç arka uç API'si kullanılarak hemen indirmeye hazır. Düzenleyici tek resim modunda kapatıldı.
editor-exitHayırHayır Kullanıcı sağ üst köşede yer alan kırmızı x'e basarak düzenleyiciyi kapattı veya kullanıcının çoklu resim modunda düzenleme yapacağı resim kalmadı. Düzenleyici kapatıldı.
errorHayırEvet Hata oluştu. Daha fazla bilgi için error değerini inceleyin. Düzenleyici kapatıldı.

Düzenleyici kapatılır kapatılmaz edit() tekrar çağırabilirsiniz (bundan önce yapılan çağrılar özel bir duruma neden olur).

Örnek geri çağırma çağrısı

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

İşlev Tanımlamaları

ClippingMagic.initialize(opts) -> array_of_missing_features

initialize işlevi başlatma ayarlarını yapan anahtar/değer çiftlerini içeren bir PlainObject alır:

apiId
Gerekli
API Kimliğiniz.

İşlev size mevcut tarayıcıda eksik olan özellikleri belirten dizeleri olan bir JavaScript dizisi geri döndürür. Eğer bu dizi boşsa siz edit işlevini çağırabilirsiniz.

ClippingMagic.edit(opts, callback)

Bu edit işlevi şu parametreleri almaktadır:

opts

Gereklidir. Başlatma ayarlarını yapan anahtar/değer çiftleri içeren bir PlainObject:

image

İsteğe bağlı. Bir Resim JSON Nesnesi (yalnızca kimlik ve parola gereklidir).

images

İsteğe bağlı. Bir Resim JSON Nesnesi Dizisi (yalnızca kimlik ve parola gereklidir).

useStickySettings

İsteğe bağlı. Boolea değeri, trueAPI kullanıcısının'yapışkan ayarlarının kullanılacağı false veya atlanmış fabrika ayarlarını kullanılacağı manasına gelmektedir.

Bu size temel kırpma ayarlarını bir kez yapıp bu ayarları daha sonra düzenlemesini yapacağınız tüm resimlere uygulama imkanı sunmaktadır.

Read about how to configure the sticky settings

API üzerinden Ön Kırpma özelliği kullanılamıyor ancak Resim Boyutu Limitlerini API yükleme çağrısında ayarlayabilirsiniz.

locale

İsteğe bağlı. Düzenleyici için kullanılacak görüntüleme dili. Eğer atlanırsa varsayılan İngilizce dili olacaktır. Geçerli değerler:

KodGörüntüleme Dili
en-US English (İngilizce)
de-DE Deutsch (Almanca)
es-ES Español (İspanyolca)
fr-FR Français (Fransızca)
hi-IN हिन्दी (Hintçe)
id-ID Indonesia (Endonezce)
it-IT Italiano (İtalyanca)
ja-JP 日本語 (Japonca)
ko-KR 한국어 (Korece)
pl-PL Polski (Lehçe)
pt-BR Português (Portekizce)
ru-RU Русский (Rusça)
th-TH ไทย (Tayca)
tr-TR Türkçe
vi-VN Tiếng Việt (Vietnamca)
zh-Hans-CN 简体中文 (Çince)
zh-Hant-TW 繁體中文 (Çince)
callback

Gereklidir. Detaylar için yukarıdaki Geri Çağırma bölümüne bakınız.

Bu yöntem bir değer döndürmemektedir. Eğer bu yöntemi çağırmadan önce initialize çağrılmadıysa veya eğer initialize boş olmayan bir dizi döndürdü ise veya bir düzenleyici penceresi zaten açıksa o zaman özel durum oluşturulur.