← All changes | src/block/block.js +352 -79 0.5 → 0.9.61 View file →

		@@ -10,9 +10,8 @@
10	10	import './editor.scss';
11	11	import icon from './icon';
12	12	//import { ENTER } from '@wordpress/keycodes';
13	13	const { ENTER } = wp.keycodes;
14		-
15	14	const { __ } = wp.i18n; // Import __() from wp.i18n
16	15	const { Component } = wp.element;
17	16
18	17	const { registerBlockType } = wp.blocks; // Import registerBlockType() from wp.blocks
		@@ -26,10 +25,14 @@
26	25	PanelBody,
27	26	ToggleControl,
28	27	CheckboxControl,
29	28	RangeControl,
	29	+ TextControl,
	30	+ Notice,
30	31	} = wp.components;
31	32
	33	+const { withSelect } = wp.data;
	34	+
32	35	const {
33	36	getDefaultBlockName,
34	37	createBlock,
35	38	} = wp.blocks;
		@@ -39,21 +42,151 @@
39	42	const CODOC_URL = OPTIONS.codoc_url;
40	43	const CODOC_USER_CODE = OPTIONS.codoc_usercode;
41	44	const CODOC_PLUGIN_VERSION = OPTIONS.codoc_plugin_version;
42	45	const CODOC_ENTRIES_CLASS = 'codoc-entries';
	46	+const CODOC_ACCOUNT_IS_PRO = OPTIONS.codoc_account_is_pro;
	47	+const CODOC_CURRENCY_CODE = OPTIONS.codoc_currency_code;
	48	+const CODOC_CURRENCY_DECIMAL_PLACES = OPTIONS.codoc_currency_decimal_places;
43	49
44		-import Cookies from 'universal-cookie';
45		-const cookies = new Cookies();
	50	+//import Cookies from 'universal-cookie';
	51	+//const cookies = new Cookies();
