Monday, June 27, 2016

MVC: Styles is not applied on layout

If your styles are not applied and you got 404 error message and your file path is correct, just change the following path in your web.config:

<add name="BlockViewHandler" path="*" verb="*" preCondition="integratedMode" type="System.Web.HttpNotFoundHandler" />

to

<add name="BlockViewHandler" path="*.cshtml" verb="*" preCondition="integratedMode" type="System.Web.HttpNotFoundHandler" /> 

Friday, June 24, 2016

MVC: Passing objects from main view to partial view

There are many ways to pass object from view to partial view, the following is an example how to pass object throw strong type model.

Suppose you have main page, which has Message partial view. Message is used to display messages and it should be shared between other views.

You have to create Model for Message which includes the following:
1. Message, which is message text
2. Type, message type to control the message css class, errors, success, notifications ... etc

Then you need to create View with strong type Message, and don't forget to check Partial View when you create the view.

put the following lines in the partial view:
@if(Model != null)
{
<div>
    @Model.Message
</div>
}

After that, create a controller and leave it as is.

In the main View. you will have the following:
@model Tuple<EventsRegistrations.Users.Model.ProfileInfo, EventsRegistrations.MVC.Models.Shared.Messages>

@{
    Layout = null;
}
<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>View1</title>
</head>
<body>
    @Html.Partial("Message", Model.Item2)
    <br />
    @Html.Partial("Profile", Model.Item1)
</body>
</html>


And in the controller set the following:
public Messages msg = new Messages();
        public EventsRegistrations.Users.Model.ProfileInfo obj = new Users.Model.ProfileInfo();

        public ViewResult DisplayProfile()
        {
            try
            {
                obj = EventsRegistrations.Users.BLL.Profile.Instance.Get(1);
                throw new Exception("ex");
                return View("Index", Tuple.Create(obj, msg));
            }
            catch (Exception ex)
            {
                msg.Message = MessageHelper.BuildExceptionMessage(ex);
                msg.Type = 1;
                return View("Index",Tuple.Create(obj, msg));
            }
        }


Sunday, June 19, 2016

MVC: Using AutoMapper

When you using 3-tiers architecture with MVC, you need to map the main model with MVC model.
you can do it by multiple ways, the best is to have centralized method to do mapping between two objects in different class.

The AutoMapper library provide this facility, you can download it via visual studio / NuGet pakage.

It is very easy and dynamic.

Example,
Suppose you have ProfileInfo class in the main model, with the following definition:




and ProfileInfo class in MVC model, which inherited the ProfileInfo class without any additional properties


In the controller, you need to map main ProfileInfo with MVC ProfileInfo after getting data from BLL, then present the MVC ProfileInfo result in the View. You should do the following:



Note, this is an example, but the best practice as mentioned is to have centralized method. So, you can put the map config in common method which will be shared between all classes.

En jo y

Thursday, March 10, 2016

PowerBI: Connect on-premise data using enterprise gateway

Microsoft provides different ways to visualize your data. One of them is SaaS PowerBi
It enables you to connect different data sources and visualize your data

If you want to connect on-premise data, you need to install and configure enterprise gateway by following the following steps

1. Go to this site and install enterprise version of gateway:
https://powerbi.microsoft.com/en-us/gateway/

2. Run the exe file installed and follow the wizard








3. Now, you should connect your data source using PowerBI DESKTOP version, then save the file and upload it to PowerBI.com






4. Now, you can create your visuals,








Friday, December 25, 2015

How to expand selected node in treeview C#

When you try to expand selected node in treeview control dynamically, just use the following code:

           // get selected node
            TreeNode parentNode = tvItems.SelectedNode;

           // get top parent node
            while(parentNode.Parent != null)
            {
                parentNode = parentNode.Parent;
            }

           // find node by value path, then expand it
            tvItems.FindNode(parentNode.ValuePath).ExpandAll();



Sunday, July 26, 2015

