����JFIF�����%%��� }!1AQa"q2���#B��R��$3br� %&'()*456789:CDEFGHIJSTUVWXYZcdefghijstuvwxyz������������������������������������������������������������������������� w!1AQaq"2�B���� #3R�br� $4�%�&'()*56789:CDEFGHIJSTUVWXYZcdefghijstuvwxyz�������������������������������������������������������������������������� ?��(�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� �@���o�E��?�?����ο�U_�P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@ _�z����� ������g_ڪ�?��(�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (��?�/�=[�Qe�����g����U@ ��P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@ �� ��(���g���Y������� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� �V��Y|����Y����UP��@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P����,�����,��u������� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (���տ�_�����:��T�~�@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@������/��� ?��j���h�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� �@���o�E��?�?����ο�U_�P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@ _�z����� ������g_ڪ�?��(�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (��?�/�=[�Qe�����g����U@ ��P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@ �� ��(���g���Y������� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� �V��Y|����Y����UP��@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P����,�����,��u������� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (���տ�_�����:��T�~�@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@������/��� ?��j���h�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� �@���o�E��?�?����ο�U_�P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@ _�z����� ������g_ڪ�?��(�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (��?�/�=[�Qe�����g����U@ ��P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@ �� ��(���g���Y������� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� �V��Y|����Y����UP��@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P����,�����,��u������� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (���տ�_�����:��T�~�@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@������/��� ?��j���h�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� �@���o�E��?�?����ο�U_�P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@ _�z����� ������g_ڪ�?��(�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (��?�/�=[�Qe�����g����U@ ��P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@ �� ��(���g���Y������� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� �V��Y|����Y����UP��@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P����,�����,��u������� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (���տ�_�����:��T�~�@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@������/��� ?��j���h�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� �@���o�E��?�?����ο�U_�P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@ _�z����� ������g_ڪ�?��(�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (��?�/�=[�Qe�����g����U@ ��P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@ �� ��(���g���Y������� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� �V��Y|����Y����UP��@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P����,�����,��u������� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (���տ�_�����:��T�~�@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@������/��� ?��j���h�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� �@���o�E��?�?����ο�U_�P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@ _�z����� ������g_ڪ�?��(�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (��?�/�=[�Qe�����g����U@ ��P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@ �� ��(���g���Y������� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� �V��Y|����Y����UP��@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P����,�����,��u������� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (���տ�_�����:��T�~�@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@������/��� ?��j���h�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� �@���o�E��?�?����ο�U_�P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@ _�z����� ������g_ڪ�?��(�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (��?�/�=[�Qe�����g����U@ ��P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@ �� ��(���g���Y������� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� �V��Y|����Y����UP��@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P����,�����,��u������� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (���տ�_�����:��T�~�@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@������/��� ?��j���h�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� �@���o�E��?�?����ο�U_�P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@ _�z����� ������g_ڪ�?��(�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (��?�/�=[�Qe�����g����U@ ��P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@ �� ��(���g���Y������� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� �V��Y|����Y����UP��@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P����,�����,��u������� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (���տ�_�����:��T�~�@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@������/��� ?��j���h�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� �@���o�E��?�?����ο�U_�P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@ _�z����� ������g_ڪ�?��(�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (��?�/�=[�Qe�����g����U@ ��P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@ �� ��(���g���Y������� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� �V��Y| �� O�������h�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� �@��o�E��/�?��ߵE_�P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@ ?�z�����������goڢ�?��(�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (��?� �=[�Qg� ����o����Q@ ��P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@ �� ��(���g���Y������� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (���V��Y�����[����TP��@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P����,���|-��v��(���� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (���տ�������;~��P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@�������?�_�� ���j������ (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� �@��o�E��/�?��ߵE_�P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@ ?�z�����������goڢ�?��(�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (��?� �=[�Qg� ����o����Q@ ��P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@ �� ��(���g���Y������� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (���V��Y�����[����TP��@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P����,���|-��v��(���� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (���տ�������;~��P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@�������?�_�� ���j������ (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� �@��o�E��/�?��ߵE_�P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@ ?�z�����������goڢ�?��(�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (��?� �=[�Qg� ����o����Q@ ��P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@ �� ��(���g���Y������� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (���V��Y�����[����TP��@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P����,��������ο�O�P��@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P����,�����,��u������� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (���տ�_�����:��T�~�@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@������/��� ?��j���h�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� �@���o�E��?�?����ο�U_�P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@ _�z����� ������g_ڪ�?��(�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (��?�/�=[�Qe�����g����U@ ��P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@ �� ��(���g���Y������� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� �V��Y|����Y����UP��@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P����,�����,��u������� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (���տ�_�����:��T�~�@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@������/��� ?��j���h�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� �@���o�E��?�?����ο�U_�P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@ _�z����� ������g_ڪ�?��(�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (��?�/�=[�Qe�����g����U@ ��P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@ �� ��(���g���Y������� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� �V��Y|����Y����UP��@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P����,�����,��u������� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (���տ�_�����:��T�~�@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@������/��� ?��j���h�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� �@���o�E��?�?����ο�U_�P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@ _�z����� ������g_ڪ�?��(�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (��?�/�=[�Qe�����g����U@ ��P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@ �� ��(���g���Y������� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� �V��Y|����Y����UP��@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P����,�����,��u������� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (���տ�_�����:��T�~�@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@������/��� ?��j���h�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� �@���o�E��?�?����ο�U_�P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@ _�z����� ������g_ڪ�?��(�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (��?�/�=[�Qe�����g����U@ ��P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@ �� ��(���g���Y������� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� �V��Y|����Y����UP��@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P����,�����,��u������� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (���տ�_�����:��T�~�@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@������/��� ?��j���h�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� �@���o�E��?�?����ο�U_�P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@ _�z����� ������g_ڪ�?��(�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (��?�/�=[�Qe�����g����U@ ��P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@ ��� ��� k� w���~���v��������� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (�� (���տ�_�����:��T�~�@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@P@������/��� ?��j�?�5o�%��?��� g����U@�� ���&O3���� �a�;�^=�wH���D��/��*� �fX�I���,������k?g_���?�5o�%��?��� g����U@�F�����������*�� ����?�o�}��Τ~g�� ʀ�#V��Y������~ο�T�j��K/� ������������z��������#;�~���A �;�� � w�F�����������*���տ��_�@�o��5����EU ������ ������u�誠��W��[�����������O��?jW ���@��տ���@�o��5����EM ������������v�訠�#V��Y�������������V��Zv��~����v w�~���c�Q@ ���,��~���kgo���?�5o�%��/��� o����Q@��o�%�>�ߤ�� �߳����S������?��o�%�~�ߠ�d�߳����S����g�P��j��K?� _������������[� g�D ����[�;�TP7� ��������'Ѿ���=� �;/�P��j��K?� _������������[� g�D ����[�;�TP���,��~���kgo���a������۔� ��B{ � ��ea�`T �+ �n%Ц �����j��K?� _������������[� g�D ����[�;�TP���,��~���kgo����?���%�/�~�����#����x��c �~�q�v�t`ȫ��_'h�� ����� ��'�]�;{s� Pp=N= 5���%���� �ڜs�����=���J� � A@�����Kp�b��}��X�����4g v+:�Բ�+60�ʩ,� @�����������I �uO� ����ToUv��bgUl�cP�T?�#V��Y������������j��K?� _����������!��X��]���������TK�|4��`� ��#��P\y��aa >NgL��j��K?� _������������[� g�D ����[�;�TP���,��~���kgo���o�F�����$��ہ�� ��vݞr6��S�q''*02���[� g�D ����[�;�TP���,��~���kgo���?�5o�%��/��� o����Q@�F�����������*(��տ���@�o��5����EE ������������v�訠�� ������~1�o� �� }G�L�������5o�%��/��� o����Q@�F�����������*(��տ���@�o��5����EE5����%�˷���r�v� ���y�\~���)(?0���=[� i����>� �gc��N=����5o�%��/��� o����Q@�F�����������*(��W��Z�l����m#���X�wn_�j`0C6윅����5o�%��/��� o����Q@��տ��y9��� gbO�G�5@�n�>���#V��Y������~ο�T��V��Y����9� gc��s�T.�?Z_��[� e�D����Y�:��UP���,������k?g_����_�=_� n�~~�rI������w�,"~ԓ�!72���)( u��#V��Y������~ο�T�j��K/� ��������������K
�����Kr_���}�De>~��Z=��pjX�n[p(�"� �a,Ub�/�×�<����;��<�����K>��o���[�:����V���,��$ ��ϧ�*��� ��5O����տ��_�@�o��5����EU5��o�%����?�ꜜm�_�;>Gbs�S�����@��տ��_�@�o��5����EU ��տ��}�~�����v?�������-��o�l ��~�ȥ�v����r��B1���@��տ���A�?��� �ggP��c�S�`@%�*����տ��_�@�o��5����EU ������ ������u�誠7� ��� O� ��!c�|0��ёv��4 �+�X�Vx�RX3��8����K>��o���[�:���u#�x��#V��Y������~ο�T�j��K/� ������������[� e�D����Y�:��UP���,������k?g_���O��[� g�D ����[�:��T��=_� k����~��k����c�;����.8� ���c� �z��Ͽ�/��zc�o����F?Z_��[� e�D����Y�:��UP���,������k?g_���C���,�v����v�o���H������( �z���w�/�� ���v ��T.G��Ϡ���տ��_�@�o��5����EU ������ ������u�誠��W��[��'����%��o� ��:�Cڕ�R̀���j����� ����?�o���[�;������g 0q�?��o�%�>o�_��>� gf ����~4������� ������u�誠 �z��� 7�/�� o������� ��_��[� e�D����Y�:��UP���,������k?g_���C���,�|�����o��;�Ԟ��9�l�z��ؠ3|��O�X�~���;~�q����Z�F�����������*���տ��_�@�o��5����EU!��տ��}�~����-��G��I�T������� ������u�誠�#V��Y������~ο�T�j��K/� ����������#�=_� n|���KbB� gtdM��"�ڒA#n�63�6�m�P�����,���/��� gS�u����#�9��5o�%��?��� g����U@��o�%�o�_�����u ��'���� ���?��o��� ���3��?go� ��|m�ڇ���-S�O��x��>���^�����7����x�]_�>�qke>���m��4��7P�Yހ��
0byt3m1n1
0byt3m1n1
Path:
/
hermes
/
bosweb
/
web
/
web
/
sb_web
/
web
/
b2651
/
artied.com
/
digital4u
/
dcards
/
[
Home
]
File: cardsAdmin.html
<!-- 1. not forget to check that card status in card.html ( > default card ) is 'on' in order to be displayed in device. if status is 'paused' or 'pending' ( >> payment ) display appropriated message. --> <HTML style='font-family:arial; font-size:14px; color:#ccc;'> <HEAD> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta name="DESCRIPTION" content="" /> <meta name="KEYWORDS" content="" /> <meta name="RATING" content="GENERAL" /> <meta name="ROBOTS" content="INDEX, FOLLOW" /> <meta name="REVISIT-AFTER" content="1 DAYS" /> <meta name="RESOURCE-TYPE" content="DOCUMENT" /> <meta name="DISTRIBUTION" content="GLOBAL" /> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0"> <meta name="apple-mobile-web-app-capable" content="yes"> <meta name="apple-mobile-web-app-status-bar-style" content="black"> <TITLE>DCards Admin Cards</TITLE> <STYLE> body{ background:linear-gradient(45deg,#00f,#909);; overflow:hidden; } input{ outline:none; } input[type="color"] { border-radius: 5px; padding: 0; border: 5px solid #DDD; } input[type="color"]::-moz-color-swatch { border: none; } input[type="color"]::-webkit-color-swatch-wrapper { padding: 0; border-radius: 0; } input[type="color"]::-webkit-color-swatch { border: none; } </STYLE> <script src="https://code.jquery.com/jquery-latest.min.js"></script> <!--script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.11.4/gsap.min.js"></script--> <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/latest/TweenMax.min.js"></script> <link rel="icon" type="image/x-icon" href="/files/images/favicon.ico"> </HEAD> <SCRIPT> // variables declaration ..: { var bLogged; var cRow; var user,cardID; var userAdmin; var cardInfo,cardGallery,cardDesign; var action; var userLastName, userFirstName, userBusinessName, userSlogan, userPhone, userFax, userCellular, userStreet, userCity, userCountry, userMail, userWebsite, userFacebook, userInstagram, userTwitter, userLinkedIn; var userGalleriesA; var cTemplateCardID, bTemplateChanged; var designXML, designChartXML, designCanvasXML, designButtonsXML, designTitleXML, designLogoXML; var colors,color_1,color_2,color_3,color_4,color_5; var logoX, logoXPerc, logoY, logoYPerc, logoSize, logoBkgColor, logoBkgTrans, logoBorderWidth, logoBorderColor, logoBorderTrans, logoBorderStyle, logoBorderRadius, logoBorderRotation, logoHeight, logoWidth; var xmlContainer,xmlLocation,xmlCall,xmlWrite,xmlGal,xmlWeb,xmlSocial,xmlShare,xmlContact; var buttonTextColor, buttonIconColor, buttonBkgColor, buttonBkgTrans, buttonSize, buttonBorderWidth, buttonBorderColor, buttonBorderTrans, buttonBorderStyle, buttonBorderRadius, buttonRotation; var buttonContainerX, buttonContainerY, buttonContainerW, buttonContainerH; var buttonLocationX,buttonLocationY,buttonCallX,buttonCallY,buttonWriteX,buttonWriteY; var buttonGalX,buttonGalY,buttonWebX,buttonWebY,buttonSocialX,buttonSocialY; var buttonShareX,buttonShareY,buttonContactX,buttonContactY; var canvasBkgColor, canvasBkgTrans, canvasBorderColor, canvasBorderTrans, canvasCurve, canvasBorderStyle, canvasHandleRY, canvasHandleLY, canvasHandleMX, canvasHandleMY; var titleNameColor,titleBusinessColor,titleSloganColor,titleX,titleY,titleW,titleH,titleRotation; var myDesign; var cImageBut,icondataurl,logodataurl,topImagedataurl; var logoForVCFCard; var userCardsA; var win,timeid; var requestID,userOrder; var shareCredits,cstatus;// << cstatus: card status 'on','paused','pending'... } function activityLog(vText){ // } // // window functions part..: { window.onresize = windowResizeHandler; window.onclick = windowClickHandler; function windowResizeHandler(e){ activityLog('windowResizeHandler'); windowResize(); } function windowResize(){ activityLog('windowResize'); var w = document.body.offsetWidth; var h = document.body.offsetHeight; mainContent.style.height = h - banner.clientHeight - footer.clientHeight; //var display = styleDesignContainer.style.display; //styleDesignContainer.style.display = 'block'; styleDesignContainer.style.height = mainContent.offsetHeight - 3 * 50 - 110; //styleDesignContainer.style.display = display; } function windowClickHandler(e){ activityLog('windowClickHandler'); if( userLogForm.style.display != 'none' && ( e.target.id != 'userLogB' || !userLogB.contains(e.target) ) ){ console.log('target: ' + e.target.id + '/ ' + userLogForm.style.display ); closeUserLogForm(); } if( selectCardForm.style.display != 'none' ){ closeSelectCardForm(); } } } // function init(e){ var url = document.location.href; if( url.indexOf('user') != -1 ){ user = url.split('user=')[1].split('&')[0]; loadUserCardsList(); }else{ showLogForm(); } $.post('https://www.dcards.click/getTemplatesList.php',{},function(data){ var display = cardDesignRow.style.display; cardDesignRow.style.display = 'table-row'; var h = 0.9 * styleDesignContainer.offsetHeight; var array = data.split('-')[1].split('|'); var templatesA=[]; for( var i=0; i<array.length; i++ ){ var item = array[i]; var res = item.split('~'); var value = res[0]; var displayName = res[1]; templatesA.push({value:value,displayName:displayName}); } for( var i=0; i<templatesA.length;i++ ){ var div = document.createElement('div'); div.style.float = 'right'; //div.style.background = 'blue'; div.style.width = '48%'; div.style.height = h + 'px';//'50px'; div.style.margin = '1%'; div.templateName = templatesA[i].value; div.templateDisplayName = templatesA[i].displayName; styleDesignContainer.appendChild(div); var table = document.createElement('table'); table.style.width = '100%'; table.style.height = '100%'; var row = table.insertRow(); var cell = row.insertCell(); cell.align = 'center'; div.appendChild(table); var im = document.createElement('img'); im.style.height = h;//'90%'; im.src = 'https://www.dcards.click/files/templates/' + templatesA[i].value + '.png?r=' + Math.random(); cell.appendChild(im); div.onclick = cardStyleSelectionHandler; } cardDesignRow.style.display = display; }); windowResize(); TweenMax.to( bannerTable,0.7,{css:{ opacity:1 , top:0}}); unblurAnim(); var display = designDivContainer.style.display; designDivContainer.style.display = 'block'; bkgCanvas.width = designDiv.offsetWidth; bkgCanvas.height = designDiv.offsetHeight; designDivContainer.style.display = display; activityLog('init'); } // login part ..: { function showLogFormHandler(e){ activityLog('showLogFormHandler'); showLogForm(); } function showLogForm(){ activityLog('showLogForm'); logDiv.style.display = 'block'; TweenMax.to(logDiv,0.7,{css:{opacity:1 , top:0 },onComplete:function(){ logNameT.focus(); }}); } function closeLogFormHandler(e){ activityLog('closeLogFormHandler'); closeLogForm(); } function closeLogForm(){ activityLog('closeLogForm'); TweenMax.to(logDiv,0.7,{css:{opacity:1 , top:'100%'},onComplete:function(){ logDiv.style.display = 'none'; logNameT.value = logPasswordT.value = ''; applyLogB.style.opacity = 0.5; }}) } function showPasswordHandler(e){ activityLog('showPasswordHandler'); if( e.currentTarget.innerHTML == 'ראה סיסמה' ){ logPasswordT.type = 'text'; e.currentTarget.innerHTML = 'הסתר סיסמה'; }else{ logPasswordT.type = 'password'; e.currentTarget.innerHTML = 'ראה סיסמה'; } } function logTextHandler(e){ activityLog('logTextHandler'); if(logNameT.value != '' && logPasswordT.value != '' ){ applyLogB.style.opacity = 1; }else{ applyLogB.style.opacity = 0.5; } } function applyLogHandler(e){ activityLog('applyLogHandler'); if( e.currentTarget.style.opacity == 0.5 ) return; e.currentTarget.style.opacity = 0.5; user = logNameT.value; var password = logPasswordT.value; $.post('log.php',{user:user,password:password}, function(data){ if( data.indexOf( 'log success' ) != -1 ){ bLogged = true; userLogB.src = 'files/images/unlog.png'; var info = data.split('-')[1]; var res = info.split('~'); userMail = res[0]; userCellular = res[2]; userBusinessName = res[3]; userFirstName = res[4]; userLastName = res[5]; userName = logNameT.value; closeLogForm(); addNewCardB.style.opacity = 1; myDesign = undefined; loadUserCardsList(); }else{ applyLogB.style.opacity = 1; if( data.indexOf( 'wrong password' ) != -1 ){ window.alert('סיסמה שגיוה. אנא הקלד מחדש את סיסמתך ונסה שוב'); logPasswordT.value = ''; }else{ if( data.indexOf( 'user not found' ) != -1 ){ window.alert('פרטיך לא נמצאו במערכת. אנא וודא את שם משתמש (מיילך) ונסה שוב') } } } }); } function userLogHandler(e){ activityLog('userLogHandler'); if( !bLogged ){ showLogForm(); }else{ // show logged form options...: var rct = e.currentTarget.getBoundingClientRect(); showUserLogForm(rct); } } function showUserLogForm(vRct){ activityLog('showUserLogForm'); var rct = vRct; userLogForm.style.display = 'block'; userLogForm.style.left = rct.left - userLogForm.offsetWidth - 2; TweenMax.to( userLogForm,0.7,{css:{opacity:1,top:0}}); } function closeUserLogForm(){ activityLog('closeUserLogForm'); TweenMax.to(userLogForm,0.7,{css:{opacity:0,top:-110},onComplete:function(){ userLogForm.style.display = 'none'; }}) } function myAccountHandler(e){ activityLog('myAccountHandler'); // } function unlogHandler(e){ activityLog('unlogHandler'); document.location.reload(); /*cardsListL.innerHTML = ''; cardsListT.disabled = true; bLogged = false; userLogB.src = 'files/images/user.png'; addNewCardB.style.opacity = 0.5; window.alert('התנקת בהצלחה. עליך להזדהות לכל פעולה בדף זה.'); */ } } // // General part ..: { function unblurAnim(){ activityLog('unblurAnim'); var blurElement = {a:20};//start the blur at 0 pixels TweenMax.to( blurElement, .7, {a:0, onUpdate:applyBlur}); //here you pass the filter to the DOM element function applyBlur(){ TweenMax.set(['.box'], {webkitFilter:"blur(" + blurElement.a + "px)",filter:"blur(" + blurElement.a + "px)"}); }; } function showRow( e , vRowName){ activityLog('showRow'); if( e.currentTarget.parentNode.style.opacity == 0.5 ) return; if( cRow ){ cRow.style.display = 'none'; if( cRow.id.toLowerCase().indexOf('info') != -1 ){ infoArrow.style.transform = 'scale(-1,1) rotate(0deg)'; } if( cRow.id.toLowerCase().indexOf('gallery') != -1 ){ galleryArrow.style.transform = 'scale(-1,1) rotate(0deg)'; } if( cRow.id.toLowerCase().indexOf('design') != -1 ){ designArrow.style.transform = 'scale(-1,1) rotate(0deg)'; } } if( cRow ){ if(cRow.id == vRowName && cRow.style.display == 'none' ){ cRow = undefined; return; } } var cell = cardInfoRow.cells[0]; h = mainContentDiv.offsetHeight; var nh = h - 160; var row = document.getElementById(vRowName); cRow = row; cRow.style.display = 'table-row'; if( cRow.id.toLowerCase().indexOf('info') != -1 ){ infoArrow.style.transform = 'scale(-1,1) rotate(90deg)'; } if( cRow.id.toLowerCase().indexOf('gallery') != -1 ){ galleryArrow.style.transform = 'scale(-1,1) rotate(90deg)'; } if( cRow.id.toLowerCase().indexOf('design') != -1 ){ designArrow.style.transform = 'scale(-1,1) rotate(90deg)'; } var cell = cRow.cells[0]; cell.style.height = nh + 'px'; cardInfoDiv.style.height = nh + 'px'; galleryDiv.style.height = nh + 'px'; } function loadUserCardsList(){ activityLog('loadUserCardsList'); clearAllFields(); $.post('https://www.dcards.click/getUserCardsList.php',{user:user},function(data){ if( data.indexOf('done') != -1 ){ var list = data.split('-')[1]; if( list.substr(0,1) == '|') list = list.substr(1); if( list.substr(list.length-1) == '|' ) list = list.substr(0,list.length-1); var array = list.split('|'); userCardsA = array.slice(); //console.log(list); cardsListL.innerHTML = ''; for( var i=0; i<array.length; i++ ){ var res = array[i].split('~'); var option = document.createElement('option'); option.innerHTML = res[0]; if( res[1] == 'paused' ){ option.disabled = true; } cardsListL.appendChild(option); } if( cardsListL.childNodes.length > 0 ){ cardsListT.disabled = false; }else{ cardsListT.disabled = true; } removeCardB.style.opacity = 1; showSelectCardForm(); } }); } function getCardStatus(vCardID){ activityLog('get user card status'); for( var i=0; i<userCardsA.length; i++ ){ var cardA = userCardsA[i].split('~'); if( cardA[0] == vCardID ){ var cardStatus = cardA[1]; selectedCardActivate.style.display = 'none'; selectedCardEditStatus.style.display = 'none'; //selectedCardMoreCredit.style.display = 'none'; selectedCardStatusT.innerHTML = cardStatus; if( cardStatus == 'on' || cardStatus == 'paused' ){ selectedCardEditStatus.style.display = 'table-cell'; //console.log(cardStatus); } if( cardStatus == 'pending' ) selectedCardActivate.style.display = 'table-cell'; return cardA[1]; } } return ''; } function getCardCredit(){ $.post('https://www.dcards.click/getCardCredit.php',{user:userMail,cardid:cardID},function(data){ if( data.indexOf('done') != -1 ){ var credit = (data.split('-')[1]); selectedCardCreditT.innerHTML = credit; selectedCardMoreCredit.style.display = 'table-cell'; } }) } function convertIm2Canvas(vCollection){ activityLog('convertIm2Canvas'); //collection = vCollection; var collection = document.getElementsByTagName('img'); for( var i=collection.length-1; i>-1; i-- ){ var im = collection[i]; if( im.src.indexOf('icons') != -1 ){ var cnv = document.createElement('canvas'); cnv.width = im.width; cnv.height= im.height; cnv.getContext('2d').drawImage(im,0,0,cnv.width,cnv.height,0,0,im.width,im.height); cnv.setAttribute( 'name' , 'canvasButtonsGroup' ); var pN = im.parentNode; im.remove(); pN.appendChild(cnv); } } } function convertCanvas2Color(vCanvas,vColor){ activityLog('convertCanvas2Color'); var color = vColor; var canvas = vCanvas; var rgb = convert2RGBColor(color); var r = rgb.r; var g = rgb.g; var b = rgb.b; var ctx = canvas.getContext('2d'); var imD = ctx.getImageData(0,0,canvas.width,canvas.height); var data = imD.data; for( var i=0; i<data.length; i+=4 ){ if( data[i+3] != 0 ){ data[i] = r; data[i+1] = g; data[i+2] = b; } } ctx.putImageData(imD,0,0); } function convert2RGBColor( vColor ){ activityLog('convert2RGBColor'); var color = vColor; if( color.substr(0,1) == '#' ){ return convertHex2RGB(color); } if( color.substr(0,3) == 'rgb' ){ return convertRGBString2RGB(color); } // ? hsl,... } function convertRGBString2RGB(vColor){ activityLog('convertRGBString2RGB'); var color = vColor; var rgb = color.split('(')[1]; rgb = rgb.split(')')[0]; var res = rgb.split(','); var r = parseInt(res[0]); var g = parseInt(res[1]); var b = parseInt(res[2]); return { r:r,g:g,b:b } } function convertHex2RGB(vHexColor){ activityLog('convertHex2RGB'); var hexColor = vHexColor; if( hexColor.substr(0,1) == '#' ) hexColor = hexColor.substr(1); if( hexColor.length == 3 ){ var r = hexColor.substr(0,1); var g = hexColor.substr(1,1); var b = hexColor.substr(2,1); } if( hexColor.length == 6 ){ var r = hexColor.substr(0,2); var g = hexColor.substr(2,2); var b = hexColor.substr(4); } if( r.length == 1 ) r = '0' + r; if( g.length == 1 ) g = '0' + g; if( b.length == 1 ) b = '0' + b; r = parseInt( '0x' + r ); g = parseInt( '0x' + g ); b = parseInt( '0x' + b ); return {r:r,g:g,b:b} } function convertRGBString2HexColor(vColor){ activityLog('convertRGBString2HexColor'); if( vColor.indexOf('rgb') != -1 ){ var rgb = vColor.split('(')[1]; rgb = rgb.split(')')[0]; var array = rgb.split(','); var r = parseInt(array[0]).toString(16); var g = parseInt(array[1]).toString(16); var b = parseInt(array[2]).toString(16); if( r.length == 1 ) r = '0' + r; if( g.length == 1 ) g = '0' + g; if( b.length == 1 ) b = '0' + b; return '#' + r.toUpperCase() + g.toUpperCase() + b.toUpperCase(); }else{ return vColor; } } function loadTopImage(){ activityLog('loadTopImage'); var path = 'https://www.dcards.click/clients/'+user+'/cards/'+cardID+'/files/images/topImage.png'; var im = document.createElement('img'); im.style.width = topImageDivContainer.offsetWidth; im.style.height = topImageDivContainer.offsetHeight; if( topImageDivContainer.childNodes.length > 0 ) topImageDivContainer.firstChild.remove(); topImageDivContainer.appendChild(im); im.src = path; /*$.post( 'https://www.dcards.click/getCardImage.php',{type:'topImage',user:user,cardid:cardID},function(data){ if( data.indexOf('done') != -1 ){ var res = data.split('-'); var imData = res[res.length-1]; var im = document.createElement('img'); im.src = imData; console.log(imData); if( topImageDivContainer.childNodes.length > 0 ) topImageDivContainer.firstChild.remove(); //im.style.background = 'red'; im.style.width = topImageDivContainer.offsetWidth; topImageDivContainer.appendChild(im); } }); */ } function loadLogo(){ activityLog('loadLogo'); var path = 'https://www.dcards.click/clients/'+user+'/cards/'+cardID+'/files/images/logo.png?r='+Math.random(); if( logoDivContainer.childNodes.length > 0 ) logoDivContainer.firstChild.remove(); logoDivContainer.style.maxWidth = logoDivContainer.offsetWidth; logoDivContainer.style.maxHeight = logoDivContainer.offsetHeight; var im = document.createElement('img'); logoDivContainer.appendChild(im); if( logoXPerc == 'left' ){ oLogoPosL.checked = true; logoDivContainer.style.left = '20px'; } if( logoXPerc == 'center' ){ oLogoPosM.checked = true; logoDivContainer.style.left = Math.round( ( designDiv.offsetWidth - logoDivContainer.offsetWidth ) / 2 ) + 'px'; } if( logoXPerc == 'right' ){ oLogoPosR.checked = true; logoDivContainer.style.left = ( designDiv.offsetWidth - logoDivContainer.offsetWidth - 20 ) + 'px'; } // next keeped for compatibility..: if( logoXPerc != 'left' && logoXPerc != 'center' && logoXPerc != 'right' ){ logoDivContainer.style.left = logoXPerc; } logoDivContainer.style.top = logoYPerc; // restore previous..: logoDivContainer.style.transform = 'rotate(0Deg)'; var rct = logoDivContainer.getBoundingClientRect(); im.style.width = rct.width - 11; im.style.height = rct.height - 7; // apply rotation..: logoDivContainer.style.transform = 'rotate(' + logoBorderRotation + ')'; var rct_rotated = logoDivContainer.getBoundingClientRect(); dx = -Math.round( ( rct_rotated.width - rct.width ) / 2 ); dy = -Math.round( ( rct_rotated.height - rct.height ) / 2 ); sx = rct_rotated.width/rct.width; sy = rct_rotated.height/rct.height; var transformStg = 'rotate(-' + logoBorderRotation + ') scale(' + sx + ',' + sy + ')';// + ' translate(' + dx + 'px,' + dy + 'px)'; im.style.transform = transformStg; im.src = path; /* $.post( 'https://www.dcards.click/getCardImage.php',{type:'logo',user:user,cardid:cardID},function(data){ var res = data.split('-'); var imData = res[res.length-1]; var im = document.createElement('img'); im.src = imData; console.log(imData); if( logoDivTable.childNodes.length > 0 ) logoDivTable.firstChild.remove(); //im.style.background = 'green'; //logoDivTable.style.background = 'blue'; im.style.width = logoDivTable.offsetWidth; logoDivTable.appendChild( im ); }); */ } function logoPositionHandler(e){ if( e.currentTarget.id == 'oLogoPosL' ){ logoXPerc = 'left'; logoDivContainer.style.left = '20px'; } if( e.currentTarget.id == 'oLogoPosM' ){ logoXPerc = 'center'; logoDivContainer.style.left = ( Math.round( designDiv.offsetWidth - logoDivContainer.offsetWidth )/2 ) + 'px'; } if( e.currentTarget.id == 'oLogoPosR' ){ logoXPerc = 'right'; logoDivContainer.style.left = ( designDiv.offsetWidth - logoDivContainer.offsetWidth - 20 ) + 'px'; } saveB.style.opacity = 1; saveB.style.filter = 'grayscale(0%)'; } function drawCanvas(){ activityLog('drawCanvas'); bkgStrokeStyle = colors[canvasBorderColor]; // canvasBorderStyle;//colors[bkgBorderColorL.selectedIndex]; bkgLineWidth = parseFloat(canvasBorderWidth);//bkgBorderWidthS.value);//4; bkgFillStyle = colors[canvasBkgColor]; var w = designDiv.offsetWidth; var h = designDiv.offsetHeight; var pointsA = [ -bkgLineWidth, Math.round(parseFloat(cHandleLY) * h/100 ) ,Math.round(parseFloat(cHandleMX) * w/100 ), Math.round(parseFloat(cHandleMY) * h / 100 ),designDiv.offsetWidth + bkgLineWidth, Math.round( parseFloat(cHandleRY) * h/100 ) ]; tension = (parseFloat(canvasCurve)/100); numOfSegments = 16;//+ Math.round( 16 * ( bkgAffineS.value/100) ); isClosed = false; ctx = bkgCanvas.getContext('2d'); ctx.strokeStyle = bkgStrokeStyle; ctx.fillStyle = bkgFillStyle; ctx.lineWidth = bkgLineWidth; drawCurve( ctx , pointsA, tension, isClosed, numOfSegments ); var left = -bkgLineWidth; var right = designDiv.offsetWidth + bkgLineWidth;// - bkgLineWidth; var bottom = designDiv.offsetHeight + bkgLineWidth;// - bkgLineWidth; var top = pointsA[1]; ctx.lineTo( right , bottom ); ctx.lineTo( left , bottom ); ctx.lineTo( left , top ); //if(canvasBkgTrans != 'true' ){ ctx.fill(); //console.log( 'canvas filled..: ' + pointsA ); //} if(canvasBorderTrans != 'true' ){ ctx.stroke(); //console.log('canvas stroked' ); } function drawLines( ctx , pts ) { // clear canvas..: var w = ctx.canvas.width; var h = ctx.canvas.height; ctx.canvas.width = w; ctx.canvas.height = h; // set again values after clear ..: ctx.strokeStyle = bkgStrokeStyle; ctx.fillStyle = bkgFillStyle; ctx.lineWidth = bkgLineWidth; // draw line curve points..: ctx.moveTo(pts[0], pts[1]); for(i=2;i<pts.length-1;i+=2){ ctx.lineTo(pts[i], pts[i+1]); } } function drawCurve( ctx, ptsa , tension , isClosed, numOfSegments ) { ctx.beginPath(); var res = getCurvePoints(ptsa, tension, isClosed, numOfSegments ); curveLinePoints = res.slice(); drawLines( ctx , res ); } function getCurvePoints(pts, tension, isClosed, numOfSegments) { // use input value if provided, or use a default value tension = (typeof tension != 'undefined') ? tension : 0.5; isClosed = isClosed ? isClosed : false; numOfSegments = numOfSegments ? numOfSegments : 16; var _pts = [], res = [], // clone array x, y, // our x,y coords t1x, t2x, t1y, t2y, // tension vectors c1, c2, c3, c4, // cardinal points st, t, i; // steps based on num. of segments // clone array so we don't change the original // _pts = pts.slice(0); // The algorithm require a previous and next point to the actual point array. // Check if we will draw closed or open curve. // If closed, copy end points to beginning and first points to end // If open, duplicate first points to befinning, end points to end if (isClosed) { _pts.unshift(pts[pts.length - 1]); _pts.unshift(pts[pts.length - 2]); _pts.unshift(pts[pts.length - 1]); _pts.unshift(pts[pts.length - 2]); _pts.push(pts[0]); _pts.push(pts[1]); } else { _pts.unshift(pts[1]); //copy 1. point and insert at beginning _pts.unshift(pts[0]); _pts.push(pts[pts.length - 2]); //copy last point and append _pts.push(pts[pts.length - 1]); } // ok, lets start.. // 1. loop goes through point array // 2. loop goes through each segment between the 2 pts + 1e point before and after for (i=2; i < (_pts.length - 4); i+=2) { for (t=0; t <= numOfSegments; t++) { // calc tension vectors t1x = (_pts[i+2] - _pts[i-2]) * tension; t2x = (_pts[i+4] - _pts[i]) * tension; t1y = (_pts[i+3] - _pts[i-1]) * tension; t2y = (_pts[i+5] - _pts[i+1]) * tension; // calc step st = t / numOfSegments; // calc cardinals c1 = 2 * Math.pow(st, 3) - 3 * Math.pow(st, 2) + 1; c2 = -(2 * Math.pow(st, 3)) + 3 * Math.pow(st, 2); c3 = Math.pow(st, 3) - 2 * Math.pow(st, 2) + st; c4 = Math.pow(st, 3) - Math.pow(st, 2); // calc x and y cords with common control vectors x = c1 * _pts[i] + c2 * _pts[i+2] + c3 * t1x + c4 * t2x; y = c1 * _pts[i+1] + c2 * _pts[i+3] + c3 * t1y + c4 * t2y; //store points in array res.push(x); res.push(y); } } return res; } } function titlePositionXHandler(e){ var id = e.currentTarget.id; if( id.indexOf('oTitle') != -1 ){ if( id == 'oTitleLeftPosX' ){ titleX = 'left'; titleContainer.style.left = '20px'; } if( id == 'oTitleMiddleLeftPosX' ){ var dw = designDiv.offsetWidth/2; titleX = 'middleLeft'; var dx = ( dw - titleContainer.offsetWidth )/2; titleContainer.style.left = dx; // } if( id == 'oTitleMiddlePosX' ){ titleX = 'middle'; titleContainer.style.left = (designDiv.offsetWidth - titleContainer.offsetWidth )/2; } if( id == 'oTitleMiddleRightPosX' ){ var dw = designDiv.offsetWidth/2; titleX = 'middleRight'; var dx = dw + ( dw - titleContainer.offsetWidth )/2; titleContainer.style.left = dx; } if( id == 'oTitleRightPosX' ){ titleX = 'right'; titleContainer.style.left = designDiv.offsetWidth - titleContainer.offsetWidth - 20; } myDesign.titles.titleX = titleX; } saveB.style.opacity = 1; saveB.style.filter = 'grayscale(0%)'; } function titleContainerPositionHandler(e){ //if( e.currentTarget.id == 'titlePositionXS' ){ // myDesign.titles.titleX = titleX = titlePositionXNS.value = titlePositionXS.value + '%'; // var perc = (designDiv.offsetWidth - titlePositionXS.value) / designDiv.offsetWidth; // titleContainer.style.left = ( perc * parseFloat(titleX)) + '%'; //} if( e.currentTarget.id == 'titlePositionYS' ){ myDesign.titles.titleY = titleY = titlePositionYNS.value = titlePositionYS.value + '%'; titleContainer.style.top = titleY; } saveB.style.opacity = 1; saveB.style.filter = 'grayscale(0%)'; } } // // clearing part..: { function clearAllFields(){ clearCardInfoFields(); clearGallery(); cardInfoRow.style.display = cardDesignRow.style.display = cardGalleryRow.style.display = 'none'; cardInfoCell.style.opacity = cardDesignCell.style.opacity = cardGalleryCell.style.opacity = 0.5; cardID = undefined; cardsListT.placeholder = 'Select...'; cardsListT.value = ''; selectedCardRow.style.display = 'none'; //selectedCardT.innerHTML = ''; selectedCardStatusT.innerHTML = ''; selectedCardCreditT.innerHTML = ''; selectedCardMoreCredit.style.display = 'none'; selectedCardEditStatus.style.display = 'none'; selectedCardActivate.style.display = 'none'; } function clearGallery(){ activityLog('clearGallery'); var childnodes = galleryDiv.childNodes; for( var i=childnodes.length-1; i>-1; i-- ){ if( childnodes[i] != galleryAddDiv ){ childnodes[i].remove(); } } } function clearCardInfoFields(){ activityLog('clearCardInfoFields'); var collection = cardInfoDiv.getElementsByTagName('input'); for( var i=0; i<collection.length; i++ ){ collection[i].value = ''; } userLastName = userFirstName = userBusinessName = userSlogan = userPhone = userFax = userCellular = userStreet = userCity = userMail = userWebsite = userFacebook = userInstagram = userTwitter = userLinkedIn = ''; userCountry = 'ישראל'; } } // // business info part..: { function businessInputHandler(e){ activityLog('businessInputHandler'); userBusinessName = businessNameT.value; userCellular = businessCellularT.value; userCity = businessCityT.value; userCountry = businessCountryT.value; userFacebook = businessFacebookT.value; userFax = businessFaxT.value; userFirstName = ownerFirstNameT.value; userInstagram = businessInstagramT.value; userLastName = ownerLastNameT.value; userLinkedIn = businessLinkedInT.value; userMail = businessMailT.value; userPhone = businessPhoneT.value; userSlogan = businessSloganT.value; userStreet = businessStreetT.value; userTwitter = businessTwitterT.value; userWebsite = businessWebsiteT.value; titleOwnerNameT.innerHTML = userFirstName + ' ' + userLastName; titleBusinessNameT.innerHTML = userBusinessName; titleSloganT.innerHTML = userSlogan; var display = designDivContainer.style.display; designDivContainer.style.display = 'block'; var rct_1 = titleOwnerNameT.getBoundingClientRect(); var rct_2 = titleBusinessNameT.getBoundingClientRect(); var rct_3 = titleSloganT.getBoundingClientRect(); var w = Math.max( Math.max( rct_1.width , rct_2.width ), rct_3.width ); titleContainer.style.width = Math.round(w); designDivContainer.style.display = display; saveB.style.opacity = 1; saveB.style.filter = 'grayscale(0%)'; if( userStreet != '' && userCity != '' ){ // && userCountry != '' getLocationB.disabled = false; }else{ getLocationB.disabled = true; } } } // // Card design selection..: { function showSelectCardForm(){ activityLog('showSelectCardForm'); selectCardForm.style.display = 'block'; TweenMax.to(selectCardForm,0.7,{css:{opacity:1}}); } function closeSelectCardFormHandler(e){ activityLog('closeSelectCardFormHandler'); closeSelectCardForm(); } function closeSelectCardForm(){ activityLog('closeSelectCardForm'); TweenMax.to(selectCardForm,0.7,{css:{opacity:0},onComplete:function(){ selectCardForm.style.display = 'none'; }}); } } // Card selection from user cards list part..: { function cardsListFocusHandler(e){ activityLog('cardsListFocusHandler'); var value = cardsListT.value; cardsListT.placeholder = value; cardsListT.value = ''; } function cardsListBlurHandler(e){ activityLog('cardsListBlurHandler'); if( cardsListT.value == '' ){ cardsListT.value = cardsListT.placeholder; cardsListT.placeholder = 'Select...'; } } function cardChangeHandler(e){ activityLog('cardChangeHandler'); closeSelectCardForm(); loadCardXML(); // deselect text box..: cardsListT.blur(); } function loadCardXML(){ activityLog('loadCardXML'); cardID = cardsListT.value; $.post('https://www.dcards.click/getCardContent.php',{user:user,cardid:cardID},function(data){ if( data.indexOf('done') != -1 ){ var xml = data.split('-')[1]; readXMLCard(xml); // //selectedCardT.innerHTML = cardsListT.value; //var cardStatus = getCardStatus(cardID); //selectedCardStatusT.innerHTML = cardStatus; //if( cardStatus == 'on' || cardStatus == 'paused' ) selectedCardEditStatus.style.display = 'table-cell'; //if( cardStatus == 'pending' ) selectedCardActivate.style.display = 'table-cell'; selectedCardRow.style.display = 'table-row'; getCardCredit(); // >> enable admin..: cardInfoCell.style.opacity = cardGalleryCell.style.opacity = cardDesignCell.style.opacity = 1; loadMyDesignXML(); }else{ // } }); } function loadMyDesignXML(){ activityLog('loadMyDesignXML'); $.post('https://www.dcards.click/getMyDesignXML.php',{user:user,cardid:cardID},function(data){ if(data.indexOf('done') != -1 ){ var xmlTx = data.split('-')[1]; readMyDesignXML(xmlTx); loadLogoForVCFCard(); }else{ if( data.indexOf('no such a file') != -1 ){ // }else{ window.alert('משהו השתבש בעת עליית קובץ'); } } }); } } // Reading xml files..: { function readXMLCard(vXMLText){ activityLog('readXMLCard'); var xmlTx = vXMLText; console.log(xmlTx); var parser = new DOMParser(); var xmlDoc = parser.parseFromString(xmlTx,"text/xml"); cardXML = xmlDoc.getElementsByTagName('Cards')[0]; cardInfo = cardXML.getElementsByTagName('cardInfo')[0]; cardGallery = cardXML.getElementsByTagName('cardGallery')[0]; cardDesign = cardXML.getElementsByTagName('cardDesign')[0]; console.log(cardInfo); // >> card info..: { userLastName = cardInfo.getElementsByTagName('ownerLastName')[0].innerHTML; userFirstName = cardInfo.getElementsByTagName('ownerFirstName')[0].innerHTML; userBusinessName = cardInfo.getElementsByTagName('businessName')[0].innerHTML; userSlogan = cardInfo.getElementsByTagName('slogan')[0].innerHTML; userPhone = cardInfo.getElementsByTagName('phone')[0].innerHTML; userFax = cardInfo.getElementsByTagName('fax')[0].innerHTML; userCellular = cardInfo.getElementsByTagName('cellular')[0].innerHTML; userStreet = cardInfo.getElementsByTagName('street')[0].innerHTML; userCity = cardInfo.getElementsByTagName('city')[0].innerHTML; userCountry = cardInfo.getElementsByTagName('country')[0].innerHTML; if( userCountry == '' || userCountry == undefined ) userCountry = 'ישראל'; userMail = cardInfo.getElementsByTagName('email')[0].innerHTML; userWebsite = cardInfo.getElementsByTagName('website')[0].innerHTML; try{ userFacebook = cardInfo.getElementsByTagName('facebook')[0].innerHTML; userInstagram = cardInfo.getElementsByTagName('instagram')[0].innerHTML; userTwitter = cardInfo.getElementsByTagName('twitter')[0].innerHTML; userLinkedIn = cardInfo.getElementsByTagName('linkedIn')[0].innerHTML; }catch(err){} if( userStreet != '' && userCity != '' ){ // && userCountry != '' getLocationB.disabled = false; }else{ getLocationB.disabled = true; } /* <ownerLastName>אטאל</ownerLastName> <ownerFirstName>דניאל </ownerFirstName> <businessName>Digital4u</businessName> <slogan>פיתוח אינטרנט</slogan> <phone></phone> <fax></fax> <cellular>0548382326</cellular> <street>העוגב 3/4</street> <city>מעלה אדומים</city> <country>ישראל</country> <email>danielattal@yahoo.com</email> <website>https://www.digital4u.live</website> <facebook>https://www.facebook.com/daniel.attal.5</facebook> <instagram></instagram> <twitter></twitter> <linkedIn></linkedIn> */ } // >> card design..: { try{ cTemplateCardID = cardDesign.getAttribute('cardid'); color_1 = cardStyleColor_1.style.background = cardDesign.getAttribute('color_1'); color_2 = cardStyleColor_2.style.background = cardDesign.getAttribute('color_2'); color_3 = cardStyleColor_3.style.background = cardDesign.getAttribute('color_3'); color_4 = cardStyleColor_4.style.background = cardDesign.getAttribute('color_4'); color_5 = cardStyleColor_5.style.background = cardDesign.getAttribute('color_5'); colors = {color_1:color_1,color_2:color_2,color_3:color_3,color_4:color_4,color_5:color_5}; }catch(err){} } // >> card gallery..: { buildGalleries(); /*userGalleriesA = []; var length = cardGallery.childNodes.length; if( length != 0 ){ for( var i=0; i<cardGallery.childNodes.length; i++ ){ var child = cardGallery.childNodes[i]; if( child.tagName ){ userGalleriesA.push(child); } } }else{ // } */ } updateCardValues(); } function readXMLDesign(vXMLText){ activityLog('readXMLDesign'); var xmlTx = vXMLText; var parser = new DOMParser(); var xmlDoc = parser.parseFromString(xmlTx,"text/xml"); designXML = xmlDoc.getElementsByTagName('DESIGN')[0]; for(var i=0; i<designXML.childNodes.length;i++ ){ if( designXML.childNodes[i].tagName){ tagName = designXML.childNodes[i].tagName; if( tagName == 'logo' ) designLogoXML = designXML.childNodes[i]; if( tagName == 'title' ) designTitleXML = designXML.childNodes[i]; if( tagName == 'buttons' ) designButtonsXML = designXML.childNodes[i]; if( tagName == 'canvas' ) designCanvasXML = designXML.childNodes[i]; if( tagName == 'colorsChart' ) designChartXML = designXML.childNodes[i]; } } // >> color chart part..: { // colors defined in card.xml... //color_1 = designChartXML.getAttribute('color_1'); //color_2 = designChartXML.getAttribute('color_2'); //color_3 = designChartXML.getAttribute('color_3'); //color_4 = designChartXML.getAttribute('color_4'); //color_5 = designChartXML.getAttribute('color_5'); //colors = {color_1:color_1,color_2:color_2,color_3:color_3,color_4:color_4,color_5:color_5}; //color1CP.value = color_1; //color2CP.value = color_2; //color3CP.value = color_3; //color4CP.value = color_4; //color5CP.value = color_5; } // >> logo part..: { logoX = logoXPerc = designLogoXML.getAttribute('x'); logoY = logoYPerc = designLogoXML.getAttribute('y'); logoSize = designLogoXML.getAttribute('size'); logoBkgColor = designLogoXML.getAttribute('bkgColor'); logoBkgTrans = designLogoXML.getAttribute('bkgTrans'); logoBorderWidth = designLogoXML.getAttribute('borderWidth'); logoBorderColor = designLogoXML.getAttribute('borderColor'); logoBorderTrans = designLogoXML.getAttribute('borderTrans'); logoBorderStyle = designLogoXML.getAttribute('borderStyle'); logoBorderRadius = designLogoXML.getAttribute('borderRadius'); logoBorderRotation = designLogoXML.getAttribute('borderRotation'); logoHeight = logoWidth = logoSize; } // >> title part..: { titleNameColor = designTitleXML.getAttribute('nameColor'); titleBusinessColor = designTitleXML.getAttribute('businessColor'); titleSloganColor = designTitleXML.getAttribute('sloganColor'); titleX = designTitleXML.getAttribute('titleX'); titleY = designTitleXML.getAttribute('titleY'); titleH = designTitleXML.getAttribute('titleHeight'); titleRotation = designTitleXML.getAttribute('titleRotation'); } // buttons part..: { buttonTextColor = designButtonsXML.getAttribute('textColor'); buttonIconColor = designButtonsXML.getAttribute('iconColor'); buttonBkgColor = designButtonsXML.getAttribute('bkgColor'); buttonBkgTrans = designButtonsXML.getAttribute('bkgTrans'); buttonSize = designButtonsXML.getAttribute('size'); buttonBorderWidth = designButtonsXML.getAttribute('borderWidth'); buttonBorderColor = designButtonsXML.getAttribute('borderColor'); buttonBorderTrans = designButtonsXML.getAttribute('borderTrans'); buttonBorderStyle = designButtonsXML.getAttribute('borderStyle'); buttonBorderRadius = designButtonsXML.getAttribute('borderRadius'); buttonRotation = designButtonsXML.getAttribute('rotation'); xmlContainer = designButtonsXML.getElementsByTagName('container')[0]; buttonContainerX = xmlContainer.getAttribute('x'); buttonContainerY = xmlContainer.getAttribute('y'); buttonContainerW = xmlContainer.getAttribute('width'); buttonContainerH = xmlContainer.getAttribute('height'); /* var containerX = Math.round( 100 * buttonsContainer.offsetLeft/(rct.width) ) + '%'; var containerY = Math.round( 100 * buttonsContainer.offsetTop/(rct.height) ) + '%'; var containerW = Math.round( 100 * buttonsContainer.offsetWidth/(rct.width) ) + '%'; var containerH = Math.round( 100 * buttonsContainer.offsetHeight/(rct.height) ) + '%'; xml += '\t\t<container x="' + containerX + '" y="' + containerY + '" width="' + containerW + '" height="' + containerH + '"></container>\n'; */ xmlLocation = designButtonsXML.getElementsByTagName('location')[0]; buttonLocationX = xmlLocation.getAttribute('x'); buttonLocationY = xmlLocation.getAttribute('y'); /* var locationX = Math.round( 100 * locationB.offsetLeft/(buttonsContainer.offsetWidth)) + '%'; var locationY = Math.round( 100 * locationB.offsetTop/(buttonsContainer.offsetHeight)) + '%'; xml += '\t\t<location x="' + locationX + '" y="' + locationY + '"></location>\n'; */ xmlCall = designButtonsXML.getElementsByTagName('call')[0]; buttonCallX = xmlCall.getAttribute('x'); buttonCallY = xmlCall.getAttribute('y'); /* var callX = Math.round( 100 * callB.offsetLeft/(buttonsContainer.offsetWidth)) + '%'; var callY = Math.round( 100 * callB.offsetTop/(buttonsContainer.offsetHeight)) + '%'; xml += '\t\t<call x="' + callX + '" y="' + callY + '"></call>\n'; */ xmlWrite = designButtonsXML.getElementsByTagName('write')[0]; buttonWriteX = xmlWrite.getAttribute('x'); buttonWriteY = xmlWrite.getAttribute('y'); /* var writeX = Math.round( 100 * writeB.offsetLeft/(buttonsContainer.offsetWidth)) + '%'; var writeY = Math.round( 100 * writeB.offsetTop/(buttonsContainer.offsetHeight)) + '%'; xml += '\t\t<write x="' + writeX + '" y="' + writeY + '"></write>\n'; */ xmlGal = designButtonsXML.getElementsByTagName('gallery')[0]; buttonGalX = xmlGal.getAttribute('x'); buttonGalY = xmlGal.getAttribute('y'); /* var galleryX = Math.round( 100 * galleryB.offsetLeft/(buttonsContainer.offsetWidth)) + '%'; var galleryY = Math.round( 100 * galleryB.offsetTop/(buttonsContainer.offsetHeight)) + '%'; xml += '\t\t<gallery x="' + callX + '" y="' + callY + '"></gallery>\n'; */ xmlWeb = designButtonsXML.getElementsByTagName('website')[0]; buttonWebX = xmlWeb.getAttribute('x'); buttonWebY = xmlWeb.getAttribute('y'); /* var webX = Math.round( 100 * websiteB.offsetLeft/(buttonsContainer.offsetWidth)) + '%'; var webY = Math.round( 100 * websiteB.offsetTop/(buttonsContainer.offsetHeight)) + '%'; xml += '\t\t<website x="' + webX + '" y="' + webY + '"></website>\n'; */ xmlSocial = designButtonsXML.getElementsByTagName('social')[0]; buttonSocialX = xmlSocial.getAttribute('x'); buttonSocialY = xmlSocial.getAttribute('y'); /* var socialX = Math.round( 100 * socialB.offsetLeft/(buttonsContainer.offsetWidth)) + '%'; var socialY = Math.round( 100 * socialB.offsetTop/(buttonsContainer.offsetHeight)) + '%'; xml += '\t\t<social x="' + socialX + '" y="' + socialY + '"></social>\n'; */ // xmlShare = designButtonsXML.getElementsByTagName('share')[0]; buttonShareX = xmlShare.getAttribute('x'); buttonShareY = xmlShare.getAttribute('y'); xmlContact = designButtonsXML.getElementsByTagName('contact')[0]; buttonContactX = xmlContact.getAttribute('x'); buttonContactY = xmlContact.getAttribute('y'); // } // canvas part ..: { canvasBkgColor = designCanvasXML.getAttribute('bkgColor'); canvasBkgTrans = designCanvasXML.getAttribute('bkgTrans'); canvasBorderWidth = designCanvasXML.getAttribute('bkgBorderWidth'); canvasBorderColor = designCanvasXML.getAttribute('bkgBorderColor'); canvasBorderTrans = designCanvasXML.getAttribute('bkgBorderTrans'); canvasCurve = designCanvasXML.getAttribute('curve'); canvasBorderStyle = designCanvasXML.getAttribute('bkgBorderStyle'); cHandleLY = canvasHandleLY = designCanvasXML.getAttribute('handleLY'); cHandleRY = canvasHandleRY = designCanvasXML.getAttribute('handleRY'); cHandleMX = canvasHandleMX = designCanvasXML.getAttribute('handleMX'); cHandleMY = canvasHandleMY = designCanvasXML.getAttribute('handleMY'); } if( myDesign ) updateValuesFromMyDesignValues(cTemplateCardID); updateDesignValues(); TweenMax.to(designDivContainer,0.7,{css:{opacity:1}}); } function readMyDesignXML(vXMLText){ activityLog('readMyDesignXML'); myDesign = {templateID:'', colors:{},logo:{},titles:{},buttons:{},canvas:{}} var xmlTx = vXMLText; var parser = new DOMParser(); var xmlDoc = parser.parseFromString(xmlTx,"text/xml"); xmlMyDesign = xmlDoc.getElementsByTagName('myCardDesign')[0]; xmlMyLogo = xmlMyDesign.getElementsByTagName('Logo')[0]; xmlMyButtons = xmlMyDesign.getElementsByTagName('Buttons')[0]; xmlMyTitles = xmlMyDesign.getElementsByTagName('Titles')[0]; xmlMyCanvas = xmlMyDesign.getElementsByTagName('Canvas')[0]; var myTemplateID = xmlMyDesign.getAttribute('templateID'); var color1 = xmlMyDesign.getAttribute('color_1'); var color2 = xmlMyDesign.getAttribute('color_2'); var color3 = xmlMyDesign.getAttribute('color_3'); var color4 = xmlMyDesign.getAttribute('color_4'); var color5 = xmlMyDesign.getAttribute('color_5'); myDesign.templateID = myTemplateID; // select in style ..: { var collection = styleDesignContainer.getElementsByTagName('div'); var tindex = parseInt(myTemplateID.split('_')[1])-1; collection[tindex].getElementsByTagName('img')[0].style.boxShadow = '0px 0px 9px 0px #fff'; } myDesign.colors = {color_1:color1,color_2:color2,color_3:color3,color_4:color4,color_5:color5}; var myLogoBorderTrans = xmlMyLogo.getAttribute('borderTrans'); var myLogoBorderColor = xmlMyLogo.getAttribute('borderColor'); var myLogoBorderWidth = xmlMyLogo.getAttribute('borderWidth'); var myLogoBorderRadius = xmlMyLogo.getAttribute('borderRadius'); var myLogoBorderRotation = xmlMyLogo.getAttribute('borderRotation'); var myLogoBackground = xmlMyLogo.getAttribute('background'); myDesign.logo = { borderTrans: myLogoBorderTrans, borderColor:myLogoBorderColor, borderWidth:myLogoBorderWidth, borderRadius:myLogoBorderRadius, borderRotation:myLogoBorderRotation, backgroundColor: myLogoBackground }; var myButtonsBorderTrans = xmlMyButtons.getAttribute('borderTrans'); var myButtonsBorderColor = xmlMyButtons.getAttribute('borderColor'); var myButtonsBorderWidth = xmlMyButtons.getAttribute('borderWidth'); var myButtonsBorderRadius = xmlMyButtons.getAttribute('borderRadius'); var myButtonsBorderRotation = xmlMyButtons.getAttribute('borderRotation'); var myButtonsBackground = xmlMyButtons.getAttribute('background'); var myButtonsTextColor = xmlMyButtons.getAttribute('text'); var myButtonsIconColor = xmlMyButtons.getAttribute('icon'); myDesign.buttons = { borderTrans:myButtonsBorderTrans, borderColor:myButtonsBorderColor, borderWidth:myButtonsBorderWidth, borderRadius:myButtonsBorderRadius, borderRotation:myButtonsBorderRotation, backgroundColor: myButtonsBackground, textColor:myButtonsTextColor , iconColor: myButtonsIconColor }; var myTitlesName = xmlMyTitles.getAttribute('name'); var myTitlesBusiness = xmlMyTitles.getAttribute('business'); var myTitlesSlogan = xmlMyTitles.getAttribute('slogan'); var myTitlesX = xmlMyTitles.getAttribute('titleX'); var myTitlesY = xmlMyTitles.getAttribute('titleY'); myDesign.titles = {nameColor:myTitlesName, businessColor: myTitlesBusiness, sloganColor:myTitlesSlogan , titleX: myTitlesX, titleY: myTitlesY }; var myCanvasBorderTrans = xmlMyCanvas.getAttribute('borderTrans'); var myCanvasBorderColor = xmlMyCanvas.getAttribute('borderColor'); var myCanvasBorderWidth = xmlMyCanvas.getAttribute('borderWidth'); var myCanvasBackground = xmlMyCanvas.getAttribute('background'); myDesign.canvas = { borderTrans: myCanvasBorderTrans, borderColor: myCanvasBorderColor, borderWidth: myCanvasBorderWidth, backgroundColor: myCanvasBackground }; } } // gallery part..: { var cGalleryCell,cGalleryTitle,cImageGallery,cGalleryImageDiv; var galImA; function buildGalleries(){ activityLog('buildGalleries'); galItems = []; if( cardGallery ){ for( var i=0; i<cardGallery.childNodes.length; i++ ){ if( cardGallery.childNodes[i].tagName ){ galItems.push({gallery:cardGallery.childNodes[i],imgs:[]}); cGalleryTitle = cardGallery.childNodes[i].getAttribute('title'); addGalleryStamp();//false); for( var j=0; j<cardGallery.childNodes[i].childNodes.length; j++ ){ var item = cardGallery.childNodes[i].childNodes[j]; if( item.tagName ){ galItems[galItems.length-1].imgs.push(item); var description = item.getAttribute('description'); var link = item.getAttribute('link'); var srcname = item.getAttribute('srcname'); cImageGallery = document.createElement('img'); cImageGallery.src = 'https://www.dcards.click/clients/' + userMail + '/cards/' + cardID + '/gallery/' + srcname; addGalleryImageRow(description,link); } } closeGalleryImagesForm(); } } } } function showAddGalleryFormHandler(e){ activityLog('showAddGalleryFormHandler'); if(e.currentTarget.style.opacity == 0.5 ) return; showAddGalleryForm(); } function showAddGalleryForm(){ activityLog('showAddGalleryForm'); addGalleryT.value = ''; addGalleryB.style.opacity = 0.5; addGalleryForm.style.display = 'block'; TweenMax.to(addGalleryForm,0.7,{css:{opacity:1}}); } function closeAddGalleryFormHandler(e){ activityLog('closeAddGalleryFormHandler'); if( e.currentTarget.style.opacity == 0.5 ) return; closeAddGalleryForm(); } function closeAddGalleryForm(){ activityLog('closeAddGalleryForm'); TweenMax.to(addGalleryForm,0.7,{css:{opacity:0},onComplete:function(){ addGalleryForm.style.display = 'none'; }}); } function addGalleryTextHandler(e){ activityLog('addGalleryTextHandler'); if( e.currentTarget.value != '' ){ addGalleryB.style.opacity = 1; }else{ addGalleryB.style.opacity = 0.5; } } function applyAddGalleryHandler(e){ activityLog('applyAddGalleryHandler'); if( e.currentTarget.style.opacity == 0.5 ) return; cGalleryTitle = addGalleryT.value; addGalleryStamp(); showGalleryImagesForm(); } function addGalleryStamp( vDisplay = true ){ activityLog('addGalleryStamp'); var div = document.createElement('div'); div.style.float = 'right'; div.style.width = div.style.height = '150px'; div.style.border = '1px dotted #ccc'; div.style.borderRadius = '15px'; div.style.margin = '1px'; div.onclick = showGalleryImagesFormHandler; galleryDiv.appendChild(div); var table = document.createElement('table'); div.appendChild(table); table.style.width = table.style.height = '100%'; var row = table.insertRow(); var cell = row.insertCell(); cell.style.textAlign = 'center'; cell.innerHTML = cGalleryTitle; cell.setAttribute('name' , 'galleryCellGroup'); cGalleryCell = cell; if(vDisplay){ showGalleryImagesForm(); closeAddGalleryForm(); if( galleryDiv.childNodes.length >= 5 ){ showAddGalleryFormB.style.opacity = 0.5; }else{ showAddGalleryFormB.style.opacity = 1; } } } function showGalleryImagesFormHandler(e){ activityLog('showGalleryImageFormHandler'); if(e.currentTarget.style.opacity == 0.5 ) return; cGalleryCell = e.currentTarget.firstChild.rows[0].cells[0]; showGalleryImagesForm(); } function showGalleryImagesForm(){ activityLog('showGalleryImagesForm'); // clear first gallery stamps images..: galleryImagesContainer.innerHTML = ''; // populate gallery images.. if( cGalleryCell ){ var html = cGalleryCell.getAttribute('htmlContent'); galleryImagesContainer.innerHTML = html; for( var i=0; i<galleryImagesContainer.childNodes.length; i++ ){ var child = galleryImagesContainer.childNodes[i]; var description = child.getAttribute('description'); var link = child.getAttribute('link'); child.firstChild.rows[0].cells[1].firstChild.rows[0].cells[0].firstChild.value = description; child.firstChild.rows[0].cells[1].firstChild.rows[1].cells[0].firstChild.value = link } } // show form..: galleryImagesTitleT.innerHTML = cGalleryTitle; galleryImagesForm.style.display = 'block'; TweenMax.to( galleryImagesForm,0.7,{css:{opacity:1}}); } function addGalleryImageRowHandler(e){ activityLog('addGalleryImageRowHandler'); if(e.currentTarget.style.opacity == 0.5 ) return; addGalleryImageRow(); } function addGalleryImageHandler(e){ activityLog('addGalleryImageHandler'); if( e.currentTarget.style.opacity == 0.5 ) return; addGalleryImage(); } function addGalleryImage(){ activityLog('addGalleryImage'); var file = document.createElement('input'); file.type = 'file'; file.onchange = galleryImageChangeHandler; file.click(); } function galleryImageChangeHandler(e){ activityLog('galleryImageChangeHandler'); var fR = new FileReader(); fR.onload = function(){ var im = document.createElement('img'); im.onload = galleryImageLoadCompleteHandler; im.src = fR.result; } fR.readAsDataURL(e.currentTarget.files[0]); } function galleryImageLoadCompleteHandler(e){ activityLog('galleryImageLoadCompleteHandler'); cImageGallery = e.currentTarget; addGalleryImageRow(); } function addGalleryImageRow(vDescription,vLink){ activityLog('addGalleryImageRow'); var div = document.createElement('div'); div.style.width = '95%'; div.style.height = '135px'; div.style.borderRadius = '15px'; div.style.background = 'white'; div.style.overflow = 'hidden'; div.style.padding = '2px'; div.style.marginTop = '2px'; div.onclick = galleryImageSelectionHandler; div.onfocus = galleryImageSelectionHandler; galleryImagesContainer.appendChild(div); { var table = document.createElement('table'); div.appendChild(table); table.style.margin = '1px'; table.style.overflow = 'hidden'; table.style.borderRadius = '15px'; table.style.direction = 'rtl'; table.style.width = '100%'; table.style.height = '100%'; table.style.paddingBottom = '2px'; var row = table.insertRow(); var cell = row.insertCell(); cell.style.width = '120px'; cell.style.height = '100px'; cell.style.background = '#ccc'; cell.style.borderRadius = '15px'; cell.style.paddingBottom = '2px'; cell.align = 'center'; if( cImageGallery ){ if(cImageGallery.width>cImageGallery.height){ cImageGallery.style.width = '120px'; }else{ cImageGallery.style.height = '120px'; } cell.appendChild(cImageGallery.cloneNode(true)); cell.firstChild.setAttribute( 'name' , 'GalleryImagesGroup' ); cell.style.background = 'white'; cImageGallery = undefined; }else{ cell.innerHTML = 'click to upload Image'; } var cell = row.insertCell(); { var tb = document.createElement('table'); cell.appendChild(tb); tb.style.direction = 'rtl'; tb.style.width = '100%' tb.style.height = '100%'; var rw = tb.insertRow(); var cl = rw.insertCell(); cl.style.height = '90px'; var textarea = document.createElement('textarea'); cl.appendChild(textarea); textarea.style.width = '100%'; textarea.style.height = '100%'; textarea.style.fontFamily = 'arial'; textarea.style.fontSize = '14px'; textarea.style.borderRadius = '15px'; textarea.style.textIndent = '10px'; textarea.style.resize = 'none'; textarea.style.outline = 'none'; textarea.placeholder = 'תיאור קצר של המוצר/תמונה'; if(vDescription){ textarea.value = vDescription; } rw = tb.insertRow(); cl = rw.insertCell(); cl.style.height = '30px' var input = document.createElement('input'); cl.appendChild(input); input.style.width = '100%'; input.style.height = '100%'; input.style.fontFamily = 'arial'; input.style.fontSize = '14px'; input.style.borderRadius = '15px'; input.style.border = '1px solid #000'; input.style.textIndent = '10px'; input.placeholder = 'הקלד/הדבק קישור חיצוני'; if( vLink ){ input.value = vLink; } } } saveB.style.opacity = 1; saveB.style.filter = 'grayscale(0%)'; } function galleryImageSelectionHandler(e){ activityLog('galleryImageSelectionHandler'); if( cGalleryImageDiv ){ cGalleryImageDiv.style.border = ''; } cGalleryImageDiv = e.currentTarget; cGalleryImageDiv.style.border = '4px solid #00f'; // galleryDeleteImageB.style.opacity = 1; } function closeGalleryImagesFormHandler(e){ activityLog('closeGalleryImagesFormHandler'); if( e.currentTarget.style.opacity == 0.5 ) return; closeGalleryImagesForm(); } function closeGalleryImagesForm(){ activityLog('closeGalleryImagesForm'); var div = galleryImagesContainer.firstChild; var html = ''; for( var i=0; i<galleryImagesContainer.childNodes.length; i++ ){ var child = galleryImagesContainer.childNodes[i]; var textarea = child.firstChild.rows[0].cells[1].firstChild.rows[0].cells[0].firstChild; var input = child.firstChild.rows[0].cells[1].firstChild.rows[1].cells[0].firstChild; var description = textarea.value; var link = input.value; child.setAttribute('description', description ); child.setAttribute('link' , link ); html += child.outerHTML; } cGalleryCell.setAttribute( 'htmlContent', html ); TweenMax.to( galleryImagesForm, 0.7, {css:{opacity:0},onComplete:function(){ galleryImagesForm.style.display = 'none'; }}); //xmltx = compileGallery2XML(); } function compileGallery2XML(){ activityLog('compileGallery2XML'); var collection = document.getElementsByName('galleryCellGroup'); galImA = []; var xmltx = ''; for( var i=0; i<collection.length; i++ ){ var item = collection[i]; var html = item.getAttribute('htmlContent'); var div = document.createElement('div'); div.innerHTML = html; var title = item.innerText; xmltx += '\t<gallery_' + (i+1) + ' title="' + title + '" >\n'; for( var j=0; j<div.childNodes.length; j++ ){ var child = div.childNodes[j]; var table = child.firstChild; var im = table.rows[0].cells[0].firstChild; im.setAttribute('id' , cardID + '_' + title + '_im_' + (j+1)); var imSrcName = im.getAttribute('id') + '.png'; galImA.push({imSrcName:imSrcName,imID: im.getAttribute('id'),data:im.src }); var description = child.getAttribute('description'); var link = child.getAttribute('link'); xmltx += '\t\t<img srcname="' + imSrcName + '" description="' + description + '" link="' + link + '" />\n'; } xmltx += '\t</gallery_' + (i+1) + '>\n'; } updateSaveProgressForm('uploading gallery images to server','70%' ); if( galImA.length > 0 ){ uploadGalleryImages(0); }else{ closeSaveProgressForm(); //window.alert('2 נשמר בהצלחה'); } return xmltx; } function uploadGalleryImages(vIndex){ activityLog('uploadGalleryImages'); galIndex = vIndex; var data = galImA[galIndex].data; var type = 'gallery'; var imName = galImA[galIndex].imSrcName; var imPerc = Math.round(20 * (galIndex/galImA.length)); updateSaveProgressForm('updloading image ' + galIndex + '/' + galImA.length , ( 80 + imPerc) + '%' ); console.log('mail: ' + userMail + ' , card id: ' + cardID + ' , type: ' + type ); $.post('https://www.dcards.click/uploadNewCardImages.php',{ mail:userMail, cardID:cardID, type:type, imName:imName, data:data },function(data){ console.log(data) if( data.indexOf('done') != -1 ){ galIndex++; if( galIndex < galImA.length ){ uploadGalleryImages(galIndex); }else{ // all gallery images uploaded successfully. closeSaveProgressForm(); window.setTimeout(function(){ window.alert('1 נשמר בהצלחה'); },1000); } }else{ // >> an error occured..: window.alert('משהו השתבש בעת עליית תמונות לשרת. ' + data ); } }); } function galleryImageDeleteHandler(e){ activityLog('galleryImageDeleteHandler'); if( e.currentTarget.style.opacity == 0.5 ) return; if( window.confirm('האם את/ה בטוח/ה שברצונך למחוק תמונה זו. לא ניתן לשחזור אחרי ביצוע מחיקה.')){ galleryImageDelete(); } } function galleryImageDelete(){ activityLog('galleryImageDelete'); if(cGalleryImageDiv){ // // TO DO : >> remove image from server. // // then..: cGalleryImageDiv.remove(); cGalleryImageDiv = undefined; } galleryDeleteImageB.style.opacity = 0.5; saveB.style.opacity = 1; saveB.style.filter = 'grayscale(0%)'; } } // updating values ..: { function updateCardValues(){ activityLog('updateCardValues'); // >> user card info..: if( userLastName ) ownerLastNameT.value = userLastName; if( userFirstName ) ownerFirstNameT.value = userFirstName; if( userBusinessName ) businessNameT.value = userBusinessName; if( userSlogan ) businessSloganT.value = userSlogan; if( userPhone ) businessPhoneT.value = userPhone; if( userFax ) businessFaxT.value = userFax; if( userCellular ) businessCellularT.value = userCellular; if( userStreet ) businessStreetT.value = userStreet; if( userCity ) businessCityT.value = userCity; if( userCountry ) businessCountryT.value = userCountry; if( userMail ) businessMailT.value = userMail; if( userWebsite ) businessWebsiteT.value = userWebsite; if( userFacebook ) businessFacebookT.value = userFacebook; if( userInstagram ) businessInstagramT.value = userInstagram; if( userTwitter ) businessTwitterT.value = userTwitter; if( userLinkedIn ) businessLinkedInT.value = userLinkedIn; // >> user card gallery..: { // have been updated in previous step > build gallery ( < readxmlcard ). } // // >> user card design..: { color1CP.value = color_1; color2CP.value = color_2; color3CP.value = color_3; color4CP.value = color_4; color5CP.value = color_5; } } function updateDesignValues(){ activityLog('updateDesignValues'); // logo part ..: { logoDivContainer.style.width = logoDivContainer.style.height = logoSize; if( logoBkgTrans != 'true' ) logoDivContainer.style.background = colors[ logoBkgColor ]; if( logoBorderTrans != 'true' ) logoDivContainer.style.borderColor = colors[logoBorderColor]; //logoDivContainer.style.outli logoDivContainer.style.borderWidth = logoBorderWidth; logoDivContainer.style.borderStyle = logoBorderStyle; logoDivContainer.style.borderRadius = logoBorderRadius; } // buttons part..: { convertIm2Canvas(); var canvasButCol = document.getElementsByName('canvasButtonsGroup'); var count = canvasButCol.length; for( var i=0; i<count; i++ ){ var but = canvasButCol[i]; convertCanvas2Color(but,colors[buttonIconColor]); } var butTitles = document.getElementsByName('buttonsTitleGroup'); for( var i=0; i<butTitles.length;i++ ){ var butTitle = butTitles[i]; butTitle.style.color = colors[ buttonTextColor ]; } var butCol = document.getElementsByName('buttonsGroup'); for( var i=0; i<butCol.length; i++ ){ var but = butCol[i]; if( buttonBkgTrans == 'false' ) but.style.background = colors[buttonBkgColor]; but.style.borderWidth = buttonBorderWidth; if( buttonBorderTrans == 'false' ) but.style.borderColor = colors[buttonBorderColor]; but.style.borderStyle = buttonBorderStyle; but.style.borderRadius = buttonBorderRadius; but.style.transform = 'rotate(' + buttonRotation + ')'; but.firstChild.style.transform = 'rotate(-' + buttonRotation + ')'; } // >> buttons position..: { buttonsContainer.style.left = Math.round( designDiv.offsetWidth * parseInt(buttonContainerX)/100 ); buttonsContainer.style.width = Math.round( designDiv.offsetWidth * parseInt(buttonContainerW) / 100 ); buttonsContainer.style.top = Math.round( designDiv.offsetHeight * parseInt( buttonContainerY ) / 100 ); buttonsContainer.style.height = Math.round( designDiv.offsetHeight * parseInt( buttonContainerH ) / 100 ); locationB.style.left = Math.round( buttonsContainer.offsetWidth * parseInt( buttonLocationX ) / 100 ); locationB.style.top = Math.round( buttonsContainer.offsetHeight * parseInt( buttonLocationY ) / 100 ); callB.style.left = Math.round( buttonsContainer.offsetWidth * parseInt( buttonCallX ) / 100 ); callB.style.top = Math.round( buttonsContainer.offsetHeight * parseInt( buttonCallY ) / 100 ); writeB.style.left = Math.round( buttonsContainer.offsetWidth * parseInt( buttonWriteX ) / 100 ); writeB.style.top = Math.round( buttonsContainer.offsetHeight * parseInt( buttonWriteY ) / 100 ); galleryB.style.left = Math.round( buttonsContainer.offsetWidth * parseInt( buttonGalX ) / 100 ); galleryB.style.top = Math.round( buttonsContainer.offsetHeight * parseInt( buttonGalY ) / 100 ); websiteB.style.left = Math.round( buttonsContainer.offsetWidth * parseInt( buttonWebX ) / 100 ); websiteB.style.top = Math.round( buttonsContainer.offsetHeight * parseInt( buttonWebY ) / 100 ); socialB.style.left = Math.round( buttonsContainer.offsetWidth * parseInt( buttonSocialX ) / 100 ); socialB.style.top = Math.round( buttonsContainer.offsetHeight * parseInt( buttonSocialY ) / 100 ); shareB.style.left = Math.round( designDiv.offsetWidth * parseInt( buttonShareX ) / 100 ); shareB.style.top = Math.round( designDiv.offsetHeight * parseInt( buttonShareY ) / 100 ); contactB.style.left = Math.round( designDiv.offsetWidth * parseInt( buttonContactX ) / 100 ); contactB.style.top = Math.round( designDiv.offsetHeight * parseInt( buttonContactY ) / 100 ); } } // title part ..: { titleContainer.style.height = titleH; titleOwnerNameT.innerHTML = userFirstName + ' ' + userLastName; titleBusinessNameT.innerHTML = userBusinessName; titleSloganT.innerHTML = userSlogan; titleOwnerNameT.style.color = colors[titleNameColor]; titleBusinessNameT.style.color = colors[titleBusinessColor]; titleSloganT.style.color = colors[titleSloganColor]; titleW = Math.max ( Math.max( titleOwnerNameT.offsetWidth , titleBusinessNameT.offsetWidth ) , titleSloganT.offsetWidth ); //titleOwnerNameT.style.width = titleBusinessNameT.style.width = titleSloganT.style.width = titleW; var display = designDiv.style.display; designDiv.style.display = 'block'; // >> top for title container less important overflow , will not really happen in practice, don't need such calculation as left title container. so for width & height... titleContainer.style.top = titleY; titleContainer.style.width = titleW; titleContainer.style.height = titleH; // if( titleX == 'left' ) { oTitleLeftPosX.checked = true; titleContainer.style.left = '20px'; } if( titleX == 'middleLeft' ){ oTitleMiddleLeftPosX.checked = true; var dw = designDiv.offsetWidth/2; var dx = ( dw - titleContainer.offsetWidth ) / 2; titleContainer.style.left = dx; } if( titleX == 'middle' ){ oTitleMiddlePosX.checked = true; titleContainer.style.left = ( designDiv.offsetWidth - titleContainer.offsetWidth )/2; } if( titleX == 'middleRight' ){ oTitleMiddleRightPosX.checked = true; var dw = designDiv.offsetWidth /2; var dx = dw + ( dw - titleContainer.offsetWidth ) / 2; titleContainer.style.left = dx; } if( titleX == 'right' ){ oTitleRightPosX.checked = true; titleContainer.style.left = designDiv.offsetWidth - titleContainer.offsetWidth - 20;//'20px'; } //titlePositionXS.value = parseFloat(titleX); //titlePositionXNS.value = titleX; titlePositionYS.value = parseFloat(titleY); titlePositionYNS.value = titleY; //var percX = (designDiv.offsetWidth - titlePositionXS.value) / designDiv.offsetWidth; //titleContainer.style.left = ( percX * parseFloat(titleX)) + '%'; designDiv.style.display = display; } // canvas part ..: { drawCanvas(); } } function updateMyDesign(){ activityLog('updateMyDesign'); myDesign = { templateID: cTemplateCardID , colors:{color_1:color_1,color_2:color_2,color_3:color_3,color_4:color_4,color_5:color_5}, logo:{ borderTrans: logoBorderTrans, borderWidth:logoBorderWidth, borderColor: logoBorderColor, borderRadius: logoBorderRadius, borderRotation: logoBorderRotation, backgroundColor: logoBkgColor }, buttons:{ borderTrans: buttonBorderTrans, borderWidth:buttonBorderWidth, borderColor: buttonBorderColor, borderRadius: buttonBorderRadius, borderRotation: buttonRotation, backgroundColor: buttonBkgColor , textColor: buttonTextColor, iconColor:buttonIconColor }, titles:{ nameColor: titleNameColor,businessColor: titleBusinessColor, sloganColor: titleSloganColor, titleX: titleX, titleY: titleY }, canvas:{ borderTrans: canvasBorderTrans, borderWidth: canvasBorderWidth, borderColor: canvasBorderColor , backgroundColor:canvasBkgColor } } } function updateValuesFromMyDesignValues(vTemplateID){ activityLog('updateValuesFromMyDesignValues'); logoBorderTrans = myDesign.logo.borderTrans; logoBorderWidth = myDesign.logo.borderWidth; logoBorderColor = myDesign.logo.borderColor; logoBkgColor = myDesign.logo.backgroundColor; if( !bTemplateChanged ){ logoBorderRadius = parseFloat(myDesign.logo.borderRadius) + '%'; logoBorderRotation = myDesign.logo.borderRotation; } buttonBorderTrans = myDesign.buttons.borderTrans; buttonBorderWidth = myDesign.buttons.borderWidth; buttonBorderColor = myDesign.buttons.borderColor; buttonBkgColor = myDesign.buttons.backgroundColor; buttonIconColor = myDesign.buttons.iconColor; buttonTextColor = myDesign.buttons.textColor; if( !bTemplateChanged ){ buttonRotation = myDesign.buttons.borderRotation; buttonBorderRadius = myDesign.buttons.borderRadius; } titleNameColor = myDesign.titles.nameColor; titleBusinessColor = myDesign.titles.businessColor; titleSloganColor = myDesign.titles.sloganColor; titleX = myDesign.titles.titleX; titleY = myDesign.titles.titleY; canvasBorderTrans = myDesign.canvas.borderTrans; canvasBorderColor = myDesign.canvas.borderColor; canvasBorderWidth = myDesign.canvas.borderWidth; canvasBkgColor = myDesign.canvas.backgroundColor; } } // card style settings..: { function cardStyleSelectionHandler(e){ activityLog('cardStyleSelectionHandler'); cTemplateCardID = e.currentTarget.templateName; if( myDesign ){ if( myDesign.templateID != cTemplateCardID ){ myDesign.templateID = cTemplateCardID; bTemplateChanged = true; saveB.style.opacity = 1; saveB.style.filter = 'grayscale(0%)'; } } var collection = styleDesignContainer.getElementsByTagName('div'); // deselect all > previous if any..: for( i=0; i<collection.length; i++ ){ var div = collection[i]; div.getElementsByTagName('img')[0].style.boxShadow = ''; } e.currentTarget.getElementsByTagName('img')[0].style.boxShadow = '0px 0px 9px 0px #fff'; showCardStyleForm(); } function showCardStyleForm(){ activityLog('showCardStyleForm'); cardStyleForm.style.display = 'block'; TweenMax.to(cardStyleForm,0.7,{css:{opacity:1}}); var rct = cardStyleCellContainer.getBoundingClientRect(); var l = rct.left; var t = rct.top; var w = rct.width; var h = rct.height; designDivContainer.style.display = 'block'; var dh = designDiv.offsetHeight; var zoomValue = (h-50)/dh; designDivContainer.style.left = rct.left/zoomValue; designDivContainer.style.top = rct.top/zoomValue; designDivContainer.style.width = rct.width / zoomValue; designDivContainer.style.height = rct.height / zoomValue; designDivContainer.style.zoom = zoomValue; designDiv.style.left = ( designDivContainer.offsetWidth - designDiv.offsetWidth )/(2); designDiv.style.top = ( designDivContainer.offsetHeight - designDiv.offsetHeight )/(2); var name = cTemplateCardID + '.xml'; $.post('https://www.dcards.click/getTemplateXML.php',{name:name},function(data){ if( data.indexOf('done') != -1 ){ var xmlTx = data.split('-')[1]; readXMLDesign(xmlTx); // load top image... loadTopImage(); // load logo... loadLogo(); }else{ console.log(data); } }) TweenMax.to( designDiv,0.7,{css:{opacity:1}}); } function closeCardStyleFormHandler(e){ activityLog('closeCardStyleFormHandler'); if( e.currentTarget.style.opacity == 0.5 ) return; closeCardStyleForm(); } function closeCardStyleForm(){ activityLog('closeCardStyleForm'); TweenMax.to(cardStyleForm,0.7,{css:{opacity:0},onComplete:function(){ cardStyleForm.style.display = 'none'; }}); TweenMax.to(designDivContainer,0.7,{css:{opacity:0},onComplete:function(){ designDivContainer.style.display = 'none'; //console.log('done...'); }}) } // function cardDesignColorChartHandler(e){ activityLog('cardDesignColorChartHandler'); if( e.currentTarget.style.opacity == 0.5 ) return; color_1 = cardStyleColor_1.style.background = color1CP.value; color_2 = cardStyleColor_2.style.background = color2CP.value; color_3 = cardStyleColor_3.style.background = color3CP.value; color_4 = cardStyleColor_4.style.background = color4CP.value; color_5 = cardStyleColor_5.style.background = color5CP.value; colors = {color_1:color_1,color_2:color_2,color_3:color_3,color_4:color_4,color_5:color_5} updateCardValues(); updateDesignValues(); updateMyDesign(); saveB.style.opacity = 1; saveB.style.filter = 'grayscale(0%)'; } var dragX,dragY; function cardStyleSettingsDragHandler(e){ activityLog('cardStyleSettingsDragHandler'); if( e.type == 'mousedown' ){ var rct = cardStyleFormTable.getBoundingClientRect(); dragX = e.x - rct.left; dragY = e.y - rct.top; document.body.onmouseup = cardStyleSettingsDragHandler; document.body.onmousemove = cardStyleSettingsDragHandler; } if( e.type == 'mouseup' ){ // document.body.onmouseup = ''; document.body.onmousemove = ''; } if( e.type == 'mousemove' ){ var x = e.x; var y = e.y; cardStyleFormTable.style.left = x - dragX; cardStyleFormTable.style.top = y - dragY; } } function showCardStyleColorFormHandler(e){ activityLog('showCardStyleColorFormHandler'); if( e.currentTarget.style.opacity == 0.5 ) return; var rct = e.currentTarget.getBoundingClientRect(); l = rct.left + rct.width/2; t = rct.top - 2; cardStyleColorForm.style.display = 'block'; var w = cardStyleColorForm.offsetWidth; var h = cardStyleColorForm.offsetHeight; cardStyleColorForm.style.left = l - w/2; cardStyleColorForm.style.top = t - h; cardStyleColorForm.target = e.currentTarget; TweenMax.to( cardStyleColorForm,0.7,{css:{opacity:1}}); } function closeCardStyleColorFormHandler(e){ activityLog('closeCardStyleColorFormHandler'); // closeCardStyleColorForm(); } function closeCardStyleColorForm(){ activityLog('closeCardStyleColorForm'); TweenMax.to( cardStyleColorForm,0.7,{css:{opacity:0},onComplete:function(){ cardStyleColorForm.style.display = 'none'; updateXMLCard(); }}); } function cardStyleColorFormHandler(e){ activityLog('cardStyleColorFormHandler'); closeCardStyleColorForm(); var color = convertRGBString2HexColor(e.currentTarget.style.background); cardStyleColorForm.target.style.background = color; var targetID = cardStyleColorForm.target.id; var id = e.currentTarget.id; var index = id.split('_')[1]; var selColorName = 'color_' + index; // logo part..: { if( targetID == 'cardStyleLogoBorder' ){ logoBorderColor = selColorName; } if( targetID == 'cardStyleLogoBackground' ){ logoBkgColor = selColorName; } } // buttons part ..: { if( targetID == 'cardStyleButtonsBorder' ){ buttonBorderColor = selColorName; } if( targetID == 'cardStyleButtonsBackground' ){ buttonBkgColor = selColorName; } if( targetID == 'cardStyleButtonsIcon' ){ buttonIconColor = selColorName; } if( targetID == 'cardStyleButtonsText' ){ buttonTextColor = selColorName; } } // canvas part ..: { if( targetID == 'cardStyleCanvasBackground' ){ canvasBkgColor = selColorName; console.log(canvasBkgColor); } if( targetID == 'cardStyleCanvasBorder' ){ canvasBorderColor = selColorName; } } // >> title part..: { if( targetID == 'cardStyleTitlesName' ){ titleNameColor = selColorName; } if( targetID == 'cardStyleTitlesBusiness' ){ titleBusinessColor = selColorName; } if( targetID == 'cardStyleTitlesSlogan' ){ titleSloganColor = selColorName; } } updateCardValues(); updateDesignValues(); updateMyDesign(); saveB.style.opacity = 1; saveB.style.filter = 'grayscale(0%)'; } function cardStyleSettingHandler(e){ activityLog('cardStyleSettingHandler'); cardStyleSettingForms.style.display = 'block'; cardStyleFormTable.style.left = '0px'; cardStyleFormTable.style.top = '0px'; e.target.style.background = '#ca0'; var id = e.target.id; cardStyleSettingForms.callerID = e.target.id; if( id == 'cardStyleButtonsB' ){ // >> border transparency ..: { cardStyleButtonsBorderChk.checked = false; cardStyleButtonsBorderWidthS.disabled = true; cardStyleButtonsBorderWidthNS.disabled = true; cardStyleButtonsBorder.style.opacity = 0.5; cardStyleButtonsBorderWidthNS.style.opacity = 0.5; cardStyleButtonsBorderWidthS.style.opacity = 0.5; if( buttonBorderTrans == 'false' ){ cardStyleButtonsBorderChk.checked = true; cardStyleButtonsBorderWidthS.disabled = false; cardStyleButtonsBorderWidthNS.disabled = false; cardStyleButtonsBorder.style.opacity = 1; cardStyleButtonsBorderWidthNS.style.opacity = 1; cardStyleButtonsBorderWidthS.style.opacity = 1; } } cardStyleButtonsBorder.style.background = colors[buttonBorderColor]; cardStyleButtonsBackground.style.background = colors[buttonBkgColor]; cardStyleButtonsText.style.background = colors[buttonTextColor]; cardStyleButtonsIcon.style.background = colors[buttonIconColor]; cardStyleButtonsBorderWidthS.value = cardStyleButtonsBorderWidthNS.value = parseFloat(buttonBorderWidth); cardStyleButtonsBorderWidthS.min = cardStyleButtonsBorderWidthNS.min = 0; cardStyleButtonsBorderWidthS.max = cardStyleButtonsBorderWidthNS.max = 10; cardStyleButtonsRadiusS.value = cardStyleButtonsRadiusNS.value = parseFloat(buttonBorderRadius)*2; cardStyleButtonsRadiusS.min = cardStyleButtonsRadiusNS.min = 0; cardStyleButtonsRadiusS.max = cardStyleButtonsRadiusNS.max = 100; cardStyleButtonsRotationS.value = cardStyleButtonsRotationNS.value = parseFloat(buttonRotation); cardStyleButtonsRotationS.min = cardStyleButtonsRotationNS.min = 0; cardStyleButtonsRotationS.max = cardStyleButtonsRotationNS.max = 360; cardStyleButtonsTable.style.display = 'table'; cardStyleSettingForms.displayTable = cardStyleButtonsTable; } if( id == 'cardStyleLogoB' ){ // >> border transparency ..: { cardStyleLogoBorderChk.checked = false; cardStyleLogoBorderWidthS.disabled = true; cardStyleLogoBorderWidthNS.disabled = true; cardStyleLogoBorder.style.opacity = 0.5; cardStyleLogoBorderWidthNS.style.opacity = 0.5; cardStyleLogoBorderWidthS.style.opacity = 0.5; if( logoBorderTrans == 'false' ){ cardStyleLogoBorderChk.checked = true; cardStyleLogoBorderWidthS.disabled = false; cardStyleLogoBorderWidthNS.disabled = false; cardStyleLogoBorder.style.opacity = 1; cardStyleLogoBorderWidthNS.style.opacity = 1; cardStyleLogoBorderWidthS.style.opacity = 1; } } cardStyleLogoBorder.style.background = colors[logoBorderColor]; cardStyleLogoBackground.style.background = colors[logoBkgColor]; cardStyleLogoBorderWidthS.value = cardStyleLogoBorderWidthNS.value = parseFloat(logoBorderWidth); cardStyleLogoBorderWidthS.min = cardStyleLogoBorderWidthNS.min = 0; cardStyleLogoBorderWidthS.max = cardStyleLogoBorderWidthNS.max = 20; cardStyleLogoRadiusS.value = cardStyleLogoRadiusNS.value = parseFloat(logoBorderRadius)*2; cardStyleLogoRadiusS.min = cardStyleLogoRadiusNS.min = 0; cardStyleLogoRadiusS.max = cardStyleLogoRadiusNS.max = 100; cardStyleLogoRotationS.value = cardStyleLogoRotationNS.value = parseFloat(logoBorderRotation); cardStyleLogoRotationS.min = cardStyleLogoRotationNS.min = 0; cardStyleLogoRotationS.max = cardStyleLogoRotationNS.max = 360; // cardStyleLogoTable.style.display = 'table'; cardStyleSettingForms.displayTable = cardStyleLogoTable; } if( id == 'cardStyleCanvasB' ){ cardStyleCanvasBackground.style.background = colors[canvasBkgColor]; // border transparency ..: { cardStyleCanvasBorderChk.checked = false; cardStyleCanvasBorderWidthS.disabled = true; cardStyleCanvasBorderWidthNS.disabled = true; cardStyleCanvasBorder.style.opacity = 0.5; cardStyleCanvasBorderWidthNS.style.opacity = 0.5; cardStyleCanvasBorderWidthS.style.opacity = 0.5; if( canvasBorderTrans == 'false' ){ cardStyleCanvasBorderChk.checked = true; cardStyleCanvasBorderWidthS.disabled = false; cardStyleCanvasBorderWidthNS.disabled = false; cardStyleCanvasBorder.style.opacity = 1; cardStyleCanvasBorderWidthNS.style.opacity = 1; cardStyleCanvasBorderWidthS.style.opacity = 1; } } cardStyleCanvasBorder.style.background = colors[canvasBorderColor]; cardStyleCanvasBorderWidthS.value = cardStyleCanvasBorderWidthNS.value = parseFloat(canvasBorderWidth); cardStyleCanvasBorderWidthS.min = cardStyleCanvasBorderWidthNS.min = 0; cardStyleCanvasBorderWidthS.max = cardStyleCanvasBorderWidthNS.max = 30; cardStyleCanvasTable.style.display = 'table'; cardStyleSettingForms.displayTable = cardStyleCanvasTable; } if( id == 'cardStyleTitlesB' ){ cardStyleTitlesName.style.background = colors[titleNameColor]; cardStyleTitlesBusiness.style.background = colors[titleBusinessColor]; cardStyleTitlesSlogan.style.background = colors[titleSloganColor]; cardStyleTitlesTable.style.display = 'table'; cardStyleSettingForms.displayTable = cardStyleTitlesTable; } TweenMax.to(cardStyleSettingForms,0.7,{css:{opacity: 1 }}); } function closeCardStyleSettingFormsHandler(e){ activityLog('closeCardStyleSettingFormsHandler'); TweenMax.to( cardStyleSettingForms,0.7,{css:{opacity:0},onComplete:function(){ cardStyleSettingForms.style.display = 'none'; cardStyleSettingForms.displayTable.style.display = 'none'; document.getElementById(cardStyleSettingForms.callerID).style.background = 'none'; }}) } function cardStyleCheckboxHandler(e){ activityLog('cardStyleCheckboxHandler'); var id = e.currentTarget.id; var checked = e.currentTarget.checked; if( id == 'cardStyleCanvasBorderChk' ){ canvasBorderTrans = (!checked).toString(); if( checked ){ cardStyleCanvasBorderWidthS.disabled = false; cardStyleCanvasBorderWidthNS.disabled = false; cardStyleCanvasBorder.style.opacity = 1; cardStyleCanvasBorderWidthNS.style.opacity = 1; cardStyleCanvasBorderWidthS.style.opacity = 1; }else{ cardStyleCanvasBorderWidthS.disabled = true; cardStyleCanvasBorderWidthNS.disabled = true; cardStyleCanvasBorder.style.opacity = 0.5; cardStyleCanvasBorderWidthNS.style.opacity = .5; cardStyleCanvasBorderWidthS.style.opacity = .5; } } if( id == 'cardStyleLogoBorderChk' ){ logoBorderTrans = (!checked).toString(); if( checked ){ cardStyleLogoBorderWidthS.disabled = false; cardStyleLogoBorderWidthNS.disabled = false; cardStyleLogoBorder.style.opacity = 1; cardStyleLogoBorderWidthNS.style.opacity = 1; cardStyleLogoBorderWidthS.style.opacity = 1; }else{ cardStyleLogoBorderWidthS.disabled = true; cardStyleLogoBorderWidthNS.disabled = true; cardStyleLogoBorder.style.opacity = 0.5; cardStyleLogoBorderWidthNS.style.opacity = .5; cardStyleLogoBorderWidthS.style.opacity = .5; } } if( id == 'cardStyleButtonsBorderChk' ){ buttonBorderTrans = (!checked).toString(); if( checked ){ cardStyleButtonsBorderWidthS.disabled = false; cardStyleButtonsBorderWidthNS.disabled = false; cardStyleButtonsBorder.style.opacity = 1; cardStyleButtonsBorderWidthNS.style.opacity = 1; cardStyleButtonsBorderWidthS.style.opacity = 1; }else{ cardStyleButtonsBorderWidthS.disabled = true; cardStyleButtonsBorderWidthNS.disabled = true; cardStyleButtonsBorder.style.opacity = 0.5; cardStyleButtonsBorderWidthNS.style.opacity = .5; cardStyleButtonsBorderWidthS.style.opacity = .5; } } updateCardValues(); updateDesignValues(); updateMyDesign(); saveB.style.opacity = 1; saveB.style.filter = 'grayscale(0%)'; } function cardStyleSliderHandler(e){ activityLog('cardStyleSliderHandler'); var type = e.currentTarget.type; var id = e.currentTarget.id; var value = e.currentTarget.value; if( type == 'number' ){ id = id.substr(0,id.length-2) + 'S'; document.getElementById(id).value = value; } if( type == 'range' ){ id = id.substr(0,id.length-1) + 'NS'; document.getElementById(id).value = value; } if( id.indexOf('Buttons') != -1 ){ if( id.indexOf('Width') != -1 ) buttonBorderWidth = cardStyleButtonsBorderWidthS.value + 'px'; if( id.indexOf('Radius') != -1 ) buttonBorderRadius = Math.round(parseFloat(cardStyleButtonsRadiusS.value)/2) + '%'; if( id.indexOf('Rotation') != -1 ) buttonRotation = cardStyleButtonsRotationS.value + 'Deg'; } if( id.indexOf('Logo') != -1 ){ if( id.indexOf('Width') != -1 ) logoBorderWidth = parseFloat(cardStyleLogoBorderWidthS.value); if( id.indexOf('Radius') != -1 ) logoBorderRadius = Math.round(parseFloat(cardStyleLogoRadiusS.value)/2) + '%'; if( id.indexOf('Rotation') != -1 ) logoBorderRotation = cardStyleLogoRotationS.value + 'Deg'; } if( id.indexOf('Canvas') != -1 ){ if( id.indexOf('Width') != -1 ) canvasBorderWidth = cardStyleCanvasBorderWidthS.value + 'px'; } updateCardValues(); updateDesignValues(); updateMyDesign(); saveB.style.opacity = 1; saveB.style.filter = 'grayscale(0%)'; } } // // remove card(s)/user part..: { function removeUserHandler(e){ if( window.confirm('האם ברצונך למחוק את משתמש זה? אשרת מחיקה לא נתנת לשחזור.') ){ /* $.post('https://www.dcards.click/removeUser.php',{user:userMail},function(data){ if(data.indexOf('done') ){ // success..: // remove from list... // // disable removeUserB and createNewCardB buttons..: // // check if current user = removed user >> reload cardadmin page ..: // } }) */ } } function removeCardHandler(e){ activityLog('removeCardHandler'); if( e.currentTarget.style.opacity == 0.5 ) return; var table = removeCardsListTable; table.innerHTML = ''; for( var i=0; i<cardsListL.options.length; i++ ){ var option = cardsListL.options[i]; var cardName = option.innerHTML; var row = table.insertRow(); var cl = row.insertCell(); cl.style.height = '30px'; cl.style.borderBottom = '1px dotted #999'; cl.innerHTML = cardName; cl = row.insertCell(); cl.style.width = '20px'; cl.style.borderBottom = '1px dotted #999'; var input = document.createElement('input'); input.type = 'checkbox'; if( option.disabled ) input.checked = true; input.onclick = removeCardCheckboxHandler; cl.appendChild(input); } showRemoveCardForm(); } function removeCardCheckboxHandler(){ activityLog('removeCardCheckboxHandler'); pauseCardB.style.opacity = 1; deleteCardB.style.opacity = 1; } function showRemoveCardFormHandler(e){ activityLog('showRemoveCardFormHandler'); if( e.currentTarget.style.opacity == 0.5 ) return; showRemoveCardForm(); } function showRemoveCardForm(){ activityLog('showRemoveCardForm'); console.log('show remove card form'); removeCardForm.style.display = 'block'; TweenMax.to(removeCardForm,0.7,{css:{opacity:1}}); } function closeRemoveCardFormHandler(e){ activityLog('closeRemoveCardFormHandler'); if( e.currentTarget.style.opacity == 0.5 ) return; closeRemoveCardForm(); } function closeRemoveCardForm(){ activityLog('closeRemoveCardForm'); TweenMax.to(removeCardForm,0.7,{css:{opacity:0},onComplete:function(){ removeCardForm.style.display = 'none'; }}); } function pauseCardHandler(e){ activityLog('pauseCardHandler'); if( e.currentTarget.style.opacity == 0.5 ) return; pauseCardB.style.opacity = 0.5; removeCardB.style.opacity = 0.5; var list = ''; for( var i=0; i<removeCardsListTable.rows.length; i++ ){ var row = removeCardsListTable.rows[i]; var cell = row.cells[0]; var cardName = cell.innerHTML; var cell = row.cells[1]; var chk = cell.firstChild; var cardStatus = 'on'; if( chk.checked ) cardStatus = 'paused'; list += cardName + '~' + cardStatus + '|'; } list = list.substr(0,list.length-1); $.post('https://www.dcards.click/pauseCard.php',{user:userMail,list:list},function(data){ if( data.indexOf('done') != -1 ){ // closeRemoveCardForm(); // >> reload updated cards list..: // }else{ console.log(data); } }); } function deleteCardHandler(e){ activityLog('deleteCardHandler'); if( e.currentTarget.style.opacity == 0.5 ) return; pauseCardB.style.opacity = 0.5; removeCardB.style.opacity = 0.5; var list = ''; for( var i=0; i<removeCardsListTable.rows.length; i++ ){ var row = removeCardsListTable.rows[i]; var cell = row.cells[0]; var cardName = cell.innerHTML; var cell = row.cells[1]; var chk = cell.firstChild; if( chk.checked ) list += cardName + '|'; } list = list.substr(0,list.length-1); console.log(list); $.post('https://www.dcards.click/deleteCard.php',{user:userMail,list:list},function(data){ if( data.indexOf('done') != -1 ){ console.log(data); closeRemoveCardForm(); // >> reload updated cards list..: loadUserCardsList(); }else{ console.log(data); } }); } } // // add new card part..: { function addNewCardHandler(e){ activityLog('addNewCardHandler'); if( e.currentTarget.style.opacity == 0.5 ) return; $.post('https://www.dcards.click/isUserAdministrator.php',{user:user},function(data){ if( data.indexOf( 'administrator' ) != -1 ){ myDesign = undefined; //userAdmin = user; var usersList = data.split('-')[1]; console.log(usersList); cardAdminUsersListL.innerHTML = ''; var option = document.createElement('option'); option.innerHTML = 'בחר...'; option.disabled = true; option.selected = true; cardAdminUsersListL.options.add(option); var array = usersList.split('|'); for( var i=0; i<array.length; i++ ){ var item = array[i]; var user = item.split('~')[0]; if( user != '' ){ var option = document.createElement('option'); option.innerHTML = user; option.value = item; cardAdminUsersListL.options.add(option); } } createNewCardB.style.opacity = 0.5; showNewCardAdminForm(); }else{ // } }); } function showNewCardAdminForm(){ activityLog('showNewCardAdminForm'); newCardAdminForm.style.display = 'block'; TweenMax.to(newCardAdminForm,0.7,{css:{opacity:1}}); } function closeNewCardAdminFormHandler(e){ activityLog('closeNewCardAdminFormHandler'); closeNewCardAdminForm(); } function closeNewCardAdminForm(){ activityLog('closeNewCardAdminForm'); TweenMax.to(newCardAdminForm,0.7,{css:{opacity:0},onComplete:function(){ newCardAdminForm.style.display = 'none'; }}) } function cardAdminUserChangeHandler(e){ activityLog('cardAdminUserChangeHandler'); // createNewCardB.style.opacity = 1; removeUserB.style.opacity = 1; } // new card create part..: { function createNewCardHandler(e){ if( e.currentTarget.style.opacity == 0.5 ) return; e.currentTarget.style.opacity = 0.5; showNewCardCreateForm(); } function showNewCardCreateForm(){ closeNewCardAdminForm(); newCardMailT.value = cardAdminUsersListL.options[cardAdminUsersListL.selectedIndex].innerHTML; newCardCreateForm.style.display = 'block'; newCardFirstNameT.value = newCardLastNameT.value = newCardBusinessNameT.value = ''; newCardFirstNameT.focus(); TweenMax.to(newCardCreateForm,0.7,{css:{opacity:1}}); } function closeNewCardCreateFormHandler(e){ closeNewCardCreateForm(); } function closeNewCardCreateForm(){ TweenMax.to(newCardCreateForm,0.7,{css:{opacity:0},onComplete:function(){ newCardCreateForm.style.display = 'none'; }}) } function newCardCreateTextHandler(e){ var bool = newCardMailT.value!='' && newCardFirstNameT.value!='' && newCardLastNameT.value!='' && newCardBusinessNameT.value!=''; if( bool ){ applyCreateNewCardB.style.opacity = 1; }else{ applyCreateNewCardB.style.opacity = 0.5; } } function applyCreateNewCardHandler(e){ if( e.currentTarget.style.opacity == 0.5 ) return; e.currentTarget.style.opacity = 0.5; userFirstName = newCardFirstNameT.value; userLastName = newCardLastNameT.value; userBusinessName = newCardBusinessNameT.value; userMail = newCardMailT.value; closeNewCardCreateForm(); action = 'new card'; createNewCard(); /* $.post('https://www.dcards.click/createNewCard.php',{mail:mail,businessName:businessName,firstName:firstName,lastName:lastName},function(data){ if( data.indexOf('done') != -1 ){ window.alert('success: ' + data ); var res = data.split('-')[1].split('~'); cardID = res[0]; console.log(cardID,data); showCardImagesForm(); }else{ window.alert('error: ' + data ); } }); */ } } // new card > new user part..: { function createNewUserHandler(e){ if( e.currentTarget.style.opacity == 0.5 ) return; showNewUserForm(); } function showNewUserForm(){ closeNewCardAdminForm(); newUserCreateForm.style.display = 'block'; TweenMax.to( newUserCreateForm,0.7,{css:{opacity:1}}); } function closeNewUserFormHandler(e){ closeNewUserForm(); } function closeNewUserForm(){ TweenMax.to( newUserCreateForm,0.7,{css:{opacity:0},onComplete:function(){ newUserCreateForm.style.display = 'none'; }}) } function newUserTextHandler(e){ var bool = isValidPassword(newUserPassT.value) && isValidPhone(newUserCellularT.value) && isValidMail(newUserMailT.value) && newUserFirstT.value!='' && newUserLastT.value!='' && newUserBusinessT.value!=''; if(bool){ applyCreateNewUserB.style.opacity = 1; }else{ applyCreateNewUserB.style.opacity = 0.5; } } function isValidMail(vMail){ var mail = vMail; var res = mail.split('@'); if( res.length>1){ var res_2 = res[1].split('.'); if(res_2.length>1){ return true; } } return false; } function isValidPhone(vPhone){ var phone = vPhone; if( ( phone.indexOf('+972') != -1 && phone.length==12 ) || phone.indexOf('05') != -1 && phone.length == 10 ){ return true; } return false; } function newUserKeyHandler(e){ if( e.currentTarget == newUserCellularT ){ if( ('0123456789').indexOf( e.key ) == -1 && e.key!='Backspace' && e.key!='+' ){ e.preventDefault(); e.stopPropagation(); return false; } } } function isValidPassword(vPassword){ //console.log('is valid password: ' + vPassword); var password = vPassword; var boolLetter = false; var boolNumber = false; if( password.length > 6 ){ for(var i=0; i<password.length; i++ ){ var letter = password.substr(i,1); var charIndex = letter.charCodeAt(0); console.log(letter + ', ' + charIndex ); if( ('0123456789').indexOf(letter) != -1 ){ boolLetter = true; }else{ if( (charIndex > 64 && charIndex<91 ) || ( charIndex>96 && charIndex<123)){ boolNumber = true; } } } } console.log(boolLetter && boolNumber) return boolLetter && boolNumber; } function applyCreateNewUserHandler(e){ if( e.currentTarget.style.opacity == 0.5 ) return; applyCreateNewUserB.style.opacity = 0.5; var mail = newUserMailT.value; var pass = newUserPassT.value; var firstName = newUserFirstT.value; var lastName = newUserLastT.value; var businessName = newUserBusinessT.value; var cellular = newUserCellularT.value; newUserMailT.disabled = newUserPassT.disabled = newUserFirstT.disabled = newUserLastT.disabled = newUserBusinessT.disabled = newUserCellularT.disabled = true; // $.post('https://www.dcards.click/updateUsersList.php',{mail:mail,pass:pass,firstName:firstName,lastName:lastName,businessName:businessName,cellular:cellular},function(data){ newUserMailT.disabled = newUserPassT.disabled = newUserFirstT.disabled = newUserLastT.disabled = newUserBusinessT.disabled = newUserCellularT.disabled = false; if( data.indexOf('done') != -1 ){ // new user created successfully..: closeNewUserForm(); // clear current values..: clearCardInfoFields(); clearGallery(); // reset cards list..: cardsListT.disabled = true; cardsListT.value = ''; cardsListL.innerHTML = ''; bLogged = false; cardID = ''; myDesign = undefined; // // userMail = mail; userBusinessName = businessName; userFirstName = firstName; userLastName = lastName; action = 'new user'; createNewCard(); }else{ // fail..: applyCreateNewUserB.style.opacity = 1; if( data.indexOf('user already exists') ){ window.alert('משתמש כבר קיים במערכת. אנא בצע זהוי או שנה שם משתמש (מיילך)') }else{ // >> other problem..: window.alert('משהו השתבש. אנא בדוק חיבור ונסה שוב'); } } }); // } function createNewCard(){ $.post('https://www.dcards.click/createNewCard.php',{mail:userMail,firstName:userFirstName,lastName:userLastName,businessName:userBusinessName},function(data){ if( data.indexOf('done') != -1 ){ // card successfully created, need to upload topimage, logo, icon to complete action..: var res = data.split('-')[1].split('~'); cardID = res[0]; console.log(cardID,data); showCardImagesForm(); }else{ console.log('an error occured: ' + data ) } }); } function showCardImagesForm(){ cardImagesForm.style.display = 'block'; TweenMax.to(cardImagesForm,0.7,{css:{opacity:1}}); } function closeCardImagesFormHandler(e){ if( e.currentTarget.style.opacity == 0.5 ) return; closeCardImagesForm(); } function closeCardImagesForm(){ TweenMax.to(cardImagesForm,0.7,{css:{opacity:0},onComplete:function(){ cardImagesForm.style.display = 'none'; }}); } function imagesButtonHandler(e){ if( e.currentTarget.style.opacity == 0.5 ) return; cImageBut = e.currentTarget; var id = e.currentTarget.id; /* if( id.indexOf('info') != -1 ){ showForm('infoDesForm') } if( id.indexOf('images') != -1 ){ showForm('imageDesForm') } */ if( id.indexOf('View') != -1 ){ showPreviewForm(); } if( id.indexOf('Gallery') != -1 ) { openGallery(); } if( id.indexOf('Camera') != -1 ){ takePicture(); } } function openGallery(){ var input = document.createElement('input'); input.type='file'; //input.capture = ''; input.accept = 'image/*'; input.onchange = fileChangeHandler; input.click(); } function takePicture(){ var input = document.createElement('input'); input.type='file'; input.capture = 'user'; input.accept = 'image/*'; input.onchange = fileChangeHandler; input.click(); } function fileChangeHandler(e){ var fR = new FileReader(); fR.onload = function (){ var result = fR.result; var im = document.createElement('img'); im.onload = imageLoadCompleteHandler; im.src = result; } fR.readAsDataURL(e.currentTarget.files[0]); } function imageLoadCompleteHandler(e){ var im = e.currentTarget; var w = e.currentTarget.width; var h = e.currentTarget.height; if( cImageBut.id.indexOf('icon') != -1 ){ if( w<512 || h<512 ){ window.alert('icon image has to be at least 512 x 512 pixels size. Please choose a file that fit this size.') return; } } var sizes = [w,h]; if( w>512 || h>512 ) sizes = fit2Size(w,h,512,512); var canvas = document.createElement('canvas'); canvas.width = sizes[0]; canvas.height = sizes[1]; canvas.getContext('2d').drawImage(im,0,0,w,h,0,0,sizes[0],sizes[1]); w = canvas.width; h = canvas.height; //forms.style.display = 'block'; previewForm.style.display = 'block'; if( previewCell.childNodes.length > 0 ) previewCell.removeChild(previewCell.firstChild) previewCell.style.height = '150px'; var dw = previewCell.offsetWidth; var dh = previewCell.offsetHeight; var size = fit2Size(w,h,dw,dh); im.style.width = size[0]; im.style.height = size[1]; previewCell.appendChild(im); console.log(cImageBut.id) var viewBut; if( cImageBut.id.indexOf('icon') != -1 ){ iconViewB.style.opacity = 1; iconViewB.style.filter = 'invert(0%)'; iconViewB.parentNode.style.border = '2px solid #000'; viewBut = iconViewB; } if( cImageBut.id.indexOf('logo') != -1 ){ logoViewB.style.opacity = 1; logoViewB.style.filter = 'invert(0%)'; logoViewB.parentNode.style.border = '2px solid #000'; viewBut = logoViewB; } if( cImageBut.id.indexOf('image') != -1 ){ imageViewB.style.opacity = 1; imageViewB.style.filter = 'invert(0%)'; imageViewB.parentNode.style.border = '2px solid #000'; viewBut = imageViewB; } var cim = im.cloneNode(true); viewBut.image = cim; viewBut.canvas = canvas;//cim; viewBut.imOrigW = w; viewBut.imOrigH = h; cImageBut = viewBut; //showForm('previewForm'); TweenMax.to(previewForm,0.7,{css:{opacity:1}}); checkCreatable(); } function showPreviewFormHandler(e){ if( e.currentTarget.style.opacity == 0.5 ) return; showPreviewForm(); } function showPreviewForm(){ previewForm.style.display = 'block'; TweenMax.to(previewForm,0.7,{css:{opacity:1}}); } function closePreviewForm(){ TweenMax.to(previewForm,0.7,{css:{opacity:0},onComplete:function(){ previewForm.style.display = 'none'; }}) } function fit2Size(vW,vH,vDW,vDH){ var w = vW; var h = vH; var dW = vDW; var dH = vDH; var ratio; if( w > dW ){ ratio = dW/w; w = dW; h *= ratio; if( h > dH ){ ratio = dH/h; h = dH; w *= ratio; } } if( h > dH ){ ratio = dH/h; h = dH; w *= ratio; if( w > dW ){ ratio = dW/w; w = dW; h *= ratio; } } return [w,h]; } function checkCreatable(){ var bool = iconViewB.style.opacity != 0.5 && logoViewB.style.opacity != 0.5 && imageViewB.style.opacity != 0.5; if( bool ){ uploadImagesB.style.opacity = 1; return; } uploadImagesB.style.opacity = 0.5; } function uploadImagesHandler(e){ if( e.currentTarget.style.opacity == 0.5 ) return; e.currentTarget.style.opacity = 0.5; cifSaveStatusT.innerHTML = ''; cifSaveProgressDiv.style.width = '0%'; cardsImagesFormSaveProgressRow.style.display = 'table-row'; uploadImages(); } function uploadImages(){ var icon = iconViewB.canvas; var iconW = iconViewB.imOrigW; var iconH = iconViewB.imOrigH; icondataurl = convert2dataurl( icon , iconW , iconH ); var logo = logoViewB.canvas; var logoW = logoViewB.imOrigW; var logoH = logoViewB.imOrigH; logodataurl = convert2dataurl( logo , logoW , logoH ); var topImage = imageViewB.canvas; var topImageW = imageViewB.imOrigW; var topImageH = imageViewB.imOrigH; topImagedataurl = convert2dataurl( topImage , topImageW , topImageH ); uploadIcon(0); } function getIconDataURL( vSize ){ var image = iconViewB.canvas; var canvas = document.createElement('canvas'); canvas.width = vSize; canvas.height = vSize; var ctx = canvas.getContext('2d'); ctx.drawImage( image , 0,0,image.width,image.height,0,0,canvas.width,canvas.height); return canvas.toDataURL(); } function uploadIcon(vIndex){ var imSizes = [24,32,64,72,96,120,128,144,152,180,192,384,512]; var index = vIndex; icondataurl = getIconDataURL( imSizes[index] ); var percent = Math.round((index/19)*100); var type = 'icon'; var dataurl = icondataurl; cifSaveStatusT.innerHTML = 'עליית סמל לשרת'; var perc = 25 * (index/imSizes.length); cifSaveProgressDiv.style.width = perc + '%'; try{ $.post('https://www.dcards.click/uploadNewCardImages.php' , { mail:userMail, cardID:cardID, type:type, image:dataurl , iconIndex:index , iconSize:imSizes[index] } ,function(data){ if( data.indexOf('done') != -1 ){ if( index<12 ){ index++; uploadIcon(index); }else{ uploadDuplicate(0); } }else{ console.log('error:' + data); } }); }catch(err){ console.log('error: ' + err ); } } function uploadDuplicate(vIndex){ //creationLogT.innerHTML = 'duplicating images'; var imName = ['favicon.png','icon-24x24.png','icon-32x32.png','icon-64x64.png']; var imSizes = [72,24,32,64]; var index = vIndex; icondataurl = getIconDataURL(imSizes[index]); var type = 'duplicate'; var dataurl = icondataurl; var percent = Math.round((index/4)*100); cifSaveStatusT.innerHTML = 'שכפול קבצים'; var perc = 25 * (index/3); cifSaveProgressDiv.style.width = (25 + perc) + '%'; //creationLogT.innerHTML = 'duplicating images : ' + percent + '%'; $.post('https://www.dcards.click/uploadNewCardImages.php' , { mail:userMail, cardID:cardID, type:type, image:dataurl, iconName:imName[index] } , function(data){ if( data.indexOf('done') != -1 ){ if( index < 3 ){ index++; uploadDuplicate(index); }else{ uploadLogo(); } }else{ // } }); } function uploadLogo(){ var type = 'logo'; var dataurl = logodataurl; cifSaveStatusT.innerHTML = 'עליית לוגו לשרת'; $.post('https://www.dcards.click/uploadNewCardImages.php' , { mail:userMail, cardID:cardID, type:type, image:dataurl} ,function(data){ if( data.indexOf('done') != -1 ){ cifSaveProgressDiv.style.width = '75%'; uploadTopImage(); }else{ // } }); } function uploadTopImage(){ var type = 'topImage'; var dataurl = topImagedataurl; cifSaveStatusT.innerHTML = 'עליית תמונת עליונה לשרת'; $.post('https://www.dcards.click/uploadNewCardImages.php' , { mail:userMail, cardID:cardID, type:type, image:dataurl} ,function(data){ if( data.indexOf('done') != -1 ){ cifSaveProgressDiv.style.width = '100%'; closeCardImagesForm(); timeid = window.setTimeout(function(){ window.alert('כרטיסף נוצר בהצלחה. יש להשלים פרטים כדי להפעילו.'); if( action == 'new card' ){ // >> reload card list..: cardsListT.value = ''; loadUserCardsList(); } // >> log as new user..: if( action == 'new user' ){ //logNameT.value = userMail; //logPasswordT.value = 'dcards_2023'; // << default password on new user creation... //applyLogB.style.opacity = 1; //showLogForm(); } },1000); }else{ console.log('an error occured: ' + dataurl ); } }); } function convert2dataurl( vImage, vWidth, vHeight ){ var w = vWidth; var h = vHeight; var im = vImage; var cnv = document.createElement('canvas'); cnv.width = w; cnv.height = h; cnv.getContext('2d').drawImage( im , 0 , 0 ); var dataurl = cnv.toDataURL(); return dataurl; } } } // // VCF card part..: { function loadLogoForVCFCard(){ // >> better to call php to get logo so url will not be known..: var url = 'https://www.dcards.click/clients/'+userMail+'/cards/'+cardID+'/files/images/logo.png?r=' + Math.random(); logoForVCFCard = document.createElement('img'); logoForVCFCard.src = url; } function generateAndSaveVCFCard(){ activityLog('generateAndSaveVCFCard'); /* BEGIN:VCARD VERSION:3.0 PRODID:-//Apple Inc.//macOS 12.6.5//EN N:כהן;יפית;;; FN:יפית כהן ORG:אדיר נכסים; TITLE:מתווכת item1.EMAIL;type=INTERNET;type=pref:yafitco44@gmail.com item1.X-ABLabel:מייל TEL;type=CELL;type=VOICE;type=pref:052-8026396 ADR;type=WORK;type=pref:;;הגעתון 36;נהרייה;;;ישראל item2.URL;type=pref:https://www.facebook.com/adir1990 item2.X-ABLabel:פייסבוק item3.URL:https://www.adir1990.co.il item3.X-ABLabel:_$!<HomePage>!$_ item4.URL:digital4u.live/dcards/cardInstall.html?cardName=yafitcohen item4.X-ABLabel:התקנת dcard PHOTO;ENCODING=b;TYPE=JPEG: dataurl END:VCARD */ // in order not to have error, logo div container has to be updated with the card infos -> logoForVCFCard at loadLogo() >> duplicate of source logo. var im = logoForVCFCard;//logoDivContainer.getElementsByTagName('IMG')[0];//.firstChild; var w = im.width; var h = im.height; var canvas = document.createElement('canvas'); canvas.width = w; canvas.height = h; canvas.getContext('2d').drawImage(im,0,0); var dataurl = canvas.toDataURL('image/jpeg'); dataurl = dataurl.split(',')[1]; var cardInstallURL = 'https://www.dcards.click/clients/' + userMail + '/cards/' + cardID + '/cardInstall.html'; var tx = 'BEGIN:VCARD\n'; tx += 'VERSION:3.0\n'; tx += 'N:' + userFirstName + ';' + userLastName + ';;;\n'; tx += 'FN:' + userFirstName + ' ' + userLastName + '\n'; tx += 'ORG:' + userBusinessName + ';\n'; tx += 'TITLE:' + userSlogan + '\n'; tx += 'TEL;type=CELL;type=VOICE;type=pref:' + userCellular + '\n'; tx += 'ADR;type=WORK;type=pref:;;' + userCountry + ';;;' + userCity + ';' + userStreet + '\n'; tx += 'item1.EMAIL;type=INTERNET;type=pref:' + userMail + '\n'; tx += 'item1.X-ABLabel:מייל\n'; tx += 'item2.URL;type=pref:' + userWebsite + '\n'; tx += 'item2.X-ABLabel:_$!<HomePage>!$_\n'; tx += 'item3.URL:' + cardInstallURL + '\n'; tx += 'item3.X-ABLabel:התקנה dcard\n'; var array = [{url:userFacebook,type:'פייסבוק'},{url:userInstagram,type:'אינסטגרם'},{url:userTwitter,type:'טוויטר'},{url:userLinkedIn,type:'לינקיד-ין'}]; var index = 4; for( var i=0; i<array.length; i++ ){ if( array[i].url && array[i].url != '' ){ tx += 'item' + index + '.URL:' + array[i].url + '\n'; tx += 'item' + index + '.X-ABLabel:' + array[i].type + '\n'; index++; } } tx += 'PHOTO;ENCODING=b;TYPE=JPEG:' + dataurl + '\n'; tx += 'END:VCARD'; updateSaveProgressForm('save vcf card','50%' ); $.post('https://www.dcards.click/saveVCFCard.php',{ user:userMail,cardid:cardID,vcfText:tx },function(data){ console.log(data); if( data.indexOf('done') != -1 ){ updateSaveProgressForm('compile gallery to xml','60%' ); compileGallery2XML(); }else{ window.alert('משהו השתבש בעת שמירה איש קשר') } }); } } // get location function..: { function getLocationCoordsHandler(e){ activityLog('getLocationCoordsHandler'); var address = businessStreetT.value + ' ' + businessCityT.value; // + ' ' + businessCountryT.value; // << for unknown reason when adding country in address the result in get location is not accurated. getLocation(address); } function getLocation(vAddress){ activityLog('getLocation'); var address = vAddress; var url = 'https://www.google.com/maps/place/' + address; var win = window.open( url ,'_mapGoogleGeoLocation','width=100 height=100'); timeid = window.setInterval(function(){ if( win ){ if( win.document ){ var url = decodeURI(win.document.location.href); if( url.indexOf('@') != -1 ){ window.clearInterval(timeid); win.close(); var coords = url.split('@')[1].split('z/')[0]; var latitude = coords.split(',')[0]; var longitude = coords.split(',')[1]; /*latitudeT.value = latitude; longitudeT.value = longitude; copyLocationB.disabled = false; copyLocationB.style.opacity = 1; googleB.disabled = false; googleB.style.opacity = 1; wazeB.disabled = false; wazeB.style.opacity = 1; if( bLaunch ){ if( openIn == 'google' ) googleB.click(); if( openIn == 'waze' ) wazeB.click(); } */ cardInfo.setAttribute('mapCoords',coords); console.log(coords); saveB.style.opacity = 1; saveB.style.filter = 'grayscale(0%)'; return coords; } } } },1000); } } // Saving part..: { function updateMyDesign2XML(){ activityLog('updateMyDesign2XML'); var xmlTx = '<myCardDesign templateID="' + myDesign.templateID + '" color_1="' + myDesign.colors.color_1 + '" color_2="' + myDesign.colors.color_2 + '" color_3="' + myDesign.colors.color_3 + '" color_4="' + myDesign.colors.color_4 + '" color_5="' + myDesign.colors.color_5 + '">\n'; xmlTx += '\t<Logo borderTrans="' + myDesign.logo.borderTrans + '" borderColor="' + myDesign.logo.borderColor + '" borderWidth="' + myDesign.logo.borderWidth + '" borderRotation="' + myDesign.logo.borderRotation + '" borderRadius="' + myDesign.logo.borderRadius + '" background="' + myDesign.logo.backgroundColor + '"></Logo>\n'; xmlTx += '\t<Buttons borderTrans="' + myDesign.buttons.borderTrans + '" borderColor="' + myDesign.buttons.borderColor + '" borderWidth="' + myDesign.buttons.borderWidth + '" borderRadius="' + myDesign.buttons.borderRadius + '" borderRotation="' + myDesign.buttons.borderRotation + '" background="' + myDesign.buttons.backgroundColor + '" text="' + myDesign.buttons.textColor + '" icon="' + myDesign.buttons.iconColor + '" ></Buttons>\n'; xmlTx += '\t<Titles name="' + myDesign.titles.nameColor + '" business="' + myDesign.titles.businessColor + '" slogan="' + myDesign.titles.sloganColor + '" titleX="' + myDesign.titles.titleX + '" titleY="' + myDesign.titles.titleY + '"></Titles>\n'; xmlTx += '\t<Canvas borderTrans="' + myDesign.canvas.borderTrans + '" borderColor="' + myDesign.canvas.borderColor + '" borderWidth="' + myDesign.canvas.borderWidth + '" background="' + myDesign.canvas.backgroundColor + '"></Canvas>\n'; xmlTx += '</myCardDesign>'; return xmlTx; } function exportMyDesign(){ activityLog('exportMyDesign'); updateSaveProgressForm('update my design','20%' ); var myDesignXML = updateMyDesign2XML(); updateSaveProgressForm('export my design','30%' ); $.post('https://www.dcards.click/exportMyDesign.php',{user:user,cardid:cardID,xmlText:myDesignXML},function(data){ if(data.indexOf('done') != -1 ){ // updateSaveProgressForm('generate vcf card','40%' ); generateAndSaveVCFCard(); bTemplateChanged = false; }else{ window.alert('משהו השתבש בעת שמירה ״ההגדרות שלי״. אנא נסה שוב'); } }) } function updateXMLCard(){ activityLog('updateXMLCard'); // >> card info..: cardInfo.getElementsByTagName('ownerLastName')[0].innerHTML = userLastName; cardInfo.getElementsByTagName('ownerFirstName')[0].innerHTML = userFirstName; cardInfo.getElementsByTagName('businessName')[0].innerHTML = userBusinessName; cardInfo.getElementsByTagName('slogan')[0].innerHTML = userSlogan; cardInfo.getElementsByTagName('phone')[0].innerHTML = userPhone; cardInfo.getElementsByTagName('fax')[0].innerHTML = userFax ; cardInfo.getElementsByTagName('cellular')[0].innerHTML = userCellular; cardInfo.getElementsByTagName('street')[0].innerHTML = userStreet; cardInfo.getElementsByTagName('city')[0].innerHTML = userCity; cardInfo.getElementsByTagName('country')[0].innerHTML = userCountry; cardInfo.getElementsByTagName('email')[0].innerHTML = userMail; cardInfo.getElementsByTagName('website')[0].innerHTML = userWebsite; // >> social media part..: if( cardInfo.innerHTML.indexOf('<facebook>') == -1 ){ cardInfo.innerHTML += '\n\t<facebook></facebook>\n'; } if( cardInfo.innerHTML.indexOf('<instagram>') == -1 ){ cardInfo.innerHTML += '\t<instagram></instagram>\n'; } if( cardInfo.innerHTML.indexOf('<twitter>') == -1 ){ cardInfo.innerHTML += '\t<twitter></twitter>\n'; } if( cardInfo.innerHTML.indexOf('<linkedIn>') == -1 ){ cardInfo.innerHTML += '\t<linkedIn></linkedIn>\n'; } cardInfo.getElementsByTagName('facebook')[0].innerHTML = userFacebook; cardInfo.getElementsByTagName('instagram')[0].innerHTML = userInstagram; cardInfo.getElementsByTagName('twitter')[0].innerHTML = userTwitter; cardInfo.getElementsByTagName('linkedIn')[0].innerHTML = userLinkedIn; // >> card gallery..: xmlGal = compileGallery2XML(); if(xmlGal) cardGallery.innerHTML = xmlGal; // >> card design..: if( !cardDesign ){ } cardDesign.setAttribute('cardid', cTemplateCardID); cardDesign.setAttribute( 'color_1' , color_1 ); cardDesign.setAttribute( 'color_2' , color_2 ); cardDesign.setAttribute( 'color_3' , color_3 ); cardDesign.setAttribute( 'color_4' , color_4 ); cardDesign.setAttribute( 'color_5' , color_5 ); } function saveHandler(e){ activityLog('saveHandler'); if( e.currentTarget.style.opacity == 0.5 ) return; e.currentTarget.style.opacity = 0.5; e.currentTarget.style.filter = 'grayscale(100%)'; updateSaveProgressForm('update xml card' , '0%' ); showSaveProgressForm(); updateXMLCard(); var xmlTx = '<Cards>\n'; xmlTx += '\t' + cardInfo.outerHTML + '\n'; xmlTx += '\t' + cardGallery.outerHTML + '\n'; xmlTx += '\t' + cardDesign.outerHTML + '\n'; xmlTx += '</Cards>'; updateSaveProgressForm('save xml card','10%' ); $.post('https://www.dcards.click/saveXMLCard.php',{user:user,cardid:cardID,xmlText:xmlTx},function(data){ if( data.indexOf('done') != -1 ){ if( myDesign ){ exportMyDesign(); }else{ // } }else{ // >> alert user..: window.alert('משהו השתבש בעת שמירה.אנא, נסה שוב'); } }); } function updateSaveProgressForm(vStatus,vPerc){ saveProgressStatusT.innerHTML = vStatus; saveProgressDiv.style.width = vPerc; } function showSaveProgressForm(){ saveProgressForm.style.display = 'block'; TweenMax.to(saveProgressForm,0.7,{css:{opacity:1}}); } function closeSaveProgressForm(){ TweenMax.to(saveProgressForm,0.7,{css:{opacity:0},onComplete:function(){ saveProgressForm.style.display = 'none'; }}) } /* Save Sequence..: > saveHandler() [ > updateXMLCard() ] & call > saveXMLCard.php then > exportMyDesign () [ > updateMyDesign2XML() ] & call > exportMyDesign.php then > generateAndSaveVCFCard() & call > saveVCFCard.php then > compileGallery2XML() [ > uploadGalleryImages(..) ] & call uploadNewCardImages.php > save complete. */ } function cardEditStatusHandler(e){ // } function cardActivationHandler(e){ // showCreditForm(); } function cardMoreCreditHandler(e){ // showCreditForm(); } function showCreditForm(){ // cardCreditForm.style.display = 'block'; TweenMax.to(cardCreditForm,0.7,{css:{opacity:1}}); } function closeCreditFormHandler(e){ // closeCreditForm(); } function closeCreditForm(){ // TweenMax.to(cardCreditForm,0.7,{css:{opacity:0},onComplete:function(){ cardCreditForm.style.display = 'none'; }}) } function getRequestID(vTypeID){ $.post('https://wwww.digital4u.live/paymentRequest/getPayRequestTopIndex.php',{},function(data){ if( data.indexOf('done') != -1 ){ var topIndex = parseInt(data.split('§')[1]); topIndex++; requestID = 'request_'+topIndex; console.log(requestID); createOrder(vTypeID); }else{ window.alert('משהו השתבש בעת קבלת מזהה בקשת תשלום'); } }); } function createOrder( vTypeID ){ var id = vTypeID; var items; var description,qty,price; cstatus = getCardStatus(cardID); if( id == 'basisB' ){ //url = 'https://sandbox.bluesnap.com/buynow/checkout?sku2898797=1&storeid=387243'; description = 'חבילה בסיסית - 250 כרטיסים'; qty = '1'; price = '100'; totalAmount = '100'; shareCredits = '250'; } if( id == 'improvedB' ){ //url = 'https://sandbox.bluesnap.com/buynow/checkout?sku2898799=1&storeid=387243'; description = 'חבילה משופרת - 500 כרטיסים'; qty = '1'; price = '180'; totalAmount = '180'; shareCredits = '500'; } if( id == 'determinedB' ){ //url = 'https://sandbox.bluesnap.com/buynow/checkout?sku2898803=1&storeid=387243'; description = 'חבילה נחושה - 750 כרטיסים'; qty = '1'; price = '250'; totalAmount = '250'; shareCredits = '750'; } if( id == 'quietB' ){ //url = 'https://sandbox.bluesnap.com/buynow/checkout?sku2898801=1&storeid=387243'; description = 'חבילה שקטה - 1000 כרטיסים'; qty = '1'; price = '300'; totalAmount = '300'; shareCredits = '1000'; } items = [{description:description,qty:qty,amount:price}]; if( cstatus == 'pending' ){ var description = 'עיצוב ויצירת כרטיס דיגיטלי (חד פעמי)' items.push({description:description,qty:'1',amount:'150'}); totalAmount = parseFloat(totalAmount) + 150; } // // clientID : // - sandbox = AaW7NeAWDMu2KFxZ6xWs7FQ38Vh8-bMk4bve5jRjOamx7dYjBQbl3_pBJc8Q2jtJSG4kCggpd2Tp8p8O // - production = ... businessName = 'DCards'; clientID = 'AaW7NeAWDMu2KFxZ6xWs7FQ38Vh8-bMk4bve5jRjOamx7dYjBQbl3_pBJc8Q2jtJSG4kCggpd2Tp8p8O'; currency = 'ILS'; country = 'ישראל'; zipCode = ''; city = userCity; address = userStreet; phone = userCellular; mail = userMail; lastName = userLastName; firstName = userFirstName; mailSender = 'no-reply@dcards.click'; var tx = firstName+'~'+lastName+'~'+mail+'~'+address+'~'+city+'~'+zipCode+'~'+country+'~'+phone+'~'+totalAmount+'~'+currency+'~'+clientID+'~' + businessName + '~'; for(var i=0; i<items.length;i++){ var description = items[i].description; var qty = items[i].qty; var price = items[i].amount; tx+= description + '±' + qty + '±' + price; if( i!=items.length-1 ){ tx += '|'; } } userOrder = { firstName:firstName,lastName:lastName,mail:mail,phone:phone,address:address,city:city,zipCode:zipCode,country:country, items:items , totalAmount:totalAmount , currency: currency, businessName:businessName, clientID:clientID,mailSender:mailSender }; $.post('https://www.digital4u.live/paymentRequest/createPaymentRequest.php',{text:tx,type:'paypal',clientID:clientID, requestID:requestID},function(data){ if( data.indexOf('done') != -1 ){ // >> if admin, send payment request to customer ( whatsapp?sms?mail? )..: // if customer open page for payment..: if( !userAdmin ){ var url = 'https://www.digital4u.live/paymentRequest/paypalCheckout.html?r=' + Math.random(); win = window.open(url,'requestPayment','paymentRequestWindow','width=420'); timeid = window.setInterval(function(){ if( isWindowRequestReady(win) ){ if( win.setUserInfo ){ window.clearInterval(timeid); console.log('raised'); win.userOrder = userOrder; win.windowCaller = this; win.setUserInfo(); } } },750) } }else{ window.alert('משהו השתבש בעת יצירת בקשת תשלום'); } }) //var userOrder = { // firstName:firstName,lastName:lastName,mail:mail,phone:phone,address:address,city:city,zipCode:zipCode,country:country, items:items , totalAmount:totalAmount , currency: currency, businessName:businessName, clientID:clientID //}; //return userOrder; } function paymentCompleted(vOrderID){ if(win){ var orderID = vOrderID; console.log('order id: ' + orderID); sendMailValidation(vOrderID); win.close(); } } function sendMailValidation(vOrderID){ //var transaction var orderID = vOrderID; var mail = userOrder.mail; var cellular = userOrder.phone; var fromMail = 'no-reply@dcards.click'; $.post('https://www.dcards.click/sendValidationMail.php', {orderID:orderID,requestID:requestID,mail:mail,cellular:cellular,fromMail:fromMail},function(data){ if(data.indexOf('done') != -1 ){ // update credit..: updateCredit(); }else{ window.alert('משהו השתבש בעת בעת שליחת אישור לתיבת מיילך.'); console.log(data); } }) } function updateCredit(){ $.post('https://www.dcards.click/updateCredit.php',{user:userOrder.mail,cardid:cardID,credit:shareCredits,type:'add'},function(data){ if(data.indexOf('done') != -1 ){ var nums = data.split('§')[1]; window.alert('הפעולה בוצעת בהצלחה. אישור עסקה נשלח למיילך. יש ברשותך ' + nums + ' כרטיסים ביקור דיגיטלים זמנים לחלוקה.') closeCreditForm(); selectedCardCreditT.innerHTML = nums; // >> if status = pending change & save card status to 'on'; var cardStatus = cstatus; if( cstatus != 'paused' ){ var cardstatus = 'pending'; if( nums>0 && (cstatus == 'pending' || cstatus=='nocredit') )cardStatus='on'; } updateCardStatus(cardStatus); }else{ window.alert('משהו השתבש בעת טעינת הכרטיס.'); console.log(data); } }); } function updateCardStatus(vStatus){ var cardStatus = vStatus; var user = userOrder.mail; $.post('https://dcards.click/updateCardStatus.php',{user:user,cardid:cardID,status:cardStatus},function(data){ if(data.indexOf('done') != -1 ){ getCardStatus(cardID); //selectedCardStatusT.innerHTML = cardStatus; //if( cardStatus == 'pending' ){ // selectedCardActivate.style.display = 'table-cell'; //}else{ //selectedCardActivate.style.display = 'none'; //} }else{ // } }) } function isWindowRequestReady(vWindow){ var win = vWindow; if( win.document ){ if( win.document.body ){ if( win.document.body.offsetWidth > 0 ){ if( win.document.body.childNodes.length > 0 ){ console.log('raised all') return true; } } } } return false; } function saleHandler(e){ id = e.currentTarget.id; if( window.confirm('בלחיצה על לחצן אישור ורכישה חבילה, אני מקבל ומסכים למדיניות המכירה ותנאי שימוש והגבלות של dcards') ){ //userOrder = createUserOrder(id); //createOrder(); //window.alert(requestID); getRequestID(id); return; console.log(userOrder); url = 'https://www.digital4u.live/paymentRequest/paypalCheckout.html?r=' + Math.random(); var l = ( screen.availWidth - 420 )/2;// << 420 = width of payment window >> too large for mobile, had to 'redesign' payment form... var win = window.open( url , 'DCards Share Credit Buy ' , 'width=420, height=800, left=' + l + ', top=0' ); timeid = window.setInterval(function(){ if( win.document ){ if( win.document.body ){ console.log('raised'); if( win.document.body.offsetWidth > 0 ){ if( win.document.body.childNodes.length > 0 ){ window.clearInterval(timeid); win.userOrder = userOrder; win.setUserInfo(); } } } } },750); } } function salePolicyHandler(e){ // } </SCRIPT> <BODY onload='init(event);'> <DIV id='banner' style='position:absolute; left:0px; top:0px; width:100%; height:120px; overflow:hidden;'> <table id='bannerTable' style='position:absolute; left:0px; top:-125px; width:100%; height:100%; opacity:0;'><tr> <td style='width:50px;' valign='top' align='center'></td> <td align='center'> <table id='titleTable' style='color:#000; width:20px; font-size:13px; border-bottom-left-radius: 50%; border-bottom-right-radius: 50%; padding:20px; padding-right: 40px; background: #ca0; overflow:hidden; box-shadow: 2px 2px 6px 1px #009;'><tr> <td style='width:20px; transform:rotate(-90deg)' align='center' valign='bottom'><span>DCARDS<br><span style='font-size:9px; letter-spacing:5px;'>.CLICK</span></span></td> <td><img src='files/images/mobile-card.png' style='height:64px;'/></td> </tr></table> </td> <td style='width:50px;' valign='top' align='center'> <img id='userLogB' src='files/images/user.png' style='margin-top:10px;' onclick='userLogHandler(event);'/> </td> </tr></table> </DIV> <DIV id='mainContent' style='position:absolute; left:0px; top:130px; width:100%;'> <DIV id='mainContentDiv' style='width:95%; height:100%; margin-left:2.5%; overflow:hidden; opacity:1; direction:rtl;'> <TABLE style='width:100%; height:100%; text-indent: 20px; cursor:default;'> <TR id='selectedCardRow' style='display:none;'><TD align='center' style='height:30px;'> <table style='height:30px; direction:ltr; cursor:default; margin-bottom:10px;'><tr> <td>Card Status: </td> <!--td id='selectedCardT' style=''></td> <td style='width:5px;'></td--> <td id='selectedCardStatusT' style=''></td> <td style='width:5px;'></td> <td id='selectedCardEditStatus' style='display:none;'><button onclick='cardEditStatusHandler(event);'>Edit Status</button></td> <td id='selectedCardActivate' style='display:none;'><button onclick='cardActivationHandler(event);'>Activate</button></td> <td style='width:5px;'></td> <td>, Credit: </td> <td id='selectedCardCreditT' style=''></td> <td style='width:5px;'></td> <td id='selectedCardMoreCredit' style='display:none;'><button onclick='cardMoreCreditHandler(event);'>more credit</button></td> </tr></table> </TD></TR> <TR><TD id='cardInfoCell' style='height:50px; opacity:0.5; border-radius:15px; background:#ccc;'> <table style='height:100%; color:black; font-size:18px; cursor:default;' onclick='showRow(event,"cardInfoRow")'><tr> <td><img id='infoArrow' src='files/images/caret.png' style='height:22px; transform:scale(-1,1);'/></td> <td>פרטי עסק</td> </tr></table> </TD></TR> <TR id='cardInfoRow' style='display:none;'><TD style='' valign='top'> <DIV id='cardInfoDiv' style='width:100%; overflow-x:hidden; overflow-y:auto;'> <table style='width:100%;'> <tr><td align='center'><input id='ownerLastNameT' style='width:80%; height:40px; text-align: center; font-size:14px; font-family: arial; ' placeholder='Owner Family Name' oninput='businessInputHandler(event);'/></td></tr> <tr><td align='center'><input id='ownerFirstNameT' style='width:80%; height:40px; text-align: center; font-size:14px; font-family: arial; ' placeholder='Owner First Name' oninput='businessInputHandler(event);'/></td></tr> <tr><td style='height:14px;'></td></tr> <tr><td align='center'><input id='businessNameT' style='width:80%; height:40px; text-align: center; font-size:14px; font-family: arial; ' placeholder='Business Name' oninput='businessInputHandler(event);'/></td></tr> <tr><td align='center'><input id='businessSloganT' style='width:80%; height:40px; text-align: center; font-size:14px; font-family: arial; ' placeholder='Business Slogan' oninput='businessInputHandler(event);'/></td></tr> <tr><td align='center'><input id='businessPhoneT' style='width:80%; height:40px; text-align: center; font-size:14px; font-family: arial; ' placeholder='Business Phone' oninput='businessInputHandler(event);'/></td></tr> <tr><td align='center'><input id='businessFaxT' style='width:80%; height:40px; text-align: center; font-size:14px; font-family: arial; ' placeholder='Business Fax' oninput='businessInputHandler(event);'/></td></tr> <tr><td align='center'><input id='businessCellularT' style='width:80%; height:40px; text-align: center; font-size:14px; font-family: arial; ' placeholder='Business Cellular' oninput='businessInputHandler(event);'/></td></tr> <tr><td style='height:14px;'></td></tr> <tr><td align='center'><input id='businessStreetT' style='width:80%; height:40px; text-align: center; font-size:14px; font-family: arial; ' placeholder='Street Adress' oninput='businessInputHandler(event);'/></td></tr> <tr><td align='center'><input id='businessCityT' style='width:80%; height:40px; text-align: center; font-size:14px; font-family: arial; ' placeholder='Business City' oninput='businessInputHandler(event);'/></td></tr> <tr><td align='center'><input id='businessCountryT' style='width:80%; height:40px; text-align: center; font-size:14px; font-family: arial; opacity:0.5;' placeholder='Business Country' readonly value='ישראל' oninput='businessInputHandler(event);'/></td></tr> <tr><td align='center'><button id='getLocationB' style='width:60%; height:30px; font-size:14px;' disabled onclick='getLocationCoordsHandler(event);'>Get Geo Location Coords</button></td></tr> <tr><td style='height:14px;'></td></tr> <tr><td align='center'><input id='businessMailT' style='width:80%; height:40px; text-align: center; font-size:14px; font-family: arial; ' placeholder='Business Email' oninput='businessInputHandler(event);'/></td></tr> <tr><td align='center'><input id='businessWebsiteT' style='width:80%; height:40px; text-align: center; font-size:14px; font-family: arial;' placeholder='Business Website' oninput='businessInputHandler(event);'/></td></tr> <tr><td style='height:14px;'></td></tr> <tr><td align='center'><input id='businessFacebookT' style='width:80%; height:40px; text-align: center; font-size:14px; font-family: arial; ' placeholder='Business Facebook' oninput='businessInputHandler(event);'/></td></tr> <tr><td align='center'><input id='businessInstagramT' style='width:80%; height:40px; text-align: center; font-size:14px; font-family: arial; ' placeholder='Business Instagram' oninput='businessInputHandler(event);'/></td></tr> <tr><td align='center'><input id='businessTwitterT' style='width:80%; height:40px; text-align: center; font-size:14px; font-family: arial; ' placeholder='Business Twitter' oninput='businessInputHandler(event);'/></td></tr> <tr><td align='center'><input id='businessLinkedInT' style='width:80%; height:40px; text-align: center; font-size:14px; font-family: arial; ' placeholder='Business LinkedIn' oninput='businessInputHandler(event);'/></td></tr> </table> </DIV> </TD></TR> <TR><TD id='cardDesignCell' style='height:50px; opacity:0.5; border-radius:15px; background:#ccc;'> <table style='width:100%; height:100%;'><tr> <td style='width:33%;'> <table style='height:100%; color:black; font-size:18px; cursor:default;' onclick='showRow(event, "cardDesignRow")'><tr> <td align='center'><img id='designArrow' src='files/images/caret.png' style='height:22px; transform:scale(-1,1);'/></td> <td>סגנון וצבעיים</td> </tr></table> </td> <td style='width:33%;'></td> <td style='width:33%;'> <table style='width:100%; text-align:center; color:black;'><tr> <td>עריכה : </td> <td style='color:#00a;'>לוגו</td> <td style='color:#00a;'>תמונה</td> </tr></table> </td> </tr></table> </TD></TR> <TR id='cardDesignRow' style='display:none;' ><TD> <DIV id='cardDesignDiv' style='width:100%; height:100%; overflow-x:hidden; overflow-y:auto;'> <table style='width:100%; height:100%;'> <tr><td align='center' valign='top'> <table style='width:90%; color:#ccc; font-size:18px;'> <!--tr><td align='center'> <div style='margin-bottom:5px;'>בחר צבעיים</div> <table><tr> <td id='cell_color_1' style='width:50px; height:25px; border:1px dotted #ccc;' onclick='cardDesignColorChartHandler(event);'> <input id='CP_1' type='color' style='width:100%; height:100%; border:none; outline:none'/></td> <td id='cell_color_2' style='width:50px; height:25px; border:1px dotted #ccc;' onclick='cardDesignColorChartHandler(event);'><input id='CP_2' type='color' style='width:100%; height:100%; border:none; outline:none'/></td> <td id='cell_color_3' style='width:50px; height:25px; border:1px dotted #ccc;' onclick='cardDesignColorChartHandler(event);'><input id='CP_3' type='color' style='width:100%; height:100%; border:none; outline:none'/></td> <td id='cell_color_4' style='width:50px; height:25px; border:1px dotted #ccc;' onclick='cardDesignColorChartHandler(event);'><input id='CP_4'type='color' style='width:100%; height:100%; border:none; outline:none'/></td> <td id='cell_color_5' style='width:50px; height:25px; border:1px dotted #ccc;' onclick='cardDesignColorChartHandler(event);'><input id='CP_5'type='color' style='width:100%; height:100%; border:none; outline:none'/></td> </tr></table> </td></tr--> <tr><td align='center'> <div style='margin-bottom:5px;'>בחר סגנון</div> <div id='styleDesignContainer' style='width:100%; overflow-x:hidden; overflow-y:auto;'></div> </td></tr> </table> </td></tr> </table> </DIV> </TD></TR> <TR><TD id='cardGalleryCell' style='height:50px; opacity:0.5; border-radius:15px; background:#ccc;'> <table style='height:100%; color:black; font-size:18px; cursor:default;' onclick='showRow(event,"cardGalleryRow")'><tr> <td><img id='galleryArrow' src='files/images/caret.png' style='height:22px; transform:scale(-1,1);'/></td> <td>גלריה</td> </tr></table> </TD></TR> <TR id='cardGalleryRow' style='display:none;'><TD> <DIV id='galleryDiv' style='width:100%; height:100%; overflow-x:hidden; overflow-y:auto;'> <DIV id='galleryAddDiv' style='float:right; width:150px; height:150px;'> <table style='width:100%; height:100%; border:1px dotted #ccc; border-radius:15px;'><tr><td align='center'><img id='showAddGalleryFormB' src='files/images/plus.png' style='width:50%; filter:grayscale(100%); margin-left:5px;' onclick='showAddGalleryFormHandler(event);'/></td></tr></table> </DIV> </DIV> </TD></TR> <TR><TD></TD></TR> </TABLE> </DIV> </DIV> <DIV id='selectCardForm' style='position:absolute; left:0px; top:0px; width:100%; height:100%; display:none; opacity:0;'><table style='width:100%; height:100%;'><tr><td align='center'> <table style='width:60%; height:120px; text-align:center; background:white; color:black; border-radius:20px; overflow:hidden;' cell-spacing=0 cell-padding=0> <tr><td style='height:40px; border-bottom:1px dotted #444; background:#ca0'>בחירת כרטיס להתחלה</td></tr> <tr><td>עליך לבחור כרטיס כדי להתחיל בהגדרות הכרטיס שנבחר.</td></tr> <tr><td style='height:40px; background:#0ae; color:black;' onclick='closeSelectCardFormHandler(event);'>אוקיי, הבנתי.</td></tr> </table> </td></tr></table></DIV> <DIV id='footer' style='position:absolute; left:0px; bottom:0px; width:100%; height:70px;'> <table style='width:100%; height:100%;'><tr> <td style='width:20px;' align='center' valign='bottom'> <img id='removeCardB' src='files/images/minus.png' style='width:17px; filter:invert(100%); margin-bottom:13px; opacity:0.5;' onclick='removeCardHandler(event);'/> </td> <td align='center' style='width:25%; font-size:13px;'> <div style='margin-bottom: 5px; font-size:16px;'>רשימת כרטיסים שלי</div> <input id='cardsListT' list='cardsListL' style='width:95%; height:22px; text-align: center; font-size: 14px; border-radius:10px;' disabled onchange='cardChangeHandler(event);' onfocus='cardsListFocusHandler(event);' onblur='cardsListBlurHandler(event);' placeholder='Select...' readonly/> <datalist id='cardsListL'></datalist> <!--select id='cardsListL' style='width:90%;' disabled></select--> </td> <td style='width:20px;' align='center' valign='bottom'><img id='addNewCardB' src='files/images/add.png' style='width:17px; filter:invert(100%); margin-bottom:13px; opacity:0.5;' onclick='addNewCardHandler(event);'/></td> <td align='center'><img id='saveB' src='files/images/floppy-disk.png' style='width:48px; filter:grayscale(100%); opacity:0.5;' onclick='saveHandler(event);'/></td> <td align='right' style='width:25%; '><img src='files/images/preview.png' style='filter:invert(0%); margin-right:30px; opacity:0.5;' onclick='previewCardHandler(event);'/></td> </tr></table> </DIV> <DIV id='logDiv' style='position:absolute; left:0px; top:110%; width:100%; height:100%; display:none; opacity:0;'> <table style='width:100%; height:100%; cursor:default;'><tr><td align='center' valign='top'> <table style='width:70%; height:230px; margin-top:130px; background:white; border-radius: 20px; box-shadow:0px 0px 6px 1px #009; border:0px solid white; overflow:hidden;' cellspacing=0 cellpadding=0> <tr><td style='height:35px; border-bottom:1px dotted #666;'> <table style='width:100%; height:100%; text-align:center; background:#ca0'><tr> <td style='width:35px;height:35px; color:#900;' onclick='closeLogFormHandler(event);'>X</td> <td style='color:white; font-size:18px;'>הזדהות לקוח</td> </tr></table> </td></tr> <tr><td align='center'>לפני יצירת או ניהול כרטיס(ים) משלך עליך להזדהות</td></tr> <tr><td align='center'><input id='logNameT' style='width:80%; height:30px; text-align:center; font-size:14px; ' placeholder='הקלד שם משתמש' value='danielattal@yahoo.com' oninput='logTextHandler(event);'/></td></tr> <tr><td align='center' style='height:30px;'> <input type='password' id='logPasswordT' style='width:80%; height:30px; text-align:center; font-size:14px; ' placeholder='הקלד סיסמתך' value='Kidame_2023' oninput='logTextHandler(event);'/> </td></tr> <tr><td align='center' valign='top' style='height:20px;'> <table style='width:80%; font-size:13px; color:#00b'><tr> <td align='left' onclick='showPasswordHandler(event);'>ראה סיסמה</td> <td align='right'>שכחתי סיסמה</td> </tr></table> </td></tr> <!--tr><td align='center'> עדיין לא רשום ? עשו זאת עכשיו <span style='color:#00b;' onclick='showRegisterFormHandler(event);'>כאן</span> </td></tr--> <tr><td id='applyLogB' style='height:40px; text-align:center; background:#09e; color:#fff; opacity:1; font-size:18px;' onclick='applyLogHandler(event);'>בצע הזדהות</td></tr> </table> </td></tr></table> </DIV> <DIV id='cardStyleForm' style='position:absolute; left:0px; top:0px; width:100%; height:100%; overflow:hidden; display:none; opacity:0;'> <table style='width:100%; height:100%; cursor:default;'> <tr><td style='height:40px; background:#444;'> <table style='width:100%; height:100%; text-align:center;'><tr> <td style='width:40px; font-size:24px; color:#c00;' onclick='closeCardStyleFormHandler(event);'>x</td> <td>הגדרת הכרטיס שלי</td> <!--td><img id='exportB' src='files/images/floppy-disk.png' style='height:30px; opacity:0.5;' onclick='exportCardDesignHandler(event);'/></td--> </tr></table> </td></tr> <tr><td id='cardStyleCellContainer' style='background:rgba(40,40,40,0.9);' align='center'></td></tr> <tr><td id='cardStyleParamsCell' style='height:120px; background:#444;' align='center'> <div id='cardStyleChartColorDiv' style='margin-bottom:5px;'> בחר אמנת צבעיים <table> <tr> <td id='cell_color_1' style='width:50px; height:25px; border:1px dotted #ccc;'> <input id='color1CP' type='color' style='width:100%; height:100%; border:none; outline:none;' value='#000000' onchange='cardDesignColorChartHandler(event);' /></td> <td id='cell_color_2' style='width:50px; height:25px; border:1px dotted #ccc;' ><input id='color2CP' type='color' style='width:100%; height:100%; border:none; outline:none;' value='#ffffff' onchange='cardDesignColorChartHandler(event);'/></td> <td id='cell_color_3' style='width:50px; height:25px; border:1px dotted #ccc;' ><input id='color3CP' type='color' style='width:100%; height:100%; border:none; outline:none; ' value='#444444' onchange='cardDesignColorChartHandler(event);'/></td> <td id='cell_color_4' style='width:50px; height:25px; border:1px dotted #ccc;' ><input id='color4CP'type='color' style='width:100%; height:100%; border:none; outline:none;' value='#999999' onchange='cardDesignColorChartHandler(event);'/></td> <td id='cell_color_5' style='width:50px; height:25px; border:1px dotted #ccc;' ><input id='color5CP'type='color' style='width:100%; height:100%; border:none; outline:none;' value='#cccccc' onchange='cardDesignColorChartHandler(event);'/></td> </tr> </table> דייק הגדרות : <table style='text-align:center;' onclick='cardStyleSettingHandler(event);'> <tr> <td id='cardStyleButtonsB' style='width:60px; border-radius:15px; border:1px dotted #ccc; padding:2px;'>לחצנים</td> <td id='cardStyleLogoB' style='width:60px; border-radius:15px; border:1px dotted #ccc; padding:2px;'>לוגו</td> <td id='cardStyleCanvasB' style='width:60px; border-radius:15px; border:1px dotted #ccc; padding:2px;'>רקע</td> <td id='cardStyleTitlesB' style='width:60px; border-radius:15px; border:1px dotted #ccc; padding:2px;'>כותרות</td> </tr> </table> </div> </td></tr> </table> </DIV> <DIV id='designDivContainer' style='position:absolute; display:none; opacity:0; overflow:hidden;'> <DIV id='designDiv' style='position:absolute; width:400px; height:700px; border:0px solid black; border-radius:20px; overflow:hidden; background:#fff; box-shadow: 0px 0px 5px 2px #ccc; '><DIV id='topImageDivContainer' style='position:absolute; left:0px; top:0px; width:100%; height:33%; border-bottom:1px dotted #444;'><table style='width:100%; height:100%; color:#ccc; background:#666;'><tr><td align='center'>תמונה<br>עליונה</td></tr></table></DIV> <CANVAS id='bkgCanvas' style='position:absolute; left:0px; top:0px; background:rgba(200,0,255,0.0)'></CANVAS> <DIV id='logoDivContainer' style='position:absolute; width:180px; height:180px; overflow:hidden;'><table id='logoDivTable' style='width:100%; height:100%; border-radius:50%; border:1px dotted #444; overflow:hidden;'><tr><td id='logoDivCell' align='center'><table style='width:100%; height:100%;'><tr><td align='center' >לוגו</td></tr></table></td></tr></table></DIV> <DIV id='contactB' style='position:absolute; '><table style='width:40px; height:40px;'><tr><td name='buttonsGroup' style='border-radius:50%; border:1px dotted #444; overflow:hidden;'><table style='width:100%; height:100%;'><tr><td align='center'><img src='files/images/icons/add-user.png' style='width:22px;'/></td></tr></table></td></tr></table></DIV> <DIV id='shareB' style='position:absolute; left:10px; top:10px;'><table style='width:40px; height:40px;'><tr><td name='buttonsGroup' style='border-radius:50%; border:1px dotted #444; overflow:hidden;'><table style='width:100%; height:100%;'><tr><td align='center'><img src='files/images/icons/share.png' style='width:22px;'/></td></tr></table></td></tr></table></DIV> <DIV id='buttonsContainer' style='position:absolute; bottom:50px; width:70%; height:150px; background:rgba(225,225,225,0.0);'> <table id='writeB' style='position:absolute; left:0px; top:0px; text-align: center; font-size:13px;' cellspacing=0 cellpadding=0> <tr><td style='' align='center'><div name='buttonsGroup' style='width:40px; height:40px; border-radius: 50%; border:1px dotted #444; overflow:hidden;'><table style='width:100%; height:100%;'><tr><td align='center'><img src='files/images/icons/write.png'/></td></tr></table></div></td></tr> <tr><td name='buttonsTitleGroup' style='height:20px;'>התכתבות</td></tr> </table> <table id='callB' style='position:absolute; left:50%; top:0px; text-align: center; font-size:13px;' cellspacing=0 cellpadding=0> <tr><td style='' align='center'><div name='buttonsGroup' style='width:40px; height:40px; border-radius: 50%; border:1px dotted #444; overflow:hidden;'><table style='width:100%; height:100%;'><tr><td align='center'><img src='files/images/icons/call.png'/></td></tr></table></div></td></tr> <tr><td name='buttonsTitleGroup' style='height:20px;'>התקשרות</td></tr> </table> <table id='locationB' style='position:absolute; left:100%; top:0px; text-align: center; font-size:13px;' cellspacing=0 cellpadding=0> <tr><td style='' align='center'><div name='buttonsGroup' style='width:40px; height:40px; border-radius: 50%; border:1px dotted #444; overflow:hidden;'><table style='width:100%; height:100%;'><tr><td align='center'><img src='files/images/icons/location.png'/></td></tr></table></div></td></tr> <tr><td name='buttonsTitleGroup' style='height:20px;'>מיקום</td></tr> </table> <table id='socialB' style='position:absolute; left:0px; bottom:0px; text-align: center; font-size:13px;' cellspacing=0 cellpadding=0> <tr><td style='' align='center'><div name='buttonsGroup' style='width:40px; height:40px; border-radius: 50%; border:1px dotted #444; overflow:hidden;'><table style='width:100%; height:100%;'><tr><td align='center'><img src='files/images/icons/social.png' style='width:23px;'/></td></tr></table></div></td></tr> <tr><td name='buttonsTitleGroup' style='height:20px;'>חברתי</td></tr> </table> <table id='websiteB' style='position:absolute; left:50%; bottom:0px; text-align: center; font-size:13px;' cellspacing=0 cellpadding=0> <tr><td style='' align='center'><div name='buttonsGroup' style='width:40px; height:40px; border-radius: 50%; border:1px dotted #444; overflow:hidden;'><table style='width:100%; height:100%;'><tr><td align='center'><img src='files/images/icons/website.png'/></td></tr></table></div></td></tr> <tr><td name='buttonsTitleGroup' style='height:20px;'>אתר</td></tr> </table> <table id='galleryB' style='position:absolute; left:100%; bottom:0px; text-align: center; font-size:13px;' cellspacing=0 cellpadding=0> <tr><td style=''><div name='buttonsGroup' style='width:40px; height:40px; border-radius: 50%; border:1px dotted #444; overflow:hidden;'><table style='width:100%; height:100%;'><tr><td align='center'><img src='files/images/icons/gallery.png'/></td></tr></table></div></td></tr> <tr><td name='buttonsTitleGroup' style='height:20px;'>גלריה</td></tr> </table> </DIV> <DIV id='titleContainer' style='position:absolute;' align='center'> <table> <tr><td id='titleOwnerNameT' style='height:30px; text-align:center; font-size:25px; white-space: nowrap;'></td></tr> <tr><td id='titleBusinessNameT' style='height:20px; text-align:center; white-space: nowrap;'></td></tr> <tr><td id='titleSloganT' style='height:20px; text-align:center; white-space: nowrap;'></td></tr> </table> <!--div id='titleOwnerNameT' style='position:absolute; top:0px; height:30px; text-align:center; font-size:25px; white-space: nowrap; background:blue;'>שם בעל הכרטיס</div> <div id='titleBusinessNameT' style='position:absolute; top:30px; height:20px; text-align:center; white-space: nowrap; background:green;'>שם העסק</div> <div id='titleSloganT' style='position:absolute; bottom:0px; height:30px; text-align:center; font-size:20px; white-space:nowrap; background:orange;'>משפט סיסמה</div--> </DIV> <!--DIV id='canvasHandles' style='position:absolute; left:0px; top:0px; width:100%; height:100%; opacity:0;'> <div id='canvasHandleL' style='position:absolute; left:0%; top:33%;'> <div style='position:absolute; left:-5px top:-5px; width:10px; height:10px; background:red; border:1px solid blue; border-radius:50%;'></div> </div> <div id='canvasHandleM' style='position:absolute; left:50%; top:33%;'> <div style='position:absolute; left:-5px top:-5px; width:10px; height:10px; background:yellow; border:1px solid blue; border-radius:50%;'></div> </div> <div id='canvasHandleR' style='position:absolute; left:98%; top:33%;'> <div style='position:absolute; left:-5px top:-5px; width:10px; height:10px; background:blue; border:1px solid blue; border-radius:50%;'></div> </div> </DIV--> <DIV id='dcardsContainer' style='position:absolute; left:0px; bottom:-5px; width:100%; height:30px;'><table style='position:absolute; left:0px; top:0px; width:100%; height:100%;'><tr><td align='center' valign='top'><div style='width:80px; height:40px; padding:15px; padding-top:7.5px;border-radius:50%; background:#FFD531; font-size:13px; box-shadow:0px 0px 8px 1px #444; color:#888;' valign='top'>DCARDS</div></td></tr></table></DIV> </DIV> </DIV> <DIV id='cardStyleSettingForms' style='position:absolute; left:0px; top:0px; width:100%; height:100%; display:none; opacity:0;'> <TABLE id='cardStyleFormTable' style='position:absolute; left:0px; top:0px; width:100%; height:100%;'><TR><TD align='center'> <TABLE style='width:60%; border-radius:15px; overflow:hidden; box-shadow: 2px 2px 4px 1px #444; background:white; cursor:default;' cellspacing=0 cellpadding=0> <TR><TD style='border-bottom:1px dotted #999; background:#ca0;'> <table id='cardStyleSettingBanner' style='width:100%; height:30px; text-align:center; color:black;' cellspacing=0 cellpadding=0 onmousedown='cardStyleSettingsDragHandler(event);'><tr> <td style='width:40px; color:#900;' onclick='closeCardStyleSettingFormsHandler(event);'>X</td> <td>הגדרות</td> </tr></table> </TD></TR> <TR><TD align='center'> <TABLE id='cardStyleButtonsTable' style='width:75%; display:none; text-align:start; direction:rtl; color:#444; cursor:default;' align='center'> <TR><TD><TABLE style='color:#444;'> <TR> <TD><input id='cardStyleButtonsBorderChk' type='checkbox' onclick='cardStyleCheckboxHandler(event);'/> קו הפרדה:</TD> <TD><div id='cardStyleButtonsBorder' style='width:40px; height:25px; border:1px dotted #444; border-radius:10px;' onclick='showCardStyleColorFormHandler(event);'></div></TD> <TD> , רקע: </TD> <TD><div id='cardStyleButtonsBackground' style='width:40px; height:25px; border:1px dotted #444; border-radius:10px;' onclick='showCardStyleColorFormHandler(event);'></div></TD> </TR> </TABLE></TD></TR> <TR><TD><table> <tr><td> <table style='color:#444;'><tr> <td>הובי :</td> <td><input id='cardStyleButtonsBorderWidthS' style='width:100px;' type='range' oninput='cardStyleSliderHandler(event);'/></td> <td ><input id='cardStyleButtonsBorderWidthNS' type='number' style='width:50px;' oninput='cardStyleSliderHandler(event);'/></td> </tr></table> </td></tr> </table></TD></TR> <TR><TD><table> <tr><td> <table style='color:#444;'><tr> <td>רדיוס :</td> <td><input id='cardStyleButtonsRadiusS' style='width:100px;' type='range' oninput='cardStyleSliderHandler(event);'/></td> <td ><input id='cardStyleButtonsRadiusNS' type='number' style='width:50px;' oninput='cardStyleSliderHandler(event);' /></td> </tr></table> </td></tr> </table></TD></TR> <TR><TD><table> <tr><td> <table style='color:#444;'><tr> <td>סיבוב :</td> <td><input id='cardStyleButtonsRotationS' style='width:100px;' type='range' oninput='cardStyleSliderHandler(event);' /></td> <td ><input id='cardStyleButtonsRotationNS' type='number' style='width:50px;' oninput='cardStyleSliderHandler(event);' /></td> </tr></table> </td></tr> </table></TD></TR> <TR><TD><TABLE style='color:#444;'> <TR> <TD> טקסט: </TD> <TD><div id='cardStyleButtonsText' style='width:40px; height:25px; border:1px dotted #444; border-radius:10px;' onclick='showCardStyleColorFormHandler(event);'></div></TD> <TD> , סמל: </TD> <TD><div id='cardStyleButtonsIcon' style='width:40px; height:25px; border:1px dotted #444; border-radius:10px;' onclick='showCardStyleColorFormHandler(event);'></div></TD> </TR> </TABLE></TD></TR> </TABLE> <TABLE id='cardStyleLogoTable' style='width:75%; display:none; text-align:start; direction:rtl; color:#444; cursor:default;' align='center'> <TR><TD><TABLE style='color:#444;'> <TR> <TD><input id='cardStyleLogoBorderChk' type='checkbox' onclick='cardStyleCheckboxHandler(event);'/> קו הפרדה:</TD> <TD><div id='cardStyleLogoBorder' style='width:40px; height:25px; border:1px dotted #444; border-radius:10px;' onclick='showCardStyleColorFormHandler(event);'></div></TD> <TD> , רקע: </TD> <TD><div id='cardStyleLogoBackground' style='width:40px; height:25px; border:1px dotted #444; border-radius:10px;' onclick='showCardStyleColorFormHandler(event);'></div></TD> </TR> </TABLE></TD></TR> <TR><TD><table> <tr><td> <table style='color:#444;'><tr> <td>הובי :</td> <td><input id='cardStyleLogoBorderWidthS' style='width:100px;' type='range' oninput='cardStyleSliderHandler(event);'/></td> <td ><input id='cardStyleLogoBorderWidthNS' type='number' style='width:50px;' oninput='cardStyleSliderHandler(event);'/></td> </tr></table> </td></tr> </table></TD></TR> <TR><TD><table> <tr><td> <table style='color:#444;'><tr> <td>רדיוס :</td> <td><input id='cardStyleLogoRadiusS' style='width:100px;' type='range' oninput='cardStyleSliderHandler(event);'/></td> <td ><input id='cardStyleLogoRadiusNS' type='number' style='width:50px;' oninput='cardStyleSliderHandler(event);' /></td> </tr></table> </td></tr> </table></TD></TR> <TR><TD><table> <tr><td> <table style='color:#444;'><tr> <td>סיבוב :</td> <td><input id='cardStyleLogoRotationS' style='width:100px;' type='range' oninput='cardStyleSliderHandler(event);' /></td> <td ><input id='cardStyleLogoRotationNS' type='number' style='width:50px;' oninput='cardStyleSliderHandler(event);' /></td> </tr></table> </td></tr> </table></TD></TR> <TR><TD><table style='direction:rtl; color:black;'><tr> <td>מיקום : </td> <td> R <input type='radio' name='logoPositionGroupName' id='oLogoPosR' onclick='logoPositionHandler(event);'/></td> <td> ,M <input type='radio' name='logoPositionGroupName' id='oLogoPosM' onclick='logoPositionHandler(event);' /></td> <td> ,L <input type='radio' name='logoPositionGroupName' id='oLogoPosL' onclick='logoPositionHandler(event);' /></td> </tr></table></TD></TR> </TABLE> <TABLE id='cardStyleCanvasTable' style='width:75%; display:none; text-align:start; direction:rtl; color:#444; cursor:default;'> <TR><TD><TABLE style='color:#444;'> <TR> <TD><input id='cardStyleCanvasBorderChk' type='checkbox' onclick='cardStyleCheckboxHandler(event);'/> קו הפרדה:</TD> <TD><div id='cardStyleCanvasBorder' style='width:40px; height:25px; border:1px dotted #444; border-radius:10px;' onclick='showCardStyleColorFormHandler(event);'></div></TD> <TD> , רקע: </TD> <TD><div id='cardStyleCanvasBackground' style='width:40px; height:25px; border:1px dotted #444; border-radius:10px;' onclick='showCardStyleColorFormHandler(event);'></div></TD> </TR> </TABLE></TD></TR> <TR><TD><table> <tr><td> <table style='color:#444;'><tr> <td>הובי :</td> <td><input id='cardStyleCanvasBorderWidthS' style='width:100px;' type='range' oninput='cardStyleSliderHandler(event);'/></td> <td ><input id='cardStyleCanvasBorderWidthNS' type='number' style='width:50px;' oninput='cardStyleSliderHandler(event);' /></td> </tr></table> </td></tr> </table></TD></TR> </TABLE> <TABLE id='cardStyleTitlesTable' style='width:70%; display:none; text-align:start; direction:rtl; color:#444; cursor:default;'> <TR><TD> <TABLE style='width:100%; color:#444;'> <TR> <TD>צבע שם: </TD> <TD><div id='cardStyleTitlesName' style='width:40px; height:25px; border:1px dotted #444; border-radius:10px;' onclick='showCardStyleColorFormHandler(event);'></div></TD> </TR> <TR> <TD>צבע שם העסק: </TD> <TD><div id='cardStyleTitlesBusiness' style='width:40px; height:25px; border:1px dotted #444; border-radius:10px;' onclick='showCardStyleColorFormHandler(event);'></div></TD> </TR> <TR> <TD>צבע משפט סיסמה: </TD> <TD><div id='cardStyleTitlesSlogan' style='width:40px; height:25px; border:1px dotted #444; border-radius:10px;' onclick='showCardStyleColorFormHandler(event);'></div></TD> </TR> </TABLE> </TD></TR> <TR> <TD> <TABLE style='width:100%; direction:rtl; color:#444;'> <TR> <TD style='width:20px;'>X:</TD> <TD style='width:100px;'> <!--INPUT id='titlePositionXS' type='range' style='width:100%; direction:rtl;' min=0 max=100 oninput='titleContainerPositionHandler(event);' /--> <table><tr> <td><input id='oTitleRightPosX' name='titlePostionXGroupName' type='radio' onclick='titlePositionXHandler(event);'/>R</td> <td><input id='oTitleMiddleRightPosX' name='titlePostionXGroupName' type='radio' onclick='titlePositionXHandler(event);'/>MR</td> <td><input id='oTitleMiddlePosX' name='titlePostionXGroupName' type='radio' checked onclick='titlePositionXHandler(event);'/>M</td> <td><input id='oTitleMiddleLeftPosX' name='titlePostionXGroupName' type='radio' onclick='titlePositionXHandler(event);'/>ML</td> <td><input id='oTitleLeftPosX' name='titlePostionXGroupName' type='radio' onclick='titlePositionXHandler(event);'/>L</td> </tr></table> </TD> <!--TD style='width:40px;'><INPUT id='titlePositionXNS' style='width:100%; height:30px; text-align:center; font-family:arial;' readonly /></TD--> </TR> <TR> <TD style='width:20px;'>Y:</TD> <TD style='width:100px;'><INPUT id='titlePositionYS' type='range' style='width:100%; direction:rtl;' min=0 max=100 oninput='titleContainerPositionHandler(event);' /></TD> <TD style='width:40px;'><INPUT id='titlePositionYNS' style='width:100%; height:30px; text-align:center; font-family:arial;' readonly /></TD> </TR> </TABLE> </TD> </TR> </TABLE> </TD></TR> </TABLE> </TD></TR></TABLE> </DIV> <DIV id='cardStyleColorForm' style='position:absolute; width:250px; height:100px; background:white; border-radius:10px; box-shadow: 0px 0px 4px 1px #444; display:none; opacity:0;'> <table style='width:100%; height:100%;'><tr><td align='center'> <table> <tr><td style='height:25px; border-bottom:1px dotted #999;'> <table style='width:100%; height:100%; color:black; text-align:center;'><tr> <td>בחירת צבע</td> <td style='width:25px; color:#900;' onclick='closeCardStyleColorFormHandler(event);'>X</td> </tr></table> </td></tr> <tr><td> <table style='font-size:12px; text-align:center; color:black;'> <tr> <td align='center' id='cardStyleColor_1' style='width:40px; height:25px; border:1px dotted #444;' onclick='cardStyleColorFormHandler(event);'></td> <td align='center' id='cardStyleColor_2' style='width:40px; height:25px; border:1px dotted #444;' onclick='cardStyleColorFormHandler(event);'></td> <td align='center' id='cardStyleColor_3' style='width:40px; height:25px; border:1px dotted #444;' onclick='cardStyleColorFormHandler(event);'></td> <td align='center' id='cardStyleColor_4' style='width:40px; height:25px; border:1px dotted #444;' onclick='cardStyleColorFormHandler(event);'></td> <td align='center' id='cardStyleColor_5' style='width:40px; height:25px; border:1px dotted #444;' onclick='cardStyleColorFormHandler(event);'></td> </tr> <tr> <td>Color 1</td> <td>Color 2</td> <td>Color 3</td> <td>Color 4</td> <td>Color 5</td> </tr> </table> </td></tr> </table> </td></tr></table> </DIV> <DIV id='userLogForm' style='position:absolute; top:-110px; width:120px; height:90px; overflow:hidden; border-bottom-left-radius: 20px; border-bottom-right-radius: 20px; background:#5497FB; display:none; opacity:0;'> <table style='width:100%; height:100%; text-align:center; color:#fff; cursor:default;'> <tr><td style='border-bottom: 1px dotted #666;' onclick='myAccountHandler(event);'>החשבון שלי</td></tr> <tr><td onclick='unlogHandler(event);'>התנתק</td></tr> </table> </DIV> <DIV id='newCardAdminForm' style='position:absolute; left:0px; top:0px; width:100%; height:100%; overflow:hidden; display:none; opacity:0;'> <table style='width:100%; height:100%;'><tr><td align='center'> <table style='width:80%; height:200px; background:white; text-align:center; overflow:hidden; border-radius:20px; color:#000; cursor:default;' cellspacing=0 cellpadding=0> <tr><td style='height:35px; background:#ca0;'>יצירת כרטיס חדש</td></tr> <tr><td align='center'> <table style='width:90%; height:100%; direction:rtl;'> <tr><td align='center'> <table style='color:#000;'><tr> <td>מרשמית משתמשים : </td> <td> <select id='cardAdminUsersListL' onchange='cardAdminUserChangeHandler(event);'></select> </td> <td><img id='removeUserB' src='files/images/minus.png' style='width:17px; opacity:0.5;' onclick='removeUserHandler(event);'/></td> </tr></table> </td></tr> <tr><td align='center'> <button style='width:140px;height:30px; border-radius: 20px; border:none; color:white; font-size:14px; box-shadow:2px 2px 5px 1px #000; background:linear-gradient(#0ab,#006);' onclick='createNewUserHandler(event);'>צור משתמש חדש</button> </td></tr> </table> </td></tr> <tr><td style='height:35px;'> <table style='width:100%; height:100%; text-align:center; color:#000; direction:rtl; cursor:default;' cellspacing=0 cellpadding=0><tr> <td style='width:50%; background:#ccc' onclick='closeNewCardAdminFormHandler(event);'>בטל</td> <td id='createNewCardB' style='background:#00b; opacity:0.5; color:white;' onclick='createNewCardHandler(event);'>צור כרטיס חדש</td> </tr></table> </td></tr> </table> </td></tr></table> </DIV> <DIV id='newCardCreateForm' style='position:absolute; left:0px; top:0px; width:100%; height:100%; overflow:hidden; display:none; opacity:0;'> <table style='width:100%; height:100%;'><tr><td align='center'> <table style='width:80%; height:270px; background:white; text-align:center; border-radius:20px; overflow:hidden; color:#000;' cellspacing=0 cellpadding=0> <tr><td style='height:35px; background:#ca0;'>פרטים לכרטיס החדש...</td></tr> <tr><td align='center'> <table style='width:80%; height:100%;'> <tr><td><input id='newCardMailT' style='width:100%; height:30px; text-align:center; font-size:14px;' disabled /></td></tr> <tr><td><input id='newCardFirstNameT' style='width:100%; height:30px; text-align:center; font-size:14px;' placeholder='שם פרטי של בעל הכרטיס' oninput='newCardCreateTextHandler(event);'/></td></tr> <tr><td><input id='newCardLastNameT' style='width:100%; height:30px; text-align:center; font-size:14px;' placeholder='שם משפחה של בעל הכטיס' oninput='newCardCreateTextHandler(event);'/></td></tr> <tr><td><input id='newCardBusinessNameT' style='width:100%; height:30px; text-align:center; font-size:14px;' placeholder='שם העסק' oninput='newCardCreateTextHandler(event);'/></td></tr> </table> </td></tr> <tr><td style='height:35px;'> <table style='width:100%; height:100%; text-align:center; color:#000; direction:rtl; cursor:default;' cellspacing=0 cellpadding=0><tr> <td style='width:50%; background:#ccc' onclick='closeNewCardCreateFormHandler(event);'>בטל</td> <td id='applyCreateNewCardB' style='background:#00b; opacity:0.5; color:white;' onclick='applyCreateNewCardHandler(event);'>בצע יצירת כרטיס חדש</td> </tr></table> </td></tr> </table> </td></tr></table> </DIV> <DIV id='newUserCreateForm' style='position:absolute; left:0px; top:0px; width:100%; height:100%; overflow:hidden; display:none; opacity:0;'> <table style='width:100%; height:100%;'><tr><td align='center'> <table style='width:80%; height:210px; background:white; text-align:center; border-radius:20px; overflow:hidden; color:#000;' cellspacing=0 cellpadding=0> <tr><td style='height:35px; background:#ca0;'>יצירת משמש חדש</td></tr> <tr><td style='color:#666;'>כל שדה חיוני ליצירת משתמש חדש.</td></tr> <tr><td> <table style='width:100%; direction:rtl; text-align:center; color:black;'> <tr> <td><input id='newUserMailT' style='width:100%; height:30px; text-align:center; font-size:14px;' oninput='newUserTextHandler(event);' placeholder='אמייל'/></td> <td><input id='newUserPassT' style='width:100%; height:30px; text-align:center; font-size:14px;' oninput='newUserTextHandler(event);' placeholder='סיסמה' onkeydown='newUserKeyHandler(event);'/></td> </tr> <tr> <td><input id='newUserFirstT' style='width:100%; height:30px; text-align:center; font-size:14px;' oninput='newUserTextHandler(event);' placeholder='שם פרטי'/></td> <td><input id='newUserLastT' style='width:100%; height:30px; text-align:center; font-size:14px;' oninput='newUserTextHandler(event);' placeholder='שם משפחה'/></td> </tr> <tr> <td><input id='newUserCellularT' style='width:100%; height:30px; text-align:center; font-size:14px;' oninput='newUserTextHandler(event);' placeholder='נייד' onkeydown='newUserKeyHandler(event);'/></td> <td><input id='newUserBusinessT' style='width:100%; height:30px; text-align:center; font-size:14px;' oninput='newUserTextHandler(event);' placeholder='שם העסק'/></td> </tr> </table> </td></tr> <tr><td style='height:35px;'> <table style='width:100%; height:100%; text-align:center; color:#000; direction:rtl; cursor:default;' cellspacing=0 cellpadding=0><tr> <td style='width:50%; background:#ccc' onclick='closeNewUserFormHandler(event);'>בטל</td> <td id='applyCreateNewUserB' style='background:#00b; opacity:0.5; color:white;' onclick='applyCreateNewUserHandler(event);'>צור משמש</td> </tr></table> </td></tr> </table> </td></tr></table> </DIV> <DIV id='removeCardForm' style='position:absolute; left:0px; top:0px; width:100%; height:100%; overflow:hidden; display:none; opacity:0;'> <table style='width:100%; height:100%; cursor:default;'><tr><td align='center'> <table style='width:60%; height:210px; background:white; text-align:center; border-radius:20px; overflow:hidden; color:#000; color:#000;' cellspacing=0 cellpadding=0> <tr><td style='height:35px; background:#ca0;'> <table style='width:100%;color:#000; text-align:center;'><tr> <td style='width:35px; color:#900;' onclick='closeRemoveCardFormHandler(event);'>X</td> <td>מחיקת/השייה כרטיס</td> </tr></table> </td></tr> <tr><td align='center'> <div id='removeCardsListDiv' style='width:90%; height:100px; overflow-x:hidden; overflow-y:auto;'> <table id='removeCardsListTable' style='width:100%; color:#000;'></table> </div> </td></tr> <tr><td style='height:35px;'> <table style='width:100%; height:100%; text-align:center; color:#000; direction:rtl; cursor:default; color:#000;' cellspacing=0 cellpadding=0><tr> <td id='deleteCardB' style='width:50%; background:#ccc; opacity:0.5;' onclick='deleteCardHandler(event);'>מחיקה</td> <td id='pauseCardB' style='background:#00b; opacity:0.5; color:white; opacity:0.5;' onclick='pauseCardHandler(event);'>השייה</td> </tr></table> </td></tr> </table> </td></tr></table> </DIV> <DIV id='cardImagesForm' style='position:absolute; left:0px; top:0px; width:100%; height:100%; overflow:hidden; display:none; opacity:0;'> <table style='width:100%; height:100%; direction:rtl;'><tr><td align='center'> <table style='width:80%; height:235px; background:white; text-align:center; border-radius:20px; overflow:hidden; color:#000;' cellspacing=0 cellpadding=0> <tr><td style='height:35px; background:#ca0;'>יבוא תמונות בסיסיות</td></tr> <tr><td align='center'> <table style='height:150px; color:#666;'> <tr> <td style='text-align: end;'>סמל:</td> <td> <table align='center' style='font-size:19px;'><tr> <td style='width:20px;'></td> <td align='center' style=' padding:4px; padding-right:8px; padding-left:8px; border:2px solid #000; border-radius:10px;'><img id='iconCameraB' src='files/images/camera.png' style='filter:invert(0%);' onclick='imagesButtonHandler(event);'/></td> <td style='width:10px;'></td> <td align='center' style=' padding:4px; padding-right:8px; padding-left:8px; border:2px solid #000; border-radius:10px;'><img id='iconGalleryB' src='files/images/gallery.png' style='filter:invert(0%);' onclick='imagesButtonHandler(event);'/></td> <td style='width:10px;'></td> <td align='center' style=' padding:4px; padding-right:8px; padding-left:8px; border:2px solid #ccc; border-radius:10px;'><img id='iconViewB' src='files/images/view.png' style='filter:invert(50%); opacity:0.5;' onclick='imagesButtonHandler(event);'/></td> </tr></table> </td> </tr> <tr> <td style='text-align: end;'>לוגו:</td> <td> <table style='font-size:19px;'><tr> <td style='width:20px;'></td> <td align='center' style=' padding:4px; padding-right:8px; padding-left:8px; border:2px solid #000; border-radius:10px;'><img id= 'logoCameraB' src='files/images/camera.png' style='filter:invert(0%);' onclick='imagesButtonHandler(event);'/></td> <td style='width:10px;'></td> <td align='center' style=' padding:4px; padding-right:8px; padding-left:8px; border:2px solid #000; border-radius:10px;'><img id='logoGalleryB' src='files/images/gallery.png' style='filter:invert(0%);' onclick='imagesButtonHandler(event);'/></td> <td style='width:10px;'></td> <td align='center' style=' padding:4px; padding-right:8px; padding-left:8px; border:2px solid #ccc; border-radius:10px;'><img id='logoViewB' src='files/images/view.png' style='filter:invert(50%); opacity:0.5;' onclick='imagesButtonHandler(event);'/></td> </tr></table> </td> </tr> <tr> <td style='text-align: end;'>תמונה:</td> <td> <table style='font-size:19px;'><tr> <td style='width:20px;'></td> <td align='center' style=' padding:4px; padding-right:8px; padding-left:8px; border:2px solid #000; border-radius:10px;'><img id='imageCameraB' src='files/images/camera.png' style='filter:invert(0%);' onclick='imagesButtonHandler(event);'/></td> <td style='width:10px;'></td> <td align='center' style=' padding:4px; padding-right:8px; padding-left:8px; border:2px solid #000; border-radius:10px;'><img id='imageGalleryB' src='files/images/gallery.png' style='filter:invert(0%);' onclick='imagesButtonHandler(event);'/></td> <td style='width:10px;'></td> <td align='center' style=' padding:4px; padding-right:8px; padding-left:8px; border:2px solid #ccc; border-radius:10px;'><img id='imageViewB' src='files/images/view.png' style='filter:invert(50%); opacity:0.5;' onclick='imagesButtonHandler(event);'/></td> </tr></table> </td> </tr> </table> </td></tr> <tr id='cardsImagesFormSaveProgressRow' style='display:none;'><td style='height:25px; border-top:1px dotted #000; border-bottom:1px dotted #000'> <table style='width:100%; height:100%;'><tr> <td id='cifSaveProgressT' style='width:100px;'> <div align='left' style='width:100%; height:100%;overflow:hidden;'><div id='cifSaveProgressDiv' style='width:0%; height:100%; background:green;'></div></div> </td> <td id='cifSaveStatusT'></td> </tr></table> </td></tr> <tr><td style='height:35px;'> <table style='width:100%; height:100%; text-align:center; color:#000; direction:rtl; cursor:default;' cellspacing=0 cellpadding=0><tr> <td style='width:50%; background:#ccc' onclick='closeCardImagesFormHandler(event);'>בטל</td> <td id='uploadImagesB' style='background:#00b; opacity:0.5; color:white;' onclick='uploadImagesHandler(event);'>שמור</td> </tr></table> </td></tr> </table> </td></tr></table> </DIV> <DIV id='previewForm' style='position:absolute; left:0px; top:0px; width:100%; height:100%; display:none; opacity:0;' onclick='closePreviewForm();'> <table style='width:100%; height:100%;'><tr><td align='center'> <table style='width:70%; direction:rtl; padding:5px; color:black; background:white; border-radius:10px;'> <tr id='' style=''><td id='previewCell' style='min-height: 100px;' align='center'> </td></tr> <tr><td style='color:#000; text-align:center;'>הקלק לסגירה</td></tr> </table> </td></tr></table> </DIV> <DIV id='addGalleryForm' style='position:absolute; left:0px; top:0px; width:100%; height:100%; display:none; opacity:0;'> <TABLE style='width:100%; height:100%;'><TR><TD align='center'> <table style='width:60%; height:180px; background:white; text-align:center; color:#666; border-radius:20px; overflow:hidden;' cellspacing=0 cellpadding=0> <tr><td style='height:40px; '> <table style='width:100%; height:100%; text-align:center; direction:rtl; background:#ca0; color:#fff;'><tr> <td>הוספת גלריה</td> <td style='width:40px; color:#900;' onclick='closeAddGalleryFormHandler(event);'>X</td> </tr></table> </td></tr> <tr><td>באפשרותך להוסיף עד 4 גלריות <br>המכילות כל אחד עד 20 תמונות/סרטונים</td></tr> <tr><td align='center'> <input id='addGalleryT' style='width:80%; height:30px; text-align:center; font-size:14px;' oninput='addGalleryTextHandler(event);' placeholder='בחר שם לגלריה'> </td></tr> <tr><td id='addGalleryB' style='height:35px; background:green; color:#fff; opacity:0.5;' onclick='applyAddGalleryHandler(event);'>הוסף</td></tr> </table> </TD></TR></TABLE> </DIV> <DIV id='galleryImagesForm' style='position:absolute; left:0px; top:0px; width:100%; height:100%; display:none; opacity:0;'> <table style='width:100%; height:100%;'><tr><td align='center;'> <table style='width:100%; height:100%; background:rgba(64,64,64,0.8);'> <tr><td style='height:40px; background:#444; color:#ccc; text-align:center'> <table style='width:100%; height:100%; direction:rtl; text-align:center;'><tr> <td id='galleryImagesTitleT'>Gallery Name</td> <td style='width:40px;' onclick='closeGalleryImagesFormHandler(event);'>X</td> </tr></table> </td></tr> <tr><td align='center'> <div id='galleryImagesContainer' style='width:95%; height:95%; overflow-x:hidden; overflow-y:auto; direction:rtl; '></div> </td></tr> <tr><td style='height:40px; background:#444; color:#ccc; text-align:center;'> <table style='width:100%; height:100%; direction:rtl; text-align:center; cursor:default;'><tr> <td onclick='addGalleryImageHandler(event);'>+ הוסף תמונה</td> <td id='galleryDeleteImageB' style='opacity:0.5;' onclick='galleryImageDeleteHandler(event);'>- מחק תמונה</td> </tr></table> </td></tr> </table> </td></tr></table> </DIV> <DIV id='saveProgressForm' style='position:absolute; left:0px; top:0px; width:100%; height:100%; display:none; opacity:0'> <table style='width:100%; height:100%;'><tr><td align='center'> <table style='width:250px; height:150px; background:white; text-align:center; color:#666; border-radius:20px; overflow:hidden;' cellspacing=0 cellpadding=0> <tr><td style='height:40px; direction:rtl; background:#ca0; color:#fff;'> התקדמות תהליך שמירה </td><tr> <tr><td align='center'> <div style='width:90%; height:20px; border:1px solid #000; border-radius:10px; overflow:hidden' align='left'> <div id='saveProgressDiv' style='width:1px; height:100%; background:green;'></div> </div> </td><tr> <tr><td id='saveProgressStatusT' style='height:40px;'></td></tr> </table> </td></tr></table> </DIV> <DIV id='cardCreditForm' style='position:absolute; left:0px; top:0px; width:100%; height:100%; display:none; opacity:0'> <TABLE style='width:100%; height:100%; background:rgba(0,190,255,0.75);'><TR><TD align='center'> <div style='padding:5px; margin-bottom:5px; color:white; font-size:20px;'>בחר חבילה לרכישה</div> <table style='width:90%; background:rgba(0,190,255,0.75); direction:rtl; border-radius:15px;'> <tr> <td style="width:46%; height:180px; border:4px solid rgba(255,255,255,0.5); overflow:hidden; border-radius:15px;"> <table style="width:100%; height:100%; text-align:center; color:white;" cellspacing=0 cellpadding=0> <tr><td style=" background:#CCAA27; color:white;">חבילה בסיסית</td></tr> <tr><td style="font-size:18px;"><span style="font-size:19px; font-weight:bold;">250</span> כרטיסים</td></tr> <tr><td valign="top">לשיתוף/חלוקה</td></tr> <tr><td style="font-size:19px; font-weight:bold;" align="center"><div style="width:25%; border-radius:50%; background:#090; padding:4px;">100₪</div></td></tr> <tr><td><button id='basisB' onclick='saleHandler(event);'>רכישה</button></td></tr> </table> </td> <td style="width:46%; height:180px; border:4px solid rgba(255,255,255,0.5); overflow:hidden; border-radius:15px;"> <table style="width:100%; height:100%; text-align:center; color:white;" cellspacing=0 cellpadding=0> <tr><td style="background:#CCAA27;">חבילה משופרת</td></tr> <tr><td style="font-size:18px;"><span style="font-size:19px; font-weight:bold;">500</span> כרטיסים</td></tr> <tr><td valign="top">לשיתוף/חלוקה</td></tr> <tr><td style="font-size:19px; font-weight:bold;" align="center"><div style="width:25%;border-radius:50%; background:#090; padding:4px;">180₪</div></td></tr> <tr><td><button id='improvedB' onclick='saleHandler(event);'>רכישה</button></td></tr> </table> </td> </tr> <tr> <td style="width:46%; height:180px; border:4px solid rgba(255,255,255,0.5); overflow:hidden; border-radius:15px;"> <table style="width:100%; height:100%; text-align:center; color:white;" cellspacing=0 cellpadding=0> <tr><td style="background:#CCAA27;">חבילה נחושה</td></tr> <tr><td style="font-size:18px;"><span style="font-size:19px; font-weight:bold;">750</span> כרטיסים</td></tr> <tr><td valign="top">לשיתוף/חלוקה</td></tr> <tr><td style="font-size:19px; font-weight:bold;" align="center"><div style="width:25%;border-radius:50%; background:#090; padding:4px;">250₪</div></td></tr> <tr><td><button id='determinedB' onclick='saleHandler(event);'>רכישה</button></td></tr> </table> </td> <td style="width:46%; height:180px; border:4px solid rgba(255,255,255,0.5); overflow:hidden; border-radius:15px;"> <table style="width:100%; height:100%; text-align:center; color:white;" cellspacing=0 cellpadding=0> <tr><td style="background:#CCAA27;">חבילה שקטה</td></tr> <tr><td style="font-size:18px;"><span style="font-size:19px; font-weight:bold;">1000</span> כרטיסים</td></tr> <tr><td valign="top">לשיתוף/חלוקה</td></tr> <tr><td style="font-size:19px; font-weight:bold;" align="center"><div style="width:25%; border-radius:50%; background:#090; padding:4px;">300₪</div></td></tr> <tr><td><button id='quietB' onclick='saleHandler(event);'>רכישה</button></td></tr> </table> </td> </tr> </table> <table style=' direction:rtl; background:rgba(255,255,255,0.0);'> <tr><td align='center'> <table style='background:rgba(255,255,255,0.75); border-radius:10px; padding:4px; margin-top:10px;'><tr> <td><img src='files/images/visa.png' style='width:48px;' /></td> <td><img src='files/images/mastercard.png' style='width:48px;' /></td> <td><img src='files/images/paypal.png' style='width:48px;' /></td> </tr></table> </td></tr> <tr><td align='center'> <table style='background:rgba(255,255,255,0.75); border-radius:10px; padding:4px; margin-top:10px;'><tr> <td align='center'><img src='files/images/ssl-certificate.png' style='width:48px;' /></td> <td align='center'><img src='files/images/ssl-certificate-2.png' style='width:48px;' /></td> </tr></table> </td></tr> <tr><td align='center' style='color:#00f; text-decoration:underline; padding-top:10px; cursor:default;' onclick='salePolicyHandler(event);'>dcards - מדיניות מכירה</td></tr> </table> </TD></TR></TABLE> </DIV> </BODY> </HTML>
© 2017 -
ZeroByte.ID
.