Kezdőlap Felfedezés Súgó
Bejelentkezés
javascript
/
three.js
tükrözi: https://github.com/tazdij/three.js.git
2
0
Másolás 0
Fájlok Problémák 0 Wiki
Forráskód Böngészése

Documentation : Arabic update (#27118)

* started updating arabic documentation

starting translating the Creating a scene page and planing to update all and added a class in css to properly display the code file name in RTL

* Update Creating-a-scene.html
Omar Mohamed Yousef 1 éve
szülő
4ee777e6b8
commit
526886f343
2 módosított fájl, 23 hozzáadás és 73 törlés
Egyesített Nézet Diff Statisztika Mutatása
  1. 21 72
      docs/manual/ar/introduction/Creating-a-scene.html
  2. 2 1
      docs/page.css

+ 21 - 72
docs/manual/ar/introduction/Creating-a-scene.html
Fájl Megtekintése 

@@ -6,47 +6,25 @@
 
 		<script src="page.js"></script>
 
 		<script src="page.js"></script>
 
 		<link type="text/css" rel="stylesheet" href="page.css" />
 
 		<link type="text/css" rel="stylesheet" href="page.css" />
 
 	</head>
 
 	</head>
 
+
 
 	<body class="rtl">
 
 	<body class="rtl">
 
-		<h1>إنشاء مشهد（[name]）</h1>
 
+		<h1>إنشاء مشهد（[name])</h1>
 
 
 
-		<p>الهدف من هذا القسم هو تقديم لمحة وجيزة عن كيفية عمل المكتبة. سنبدأ بتحضير مشهد يتمثل في مكعب ثلاثي الأبعاد .الصفحة مرفوقة بمثال أسفلها في حالة واجهتك بعض المشاكل وإحتجت إلى المساعدة.</p>
 
+		<p>الهدف من هذا القسم هو تقديم مقدمة مختصرة عن three.js. سنبدأ بإعداد مشهد باستخدام مكعب دوار. متوفر مثال عملي جاهز في أسفل الصفحة في حالة واجهتك مشكلة و علقت واحتجت إلى المساعدة.</p>
 
 
 
-		<h2>قبل أن نبدأ</h2>
 
+		<h2>قبل أن تبدأ</h2>
 
 
 
-		<p>قبل أن تتمكن من استخدام three.js ، تحتاج إلى مكان لعرضه. احفظ HTML التالي في ملف على جهاز الكمبيوتر الخاص بك وافتحه في المتصفح الخاص بك.</p>
 
+		<p>إذا لم تقم بذلك بعد، فانتقل إلى دليل [link:#manual/ar/introduction/Installation تثبيت]. سنفترض أنك قمت بالفعل بإعداد نفس هيكل المشروع (يشمل ذلك Index.html وmain.js)، وقمت بتثبيت three.js، وأنك تقوم بستخدم أداة بناء ، أو تستخدم خادم محلي مع CDN و import maps.</p>
 
 
 
-		<code>
 
-		&lt;!DOCTYPE html&gt;
 
-		&lt;html&gt;
 
-			&lt;head&gt;
 
-				&lt;meta charset="utf-8"&gt;
 
-				&lt;title&gt;My first three.js app&lt;/title&gt;
 
-				&lt;style&gt;
 
-					body { margin: 0; }
 
-				&lt;/style&gt;
 
-			&lt;/head&gt;
 
-			&lt;body&gt;
 
-				&lt;script type="module"&gt;
 
-					import * as THREE from 'https://unpkg.com/three/build/three.module.js';
 
-
 
-					// Our Javascript will go here.
 
-				&lt;/script&gt;
 
-			&lt;/body&gt;
 
-		&lt;/html&gt;
 
-		</code>
 
-
 
-		<p>
 
-			هذا كل شيء. بقية الأوامر البرمجية ستكون محتوات في وسم &lt;script&gt; الفارغ حاليا.
 
-		</p>
 
+		<h2>إنشاء المشهد</h2>
 
 
 
-		<h2>إنشاء مشهد</h2>
 
+		<p>لكي نتمكن فعلًا من عرض أي شيء باستخدام three.js، نحتاج إلى ثلاثة عناصر: المشهد (scene) والكاميرا (camera) والعارض (renderer)، بحيث يمكننا عرض المشهد بواسطة الكاميرا.</p>
 
 
 
-		<p>
 
-			لنتمكن من إظهار أي شيء بإستهمال three.js، نحتاج ثلاثة عناصر أساسية: المسرح (Scene)، الكاميرا (Camera)، و العارض
 
-			(Renderer).
 
-		</p>
 
+		<p class="RtlTitle"><i >main.js —</i></p>
 
 
 
 		<code>
 
 		<code>
 
+		import * as THREE from 'three';
 
+
 
 		const scene = new THREE.Scene();
 
 		const scene = new THREE.Scene();
 
 		const camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 0.1, 1000 );
 
 		const camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 0.1, 1000 );
 
 
 
@@ -55,49 +33,20 @@
 
 		document.body.appendChild( renderer.domElement );
 
 		document.body.appendChild( renderer.domElement );
 
 		</code>
 
 		</code>
 
 
 
-		<p>
 
-			لنتمهل لحظة من أجل توضيح ما يحصل هنا. لقد قمنا بتحضير كل من المسرح، الكاميرا، و العارض.
 
-		</p>
 
+		<p>لنتمهل لحظة من أجل توضيح ما يحصل هنا. لقد قمنا بتحضير كل من المسرح، الكاميرا، و العارض.</p>
 
 
 
-		<p>
 
-			توفر مكتبة three.js العديد من الخيارات بخصوص نوع الكاميرا. للوقت الراهن، سنستعمل
 