النقد التقني لنظام التوظيف الخاص بجريدة الرياض http://career.alriyadh.com

تقدم جريدة الرياض نظام التوظيف الذي يساعد الباحثين عن العمل والشركات بقبول وعرض الوظائف بشكل أوتوماتيكي..



1. الشكل الخارجي:
تحتوي الصفحة الرئيسية على لوحة تحكم مميزة تسهل للمتصفح معرفة العناصر الأساسية في النظام مثل الفرص الوظيفية، التسجيل للأفراد والشركات، إحصائيات ... ألخ.

التصميم بسيط ولكن يلاحظ عدم تناسق الألوان في الـ Header و الـ Footer 


أيضاً نجد أن بعض الكتابات غير ظاهرة بشكل صحيح، ولعلها مشكلة بالتصميم المطبق.. كما هو موضح بالصورة التالية:


يوجد مستطيل أبيض، لم يتم الاستفادة منه، وتركه بهذا الشكل غير مناسب:


يحتوي الموقع أيضاً على نسخة إنجليزية.. فنرى عند التحويل على هذه النسخة مجموعة من الأخطاء موضحة كالتالي:


بعض الكتابات لازالت عربية ..
عدم عرض الفرص الوظيفية .. كما هو موجود بالنسخة العربية ..
تداخل بعض النصوص مع الصور ..

2. التقنيات المستخدمة:

تم تطوير الموقع باستخدام ASP.NET كما هو ملاحظ .. ويعتمد الموقع على JavaScript بشكل أساسي لعرض محتوياته -للأسف-.. وهذه المشكلة موجودة في أغلب الأنظمة المطبقة .. حيث نجد الصورة التالية عند تعطيل الـ JavaScript
بعد تعطيل الجافا سكربت، نلاحظ أن الـ IP الخاص بالسيرفر ظهر للمستخدم .. وهذه مشكلة بأمان النظام أيضاً عدا عن كونها خطأ بالتطوير.. 

كما نلاحظ وجود مشكلة بالـ SlideShow الخاص <img src="" alt="" /> .. من المتوقع تعطلعه عن العمل، لكن يجب ألا يظهر الـ HTML الخاص به..

أيضاً نجد مشكلة في بيانات التسجيل .. وذلك لاعتماد ظهورها كلياً على الجافا سكربت ..

3. سهولة التصفح والاستخدام:
يحتوي الموقع على العديد من الروابط التي تسهل عملية التنقل بين جنباته، كما يحتوي على قائمة لعرض الشركات المعلنة للوظائف .. ولكن من الملاحظ أنها غير مفهومة .. حيث توجد فقط شعارات الشركات:



من الملاحظ أيضاً أن الموقع يفتقد إلى دعم المستخدم من خلال تطبيق ToolTip على كل زر أو رابط، وهذا شيء مهم حيث يوفر على المستخدم معرفة مهام كل زر ومعرفة أين سيقوده كل رابط ..

4. التدقيق اللغوي:
قد يكون من الصعب حصر جميع الأخطاء اللغوية بالنظام، أو ضبطها، لوجود عدة أنوع من المستخدمين، صاحب الشركة، وطالب الوظيفة بالإضافة إلى مسؤول النظام .. 

لكن سأقوم بعرض الأخطاء التابعة للنظام كنظام والبعد عن البيانات، entered data

"موقع لعرض الوظائف للمستفيدين من لأفراد والشركات"  ... الأفراد وليس لأفراد.
"إتصل بقسم الوظائف" .. اتصل وليس إتصل
"ادخل رقم الوظيفة" .. أدخل وليس ادخل
"ارشيف الوظائف" .. أرشيف وليس ارشيف
"الاسم الاول" .. الأول وليس الاول
"البريد الالكتروني" .. الإلكتروني وليس الالكتروني

5. الأمان:
يعتبر الأمان في نظام التوظيف الخاص بجريدة الرياض ضعيف للأسباب التالية:

