|
|
<!DOCTYPE html> |
|
|
<html lang="ar" dir="rtl"> |
|
|
<head> |
|
|
<meta charset="UTF-8"> |
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|
|
<title>درس الغير</title> |
|
|
<script src="https://cdn.tailwindcss.com"></script> |
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> |
|
|
<style> |
|
|
@import url('https://fonts.googleapis.com/css2?family=Tajawal:wght@400;500;700;900&display=swap'); |
|
|
|
|
|
body { |
|
|
font-family: 'Tajawal', sans-serif; |
|
|
background-color: #f8fafc; |
|
|
} |
|
|
|
|
|
.concept-card { |
|
|
transition: all 0.3s ease; |
|
|
} |
|
|
|
|
|
.concept-card:hover { |
|
|
transform: translateY(-5px); |
|
|
box-shadow: 0 10px 20px rgba(0,0,0,0.1); |
|
|
} |
|
|
|
|
|
.philosopher-card { |
|
|
border-left: 4px solid; |
|
|
transition: all 0.3s ease; |
|
|
} |
|
|
.philosopher-card:hover { |
|
|
box-shadow: 0 5px 15px rgba(0,0,0,0.08); |
|
|
} |
|
|
|
|
|
.axis-header { |
|
|
position: relative; |
|
|
padding-bottom: 15px; |
|
|
margin-bottom: 20px; |
|
|
} |
|
|
|
|
|
.axis-header::after { |
|
|
content: ""; |
|
|
position: absolute; |
|
|
bottom: 0; |
|
|
right: 0; |
|
|
width: 100px; |
|
|
height: 3px; |
|
|
background-color: #4f46e5; |
|
|
border-radius: 1.5px; |
|
|
} |
|
|
|
|
|
.comparison-card { |
|
|
background: linear-gradient(135deg, #eef2ff, #e0e7ff); |
|
|
border: 1px solid #c7d2fe; |
|
|
} |
|
|
|
|
|
|
|
|
.floating-btn { |
|
|
position: fixed; bottom: 20px; left: 20px; z-index: 10; transition: transform 0.3s ease; |
|
|
} |
|
|
.floating-btn:hover { |
|
|
transform: scale(1.1); |
|
|
} |
|
|
|
|
|
.highlight { |
|
|
background-color: rgba(99, 102, 241, 0.2); |
|
|
padding: 0.1em 0.3em; border-radius: 3px; |
|
|
} |
|
|
|
|
|
|
|
|
.flip-card { |
|
|
background-color: transparent; width: 100%; min-height: 170px; perspective: 1000px; display: flex; |
|
|
} |
|
|
.flip-card-inner { |
|
|
position: relative; width: 100%; height: 100%; text-align: center; transition: transform 0.6s; transform-style: preserve-3d; box-shadow: 0 4px 8px 0 rgba(0,0,0,0.1); border-radius: 0.5rem; display: flex; flex-direction: column; |
|
|
} |
|
|
|
|
|
.flip-card:hover .flip-card-inner, |
|
|
.flip-card:focus-within .flip-card-inner { |
|
|
transform: rotateY(180deg); |
|
|
} |
|
|
.flip-card-front, .flip-card-back { |
|
|
position: absolute; width: 100%; height: 100%; -webkit-backface-visibility: hidden; backface-visibility: hidden; display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 1rem; border-radius: 0.5rem; |
|
|
} |
|
|
.flip-card-front { |
|
|
background-color: #ffffff; color: black; |
|
|
} |
|
|
.flip-card-back { |
|
|
background-color: #4f46e5; color: white; transform: rotateY(180deg); overflow-y: auto; |
|
|
} |
|
|
.flip-card-back p { font-size: 0.875rem; } |
|
|
|
|
|
|
|
|
@keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } } |
|
|
.fade-in { animation: fadeIn 0.8s ease-out forwards; } |
|
|
|
|
|
|
|
|
.axis-concept-card { |
|
|
background-color: #f9fafb; border: 1px solid #e5e7eb; border-right: 3px solid; padding: 1rem; border-radius: 0.375rem; box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05); |
|
|
} |
|
|
|
|
|
|
|
|
.quiz-section { |
|
|
background-color: #ffffff; padding: 2rem; border-radius: 0.5rem; box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); margin-bottom: 2rem; |
|
|
} |
|
|
.quiz-title { |
|
|
font-size: 1.5rem; font-weight: 700; color: #1f2937; margin-bottom: 1.5rem; text-align: center; border-bottom: 2px solid #a5b4fc; padding-bottom: 0.5rem; |
|
|
} |
|
|
.quiz-question { |
|
|
border-bottom: 1px solid #e5e7eb; padding-bottom: 1rem; margin-bottom: 1.5rem; |
|
|
} |
|
|
.quiz-question:last-of-type { border-bottom: none; margin-bottom: 0; padding-bottom: 0; } |
|
|
|
|
|
</style> |
|
|
</head> |
|
|
<body class="bg-gray-50"> |
|
|
|
|
|
<div class="container mx-auto px-4 py-8"> |
|
|
|
|
|
<header class="text-center mb-12"> |
|
|
<h1 class="text-4xl md:text-5xl font-bold text-gray-800 mb-4"> |
|
|
<i class="fas fa-user-friends text-indigo-600"></i> درس الغَـيْـر <i class="fas fa-eye text-indigo-600"></i> |
|
|
</h1> |
|
|
<p class="text-lg text-gray-600 max-w-3xl mx-auto"> |
|
|
استكشاف إشكالية "الأنا الآخر": ضرورة وجوده، إمكانية معرفته، وطبيعة العلاقة معه بين الصراع والاعتراف والصداقة. |
|
|
</p> |
|
|
</header> |
|
|
|
|
|
<section class="mb-16" id="main-concepts-overview"> |
|
|
<h2 class="text-3xl font-bold text-gray-800 mb-8 text-center axis-header">نظرة عامة على المفاهيم</h2> |
|
|
<p class="text-center text-gray-600 mb-8"> |
|
|
"الغير" مفهوم فلسفي مركزي يطرح تساؤلات عميقة حول الذات وعلاقتها بالآخرين. هل وجود الغير ضروري لوعي الذات بذاتها؟ هل يمكننا حقاً معرفة الآخر؟ وكيف تتشكل العلاقة معه؟ |
|
|
</p> |
|
|
<div class="flex justify-center space-x-8 space-x-reverse text-center text-gray-700"> |
|
|
<div class="flex flex-col items-center"> |
|
|
<i class="fas fa-question-circle text-3xl text-red-500 mb-2"></i> |
|
|
<span>وجود الغير</span> |
|
|
</div> |
|
|
<div class="flex flex-col items-center"> |
|
|
<i class="fas fa-search text-3xl text-purple-500 mb-2"></i> |
|
|
<span>معرفة الغير</span> |
|
|
</div> |
|
|
<div class="flex flex-col items-center"> |
|
|
<i class="fas fa-handshake text-3xl text-green-500 mb-2"></i> / <i class="fas fa-fist-raised text-3xl text-green-500 mb-2"></i> |
|
|
<span>العلاقة مع الغير</span> |
|
|
</div> |
|
|
</div> |
|
|
</section> |
|
|
|
|
|
<section class="mb-16"> |
|
|
<h2 class="text-3xl font-bold text-gray-800 mb-8 axis-header">المحور الأول: وجود الغير</h2> |
|
|
<div class="bg-red-50 border-r-4 border-red-400 p-4 rounded-lg shadow-sm mb-8"> |
|
|
<h3 class="font-bold text-red-800 mb-2 flex items-center"><i class="fas fa-question-circle ml-2"></i> الإشكالية المحورية</h3> |
|
|
<p class="text-red-700">إذا كان الغير هو الأنا الذي ليس أنا، أي الأنا الذي يشبهني ويختلف عني، فهل وجوده يشكل ضرورة بالنسبة للأنا ومكونا أساسيا لوجودها؟ وهل لابد للأنا من الغير لتدرك وتعي ذاتها؟ أم أن وجوده يبقى بدون أهمية ولا ضرورة له؟ هل الوجود مع الغير تهديد للذات وتشييء لها أم هو اعتراف بها؟</p> |
|
|
</div> |
|
|
<div class="mb-8"> |
|
|
<h3 class="font-bold text-xl text-gray-700 mb-4">مفاهيم أساسية للمحور:</h3> |
|
|
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-4"> |
|
|
<div class="axis-concept-card border-indigo-500 p-4 rounded-md shadow-sm"> |
|
|
<h4 class="font-semibold text-indigo-700 flex items-center mb-1"><i class="fas fa-user ml-2"></i> الأنا (Self)</h4> |
|
|
<p class="text-sm text-gray-600">الذات الواعية المفكرة؛ شعور الفرد بهويته واستقلاليته ووعيه الخاص.</p> |
|
|
</div> |
|
|
<div class="axis-concept-card border-gray-500 p-4 rounded-md shadow-sm"> |
|
|
<h4 class="font-semibold text-gray-700 flex items-center mb-1"><i class="fas fa-user-alt ml-2"></i> الآخر / الغير (Other)</h4> |
|
|
<p class="text-sm text-gray-600">الأنا الذي ليس أنا؛ ذات واعية أخرى يُنظر إليها على أنها مشابهة ومختلفة في آن واحد.</p> |
|
|
</div> |
|
|
<div class="axis-concept-card border-blue-500 p-4 rounded-md shadow-sm"> |
|
|
<h4 class="font-semibold text-blue-700 flex items-center mb-1"><i class="fas fa-users ml-2"></i> الوجود-مع (Being-with)</h4> |
|
|
<p class="text-sm text-gray-600">عند هيدجر: نمط الوجود اليومي المنغمس في الجماعة اللامبالية ("الهم")، حيث تفقد الأنا خصوصيتها.</p> |
|
|
</div> |
|
|
<div class="axis-concept-card border-red-600 p-4 rounded-md shadow-sm"> |
|
|
<h4 class="font-semibold text-red-700 flex items-center mb-1"><i class="fas fa-exchange-alt ml-2"></i> الصراع الوجودي</h4> |
|
|
<p class="text-sm text-gray-600">التوتر أو الصدام الناشئ عن لقاء الأنا بالغير، قد يتضمن التشييء، سلب الحرية، أو الصراع من أجل الاعتراف.</p> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<h3 class="font-bold text-xl text-gray-700 mb-6">مواقف الفلاسفة:</h3> |
|
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-8"> |
|
|
<div class="philosopher-card border-red-500 bg-white p-6 rounded-lg shadow-md"> |
|
|
<h4 class="font-bold text-lg text-red-700 mb-2 flex items-center"><i class="fas fa-eye-slash ml-2"></i> مارتن هيدجر: الوجود مع الغير تهديد للأصالة</h4> |
|
|
<p class="text-gray-600 mb-2 text-sm">يرى أن الانغماس في <span class="highlight">"الوجود مع الآخرين"</span> يفرغ الذات من خصوصيتها ويذيبها في الجماعة الزائفة (الـ"هم").</p> |
|
|
<ul class="list-disc pr-4 text-sm text-gray-500 space-y-1"> |
|
|
<li>الوجود اليومي المشترك يفقد الأنا تمايزها وهويتها الفردية.</li> |
|
|
<li>الوجود-مع هو <strong class="text-red-600">تهديد للوجود الأصيل</strong> وتنازل عن الوجود الخاص.</li> |
|
|
<li>الأنا تصبح مجرد صدى للآخرين، تفقد حريتها وإنسانيتها وتميزها.</li> |
|
|
<li>العلاقة مع الغير في الحياة اليومية هي علاقة ابتذال وتسطيح.</li> |
|
|
</ul> |
|
|
</div> |
|
|
<div class="philosopher-card border-purple-500 bg-white p-6 rounded-lg shadow-md"> |
|
|
<h4 class="font-bold text-lg text-purple-700 mb-2 flex items-center"><i class="fas fa-eye ml-2"></i> جون بول سارتر: ضرورة وصراع (الغير وسيط ونظرة)</h4> |
|
|
<p class="text-gray-600 mb-2 text-sm">يؤكد على ضرورة الغير لوعي الأنا بذاتها (مثال الخجل)، لكنه يرى أيضاً أن <span class="highlight">نظرته تشيئ الأنا وتسلب حريتها</span>.</p> |
|
|
<ul class="list-disc pr-4 text-sm text-gray-500 space-y-1"> |
|
|
<li>الغير ضروري كـ <strong class="text-purple-600">وسيط</strong> لمعرفة الذات (مثال: الخجل لا يُشعر به إلا أمام الآخر).</li> |
|
|
<li>لكن وجود الغير يمثل مشكلة لأنه يحد من حرية الأنا عبر نظرته التي تحولها لموضوع.</li> |
|
|
<li>وجود الغير ذو وجهين: إيجابي (وعي الذات) وسلبي (سلب الحرية، تشييء).</li> |
|
|
<li>العلاقة تتسم بالصراع: <strong class="text-purple-600">"الجحيم هو الآخرون"</strong>.</li> |
|
|
</ul> |
|
|
</div> |
|
|
</div> |
|
|
<div class="mt-8"> |
|
|
<h3 class="font-bold text-lg text-gray-700 mb-4">مقارنة سريعة (هيدجر وسارتر):</h3> |
|
|
<div class="comparison-card p-6 rounded-lg shadow-sm grid grid-cols-1 md:grid-cols-2 gap-6"> |
|
|
<div> |
|
|
<h5 class="font-semibold text-red-700 mb-2 flex items-center"><i class="fas fa-eye-slash ml-2"></i> هيدجر</h5> |
|
|
<ul class="list-disc pr-4 text-sm text-gray-700 space-y-1"> |
|
|
<li>نظرة لوجود الغير: تهديد للأصالة، ابتذال.</li> |
|
|
<li>دور الغير في الوعي: سلبي، يطمس الوعي الفردي.</li> |
|
|
<li>طبيعة العلاقة: انغماس في اللاأصالة.</li> |
|
|
</ul> |
|
|
</div> |
|
|
<div> |
|
|
<h5 class="font-semibold text-purple-700 mb-2 flex items-center"><i class="fas fa-eye ml-2"></i> سارتر</h5> |
|
|
<ul class="list-disc pr-4 text-sm text-gray-700 space-y-1"> |
|
|
<li>نظرة لوجود الغير: ضروري للوعي ولكنه مصدر صراع وتشييء.</li> |
|
|
<li>دور الغير في الوعي: إيجابي (وسيط للوعي) وسلبي (النظرة المشيئة).</li> |
|
|
<li>طبيعة العلاقة: ضرورة متناقضة، صراع وجودي.</li> |
|
|
</ul> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<div class="bg-gray-100 border border-gray-200 p-4 rounded-lg shadow-inner mt-8"> |
|
|
<h3 class="font-bold text-gray-800 mb-2 flex items-center"><i class="fas fa-link ml-2 text-indigo-500"></i> تركيب المحور الأول</h3> |
|
|
<p class="text-gray-700 text-sm"> |
|
|
تتباين نظرة الفلسفة الوجودية لوجود الغير؛ فبينما يراه هيدجر تهديداً للوجود الأصيل وانغماساً في الزيف، يبرز سارتر وجهه المزدوج: ضروري لوعي الذات (كوسيط عبر ظواهر مثل الخجل) ولكنه في الوقت نفسه مصدر للصراع والتشييء (عبر النظرة التي تسلب الحرية). كلا الموقفين (وإن اختلفا في التركيز) يبرزان التوتر الكامن في العلاقة مع الآخر. هذا يفتح الباب أمام تساؤلات حول إمكانية تجاوز هذا الصراع، كما قد يوحي موقف كانط الأخلاقي أو حتى التساؤل حول غنى الذات عن الغير عند ديكارت (الكوجيتو). |
|
|
</p> |
|
|
</div> |
|
|
</section> |
|
|
|
|
|
<section class="mb-16"> |
|
|
<h2 class="text-3xl font-bold text-gray-800 mb-8 axis-header">المحور الثاني: معرفة الغير</h2> |
|
|
<div class="bg-purple-50 border-r-4 border-purple-400 p-4 rounded-lg shadow-sm mb-8"> |
|
|
<h3 class="font-bold text-purple-800 mb-2 flex items-center"><i class="fas fa-question-circle ml-2"></i> الإشكالية المحورية</h3> |
|
|
<p class="text-purple-700">إذا كان الغير ذاتاً واعية وليس مجرد موضوع، فهل يمكن للأنا معرفته وإدراك عالمه الداخلي؟ هل معرفة الغير ممكنة ولو بشكل نسبي (مثلاً عبر التواصل أو التعاطف)، أم أنها مستحيلة بسبب انفصال الذوات وحميمية التجربة الفردية؟ وما طبيعة هذه المعرفة إن كانت ممكنة: يقينية أم تخمينية؟</p> |
|
|
</div> |
|
|
<div class="mb-8"> |
|
|
<h3 class="font-bold text-xl text-gray-700 mb-4">مفاهيم أساسية للمحور:</h3> |
|
|
<div class="grid grid-cols-1 md:grid-cols-3 gap-4"> |
|
|
<div class="axis-concept-card border-green-500 p-3 rounded-md shadow-sm"> |
|
|
<h4 class="font-semibold text-green-700 text-center mb-1"><i class="fas fa-people-arrows mr-1"></i> البينذاتية (Intersubjectivity)</h4> |
|
|
<p class="text-xs text-gray-600 text-center">عند هوسرل: الفضاء المشترك والتجارب المتشابهة بين الذوات، الذي يتيح إمكانية الفهم المتبادل والتوحد الحدسي.</p> |
|
|
</div> |
|
|
<div class="axis-concept-card border-cyan-500 p-3 rounded-md shadow-sm"> |
|
|
<h4 class="font-semibold text-cyan-700 text-center mb-1"><i class="fas fa-comments mr-1"></i> التواصل (Communication)</h4> |
|
|
<p class="text-xs text-gray-600 text-center">فعل تبادل الأفكار والمشاعر الذي يخرج الوعي من تمركزه على ذاته ويتيح الانفتاح على الآخر، مما قد يسهل المعرفة.</p> |
|
|
</div> |
|
|
<div class="axis-concept-card border-red-500 p-3 rounded-md shadow-sm"> |
|
|
<h4 class="font-semibold text-red-700 text-center mb-1"><i class="fas fa-lock mr-1"></i> الحميمية (Intimacy)</h4> |
|
|
<p class="text-xs text-gray-600 text-center">عند برجي: العلاقة الخاصة والمنغلقة للذات مع نفسها وتجاربها الداخلية (كالألم)، والتي تشكل عائقاً أمام معرفة الغير لها.</p> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<h3 class="font-bold text-xl text-gray-700 mb-6">مواقف الفلاسفة:</h3> |
|
|
<div class="space-y-8"> |
|
|
<div class="philosopher-card border-green-500 bg-white p-6 rounded-lg shadow-md"> |
|
|
<h4 class="font-bold text-lg text-green-700 mb-3 flex items-center"><i class="fas fa-handshake ml-2"></i> إدموند هوسرل: المعرفة ممكنة عبر التوحد الحدسي والبينذاتية</h4> |
|
|
<p class="text-gray-600 text-sm">يرى أن معرفة الغير كذات نفسية ممكنة، وإن كانت غير مباشرة، عبر <span class="highlight">"التوحد الحدسي"</span> في إطار العالم المشترك (البينذاتية).</p> |
|
|
<ul class="list-disc pr-4 text-sm text-gray-500 space-y-1"> |
|
|
<li>ندرك الغير كذات مشابهة لنا (نفس وجسم).</li> |
|
|
<li>المعرفة تتم عبر وضع أنفسنا مكان الغير بناءً على التشابه والتجربة المشتركة.</li> |
|
|
<li><strong class="text-green-600">التعاطف، التشارك، والتواصل</strong> وسائل أساسية للاقتراب من فهم الغير.</li> |
|
|
<li>المعرفة ممكنة نسبياً من خلال الانفتاح في فضاء البينذاتية.</li> |
|
|
</ul> |
|
|
</div> |
|
|
<div class="philosopher-card border-red-500 bg-white p-6 rounded-lg shadow-md"> |
|
|
<h4 class="font-bold text-lg text-red-700 mb-3 flex items-center"><i class="fas fa-user-secret ml-2"></i> غاستون برجي: استحالة معرفة الغير بسبب الحميمية</h4> |
|
|
<p class="text-gray-600 text-sm">يؤكد على <span class="highlight">استحالة معرفة الغير</span> معرفة حقيقية بسبب جدار "الحميمية" الذي يفصل بين الذوات.</p> |
|
|
<ul class="list-disc pr-4 text-sm text-gray-500 space-y-1"> |
|
|
<li>كل ذات تعيش تجربة حميمية مع نفسها لا يمكن للغير اقتحامها.</li> |
|
|
<li>عالم الآخرين موصد ومنغلق أمامنا، كما عالمنا منغلق أمامهم.</li> |
|
|
<li>مثال الألم: يمكن المساعدة والمواساة، لكن لا يمكن معايشة ألم الغير نفسه.</li> |
|
|
<li><strong class="text-red-600">تجربة الغير تبقى برانية ومستحيلة الإدراك المباشر</strong>.</li> |
|
|
</ul> |
|
|
</div> |
|
|
</div> |
|
|
<div class="mt-8"> |
|
|
<h3 class="font-bold text-lg text-gray-700 mb-4">مقارنة سريعة:</h3> |
|
|
<div class="comparison-card p-6 rounded-lg shadow-sm grid grid-cols-1 md:grid-cols-2 gap-6"> |
|
|
<div> |
|
|
<h5 class="font-semibold text-green-700 mb-2 flex items-center"><i class="fas fa-handshake ml-2"></i> هوسرل</h5> |
|
|
<ul class="list-disc pr-4 text-sm text-gray-700 space-y-1"> |
|
|
<li>إمكانية المعرفة: ممكنة نسبياً.</li> |
|
|
<li>الوسيلة: التوحد الحدسي، البينذاتية، التواصل.</li> |
|
|
<li>طبيعة المعرفة: غير مباشرة، قائمة على التشابه والتعاطف.</li> |
|
|
</ul> |
|
|
</div> |
|
|
<div> |
|
|
<h5 class="font-semibold text-red-700 mb-2 flex items-center"><i class="fas fa-user-secret ml-2"></i> غاستون برجي</h5> |
|
|
<ul class="list-disc pr-4 text-sm text-gray-700 space-y-1"> |
|
|
<li>إمكانية المعرفة: مستحيلة.</li> |
|
|
<li>العائق: جدار الحميمية وانغلاق التجارب الذاتية.</li> |
|
|
<li>طبيعة المعرفة: محاولة خارجية لا تصل للجوهر.</li> |
|
|
</ul> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<div class="bg-gray-100 border border-gray-200 p-4 rounded-lg shadow-inner mt-8"> |
|
|
<h3 class="font-bold text-gray-800 mb-2 flex items-center"><i class="fas fa-link ml-2 text-indigo-500"></i> تركيب المحور الثاني</h3> |
|
|
<p class="text-gray-700 text-sm"> |
|
|
تتأرجح إشكالية معرفة الغير بين قطبين: إمكانية الفهم النسبي عبر التواصل والتعاطف والبناء على المشترك الإنساني (هوسرل)، واستحالة الولوج إلى العمق الذاتي للآخر بسبب فرادة التجربة وحميميتها (برجي). ربما تكون المعرفة الممكنة هي معرفة تخمينية، تعتمد على العلامات الخارجية والتواصل، لكنها تبقى غير قادرة على القبض على حقيقة الغير الداخلية بشكل كامل ويقيني. يظل التحدي قائماً في كيفية التعامل مع هذا الغير الذي نعرفه ولا نعرفه في آن، مع التأكيد على ضرورة احترامه كذات وليس كموضوع غامض. |
|
|
</p> |
|
|
</div> |
|
|
</section> |
|
|
|
|
|
<section class="mb-16"> |
|
|
<h2 class="text-3xl font-bold text-gray-800 mb-8 axis-header">المحور الثالث: العلاقة مع الغير</h2> |
|
|
<div class="bg-green-50 border-r-4 border-green-400 p-4 rounded-lg shadow-sm mb-8"> |
|
|
<h3 class="font-bold text-green-800 mb-2 flex items-center"><i class="fas fa-question-circle ml-2"></i> الإشكالية المحورية</h3> |
|
|
<p class="text-green-700">إذا كان وجود الغير ضرورياً ومصدراً للصراع في آن، وإذا كانت معرفته تتأرجح بين الممكن والمستحيل، فما طبيعة العلاقة التي يجب أن نقيمها معه؟ هل هي علاقة صراع وتشييء حتمية (كما قد توحي به بعض التحليلات الوجودية والهيجلية)؟ أم أن هناك إمكانية لعلاقات إيجابية كالصداقة والغيرية؟ وهل يمكن تجاوز الصراع لتجسيد قيم إنسانية عليا في التعامل مع الآخر؟</p> |
|
|
</div> |
|
|
<div class="mb-8"> |
|
|
<h3 class="font-bold text-xl text-gray-700 mb-4">مفاهيم أساسية للمحور:</h3> |
|
|
<div class="grid grid-cols-1 md:grid-cols-4 gap-4"> |
|
|
<div class="axis-concept-card border-purple-500 p-4 rounded-md shadow-sm"> |
|
|
<h4 class="font-semibold text-purple-700 flex items-center mb-1"><i class="fas fa-link ml-2"></i> العلاقة مع الغير</h4> |
|
|
<p class="text-sm text-gray-600">طبيعة التفاعل والتواصل (أو انعدامه) بين الأنا والآخر، والتي قد تتخذ أشكالاً متنوعة (صراع، صداقة، حب، إيثار، غربة، إلخ).</p> |
|
|
</div> |
|
|
<div class="axis-concept-card border-blue-500 p-4 rounded-md shadow-sm"> |
|
|
<h4 class="font-semibold text-blue-700 flex items-center mb-1"><i class="fas fa-users ml-2"></i> الصداقة (كانط)</h4> |
|
|
<p class="text-sm text-gray-600">علاقة أخلاقية مثالية تجمع بين الحب والاحترام المتبادل، وتعتبر الغير كغاية في ذاته، وهي واجب عقلي.</p> |
|
|
</div> |
|
|
<div class="axis-concept-card border-green-500 p-4 rounded-md shadow-sm"> |
|
|
<h4 class="font-semibold text-green-700 flex items-center mb-1"><i class="fas fa-hand-holding-heart ml-2"></i> الغيرية (Altruism - كونت)</h4> |
|
|
<p class="text-sm text-gray-600">تجاوز الأنانية والحياة من أجل الآخرين، والتضحية من أجلهم كواجب أخلاقي واجتماعي كرد لجميل الإنسانية.</p> |
|
|
</div> |
|
|
<div class="axis-concept-card border-gray-500 p-4 rounded-md shadow-sm"> |
|
|
<h4 class="font-semibold text-gray-700 flex items-center mb-1"><i class="fas fa-question ml-2"></i> الغرابة (Strangeness)</h4> |
|
|
<p class="text-sm text-gray-600">إدراك الاختلاف الجذري للغير وعدم قابليته للاختزال إلى الأنا، وقد تشير أيضاً إلى الغريب بداخلنا (كريستيفا).</p> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<h3 class="font-bold text-xl text-gray-700 mb-6">مواقف الفلاسفة:</h3> |
|
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-8"> |
|
|
<div class="philosopher-card border-blue-500 bg-white p-6 rounded-lg shadow-md"> |
|
|
<h4 class="font-bold text-lg text-blue-700 mb-2 flex items-center"><i class="fas fa-balance-scale ml-2"></i> إيمانويل كانط: الصداقة كواجب أخلاقي ومثال للعلاقة</h4> |
|
|
<p class="text-gray-600 mb-2 text-sm">يدعو إلى تأسيس العلاقة مع الغير على <span class="highlight">مبادئ أخلاقية</span>، معتبراً الصداقة النموذج الأسمى لهذه العلاقة.</p> |
|
|
<ul class="list-disc pr-4 text-sm text-gray-500 space-y-1"> |
|
|
<li>العلاقة يجب أن تتجاوز الصراع نحو قيم الحب والاحترام والتضحية.</li> |
|
|
<li>الصداقة تجمع بين <strong class="text-blue-600">الحب (يقرب) والاحترام (يبعد)</strong>، وتحقق التوازن.</li> |
|
|
<li>هي واجب أخلاقي يقتضي معاملة الغير كغاية لا كوسيلة.</li> |
|
|
<li>قد تكون الصداقة صعبة، لكنها ضرورية كواجب عقلي خالص من المنفعة.</li> |
|
|
</ul> |
|
|
</div> |
|
|
<div class="philosopher-card border-green-500 bg-white p-6 rounded-lg shadow-md"> |
|
|
<h4 class="font-bold text-lg text-green-700 mb-2 flex items-center"><i class="fas fa-hands-helping ml-2"></i> أوغست كونت: الغيرية كواجب ورد للجميل</h4> |
|
|
<p class="text-gray-600 mb-2 text-sm">يرى أن العلاقة المثلى هي <span class="highlight">"الغيرية"</span>: الحياة من أجل الآخرين وتجاوز الأنانية.</p> |
|
|
<ul class="list-disc pr-4 text-sm text-gray-500 space-y-1"> |
|
|
<li>يجب تجاوز الأنانية والعيش من أجل الغير، تضحية وإيثاراً.</li> |
|
|
<li>وجودنا الحالي هو نتاج تضحيات الآخرين (الوالدين، المصلحين...).</li> |
|
|
<li><strong class="text-green-600">الحياة من أجل الغير</strong> هي رد للجميل وواجب اجتماعي وأخلاقي.</li> |
|
|
<li>العيش للغير يحقق معنى أعمق للحياة يتجاوز الأخذ والتملك نحو العطاء.</li> |
|
|
</ul> |
|
|
</div> |
|
|
|
|
|
</div> |
|
|
<div class="mt-8"> |
|
|
<h3 class="font-bold text-lg text-gray-700 mb-4">مقارنة سريعة (كانط وكونت):</h3> |
|
|
<div class="comparison-card p-6 rounded-lg shadow-sm grid grid-cols-1 md:grid-cols-2 gap-6"> |
|
|
<div> |
|
|
<h5 class="font-semibold text-blue-700 mb-2 flex items-center"><i class="fas fa-balance-scale ml-2"></i> كانط</h5> |
|
|
<ul class="list-disc pr-4 text-sm text-gray-700 space-y-1"> |
|
|
<li>أساس العلاقة: الواجب الأخلاقي العقلي، الاحترام.</li> |
|
|
<li>النموذج: الصداقة (توازن حب واحترام).</li> |
|
|
<li>الدافع: احترام الإنسانية في شخص الغير كغاية.</li> |
|
|
</ul> |
|
|
</div> |
|
|
<div> |
|
|
<h5 class="font-semibold text-green-700 mb-2 flex items-center"><i class="fas fa-hands-helping ml-2"></i> كونت</h5> |
|
|
<ul class="list-disc pr-4 text-sm text-gray-700 space-y-1"> |
|
|
<li>أساس العلاقة: الواجب الاجتماعي، رد الجميل، التعاطف.</li> |
|
|
<li>النموذج: الغيرية (التضحية والحياة للآخرين).</li> |
|
|
<li>الدافع: الوعي بفضل الإنسانية، تجاوز الأنانية.</li> |
|
|
</ul> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<div class="bg-gray-100 border border-gray-200 p-4 rounded-lg shadow-inner mt-8"> |
|
|
<h3 class="font-bold text-gray-800 mb-2 flex items-center"><i class="fas fa-link ml-2 text-indigo-500"></i> تركيب المحور الثالث</h3> |
|
|
<p class="text-gray-700 text-sm"> |
|
|
مقابل الرؤى التي تركز على الصراع والتشييء، تقدم فلسفات كانط وكونت بديلاً أخلاقياً للعلاقة مع الغير. فبدلاً من الصدام الحتمي، يمكن بناء جسور من الصداقة القائمة على الاحترام المتبادل (كانط) أو من الغيرية القائمة على التضحية ورد الجميل (كونت). هذه المواقف تؤكد أن الإنسان قادر على تجاوز أنانيته الطبيعية والانفتاح على الآخر بروح إيجابية. ورغم واقعية وجود الصراع أحياناً، فإن الإمكانية الأخلاقية لعلاقة إنسانية سامية تظل قائمة وضرورية للوجود المشترك، بغض النظر عن قرب أو بعد الغير أو درجة تشابهه أو اختلافه معنا. |
|
|
</p> |
|
|
</div> |
|
|
</section> |
|
|
|
|
|
<section class="mb-16"> |
|
|
<h2 class="text-3xl font-bold text-gray-800 mb-8 text-center axis-header">خلاصة واستنتاجات</h2> |
|
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-8 mb-8"> |
|
|
<div class="bg-white p-6 rounded-lg shadow-md border-l-4 border-indigo-500"> |
|
|
<h3 class="font-semibold text-lg text-indigo-800 mb-2 flex items-center"><i class="fas fa-users-cog ml-2"></i> الغير: مرآة وند وتحدٍ</h3> |
|
|
<p class="text-gray-700 text-sm">يتضح من خلال محاور الدرس أن الغير يمثل إشكالية فلسفية معقدة. فهو ضروري لوجود الأنا ووعيها بذاتها (كسارتر)، ولكنه قد يكون مصدراً للتهديد والصراع والتشييء (كهيدجر وسارتر). معرفته تتأرجح بين الإمكان النسبي والاستحالة، وعلاقتنا به يمكن أن تتخذ أشكالاً سلبية (صراع) أو إيجابية (صداقة، غيرية).</p> |
|
|
</div> |
|
|
<div class="bg-white p-6 rounded-lg shadow-md border-l-4 border-purple-500"> |
|
|
<h3 class="font-semibold text-lg text-purple-800 mb-2 flex items-center"><i class="fas fa-question ml-2"></i> الأهمية الأخلاقية</h3> |
|
|
<p class="text-gray-700 text-sm">رغم صعوبات وجود الغير ومعرفته، تبرز أهمية البعد الأخلاقي في التعامل معه. الدعوة إلى معاملته كغاية (كانط)، أو الحياة من أجله (كونت)، أو حتى محاولة فهمه عبر التعاطف (هوسرل)، كلها تؤكد على ضرورة السمو فوق النظرة التشييئية أو الصراعية.</p> |
|
|
</div> |
|
|
</div> |
|
|
<div class="bg-sky-100 border border-sky-300 p-6 rounded-lg shadow"> |
|
|
<h3 class="font-bold text-sky-800 mb-2 flex items-center"><i class="fas fa-infinity ml-2"></i> نحو وجود مشترك أفضل</h3> |
|
|
<p class="text-sky-700"> |
|
|
يدعونا التفكير في إشكالية الغير إلى وعي أعمق بتعقيدات الوجود الإنساني المشترك، وإلى ضرورة بناء علاقات قائمة على الاحترام المتبادل والاعتراف بالاختلاف، والسعي لتجاوز الصراع نحو أشكال أرقى من التعايش الإنساني. |
|
|
</p> |
|
|
</div> |
|
|
</section> |
|
|
|
|
|
<section class="mb-16"> |
|
|
<h2 class="text-3xl font-bold text-gray-800 mb-8 text-center axis-header">مراجعة المفاهيم الأساسية (انقر للتعريف)</h2> |
|
|
<div class="grid grid-cols-2 md:grid-cols-4 lg:grid-cols-5 gap-5"> |
|
|
<div class="flip-card" tabindex="0"> <div class="flip-card-inner"> <div class="flip-card-front"> <i class="fas fa-user text-4xl text-indigo-500 mb-2"></i> <h4 class="font-bold">الأنا</h4> </div> <div class="flip-card-back"> <p>الذات الواعية المفكرة؛ شعور الفرد بهويته واستقلاليته ووعيه الخاص.</p> </div> </div> </div> |
|
|
<div class="flip-card" tabindex="0"> <div class="flip-card-inner"> <div class="flip-card-front"> <i class="fas fa-user-alt text-4xl text-gray-500 mb-2"></i> <h4 class="font-bold">الغير / الآخر</h4> </div> <div class="flip-card-back"> <p>الأنا الذي ليس أنا؛ ذات واعية أخرى يُنظر إليها على أنها مشابهة ومختلفة في آن واحد.</p> </div> </div> </div> |
|
|
<div class="flip-card" tabindex="0"> <div class="flip-card-inner"> <div class="flip-card-front"> <i class="fas fa-users text-4xl text-blue-500 mb-2"></i> <h4 class="font-bold">الوجود-مع</h4> </div> <div class="flip-card-back"> <p>عند هيدجر: نمط الوجود اليومي المنغمس في الجماعة ("الهم")، حيث تفقد الأنا خصوصيتها وأصالتها.</p> </div> </div> </div> |
|
|
<div class="flip-card" tabindex="0"> <div class="flip-card-inner"> <div class="flip-card-front"> <i class="fas fa-exchange-alt text-4xl text-red-600 mb-2"></i> <h4 class="font-bold">الصراع الوجودي</h4> </div> <div class="flip-card-back"> <p>التوتر أو الصدام الناشئ عن لقاء الأنا بالغير، قد يتضمن التشييء، سلب الحرية، أو الصراع من أجل الاعتراف.</p> </div> </div> </div> |
|
|
<div class="flip-card" tabindex="0"> <div class="flip-card-inner"> <div class="flip-card-front"> <i class="fas fa-eye text-4xl text-purple-500 mb-2"></i> <h4 class="font-bold">نظرة الغير</h4> </div> <div class="flip-card-back"> <p>عند سارتر: فعل إدراك الغير للأنا الذي يحول الأنا إلى موضوع ويحد من حريتها ويكشفها لذاتها (كالخجل).</p> </div> </div> </div> |
|
|
<div class="flip-card" tabindex="0"> <div class="flip-card-inner"> <div class="flip-card-front"> <i class="fas fa-people-arrows text-4xl text-green-500 mb-2"></i> <h4 class="font-bold">البينذاتية</h4> </div> <div class="flip-card-back"> <p>عند هوسرل: الفضاء والتجارب المشتركة بين الذوات الذي يتيح إمكانية الفهم المتبادل والتوحد الحدسي.</p> </div> </div> </div> |
|
|
<div class="flip-card" tabindex="0"> <div class="flip-card-inner"> <div class="flip-card-front"> <i class="fas fa-lock text-4xl text-red-500 mb-2"></i> <h4 class="font-bold">الحميمية</h4> </div> <div class="flip-card-back"> <p>عند برجي: العلاقة الخاصة والمنغلقة للذات مع نفسها وتجاربها الداخلية، والتي تشكل عائقاً أمام معرفة الغير لها.</p> </div> </div> </div> |
|
|
<div class="flip-card" tabindex="0"> <div class="flip-card-inner"> <div class="flip-card-front"> <i class="fas fa-comments text-4xl text-cyan-500 mb-2"></i> <h4 class="font-bold">التواصل</h4> </div> <div class="flip-card-back"> <p>فعل تبادل الأفكار والمشاعر الذي يخرج الوعي من تمركزه ويتيح الانفتاح على الآخر، مما قد يسهل المعرفة.</p> </div> </div> </div> |
|
|
<div class="flip-card" tabindex="0"> <div class="flip-card-inner"> <div class="flip-card-front"> <i class="fas fa-users text-4xl text-blue-600 mb-2"></i> <h4 class="font-bold">الصداقة (كانط)</h4> </div> <div class="flip-card-back"> <p>علاقة أخلاقية مثالية تجمع بين الحب والاحترام المتبادل، وتعتبر الغير كغاية، وهي واجب عقلي.</p> </div> </div> </div> |
|
|
<div class="flip-card" tabindex="0"> <div class="flip-card-inner"> <div class="flip-card-front"> <i class="fas fa-hand-holding-heart text-4xl text-green-600 mb-2"></i> <h4 class="font-bold">الغيرية (كونت)</h4> </div> <div class="flip-card-back"> <p>تجاوز الأنانية والحياة من أجل الآخرين، والتضحية من أجلهم كواجب أخلاقي واجتماعي.</p> </div> </div> </div> |
|
|
<div class="flip-card" tabindex="0"> <div class="flip-card-inner"> <div class="flip-card-front"> <i class="fas fa-question text-4xl text-gray-500 mb-2"></i> <h4 class="font-bold">الغرابة</h4> </div> <div class="flip-card-back"> <p>إدراك الاختلاف الجذري للغير وعدم قابليته للاختزال إلى الأنا (قد تشير للغريب داخلنا - كريستيفا).</p> </div> </div> </div> |
|
|
</div> |
|
|
</section> |
|
|
|
|
|
<section class="mb-16"> |
|
|
<h2 class="text-3xl font-bold text-gray-800 mb-12 text-center axis-header">اختبر فهمك (أقسام منفصلة)</h2> |
|
|
|
|
|
|
|
|
<div id="problematicsQuizSection" class="quiz-section"> |
|
|
<h3 class="quiz-title"><i class="fas fa-question-circle text-blue-500 mr-2"></i> اختبار الإشكاليات الفلسفية</h3> |
|
|
<div class="space-y-6"> |
|
|
<div class="quiz-question"> |
|
|
<h4 class="font-semibold text-lg mb-3">س1: الإشكالية المحورية للمحور الأول (وجود الغير) تدور حول:</h4> |
|
|
<div class="space-y-2"> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qp1" value="a" data-correct="true" class="ml-2"> ضرورة وجود الغير بالنسبة لوعي الأنا بنفسها، وما إذا كان هذا الوجود تهديداً أم اعترافاً.</label> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qp1" value="b" class="ml-2"> إمكانية أو استحالة معرفة العالم الداخلي للغير.</label> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qp1" value="c" class="ml-2"> طبيعة العلاقة الأخلاقية مع الغير (صداقة، غيرية، صراع).</label> |
|
|
</div> |
|
|
</div> |
|
|
<div class="quiz-question"> |
|
|
<h4 class="font-semibold text-lg mb-3">س2: المحور الثاني (معرفة الغير) يطرح إشكاليات حول:</h4> |
|
|
<div class="space-y-2"> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qp2" value="a" class="ml-2"> هل وجود الغير يحد من حرية الأنا.</label> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qp2" value="b" data-correct="true" class="ml-2"> مدى إمكانية فهم وإدراك وعي الغير وحياته النفسية، والعوائق أمام ذلك.</label> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qp2" value="c" class="ml-2"> الواجبات الأخلاقية تجاه الغير.</label> |
|
|
</div> |
|
|
</div> |
|
|
<div class="quiz-question"> |
|
|
<h4 class="font-semibold text-lg mb-3">س3: الإشكالية الأساسية للمحور الثالث (العلاقة مع الغير) تتمحور حول:</h4> |
|
|
<div class="space-y-2"> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qp3" value="a" class="ml-2"> هل الأنا في غنى عن الغير لوجودها.</label> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qp3" value="b" class="ml-2"> كيف يمكن للأنا معرفة ذاتها بشكل يقيني.</label> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qp3" value="c" data-correct="true" class="ml-2"> تحديد طبيعة العلاقة السائدة أو الممكنة مع الغير (صراع، صداقة، غيرية، إلخ).</label> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<button id="submitProblematicsQuiz" class="mt-8 w-full bg-blue-600 text-white py-3 px-6 rounded-lg font-semibold hover:bg-blue-700 transition duration-300 text-lg"> |
|
|
إرسال إجابات الإشكاليات <i class="fas fa-paper-plane mr-2"></i> |
|
|
</button> |
|
|
<div id="problematicsResult" class="mt-6"></div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div id="conceptsQuizSection" class="quiz-section"> |
|
|
<h3 class="quiz-title"><i class="fas fa-book-open text-green-500 mr-2"></i> اختبار المفاهيم الفلسفية</h3> |
|
|
<div class="space-y-6"> |
|
|
<div class="quiz-question"> |
|
|
<h4 class="font-semibold text-lg mb-3">س1: مفهوم <span class="text-blue-600 font-bold">"الوجود-مع"</span> عند هيدجر يشير إلى:</h4> |
|
|
<div class="space-y-2"> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qc1" value="a" data-correct="true" class="ml-2"> الانغماس اللاأصيل في الجماعة اليومية الذي يفقد الأنا خصوصيتها.</label> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qc1" value="b" class="ml-2"> العلاقة الإيجابية القائمة على الصداقة والاحترام.</label> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qc1" value="c" class="ml-2"> ضرورة الغير لوعي الأنا بذاتها.</label> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qc1" value="d" class="ml-2"> استحالة معرفة الغير.</label> |
|
|
</div> |
|
|
</div> |
|
|
<div class="quiz-question"> |
|
|
<h4 class="font-semibold text-lg mb-3">س2: <span class="text-purple-600 font-bold">"نظرة الغير"</span> عند سارتر هي التي:</h4> |
|
|
<div class="space-y-2"> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qc2" value="a" class="ml-2"> تؤكد أصالة الأنا وفردانيتها.</label> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qc2" value="b" data-correct="true" class="ml-2"> تحول الأنا إلى موضوع، تحد من حريتها، وتكشفها لذاتها (مثلاً عبر الخجل).</label> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qc2" value="c" class="ml-2"> تسمح بمعرفة يقينية لعالم الغير الداخلي.</label> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qc2" value="d" class="ml-2"> تبني علاقة صداقة حقيقية.</label> |
|
|
</div> |
|
|
</div> |
|
|
<div class="quiz-question"> |
|
|
<h4 class="font-semibold text-lg mb-3">س3: مفهوم <span class="text-green-600 font-bold">"البينذاتية"</span> عند هوسرل هو:</h4> |
|
|
<div class="space-y-2"> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qc3" value="a" class="ml-2"> حالة الصراع الحتمي بين الأنا والغير.</label> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qc3" value="b" class="ml-2"> استحالة التواصل بين الذوات.</label> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qc3" value="c" data-correct="true" class="ml-2"> الفضاء المشترك والتجارب المتشابهة التي تتيح إمكانية الفهم المتبادل.</label> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qc3" value="d" class="ml-2"> الانغلاق التام للذات على نفسها.</label> |
|
|
</div> |
|
|
</div> |
|
|
<div class="quiz-question"> |
|
|
<h4 class="font-semibold text-lg mb-3">س4: <span class="text-red-600 font-bold">"الحميمية"</span> كما وصفها برجي تشكل:</h4> |
|
|
<div class="space-y-2"> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qc4" value="a" data-correct="true" class="ml-2"> عائقاً أمام معرفة الغير لعالم الأنا الداخلي.</label> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qc4" value="b" class="ml-2"> أساساً لعلاقة الصداقة القوية.</label> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qc4" value="c" class="ml-2"> دافعاً للحياة من أجل الآخرين.</label> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qc4" value="d" class="ml-2"> وسيلة لوعي الأنا بذاتها.</label> |
|
|
</div> |
|
|
</div> |
|
|
<div class="quiz-question"> |
|
|
<h4 class="font-semibold text-lg mb-3">س5: مفهوم <span class="text-blue-600 font-bold">"الصداقة"</span> عند كانط هو بالأساس:</h4> |
|
|
<div class="space-y-2"> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qc5" value="a" class="ml-2"> علاقة قائمة على المنفعة المتبادلة.</label> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qc5" value="b" data-correct="true" class="ml-2"> واجب أخلاقي يجمع بين الحب والاحترام ويعتبر الغير كغاية.</label> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qc5" value="c" class="ml-2"> شعور عاطفي بحت يتغير بتقلب الظروف.</label> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qc5" value="d" class="ml-2"> شكل من أشكال الصراع الخفي.</label> |
|
|
</div> |
|
|
</div> |
|
|
<div class="quiz-question"> |
|
|
<h4 class="font-semibold text-lg mb-3">س6: <span class="text-green-600 font-bold">"الغيرية"</span> عند أوغست كونت تعني:</h4> |
|
|
<div class="space-y-2"> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qc6" value="a" class="ml-2"> إدراك غرابة واختلاف الغير.</label> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qc6" value="b" class="ml-2"> معرفة الغير معرفة يقينية.</label> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qc6" value="c" data-correct="true" class="ml-2"> تجاوز الأنانية والحياة من أجل الآخرين والتضحية من أجلهم.</label> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qc6" value="d" class="ml-2"> الانغماس في الوجود اليومي المشترك.</label> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<button id="submitConceptsQuiz" class="mt-8 w-full bg-green-600 text-white py-3 px-6 rounded-lg font-semibold hover:bg-green-700 transition duration-300 text-lg"> |
|
|
إرسال إجابات المفاهيم <i class="fas fa-paper-plane mr-2"></i> |
|
|
</button> |
|
|
<div id="conceptsResult" class="mt-6"></div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div id="stancesQuizSection" class="quiz-section"> |
|
|
<h3 class="quiz-title"><i class="fas fa-users text-purple-500 mr-2"></i> اختبار المواقف الفلسفية</h3> |
|
|
<div class="space-y-6"> |
|
|
<div class="quiz-question"> |
|
|
<h4 class="font-semibold text-lg mb-3">س1: يعتبر <span class="text-red-700 font-bold">هيدجر</span> أن الوجود مع الآخرين في الحياة اليومية يؤدي إلى:</h4> |
|
|
<div class="space-y-2"> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qs1" value="a" data-correct="true" class="ml-2"> فقدان الأنا لخصوصيتها وأصالتها وانغماسها في الجماعة الزائفة.</label> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qs1" value="b" class="ml-2"> تحقيق الوعي الكامل بالذات.</label> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qs1" value="c" class="ml-2"> بناء علاقات صداقة حقيقية.</label> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qs1" value="d" class="ml-2"> إمكانية معرفة الغير بشكل مباشر.</label> |
|
|
</div> |
|
|
</div> |
|
|
<div class="quiz-question"> |
|
|
<h4 class="font-semibold text-lg mb-3">س2: يرى <span class="text-purple-700 font-bold">سارتر</span> أن وجود الغير بالنسبة للأنا هو:</h3> |
|
|
<div class="space-y-2"> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qs2" value="a" class="ml-2"> غير ضروري على الإطلاق.</label> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qs2" value="b" data-correct="true" class="ml-2"> ضروري لوعي الأنا بذاتها، ولكنه في نفس الوقت مصدر للصراع والتشييء.</label> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qs2" value="c" class="ml-2"> إيجابي دائماً ويؤدي إلى الحرية.</label> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qs2" value="d" class="ml-2"> تهديد للأصالة فقط دون أي جوانب إيجابية.</label> |
|
|
</div> |
|
|
</div> |
|
|
<div class="quiz-question"> |
|
|
<h4 class="font-semibold text-lg mb-3">س3: حسب <span class="text-green-700 font-bold">هوسرل</span>، يمكن معرفة الغير بشكل نسبي عن طريق:</h3> |
|
|
<div class="space-y-2"> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qs3" value="a" class="ml-2"> الانغلاق على التجربة الذاتية الحميمية.</label> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qs3" value="b" data-correct="true" class="ml-2"> التوحد الحدسي والتعاطف في إطار العالم المشترك (البينذاتية) والتواصل.</label> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qs3" value="c" class="ml-2"> النظر إليه كموضوع خارجي فقط.</label> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qs3" value="d" class="ml-2"> الصراع معه وانتزاع الاعتراف.</label> |
|
|
</div> |
|
|
</div> |
|
|
<div class="quiz-question"> |
|
|
<h4 class="font-semibold text-lg mb-3">س4: يؤكد <span class="text-red-700 font-bold">غاستون برجي</span> على استحالة معرفة الغير بسبب:</h3> |
|
|
<div class="space-y-2"> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qs4" value="a" class="ml-2"> غياب التواصل اللغوي.</label> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qs4" value="b" class="ml-2"> الصراع الدائم بين الأنا والغير.</label> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qs4" value="c" data-correct="true" class="ml-2"> انغلاق التجربة الذاتية الحميمية لكل فرد وعدم إمكانية اقتحامها.</label> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qs4" value="d" class="ml-2"> تشابه الذوات الشديد الذي يلغي الحاجة للمعرفة.</label> |
|
|
</div> |
|
|
</div> |
|
|
<div class="quiz-question"> |
|
|
<h4 class="font-semibold text-lg mb-3">س5: يدعو <span class="text-blue-600 font-bold">كانط</span> إلى أن تكون العلاقة مع الغير قائمة على:</h3> |
|
|
<div class="space-y-2"> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qs5" value="a" class="ml-2"> الهيمنة والصراع من أجل الاعتراف.</label> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qs5" value="b" data-correct="true" class="ml-2"> الصداقة كواجب أخلاقي يجمع بين الحب والاحترام ويعامل الغير كغاية.</label> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qs5" value="c" class="ml-2"> التجاهل التام لوجود الآخر.</label> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qs5" value="d" class="ml-2"> التضحية الكاملة بالذات من أجل الغير.</label> |
|
|
</div> |
|
|
</div> |
|
|
<div class="quiz-question"> |
|
|
<h4 class="font-semibold text-lg mb-3">س6: يشجع <span class="text-green-600 font-bold">أوغست كونت</span> على تبني مبدأ "الغيرية" الذي يعني:</h3> |
|
|
<div class="space-y-2"> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qs6" value="a" class="ml-2"> التركيز على تحقيق مصالح الأنا أولاً.</label> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qs6" value="b" data-correct="true" class="ml-2"> الحياة من أجل الآخرين والتضحية كواجب ورد لجميل الإنسانية.</label> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qs6" value="c" class="ml-2"> احترام الغير مع الحفاظ على مسافة ضرورية.</label> |
|
|
<label class="flex items-center cursor-pointer"><input type="radio" name="qs6" value="d" class="ml-2"> إدراك استحالة معرفة الغير.</label> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<button id="submitStancesQuiz" class="mt-8 w-full bg-purple-600 text-white py-3 px-6 rounded-lg font-semibold hover:bg-purple-700 transition duration-300 text-lg"> |
|
|
إرسال إجابات المواقف <i class="fas fa-paper-plane mr-2"></i> |
|
|
</button> |
|
|
<div id="stancesResult" class="mt-6"></div> |
|
|
</div> |
|
|
|
|
|
</section> |
|
|
</div> |
|
|
|
|
|
<a href="#main-concepts-overview" onclick="event.preventDefault(); scrollToElement('#main-concepts-overview');" |
|
|
class="floating-btn bg-indigo-600 text-white w-14 h-14 rounded-full flex items-center justify-center shadow-lg hover:bg-indigo-700"> |
|
|
<i class="fas fa-arrow-up text-xl" aria-hidden="true"></i> |
|
|
<span class="sr-only">الصعود للأعلى</span> |
|
|
</a> |
|
|
|
|
|
<script> |
|
|
|
|
|
|
|
|
document.addEventListener('DOMContentLoaded', () => { |
|
|
|
|
|
document.body.classList.add('fade-in'); |
|
|
|
|
|
|
|
|
document.getElementById('submitProblematicsQuiz')?.addEventListener('click', () => submitSpecificQuiz('problematics')); |
|
|
document.getElementById('submitConceptsQuiz')?.addEventListener('click', () => submitSpecificQuiz('concepts')); |
|
|
document.getElementById('submitStancesQuiz')?.addEventListener('click', () => submitSpecificQuiz('stances')); |
|
|
|
|
|
|
|
|
const flipCards = document.querySelectorAll('.flip-card'); |
|
|
flipCards.forEach(card => { |
|
|
|
|
|
if (!card.hasAttribute('tabindex')) { |
|
|
card.setAttribute('tabindex', '0'); |
|
|
} |
|
|
card.addEventListener('keypress', function (e) { |
|
|
|
|
|
if (e.key === 'Enter' || e.key === ' ') { |
|
|
e.preventDefault(); |
|
|
|
|
|
|
|
|
card.focus(); |
|
|
|
|
|
|
|
|
} |
|
|
}); |
|
|
|
|
|
|
|
|
}); |
|
|
}); |
|
|
|
|
|
|
|
|
function submitSpecificQuiz(quizType) { |
|
|
const quizSection = document.getElementById(`${quizType}QuizSection`); |
|
|
if (!quizSection) { |
|
|
console.error(`Quiz section not found for type: ${quizType}`); |
|
|
return; |
|
|
} |
|
|
|
|
|
const questions = quizSection.querySelectorAll(':scope > .space-y-6 > .quiz-question'); |
|
|
const totalQuestions = questions.length; |
|
|
const resultDiv = document.getElementById(`${quizType}Result`); |
|
|
let score = 0; |
|
|
|
|
|
let namePrefix = ''; |
|
|
if (quizType === 'problematics') namePrefix = 'qp'; |
|
|
else if (quizType === 'concepts') namePrefix = 'qc'; |
|
|
else if (quizType === 'stances') namePrefix = 'qs'; |
|
|
else { |
|
|
console.error(`Unknown quiz type: ${quizType}`); |
|
|
return; |
|
|
} |
|
|
|
|
|
resultDiv.innerHTML = ''; |
|
|
clearQuizFormatting(quizSection); |
|
|
|
|
|
questions.forEach((questionDiv, index) => { |
|
|
const questionNumber = index + 1; |
|
|
const inputName = `${namePrefix}${questionNumber}`; |
|
|
const selectedAnswer = questionDiv.querySelector(`input[name="${inputName}"]:checked`); |
|
|
const correctAnswerInput = questionDiv.querySelector(`input[name="${inputName}"][data-correct="true"]`); |
|
|
const questionTitle = questionDiv.querySelector('h4'); |
|
|
|
|
|
|
|
|
if (correctAnswerInput) { |
|
|
correctAnswerInput.parentElement.classList.add('text-green-600', 'font-semibold'); |
|
|
} else { |
|
|
console.warn(`No correct answer defined for question ${inputName}`); |
|
|
} |
|
|
|
|
|
if (selectedAnswer) { |
|
|
if (selectedAnswer.hasAttribute('data-correct')) { |
|
|
score++; |
|
|
} else { |
|
|
|
|
|
selectedAnswer.parentElement.classList.add('text-red-600', 'font-semibold'); |
|
|
} |
|
|
} else { |
|
|
|
|
|
if(questionTitle) questionTitle.classList.add('text-yellow-600', 'font-bold'); |
|
|
} |
|
|
}); |
|
|
|
|
|
const percentage = totalQuestions > 0 ? Math.round((score / totalQuestions) * 100) : 0; |
|
|
|
|
|
let feedbackMessage = ''; |
|
|
let resultClass = ''; |
|
|
let buttonClass = ''; |
|
|
if (quizType === 'problematics') buttonClass = 'bg-blue-600 hover:bg-blue-700'; |
|
|
else if (quizType === 'concepts') buttonClass = 'bg-green-600 hover:bg-green-700'; |
|
|
else if (quizType === 'stances') buttonClass = 'bg-purple-600 hover:bg-purple-700'; |
|
|
else buttonClass = 'bg-gray-600 hover:bg-gray-700'; |
|
|
|
|
|
if (percentage >= 80) { |
|
|
feedbackMessage = `ممتاز! (${score}/${totalQuestions}) إجابات صحيحة.`; |
|
|
resultClass = 'bg-green-100 text-green-800 border border-green-200'; |
|
|
} else if (percentage >= 50) { |
|
|
feedbackMessage = `جيد! (${score}/${totalQuestions}) إجابات صحيحة. تحتاج لمراجعة بسيطة.`; |
|
|
resultClass = 'bg-yellow-100 text-yellow-800 border border-yellow-200'; |
|
|
} else { |
|
|
feedbackMessage = `تحتاج إلى مراجعة هذا القسم. (${score}/${totalQuestions}) إجابات صحيحة.`; |
|
|
resultClass = 'bg-red-100 text-red-800 border border-red-200'; |
|
|
} |
|
|
|
|
|
resultDiv.className = `mt-6 p-4 rounded-lg shadow ${resultClass}`; |
|
|
resultDiv.innerHTML = ` |
|
|
<h4 class="font-bold text-lg mb-2">النتيجة: ${percentage}%</h4> |
|
|
<p class="mb-4">${feedbackMessage}</p> |
|
|
<button onclick="retryQuiz('${quizType}')" class="w-full md:w-auto ${buttonClass} text-white py-2 px-5 rounded-lg font-medium transition duration-300 text-base"> |
|
|
أعد المحاولة <i class="fas fa-redo mr-1"></i> |
|
|
</button> |
|
|
`; |
|
|
|
|
|
resultDiv.scrollIntoView({ behavior: 'smooth', block: 'nearest' }); |
|
|
} |
|
|
|
|
|
function clearQuizFormatting(quizSection) { |
|
|
if (!quizSection) return; |
|
|
const quizContent = quizSection.querySelector(':scope > .space-y-6'); |
|
|
if (!quizContent) return; |
|
|
|
|
|
const labels = quizContent.querySelectorAll('label'); |
|
|
labels.forEach(label => { |
|
|
label.classList.remove('text-green-600', 'text-red-600', 'font-semibold'); |
|
|
}); |
|
|
const questionTitles = quizContent.querySelectorAll('.quiz-question h4'); |
|
|
questionTitles.forEach(title => title.classList.remove('text-yellow-600', 'font-bold')); |
|
|
} |
|
|
|
|
|
function retryQuiz(quizType) { |
|
|
const quizSection = document.getElementById(`${quizType}QuizSection`); |
|
|
const resultDiv = document.getElementById(`${quizType}Result`); |
|
|
|
|
|
if(quizSection && resultDiv) { |
|
|
const radioButtons = quizSection.querySelectorAll('input[type="radio"]'); |
|
|
radioButtons.forEach(rb => rb.checked = false); |
|
|
resultDiv.innerHTML = ''; |
|
|
resultDiv.className = 'mt-6'; |
|
|
clearQuizFormatting(quizSection); |
|
|
quizSection.scrollIntoView({ behavior: 'smooth', block: 'start' }); |
|
|
} else { |
|
|
console.error(`Could not find section or result div for quiz type: ${quizType}`); |
|
|
scrollToElement('body'); |
|
|
} |
|
|
} |
|
|
|
|
|
function scrollToElement(selector) { |
|
|
const element = document.querySelector(selector); |
|
|
if (element) { |
|
|
element.scrollIntoView({ behavior: 'smooth', block: 'start' }); |
|
|
} else { |
|
|
window.scrollTo({ top: 0, behavior: 'smooth' }); |
|
|
} |
|
|
} |
|
|
</script> |
|
|
|
|
|
<p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=methodya/autrui" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body> |
|
|
</html> |