46	52
	53	+const CODOC_MAX_LENGTHS = OPTIONS.codoc_max_lengths || {};
	54	+
	55	+// エディタで前回使った設定を localStorage に保存し、新規ブロックの初期値に使う
	56	+// (優先順位: 設定画面の Block Default Values -> 前回値 -> 固定値)
	57	+const CODOC_LAST_USED_KEY = 'codoc_block_last_used';
	58	+const CODOC_LAST_USED_ATTRS = ['showPrice','price','limited','limitedCount','affiliateMode','affiliateRate','showSupport','showPaywalledSupport','showPayWithoutAccountButton','statusLimited','subscriptions'];
	59	+function loadLastUsedAttributes() {
	60	+ try {
	61	+ const parsed = JSON.parse(window.localStorage.getItem(CODOC_LAST_USED_KEY) || 'null');
	62	+ return (parsed && typeof parsed === 'object') ? parsed : {};
	63	+ } catch (e) {
	64	+ return {};
	65	+ }
	66	+}
	67	+function saveLastUsedAttributes(attributes) {
	68	+ try {
	69	+ const saved = {};
	70	+ CODOC_LAST_USED_ATTRS.forEach((key) => {
	71	+ if (attributes[key] !== undefined && attributes[key] !== null) {
	72	+ saved[key] = attributes[key];
	73	+ }
	74	+ });
	75	+ window.localStorage.setItem(CODOC_LAST_USED_KEY, JSON.stringify(saved));
	76	+ } catch (e) {
	77	+ // localStorage が使えない環境では何もしない
	78	+ }
	79	+}
	80	+
	81	+// codoc ブロックの直前/直後で本文を分割
	82	+function splitCodocContent(content) {
	83	+ const blockRegex = /<!--\s*wp:codoc\/codoc-block[\s\S]*?<!--\s*\/wp:codoc\/codoc-block\s*-->/;
	84	+ const splited = (content || '').split(blockRegex);
	85	+ return {
	86	+ bodyFree: splited[0] || '',
	87	+ bodyPaywalled: splited.slice(1).join('') || '',
	88	+ };
	89	+}
	90	+
	91	+function buildLengthErrors(title, bodyFree, bodyPaywalled) {
	92	+ const errors = [];
	93	+ const total = bodyFree.length + bodyPaywalled.length;
	94	+ if (CODOC_MAX_LENGTHS.title && title.length > CODOC_MAX_LENGTHS.title) {
	95	+ errors.push(__('Title exceeds the maximum length of', 'codoc') + ' ' + CODOC_MAX_LENGTHS.title + ' (' + title.length + ')');
	96	+ }
	97	+ if (CODOC_MAX_LENGTHS.body_free && bodyFree.length > CODOC_MAX_LENGTHS.body_free) {
	98	+ errors.push(__('Free area exceeds the maximum length of', 'codoc') + ' ' + CODOC_MAX_LENGTHS.body_free + ' (' + bodyFree.length + ')');
	99	+ }
	100	+ if (CODOC_MAX_LENGTHS.body_paywalled && bodyPaywalled.length > CODOC_MAX_LENGTHS.body_paywalled) {
	101	+ errors.push(__('Paid area exceeds the maximum length of', 'codoc') + ' ' + CODOC_MAX_LENGTHS.body_paywalled + ' (' + bodyPaywalled.length + ')');
	102	+ }
	103	+ if (CODOC_MAX_LENGTHS.body && total > CODOC_MAX_LENGTHS.body) {
	104	+ errors.push(__('Total body exceeds the maximum length of', 'codoc') + ' ' + CODOC_MAX_LENGTHS.body + ' (' + total + ')');
	105	+ }
	106	+ return errors;
	107	+}
	108	+
	109	+// codoc ブロック選択時の Inspector サイドバーに警告を表示する
	110	+const CodocLengthNotices = withSelect((select) => {
	111	+ const editor = select('core/editor');
	112	+ return {
	113	+ postTitle: editor ? editor.getEditedPostAttribute('title') : '',
	114	+ postContent: editor ? editor.getEditedPostAttribute('content') : '',
	115	+ };
	116	+})(({ postTitle, postContent }) => {
	117	+ const { bodyFree, bodyPaywalled } = splitCodocContent(postContent);
	118	+ const errors = buildLengthErrors(postTitle || '', bodyFree, bodyPaywalled);
	119	+ if (errors.length === 0) {
	120	+ return null;
	121	+ }
	122	+ return (
	123	+ <Notice status="error" isDismissible={ false }>
	124	+ <strong>{ __('codoc length limit exceeded:', 'codoc') }</strong>
	125	+ <ul style={{ marginTop: '0.5em', marginBottom: 0 }}>
	126	+ { errors.map((e, i) => <li key={i}>{ e }</li>) }
	127	+ </ul>
	128	+ </Notice>
	129	+ );
	130	+});
	131	+
	132	+// codoc ブロックを選択していなくても、本文中に存在すればエディタ上部に通知を表示する
	133	+(function() {
	134	+ if (!wp.data || !wp.data.subscribe) {
	135	+ return;
	136	+ }
	137	+ const NOTICE_ID = 'codoc-length-limit';
	138	+ let lastState = '';
	139	+ wp.data.subscribe(function() {
	140	+ const editor = wp.data.select('core/editor');
	141	+ const blockEditor = wp.data.select('core/block-editor') || wp.data.select('core/editor');
	142	+ const noticesDispatch = wp.data.dispatch('core/notices');
	143	+ if (!editor || !blockEditor || !noticesDispatch) {
	144	+ return;
	145	+ }
	146	+ const blocks = blockEditor.getBlocks ? blockEditor.getBlocks() : [];
	147	+ const hasCodocBlock = blocks.some(function(b) { return b && b.name === 'codoc/codoc-block'; });
	148	+ if (!hasCodocBlock) {
	149	+ if (lastState !== '') {
	150	+ noticesDispatch.removeNotice(NOTICE_ID);
	151	+ lastState = '';
	152	+ }
	153	+ return;
	154	+ }
	155	+ const title = editor.getEditedPostAttribute('title') || '';
	156	+ const content = editor.getEditedPostAttribute('content') || '';
	157	+ const { bodyFree, bodyPaywalled } = splitCodocContent(content);
	158	+ const errors = buildLengthErrors(title, bodyFree, bodyPaywalled);
	159	+ const state = errors.join('||');
	160	+ if (state === lastState) {
	161	+ return;
	162	+ }
	163	+ lastState = state;
	164	+ noticesDispatch.removeNotice(NOTICE_ID);
	165	+ if (errors.length > 0) {
	166	+ noticesDispatch.createNotice(
	167	+ 'error',
	168	+ __('codoc length limit exceeded:', 'codoc') + ' ' + errors.join(' / '),
	169	+ { id: NOTICE_ID, isDismissible: false }
	170	+ );
	171	+ }
	172	+ });
	173	+})();
	174	+