عند تعطيل الجافا سكربت - كما رأينا - يظهر عنوان السيرفر الخاص بالنظام للمستخدم النهائي.. http://46.151.209.69:1010

ملفات النظام الخاصة متاحة للعموم ويمكن تصفحها ومعرفة الإعدادات الخاصة بالنظام:


يبدو أن الشركة المنفذة للنظام وهي cvspro قد نسيت عند نقل النظام إلى بيئة جريدة الرياض من نقل كافة الملفات .. فنجد أن بعض الملفات لازالت تعمل على سيرفرات الشركة:

صفحة مدير النظام متاحة للعموم بمجرد النقل عن طريق الـ URL وذلك لعدم وجود ملف حماية على مستوى الملف:

أخيراً .. يلاحظ أن النظام تم تطويره في مصر ... أو أن المطور مصري الجنسية :)


6. الأداء:
يعتبر الأداء جيد بالنسبة للنظام .. ونلاحظ أن بعض العناصر الغير موجودة في الخادم تعيق أداء أفضل له .. بالإضافة إلى بعض العناصر التي يتم استدعائها من خوادم الشركة المنفذة:

7. نصائح لتطوير الموقع:
الاهتمام أكثر بالجانب الأمني للنظام ... حيث يحتوي على معلومات شركات ومستخدمين..
نقل جميع الملفات الخاصة بالنظام إلى بيئة جريدة الرياض ..
تحسين التصميم بحيث يصبح متناسق مع موقع الجريدة ..

Wednesday, June 17, 2015

النقد التقني لموقع تداول: http://www.tadawul.com.sa

في سلسلة لنقد المواقع الإلكترونية السعودية، سأبدأ بموقع تداول(http://www.tadawul.com.sa/)..
يشمل هذا النقد عدة عناصر منها:
1. الشكل الخارجي.
2. التقنيات المستخدمة.
3. سهولة التصفح والاستخدام.
4. التدقيق اللغوي.
5. الأمان.
6. الأداء.
7. نصائح لتطوير الموقع.

نبدأ على بركة الله ..


1. الشكل الخارجي:
يتميز موقع تداول بالبساطة .. حيث يوفر مجموعة من العناصر المهمة component التي تعرض بالصفحة الرئيسية والتي تهم المتصفح مثل المؤشر العام للسوق، سوق الأسهم، مؤشرات الأسواق ... ألخ..
كما أن تناسق الألوان مريح للعين للتصفح الطويل ..
يحتوي الموقع على عدة روابط يمكن من خلالها التشعب عبر الموقع..

2. التقنيات المستخدمة:
يبدو أن الموقع يعتمد بشكل كبير على الجافا سكربت، حتى بمجرد توقيف الجافا سكربت بالمتصفح يتغير شكل الموقع وتتعطل نسبة كبيرة من أدواته كما هو موضح بالصورة التالية:

نلاحظ تعطل بعض الروابط عن العمل، والشريط الأخضر، بالإضافة لبعض العناصر مثل طباعة الصفحة وغيرها ..

كما نلاحظ تغيير مسمى بعض الروابط إلى أسماء غير مفهومة كما هو موضح بالصورة التالية:


3. سهولة التصفح والاستخدام:
يحتوي الموقع على العديد من الروابط أعلى وأسفل، ويمين ويسار الصفحة مخصصة للتنقل بين جنباته، كما يحتوي على روابط غير مفهومة مثل الروابط التالية:

في القائمة الرئيسية نجد عدم التناسق بالألوان مثلاً عند تمرير المؤشر على كلمة سوق الأسهم، نجد أن الخلفية تتحول إلى زرقاء والكتابة باللون الأبيض، أما عند تمرير المؤشر على كلمة الصكوك والسندات فنجد أن الخلفية لم تتغير إنما لون الخط تغير إلى اللون الأبيض والذي يحجب القراءة تماماً كما هو موضح بالصورة التالية:
عند مربع البحث، في خانة إدخال الرمز يوجد عبارة توجيهية داخل الخانة وهي "أدخل الرمز".. لكن عند الضغط عليها لبدأ الكتابة، نجد أنها لازالت موجودة، فيضطر المستخدم لحذفها ثم إدخال رمز البحث، والمفروض أن تحذف بمجرد الضغط على خانة الإدخال مما يعطي نوع من سهولة الاستخدام:
كما نلاحظ بالجزء السفلي من البحث عبارة "إبحث موقعنا" وهي غير مفهومة! والأنسب أن تكون "البحث في الموقع" .. كما أن لون الخط يجب أن يكون موحد من الجزء الأعلى من البحث ..

يبدو أن القائمة ستطول :) ..

