बेहतर कस्टमाइज़ेशन

Blockly की मदद से, Blockly की क्लास को बदलकर कुछ सुविधाओं को पसंद के मुताबिक बनाया जा सकता है.

बदली जा सकने वाली क्लास

इन Blockly क्लास को बदला जा सकता है:

Blockly क्लास	इंटरफ़ेस	रजिस्ट्री टाइप का नाम
Blockly.dragging.Dragger	Blockly.IDragger	blockDragger
Blockly.ConnectionChecker	Blockly.IConnectionChecker	connectionChecker
Blockly.InsertionMarkerPreviewer	Blockly.IConnectionPreviewer	connectionPreviewer
Blockly.HorizontalFlyout	Blockly.IFlyout	flyoutsHorizontalToolbox
Blockly.VerticalFlyout	Blockly.IFlyout	flyoutsVerticalToolbox
Blockly.MetricsManager	Blockly.IMetricsManager	metricsManager
Blockly.Toolbox	Blockly.IToolbox	toolbox
Blockly.VariableMap	Blockly.IVariableMap	variableMap
Blockly.VariableModel	Blockly.IVariableModel	--

रेंडरर को बदलने के तरीके के बारे में जानने के लिए, कस्टम रेंडरर बनाना लेख पढ़ें.

बदलाव के लिए क्लास बनाना

बदलाव वाली क्लास बनाने के लिए, उससे जुड़े इंटरफ़ेस में फ़ंक्शन लागू करें. इन सभी फ़ंक्शन को नई क्लास में लागू किया जा सकता है. इसके अलावा, Blockly क्लास को एक्सटेंड करके, सिर्फ़ उन फ़ंक्शन को बदला जा सकता है जिनमें आपको बदलाव करना है. सिर्फ़ एक शर्त है कि आपको (या बेस क्लास को) इंटरफ़ेस में मौजूद सभी फ़ंक्शन लागू करने होंगे. साथ ही, इंटरफ़ेस पर टिप्पणियों में बताई गई सभी शर्तों का पालन करना होगा.

टाइप चेकर को यह बताने के लिए कि आपने किसी इंटरफ़ेस को लागू किया है, अपनी क्लास को @implements {InterfaceName} JSDoc टैग (JavaScript में) या implements कीवर्ड (TypeScript में) के साथ एनोटेट करें.

Blockly को अपनी बदली गई क्लास के बारे में बताएं

Blockly को अपनी बदली गई क्लास के बारे में बताने के दो तरीके हैं: इसे इसके टाइप की डिफ़ॉल्ट क्लास के तौर पर रजिस्टर करें (सुझाया गया) या plugins कॉन्फ़िगरेशन विकल्प का इस्तेमाल करके इसे इंजेक्ट करें.

बदली गई क्लास को डिफ़ॉल्ट क्लास के तौर पर रजिस्टर करना

Blockly को अपने रिप्लेसमेंट क्लास के बारे में बताने का सबसे अच्छा तरीका यह है कि उसे उसके टाइप के लिए डिफ़ॉल्ट के तौर पर रजिस्टर किया जाए. इसके लिए, Blockly.registry.register को कॉल करें. इसके लिए, Blockly.registry.DEFAULT नाम का इस्तेमाल करें और opt_allowOverrides पैरामीटर को true पर सेट करें.

Blockly.registry.register(
  Blockly.registry.Type.VARIABLE_MODEL,
  Blockly.registry.DEFAULT,
  CustomVariableModel,
  true,
);

बदली गई क्लास को इंजेक्ट करना

plugins configuration option का इस्तेमाल करके, बदली गई क्लास भी डाली जा सकती हैं. यह एक ऐसा ऑब्जेक्ट है जो रजिस्ट्री टाइप के नामों को प्रॉपर्टी के नाम के तौर पर इस्तेमाल करता है. साथ ही, रजिस्टर किए गए नामों या बदलने वाली क्लास को प्रॉपर्टी की वैल्यू के तौर पर इस्तेमाल करता है.

(plugins प्रॉपर्टी के नाम के बावजूद, आपकी क्लास को npm के ज़रिए पैकेज और डिस्ट्रिब्यूट करने की ज़रूरत नहीं है. जैसे, Blockly को एक्सटेंड करने के लिए इस्तेमाल किए जाने वाले प्लगिन.)

अपनी बदली गई क्लास को Blockly.inject पर पास करें:

Blockly.inject('blocklyDiv', {
  plugins: {
    'metricsManager': CustomMetricsManagerClass
  }
}

इसके अलावा, Blockly.registry.register का इस्तेमाल करके अपनी क्लास रजिस्टर करें और रजिस्टर किए गए नाम को Blockly.inject पर पास करें. अगर आपने कॉन्फ़िगरेशन के विकल्पों को सिर्फ़ JSON के तौर पर सेव किया है, तो यह तरीका आपके काम आ सकता है.

Blockly.registry.register(Blockly.registry.Type.METRICS_MANAGER, 'YOUR_NAME', CustomMetricsManagerClass);

Blockly.inject('blocklyDiv', {
  plugins: {
    'metricsManager': 'YOUR_NAME'
  }
}