47	175	class CodocControls extends Component {
48	176	constructor( props ) {
49	177	super( ...arguments );
50		-
51	178	this.subscriptionsFetched = [];
	179	+ this.subscriptionSearchTerm = '';
	180	+ this.state = {
	181	+ searchTerm: '',
	182	+ filteredSubscriptions: []
	183	+ };
52	184	this.fetchSubscriptions();
	185	+ this.handleSearchChange = this.handleSearchChange.bind(this);
53	186	}
54	187
55		- fetchSubscriptions() {
	188	+ fetchSubscriptions(searchTitle = '') {
56	189	const {
57	190	setAttributes,
58	191	attributes: {
59	192	fetching,
		@@ -66,8 +199,13 @@
66	199
67	200	setAttributes( { fetching: true } )
68	201	let url = CODOC_URL + '/api/v1/cms/' + CODOC_USER_CODE + '/subscriptions?without_token=1';
69	202
	203	+ // Add title parameter if search term exists
	204	+ if (searchTitle) {
	205	+ url += '&title=' + encodeURIComponent(searchTitle);
	206	+ }
	207	+
70	208	fetch(url)
71	209	.then( res => res.json() )
72	210	.then( res => {
73	211	let list = [];
		@@ -75,104 +213,173 @@
75	213	for ( var i = 0; i < res.subscriptions.length; i++ ) {
76	214	let info = {
77	215	value: res.subscriptions[i].code,
78	216	label: res.subscriptions[i].title,
	217	+ term: res.subscriptions[i].term,
	218	+ price: res.subscriptions[i].price,
	219	+ currency: res.subscriptions[i].currency
79	220	}
80	221	list[i] = info
81	222	}
82	223	}
83		- if (list.length) {
	224	+ if (list.length || searchTitle) {
84	225	this.subscriptionsFetched = list;
	226	+ this.setState({ filteredSubscriptions: list });
85	227	}
86	228	setAttributes( { fetching: false } )
87	229	})
88	230	}
89		-
	231	+
	232	+ handleSearchChange(value) {
	233	+ this.setState({ searchTerm: value });
	234	+
	235	+ // Debounce the API call
	236	+ clearTimeout(this.searchTimeout);
	237	+ this.searchTimeout = setTimeout(() => {
	238	+ this.fetchSubscriptions(value);
	239	+ }, 500);
	240	+ }
	241	+
90	242	getShowPriceHelp( checked ) {
91	243	return checked ?
92		- __( 'する' ) :
93		- __( 'しない' );
	244	+ __( 'Enable','codoc' ) :
	245	+ __( 'Disable','codoc' );
94	246	}
95	247	getShowSupportHelp( checked ) {
96	248	return checked ?
97		- __( '受け付ける' ) :
98		- __( '受け付けない' );
	249	+ __( 'Accept' ,'codoc') :
	250	+ __( 'Do not accept' ,'codoc');
99	251	}
100		-
	252	+ getShowPaywalledSupportHelp( checked ) {
	253	+ return checked ?
	254	+ __( 'The paid part will be hidden upon access, but will be displayed after tapping "Pay to Read". Viewers can freely specify the amount to purchase based on the content. Please note that there may be cases where it is not purchased.' ,'codoc') :
	255	+ __( ' ' );
	256	+ }
	257	+ getStatusLimitedHelp( checked ) {
	258	+ return checked ?
	259	+ __( 'Unlisted' ,'codoc') :
	260	+ __( 'Published' ,'codoc');
	261	+ }
	262	+ getShowPayWithoutAccountButtonHelp( checked ) {
	263	+ return checked ?
	264	+ __( 'Viewers can purchase without a codoc account.' ,'codoc') :
	265	+ __( 'Viewers must log in to codoc to purchase.' ,'codoc');
	266	+ }
	267	+
101	268	render() {
102	269	const {
103		- setAttributes,
	270	+ setAttributes: setBlockAttributes,
104	271	attributes: {
105	272	showPrice,
106	273	price,
107	274	limited,
108	275	limitedCount,
109		-
	276	+
110	277	affiliateMode,
111	278	affiliateRate,
112	279
113	280	showSupport,
114		-
	281	+ showPaywalledSupport,
	282	+ showPayWithoutAccountButton,
	283	+ statusLimited,
115	284	subscriptions,
116	285	}
117	286	} = this.props;
	287	+ // 設定変更のたびに前回値として保存
	288	+ const setAttributes = (attrs) => {
	289	+ setBlockAttributes(attrs);
	290	+ saveLastUsedAttributes(Object.assign({}, this.props.attributes, attrs));
	291	+ };
118	292
119	293	const toggleShowPrice = () => setAttributes( { showPrice: ! showPrice } );
120	294	const toggleLimited = () => setAttributes( { limited: ! limited } );
	295	+ const toggleShowPaywalledSupport = () => setAttributes( { showPaywalledSupport: ! showPaywalledSupport } );
	296	+ const toggleStatusLimited = () => setAttributes( { statusLimited: ! statusLimited } );
121	297	const toggleAffiliateMode = () => setAttributes( { affiliateMode: ! affiliateMode } );
122	298	const toggleShowSupport = () => setAttributes( { showSupport: ! showSupport } );
123		-
	299	+ const toggleShowPayWithoutAccountButton = () => setAttributes( { showPayWithoutAccountButton: ! showPayWithoutAccountButton } );
	300	+
124	301	const SubscriptionCheckBoxes = withState({
125		- checked_obj: Object.assign(new Object, subscriptions)
126		- })( ( { checked_obj , setState } ) => (
	302	+ checked_obj: Object.assign({}, subscriptions)
	303	+ })( ({ checked_obj, setState }) => (
	304	+ <div>
	305	+ {this.state.filteredSubscriptions.length === 0 ? (
	306	+ <p style={{ fontStyle: 'italic', color: '#666' }}>
	307	+ { this.state.searchTerm
	308	+ ? __('No plans found matching your search.','codoc')
	309	+ : __('No reader plans available.','codoc')
	310	+ }
	311	+ </p>
	312	+ ) : (
127	313	<ul>
128		- {
129		- this.subscriptionsFetched.map((v) => (
130		- <li><CheckboxControl
131		- className="check_items"
132		- label={v.label}
133		- checked={checked_obj[v.value]}
	314	+ {
	315	+ this.state.filteredSubscriptions.map((v) => {
	316	+ const isChecked = !!checked_obj[v.value];
	317	+ const checkedCount = Object.keys(checked_obj).length;
134	318
135		- onChange={ ( check ) => {
136		- check ? checked_obj[v.value] = true : delete checked_obj[v.value]
137		- setAttributes({subscriptions : checked_obj})
138		- setState({checked_obj})
139		- } }
140		- /></li>
141		- ) )
	319	+ return (
	320	+ <li key={v.value}>
	321	+ <CheckboxControl
	322	+ className="check_items"
	323	+ label={v.label}
	324	+ checked={isChecked}
	325	+ onChange={(check) => {
	326	+ // 追加する場合、5個以上は無効
	327	+ if (check && checkedCount >= 5) {
	328	+ return; // これ以上チェックできない
	329	+ }
	330	+
	331	+ const newChecked = { ...checked_obj };
	332	+
	333	+ if (check) {
	334	+ newChecked[v.value] = true;
	335	+ } else {
	336	+ delete newChecked[v.value];
	337	+ }
	338	+
	339	+ setAttributes({ subscriptions: newChecked });
	340	+ setState({ checked_obj: newChecked });
	341	+ }}
	342	+ />
	343	+ </li>
	344	+ );
	345	+ })
142	346	}
143	347	</ul>
	348	+ )}
	349	+ </div>
144	350	) )
145	351	const affiliateRateOptions = [
146		- { value: '0.0500', label:'販売価格の5%' },
147		- { value: '0.1000', label:'販売価格の10%' },
148		- { value: '0.1500', label:'販売価格の15%' },
149		- { value: '0.2000', label:'販売価格の20%' },
150		- { value: '0.2500', label:'販売価格の25%' },
151		- { value: '0.3000', label:'販売価格の30%' },
152		- { value: '0.3500', label:'販売価格の35%' },
153		- { value: '0.4000', label:'販売価格の40%' },
154		- { value: '0.4500', label:'販売価格の45%' },
155		- { value: '0.5000', label:'販売価格の50%' },
	352	+ { value: '0.0500', label:'5%' },
	353	+ { value: '0.1000', label:'10%' },
	354	+ { value: '0.1500', label:'15%' },
	355	+ { value: '0.2000', label:'20%' },
	356	+ { value: '0.2500', label:'25%' },
	357	+ { value: '0.3000', label:'30%' },
	358	+ { value: '0.3500', label:'35%' },
	359	+ { value: '0.4000', label:'40%' },
	360	+ { value: '0.4500', label:'45%' },
	361	+ { value: '0.5000', label:'50%' },
156	362	];
157	363
158	364	return(
159	365	<InspectorControls key="CodocControls">
160	366
	367	+ <CodocLengthNotices />
	368	+
161	369	<PanelBody>
162	370
163	371	<ToggleControl
164		- label={ __( '単体販売' ) }
	372	+ label={ __( 'individual sale','codoc' ) }
165	373	checked={ !! showPrice }
166	374	help={ this.getShowPriceHelp }
167	375	ref="showPrice"
168	376	onChange={ toggleShowPrice }
169	377	/>
170		-
	378	+
171	379	<div style={{ display: showPrice ? 'initial' : 'none' }}>
172		-
173	380	<RangeControl
174		- label={ __( '価格(円)' ) }
	381	+ label={ __('price','codoc') + ' ' + (CODOC_CURRENCY_DECIMAL_PLACES > 0 ? (price / 100).toFixed(CODOC_CURRENCY_DECIMAL_PLACES) : price) + ' ' + __(CODOC_CURRENCY_CODE) + __(showPaywalledSupport ? '【' + __('Displayed as the your suggested price','codoc') + '】' : '' ) }
175	382	value={ price }
176	383	initialPosition={ price }
177	384	onChange={ ( value ) => {
178	385	// do validate this
		@@ -178,13 +385,21 @@
178	385	// do validate this
179	386	setAttributes({ price: value });
180	387	}}
181	388	min="100"
182		- max="50000"
	389	+ max={ CODOC_ACCOUNT_IS_PRO == 1 ? 100000 : 50000 }
183	390	/><br />
184		-
	391	+
185	392	<ToggleControl
186		- label={ __( '数量限定販売' ) }
	393	+ label={ __( 'Pay-what-you-want','codoc' ) }
	394	+ checked={ !! showPaywalledSupport }
	395	+ help={ this.getShowPaywalledSupportHelp }
	396	+ onChange={ toggleShowPaywalledSupport }
	397	+ />
	398	+
	399	+ <div style={{ display: showPaywalledSupport ? 'none' : 'initial' }}>
	400	+ <ToggleControl
	401	+ label={ __( 'Limited quantity sale','codoc' ) }
187	402	checked={ !! limited }
188	403	onChange={ toggleLimited }
189	404	/>
190	405
		@@ -189,9 +404,9 @@
189	404	/>
190	405
191	406	<div style={{ display: limited ? 'initial' : 'none' }}>
192	407	<RangeControl
193		- label={ __( '限定数' ) }
	408	+ label={ __( 'Limited quantity','codoc' ) }
194	409	value={ limitedCount }
195	410	onChange={ ( value ) => {
196	411	// do validate this
197	412	setAttributes({ limitedCount: value });
		@@ -196,15 +411,15 @@
196	411	// do validate this
197	412	setAttributes({ limitedCount: value });
198	413	}}
199	414	initialPosition={ limitedCount }
200		- min="1"
	415	+ min="0"
201	416	max="100"
202	417	/><br />
203	418	</div>
204		-
	419	+
205	420	<ToggleControl
206		- label={ __( 'アフィリエイト' ) }
	421	+ label={ __( 'Affiliate','codoc' ) }
207	422	checked={ !! affiliateMode }
208	423	onChange={ toggleAffiliateMode }
209	424	/>
210	425
		@@ -209,30 +424,72 @@
209	424	/>
210	425
211	426	<div style={{ display: affiliateMode ? 'initial' : 'none' }}>
212	427	<SelectControl
213		- label={ __( '料率' ) }
214		- description={ __( '購入者を対象に指定した料率でアフィリエイトをオファーできます') }
	428	+ label={ __( 'Rate' , 'codoc') }
	429	+ description={ __( 'You can offer affiliate marketing at a specified rate for purchasers.', 'codoc') }
215	430	options={ affiliateRateOptions }
216	431	value={ affiliateRate }
217	432	onChange={ ( value ) => {
218	433	setAttributes( { affiliateRate: value } );
219		- }}/><br />
	434	+ }}/><br />
220	435	</div>
221		-
	436	+
222	437	</div>
223		-
	438	+ </div>
	439	+
	440	+ <div style={{ display: showPaywalledSupport ? 'none' : 'initial' }}>
224	441	<ToggleControl
225		- label={ __( 'サポート' ) }
	442	+ label={ __( 'Tipping', 'codoc') }
226	443	checked={ !! showSupport }
227	444	value="1"
228	445	onChange={ toggleShowSupport }
229	446	help={ this.getShowSupportHelp }
230	447	/>
	448	+ </div>
231	449
232		- <label>サブスクリプション</label>
	450	+ <div style={{ display: 'initial' }}>
	451	+ <ToggleControl
	452	+ label={ __( 'Guest purchase', 'codoc') }
	453	+ checked={ !! showPayWithoutAccountButton }
	454	+ value="1"
	455	+ onChange={ toggleShowPayWithoutAccountButton }
	456	+ help={ this.getShowPayWithoutAccountButtonHelp }
	457	+ />
	458	+ </div>
	459	+
	460	+ <div style={{ display: 'initial' }}>
	461	+ <ToggleControl
	462	+ label={ __( 'Unlisted','codoc' ) }
	463	+ checked={ !! statusLimited }
	464	+ value="1"
	465	+ onChange={ toggleStatusLimited }
	466	+ help={ this.getStatusLimitedHelp }
	467	+ />
	468	+ </div>
	469	+
	470	+ <div class="codoc-subscription-title">
	471	+ <label>
	472	+ { __('Reader Plans','codoc') }
	473	+ </label>
	474	+ <a
	475	+ href={ CODOC_URL + '/me/subscriptions'}
	476	+ target="_blank" class="codoc-subscription-add"
	477	+ >
	478	+ { __('Add','codoc') }
	479	+ </a>
	480	+ </div>
	481	+
	482	+ <TextControl
	483	+ label={ __('Search Plans','codoc') }
	484	+ value={ this.state.searchTerm }
	485	+ onChange={ this.handleSearchChange }
	486	+ placeholder={ __('Enter title to search...','codoc') }
	487	+ />
	488	+
233	489	<SubscriptionCheckBoxes />
234	490
	491	+
235	492	</PanelBody>
236	493	</InspectorControls>
237	494	);
238	495	}
		@@ -241,22 +498,28 @@
241	498	class EditBlockContent extends Component {
242	499	constructor() {
243	500	super( ...arguments );
244	501	// デフォルト値
	502	+ const bd = OPTIONS.codoc_block_defaults || {};
	503	+ const lu = loadLastUsedAttributes();
	504	+ const d = (key, fallback) => bd.hasOwnProperty(key) ? bd[key] : (lu.hasOwnProperty(key) ? lu[key] : fallback);
245	505	this.props.setAttributes({ version: CODOC_PLUGIN_VERSION });
246		- this.props.setAttributes({ showPrice: this.props.attributes.showPrice == null ? true : this.props.attributes.showPrice });
247		- this.props.setAttributes({ price: this.props.attributes.price == null ? 100 : this.props.attributes.price });
248		- this.props.setAttributes({ limited: this.props.attributes.limited == null ? false : this.props.attributes.limited });
249		- this.props.setAttributes({ limitedCount: this.props.attributes.limitedCount == null ? 10 : this.props.attributes.limitedCount });
250		- this.props.setAttributes({ affiliateMode: this.props.attributes.affiliateMode == null ? false : this.props.attributes.affiliateMode });
251		- this.props.setAttributes({ affiliateRate: this.props.attributes.affiliateRate == null ? '0.0500' : this.props.attributes.affiliateRate });
252		- this.props.setAttributes({ showSupport: this.props.attributes.showSupport == null ? false : this.props.attributes.showSupport });
253		- this.props.setAttributes({ subscriptions: this.props.attributes.subscriptions == null ? {} : this.props.attributes.subscriptions });
	506	+ this.props.setAttributes({ showPrice: this.props.attributes.showPrice == null ? d('showPrice', true) : this.props.attributes.showPrice });
	507	+ this.props.setAttributes({ price: this.props.attributes.price == null ? d('price', 500) : this.props.attributes.price });
	508	+ this.props.setAttributes({ limited: this.props.attributes.limited == null ? d('limited', false) : this.props.attributes.limited });
	509	+ this.props.setAttributes({ limitedCount: this.props.attributes.limitedCount == null ? d('limitedCount', 10) : this.props.attributes.limitedCount });
	510	+ this.props.setAttributes({ affiliateMode: this.props.attributes.affiliateMode == null ? d('affiliateMode', false) : this.props.attributes.affiliateMode });
	511	+ this.props.setAttributes({ affiliateRate: this.props.attributes.affiliateRate == null ? d('affiliateRate', '0.0500') : this.props.attributes.affiliateRate });
	512	+ this.props.setAttributes({ showSupport: this.props.attributes.showSupport == null ? d('showSupport', false) : this.props.attributes.showSupport });
	513	+ this.props.setAttributes({ showPaywalledSupport: this.props.attributes.showPaywalledSupport == null ? d('showPaywalledSupport', false) : this.props.attributes.showPaywalledSupport });
	514	+ this.props.setAttributes({ statusLimited: this.props.attributes.statusLimited == null ? d('statusLimited', false) : this.props.attributes.statusLimited });
	515	+ this.props.setAttributes({ showPayWithoutAccountButton: this.props.attributes.showPayWithoutAccountButton == null ? d('showPayWithoutAccountButton', true) : this.props.attributes.showPayWithoutAccountButton });
	516	+ this.props.setAttributes({ subscriptions: this.props.attributes.subscriptions == null ? d('subscriptions', {}) : this.props.attributes.subscriptions });
254	517
255	518	this.onChangeInput = this.onChangeInput.bind( this );
256	519	this.onKeyDown = this.onKeyDown.bind( this );
257	520	this.state = {
258		- defaultText: __( 'この続きをみるには' ),
	521	+ defaultText: __( 'To continue reading, ...','codoc' ),
259	522	};
260	523	}
261	524	onChangeInput( event ) {
262	525	this.setState( {
		@@ -272,9 +535,9 @@
272	535	if ( keyCode === ENTER ) {
273	536	insertBlocksAfter( [ createBlock( getDefaultBlockName() ) ] );
274	537	}
275	538	}
276		-
	539	+
277	540	render() {
278	541	const {
279	542	attributes: {
280	543	customText,
		@@ -306,10 +569,10 @@
306	569	};
307	570
308	571
309	572	registerBlockType( 'codoc/codoc-block', {
310		- title: __( 'codoc' ),
311		- description: __( 'このブロックから下のブロックは認証されたcodocユーザーのみが閲覧できる有料エリアとなります。' ),
	573	+ title: __( 'codoc' ,'codoc'),
	574	+ description: __( 'The area from this block down is a paid area that only authenticated codoc users can view.','codoc' ),
312	575	icon,
313	576	category: 'layout',
314	577	supports: {
315	578	customClassName: false,
		@@ -317,11 +580,11 @@
317	580	html: false,
318	581	multiple: false,
319	582	},
320	583	keywords: [
321		- __( 'codoc Block' ),
322		- __( 'plugin for codoc' ),
323		- __( 'codoc-block' ),
	584	+ __( 'codoc Block' ,'codoc'),
	585	+ __( 'plugin for codoc' ,'codoc'),
	586	+ __( 'codoc-block' ,'codoc'),
324	587	],
325	588	attributes: {
326	589	showPrice: {
327	590	type: 'boolean',
		@@ -350,8 +613,20 @@
350	613	showSupport: {
351	614	type: 'boolean',
352	615	default: null,
353	616	},
	617	+ showPaywalledSupport: {
	618	+ type: 'boolean',
	619	+ default: null,
	620	+ },
	621	+ statusLimited: {
	622	+ type: 'boolean',
	623	+ default: null,
	624	+ },
	625	+ showPayWithoutAccountButton: {
	626	+ type: 'boolean',
	627	+ default: null,
	628	+ },
354	629	subscriptions: {
355	630	type: 'object',
356	631	default: null,
357	632	},
		@@ -363,11 +638,11 @@
363	638	type: 'string',
364	639	default: null,
365	640	},
366	641	},
367		-
	642	+
368	643	edit: EditBlockContent,
369		-
	644	+
370	645	save: function( props ) {
371	646	const {
372	647	setAttributes,
373	648	attributes: {
		@@ -374,10 +649,9 @@
374	649	customText,
375	650	}
376	651	} = props;
377	652	return ( // return if link behavior normal
378		- <div>
379		- <span
	653	+ <div
380	654	data-id='codoc-tag'
381	655	className={ CODOC_ENTRIES_CLASS }
382	656	>
383	657	{ customText && !! customText.length && (
		@@ -384,9 +658,8 @@
384	658	<RichText.Content
385	659	value={ customText }
386	660	/>
387	661	)}
388		- </span>
389	662	</div>
390	663	)
391	664	},
392	665	} );