4. التدقيق اللغوي:
يحتوي الموقع على العديد من الأخطاء الإملائية والنحوية على سبيل المثال الكلمات التالية:
الأسهم كتبت الاسهم عدة مرات (بدون همزة) وكتبت الأسهم بالشكل الصحيح أيضاً عدة مرات ..
الاستثمار وليس الإستثمار ..
اتصل بنا وليس إتصل بنا ..
ابحث وليس إبحث ..
الاستعلام وليس الإستعلام ..
الاكتتاب وليس الإكتتاب..
المستثمرين الأجانب الغير مقيمين والعبارة الصحيحة هي المستثمرون الأجانب غير المقيمين..



5. الأمان:
يحتوي الموقع على نسبة كبيرة جدا من الملفات المرفوعة على الخوادم، قد يكون بعضها غير مخصص للعرض أو تكون خطابات بين الشركة المساهمة وموقع تداول ..
أعتذر عن إظهار أي ملف طبقاً لسياسة الخصوصية ..
يحتوي الموقع أيضاً على ملفات نظام قابلة للتعديل والمشاهدة، والتي قد تؤثر على عمل الموقع ..
يحتوي الموقع على صفحات يجب ألا تكون ظاهرة لعموم المتصفحين مثل: اضغط هنا
صفحة البحث يجب أن تكون آمنة أكثر بحيث لايجب أن يقوم بالاتصال بقاعدة البيانات مباشرة قبل التأكد - على الأقل - من أن هناك نص مدخل يجب البحث فيه ..


6. الأداء:
الموقع بطيء نوع ما خاصة الصفحة الرئيسية ويعود ذلك لعدة عوامل منها:
كتابة الجافا سكربت في أعلى الصفحة وهي يجب أن تكون أسفل الصفحة ..
الصور وملفات الجافا سكربت غير مضغوطة .. وبعضها لايتم استدعائها من ذاكرة التخزين المؤقتة..
يوجد عناصر يتم استدعائها من خارج الخادم تؤثر على أداء الموقع مثل العناصر التابعة لـ zedo.com

7. نصائح لتطوير الموقع:
تعديل صيغة الـ HTML واستخدام الـ CSS بشكل صحيح، حيث نجد العديد من الخصائص مطبقة على عناصر الـ HTML بشكل مباشر رغم استخدام الـ CSS
التدقيق الإملائي والنحوي لكامل الموقع.
تعديل الـ CSS والصور والروابط
دعم التصفح بدون جافا سكربت بدون تعطل المهام الأساسية عن العمل ..
حفظ الملفات في قاعدة البيانات بدل من حفظها على الخوادم، والتأكد من خاصية الأمان لكل مجلد يحتوي على ملفات
استخدام الـ Captcha بكل حدث يقول بالاتصال بقاعدة البيانات مباشرة للحد من الهجمات الوهمية.
ضغط ملفات الصور والجافا سكربت مما يتيح تصفح أسرع.
نقل العناصر الخارجية مثل zedo.com إلى الخادم الخاص بموقع تداول.
حذف الروابط الغير هامة الموجودة في HTML والتي تظهر عند عرض مصدر الصفحة..

هذه بعض من الملاحظات للموقع، لاشك يحتاج لعمل كبير ليوازي قيمته كموقع يزوره الآلاف يومياً ..