-			<strong>PerspectiveCamera</strong>.
 
-		</p>
 
+		<p>توفر مكتبة three.js العديد من الخيارات بخصوص نوع الكاميرا. للوقت الراهن، سنستعمل<strong>PerspectiveCamera</strong>.</p>
 
 
 
-		<p>
 
-			أول ميزة هي <strong>مجال الرؤية - Field of view</strong>. يمكن التعبير عنها بإستعمال إختصارها كالأتي FOV. هذه
 
-			القيمة تمثل مجال
 
-			المشاهدة المتاح في أي وقت
 
-			من العرض. وحده قيسها هي الدرجة (degrees)
 
-		</p>
 
-
 
-		<p>
 
-			القيمة الثانية هي <strong>نسبة العرض إلى الارتفاع - aspect ratio</strong>. من المستحسن إستعمال نتيجة قسمة عرض و
 
-			طول العنصر الحاوي، و إلا ستحصل على تجربة مماثلة
 
-			لمشاهدة فيلم قديم على تلفاز عريض حيث ستكون الصورة متغيرة.
 
-		</p>
 
-
 
-		<p>
 
-			القيمتين المتبقيتين هما <strong>أقرب</strong> و <strong>أبعد</strong> سطح فاصل. نقصد بدلك أن أي عنصر في المشهد
 
-			أبعد من السطح الفاصل البعيد بالنسبة
 
-			للكاميرا أو أقرب من السطح الفاصل القريب لن يتم عرضه.
 
-			أنت لست مطالب بالقلق حيال هذا، و لكن من الممكن أن تريد إستعمال قيم أخرى من أجل الحصول على أداء أفضل.
 
-		</p>
 
-
 
-		<p>
 
-			نصل الأن إلى العارض. هنا أين يكمن السحر. بالإضافة لإستعمال WebGLRenderer، المكتبة تتكفل بتمكين بعض المتصفحات
 
-			القديمة التي لا
 
-			تدعم WebGL لسبب ما من الخصائص المفقودة.
 
-		</p>
 
-
 
-		<p>
 
-			إلي جانب إنشاء نموذج من مكون عارض، نحن مطالبون بتوفير قياس المشهد المراد عرضه. إنها لا فكرة جيدة أن نستعمل عرض و
 
-			طول المنطقة التي نريد ملأها في الصفحة. في هذه الحالة إستعملنا عرض و طول نافدة المتصفح. بالنسبة لتطبيقات عالية
 
-			الأداء، يمكنك توفير قيم أقل مثل <strong>window.innerWidth/2</strong> و <strong>window.innerHeight/2</strong>،
 
-			التي
 
-			ستجعل المشهد يعرض أسرع بنصف المدة السابقة.
 
-		</p>
 
+		<p>أول ميزة هي <strong>مجال الرؤية - Field of view</strong>. يمكن التعبير عنها بإستعمال إختصارها كالأتي FOV. هذه القيمة تمثل مجال المشاهدة المتاح في أي وقت من العرض. وحده قيسها هي الدرجة (degrees)</p>
 
+		
+		<p>القيمة الثانية هي <strong>نسبة العرض إلى الارتفاع - aspect ratio</strong>. من المستحسن إستعمال نتيجة قسمة عرض وطول العنصر الحاوي، و إلا ستحصل على تجربة مماثلة لمشاهدة فيلم قديم على تلفاز عريض حيث ستكون الصورة متغيرة.</p>
 
 
 
+		<p>القيمتين المتبقيتين هما <strong>أقرب</strong> و <strong>أبعد</strong> سطح فاصل. نقصد بدلك أن أي عنصر في المشهدأبعد من السطح الفاصل البعيد بالنسبة للكاميرا أو أقرب من السطح الفاصل القريب لن يتم عرضه.أنت لست مطالب بالقلق حيال هذا، و لكن من الممكن أن تريد إستعمال قيم أخرى من أجل الحصول على أداء أفضل.</p>
 
+			
+		<p>نصل الأن إلى العارض. هنا أين يكمن السحر. بالإضافة لإستعمال WebGLRenderer، المكتبة تتكفل بتمكين بعض المتصفحات القديمة التي لا تدعم WebGL لسبب ما من الخصائص المفقودة.</p>
 
+		
+		<p>إلي جانب إنشاء نموذج من مكون عارض، نحن مطالبون بتوفير قياس المشهد المراد عرضه. إنها لا فكرة جيدة أن نستعمل عرض وطول المنطقة التي نريد ملأها في الصفحة. في هذه الحالة إستعملنا عرض و طول نافدة المتصفح. بالنسبة لتطبيقات عاليةالأداء، يمكنك توفير قيم أقل مثل <strong>window.innerWidth/2</strong> و <strong>window.innerHeight/2</strong>،التي ستجعل المشهد يعرض أسرع بنصف المدة السابقة.</p>
 
+		
 		<p>
 
 		<p>
 
 			على سبيل المثال إلغاء قيمة <strong>updateStyle</strong> كالأتي:
 
 			على سبيل المثال إلغاء قيمة <strong>updateStyle</strong> كالأتي:
 
 			<br />
 
 			<br />

+ 2 - 1
docs/page.css
Fájl Megtekintése 

@@ -74,7 +74,8 @@ body.rtl ol,
 
 body.rtl table {
 
 body.rtl table {
 
 	direction: rtl !important;
 
 	direction: rtl !important;
 
 }
 
 }
 
-body.rtl code {
 
+body.rtl code,
 
+body.rtl .RtlTitle {
 
 	direction: ltr !important;
 
 	direction: ltr !important;
 
 	text-align: initial;
 
 	text-align: initial;
 
 }
 
 }