Admin theme improvements

LiveHelperChat · Jan 17, 2019 · 5665d13 · 5665d13
1 parent 091d1fc
commit 5665d13
Show file tree

Hide file tree

Showing 5 changed files with 287 additions and 2 deletions.
diff --git a/lhc_web/design/defaulttheme/tpl/lhchat/userjoined.tpl.php b/lhc_web/design/defaulttheme/tpl/lhchat/userjoined.tpl.php
@@ -1 +1 @@
-<div class="message-row system-response"><i><span class="usr-tit sys-tit"><?php echo erTranslationClassLhTranslation::getInstance()->getTranslation('chat/syncadmin','System assistant')?></span><?php echo erTranslationClassLhTranslation::getInstance()->getTranslation('chat/userjoined','Visitor has joined the chat!')?></i></div>
+<div class="message-row system-response"><i><span class="usr-tit sys-tit"><?php echo erTranslationClassLhTranslation::getInstance()->getTranslation('chat/syncadmin','System assistant')?></span><div class="msg-body"><?php echo erTranslationClassLhTranslation::getInstance()->getTranslation('chat/userjoined','Visitor has joined the chat!')?></div></i></div>
diff --git a/lhc_web/design/defaulttheme/tpl/lhchat/userleftchat.tpl.php b/lhc_web/design/defaulttheme/tpl/lhchat/userleftchat.tpl.php
@@ -1 +1 @@
-<div class="message-row system-response"><i><span class="usr-tit sys-tit"><?php echo erTranslationClassLhTranslation::getInstance()->getTranslation('chat/syncadmin','System assistant')?></span><?php echo erTranslationClassLhTranslation::getInstance()->getTranslation('chat/userleftchat','Visitor has left the chat!')?></i></div>
+<div class="message-row system-response"><i><span class="usr-tit sys-tit"><?php echo erTranslationClassLhTranslation::getInstance()->getTranslation('chat/syncadmin','System assistant')?></span><div class="msg-body"><?php echo erTranslationClassLhTranslation::getInstance()->getTranslation('chat/userleftchat','Visitor has left the chat!')?></div></i></div>
diff --git a/lhc_web/design/defaulttheme/tpl/lhtheme/admin/form.tpl.php b/lhc_web/design/defaulttheme/tpl/lhtheme/admin/form.tpl.php
@@ -9,6 +9,7 @@
 	<!-- Nav tabs -->
 	<ul class="nav nav-tabs" role="tablist">
 		<li role="presentation" class="nav-item"><a class="active nav-link" href="#settings" aria-controls="settings" role="tab" data-toggle="tab"><?php echo erTranslationClassLhTranslation::getInstance()->getTranslation('icclicktocallform/form','Settings');?></a></li>
+        <li role="presentation" class="nav-item"><a class="nav-link" href="#chatattributes" aria-controls="chatattributes" role="tab" data-toggle="tab"><?php echo erTranslationClassLhTranslation::getInstance()->getTranslation('icclicktocallform/form','Chat attributes');?></a></li>
         <li role="presentation" class="nav-item"><a class="nav-link" href="#mainattr" aria-controls="mainattr" role="tab" data-toggle="tab"><?php echo erTranslationClassLhTranslation::getInstance()->getTranslation('icclicktocallform/form','Main attributes');?></a></li>
         <li role="presentation" class="nav-item"><a class="nav-link" href="#headersettings" aria-controls="headersettings" role="tab" data-toggle="tab"><?php echo erTranslationClassLhTranslation::getInstance()->getTranslation('icclicktocallform/form','Header settings');?></a></li>
 		<li role="presentation" class="nav-item"><a class="nav-link" href="#headercss" aria-controls="headercss" role="tab" data-toggle="tab"><?php echo erTranslationClassLhTranslation::getInstance()->getTranslation('icclicktocallform/form','Header css');?></a></li>
@@ -28,6 +29,118 @@
 			</div>				
 		</div>
 
+
+		<div role="tabpanel" class="tab-pane" id="chatattributes">
+
+                <h3><?php echo erTranslationClassLhTranslation::getInstance()->getTranslation('abstract/widgettheme','Live preview')?></h3>
+                <div id="messages">
+                    <div class="msgBlock msgBlock-admin" style="height:300px;background-color: #{{bactract_bg_color_chat_bg}}">
+                        <div class="message-row response">
+                            <div class="msg-date" style="color:#{{bactract_bg_color_time_color}}">10:14:39</div>
+                            <span style="color:#{{bactract_bg_color_buble_visitor_title_color}}" class="usr-tit vis-tit" role="button"><i class="material-icons chat-operators mi-fs15 mr-0">face</i>Visitor</span>
+                            <div class="msg-body" style="background-color: #{{bactract_bg_color_buble_visitor_background}};color:#{{bactract_bg_color_buble_visitor_text_color}}">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</div>
+                        </div>
+                        <div class="message-row system-response">
+                            <div class="msg-date" style="color:#{{bactract_bg_color_time_color}}">2019-01-15 14:17:44</div><i>
+                            <span class="usr-tit sys-tit" style="background-color: #{{bactract_bg_color_buble_sys_background}};color:#{{bactract_bg_color_buble_sys_title_color}}">System assistant</span>
+                            <div class="msg-body" style="color: #{{bactract_bg_color_buble_sys_text_color}}">Operator has accepted the chat!</div></i>
+                        </div>
+                        <div class="message-row message-admin operator-changes">
+                            <div class="msg-date" style="color:#{{bactract_bg_color_time_color}}">10:18:22</div>
+                            <span style="color:#{{bactract_bg_color_buble_operator_title_color}}" class="usr-tit op-tit" ><i class="material-icons chat-operators mi-fs15 mr-0">account_box</i>Operator</span>
+                            <div class="msg-body" style="color:#{{bactract_bg_color_buble_operator_text_color}};background-color: #{{bactract_bg_color_buble_operator_background}};">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</div>
+                        </div>
+                    </div>
+                </div>
+
+                <h5><?php echo erTranslationClassLhTranslation::getInstance()->getTranslation('abstract/widgettheme','Visitor messages style')?></h5>
+                <div class="row">
+                    <div class="col">
+                        <div class="form-group">
+                            <label><?php echo $fields['buble_visitor_background']['trans'];?></label>
+                            <?php echo erLhcoreClassAbstract::renderInput('buble_visitor_background', $fields['buble_visitor_background'], $form)?>
+                        </div>
+                    </div>
+                    <div class="col">
+                        <div class="form-group">
+                            <label><?php echo $fields['buble_visitor_title_color']['trans'];?></label>
+                            <?php echo erLhcoreClassAbstract::renderInput('buble_visitor_title_color', $fields['buble_visitor_title_color'], $form)?>
+                        </div>
+                    </div>
+                    <div class="col">
+                        <div class="form-group">
+                            <label><?php echo $fields['buble_visitor_text_color']['trans'];?></label>
+                            <?php echo erLhcoreClassAbstract::renderInput('buble_visitor_text_color', $fields['buble_visitor_text_color'], $form)?>
+                        </div>
+                    </div>
+                </div>
+
+                <h5><?php echo erTranslationClassLhTranslation::getInstance()->getTranslation('abstract/widgettheme','Operator messages style')?></h5>
+                <div class="row">
+                    <div class="col">
+                        <div class="form-group">
+                            <label><?php echo $fields['buble_operator_background']['trans'];?></label>
+                            <?php echo erLhcoreClassAbstract::renderInput('buble_operator_background', $fields['buble_operator_background'], $form)?>
+                        </div>
+                    </div>
+                    <div class="col">
+                        <div class="form-group">
+                            <label><?php echo $fields['buble_operator_title_color']['trans'];?></label>
+                            <?php echo erLhcoreClassAbstract::renderInput('buble_operator_title_color', $fields['buble_operator_title_color'], $form)?>
+                        </div>
+                    </div>
+                    <div class="col">
+                        <div class="form-group">
+                            <label><?php echo $fields['buble_operator_text_color']['trans'];?></label>
+                            <?php echo erLhcoreClassAbstract::renderInput('buble_operator_text_color', $fields['buble_operator_text_color'], $form)?>
+                        </div>
+                    </div>
+                </div>
+
+                <h5><?php echo erTranslationClassLhTranslation::getInstance()->getTranslation('abstract/widgettheme','System assistant messages style')?></h5>
+                <div class="row">
+                    <div class="col">
+                        <div class="form-group">
+                            <label><?php echo $fields['buble_sys_background']['trans'];?></label>
+                            <?php echo erLhcoreClassAbstract::renderInput('buble_sys_background', $fields['buble_sys_background'], $form)?>
+                        </div>
+                    </div>
+                    <div class="col">
+                        <div class="form-group">
+                            <label><?php echo $fields['buble_sys_title_color']['trans'];?></label>
+                            <?php echo erLhcoreClassAbstract::renderInput('buble_sys_title_color', $fields['buble_sys_title_color'], $form)?>
+                        </div>
+                    </div>
+                    <div class="col">
+                        <div class="form-group">
+                            <label><?php echo $fields['buble_sys_text_color']['trans'];?></label>
+                            <?php echo erLhcoreClassAbstract::renderInput('buble_sys_text_color', $fields['buble_sys_text_color'], $form)?>
+                        </div>
+                    </div>
+                </div>
+
+                <h5><?php echo erTranslationClassLhTranslation::getInstance()->getTranslation('abstract/widgettheme','General')?></h5>
+                <div class="row">
+                    <div class="col">
+                        <div class="form-group">
+                            <label><?php echo $fields['chat_bg']['trans'];?></label>
+                            <?php echo erLhcoreClassAbstract::renderInput('chat_bg', $fields['chat_bg'], $form)?>
+                        </div>
+                    </div>
+                    <div class="col">
+                        <div class="form-group">
+                            <label><?php echo $fields['time_color']['trans'];?></label>
+                            <?php echo erLhcoreClassAbstract::renderInput('time_color', $fields['time_color'], $form)?>
+                        </div>
+                    </div>
+                </div>
+
+			</div>
+
+
+
+
+
 		<div role="tabpanel" class="tab-pane" id="headersettings">
             <div class="form-group">
 				<label><?php echo erTranslationClassLhTranslation::getInstance()->getTranslation('icclicktocallform/form','Header content');?></label>

diff --git a/lhc_web/design/defaulttheme/tpl/lhtheme/admincss.tpl.php b/lhc_web/design/defaulttheme/tpl/lhtheme/admincss.tpl.php
@@ -181,5 +181,72 @@
 }
 <?php endif; ?>
 
+<?php if (isset($cssAttributes['buble_operator_background']) || isset($cssAttributes['buble_operator_text_color'])) : ?>
+    div.message-admin div.msg-body,
+    div.message-admin div.msg-body a.link{
+        <?php if (isset($cssAttributes['buble_operator_background'])) : ?>background-color: #<?php echo $cssAttributes['buble_operator_background'];?>;<?php endif; ?>
+        <?php if (isset($cssAttributes['buble_operator_text_color'])) : ?>color: #<?php echo $cssAttributes['buble_operator_text_color'];?>;<?php endif; ?>
+    }
+<?php endif; ?>
+
+<?php if (isset($cssAttributes['buble_operator_title_color'])) : ?>
+    .op-tit{
+        color: #<?php echo $cssAttributes['buble_operator_title_color'];?>
+    }
+<?php endif; ?>
+
+<?php if (isset($cssAttributes['buble_visitor_text_color']) || isset($cssAttributes['buble_visitor_background'])) : ?>
+    div.message-row.response div.msg-body,
+    div.message-row.response div.msg-body a.link{
+        <?php if (isset($cssAttributes['buble_visitor_background'])) : ?>background-color: #<?php echo $cssAttributes['buble_visitor_background'];?>;<?php endif; ?>
+        <?php if (isset($cssAttributes['buble_visitor_text_color'])) : ?>color: #<?php echo $cssAttributes['buble_visitor_text_color'];?>;<?php endif; ?>
+    }
+<?php endif; ?>
+
+<?php if (isset($cssAttributes['buble_visitor_title_color'])) : ?>
+    .vis-tit{
+        color: #<?php echo $cssAttributes['buble_visitor_title_color'];?>
+    }
+<?php endif; ?>
+
+<?php if (isset($cssAttributes['chat_bg'])) : ?>
+    .msgBlock-admin{
+        background-color: #<?php echo $cssAttributes['chat_bg'];?>
+    }
+<?php endif; ?>
+
+<?php if (isset($cssAttributes['time_color'])) : ?>
+    .msg-date{
+        color: #<?php echo $cssAttributes['time_color'];?>
+    }
+<?php endif; ?>
+
+
+<?php if (isset($cssAttributes['buble_sys_background']) || isset($cssAttributes['buble_sys_title_color']) ) : ?>
+    .sys-tit{
+        <?php if (isset($cssAttributes['buble_sys_background'])) : ?>background-color: #<?php echo $cssAttributes['buble_sys_background'];?>;<?php endif; ?>
+        <?php if (isset($cssAttributes['buble_sys_title_color'])) : ?>color: #<?php echo $cssAttributes['buble_sys_title_color'];?>;<?php endif; ?>
+    }
+<?php endif; ?>
+
+<?php if (isset($cssAttributes['buble_sys_text_color'])) : ?>
+div.system-response div.msg-body,
+div.system-response div.msg-body a.link{
+    color: #<?php echo $cssAttributes['buble_sys_text_color'];?>
+}
+<?php endif; ?>
 
 
+<?php /*
+<div class="msgBlock" style="" id="messagesBlock">
+    <div class="message-row response" id="msg-10459" data-op-id="0">
+        <div class="msg-date">10:14:39</div>
+        <span style="color:#{{bactract_bg_color_buble_visitor_title_color}}" class="usr-tit vis-tit" role="button"><i class="material-icons chat-operators mi-fs15 mr-0">account_box</i>Operator</span>
+        <div class="msg-body" style="background-color: #{{bactract_bg_color_buble_visitor_background}};color:#{{bactract_bg_color_buble_visitor_text_color}}">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</div>
+    </div>
+    <div class="message-row message-admin operator-changes" id="msg-10463" data-op-id="1">
+        <div class="msg-date">10:18:22</div>
+        <span style="color:#{{bactract_bg_color_buble_operator_title_color}}" class="usr-tit op-tit" ><i class="material-icons chat-operators mi-fs15 mr-0">face</i>Visitor</span>
+        <div class="msg-body" style="color:#{{bactract_bg_color_buble_operator_text_color}};background-color: #{{bactract_bg_color_buble_operator_background}};">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</div>
+    </div>
+</div>*/
diff --git a/lhc_web/lib/core/lhabstract/fields/erlhabstractmodeladmintheme.php b/lhc_web/lib/core/lhabstract/fields/erlhabstractmodeladmintheme.php
@@ -1,6 +1,111 @@
 <?php
 
 return array(
+    // Messages styles
+    'buble_visitor_background' => array(
+        'type' => 'colorpicker',
+        'main_attr' => 'css_attributes_array',
+        'trans' => erTranslationClassLhTranslation::getInstance()->getTranslation('abstract/widgettheme','Buble background color'),
+        'required' => false,
+        'hidden' => true,
+        'validation_definition' => new ezcInputFormDefinitionElement(
+            ezcInputFormDefinitionElement::OPTIONAL, 'unsafe_raw'
+        )),
+    'buble_visitor_title_color' => array(
+        'type' => 'colorpicker',
+        'main_attr' => 'css_attributes_array',
+        'trans' => erTranslationClassLhTranslation::getInstance()->getTranslation('abstract/widgettheme','Title color'),
+        'required' => false,
+        'hidden' => true,
+        'validation_definition' => new ezcInputFormDefinitionElement(
+            ezcInputFormDefinitionElement::OPTIONAL, 'unsafe_raw'
+        )),
+    'buble_visitor_text_color' => array(
+        'type' => 'colorpicker',
+        'main_attr' => 'css_attributes_array',
+        'trans' => erTranslationClassLhTranslation::getInstance()->getTranslation('abstract/widgettheme','Text color'),
+        'required' => false,
+        'hidden' => true,
+        'validation_definition' => new ezcInputFormDefinitionElement(
+            ezcInputFormDefinitionElement::OPTIONAL, 'unsafe_raw'
+        )),
+    'buble_operator_background' => array(
+        'type' => 'colorpicker',
+        'main_attr' => 'css_attributes_array',
+        'trans' => erTranslationClassLhTranslation::getInstance()->getTranslation('abstract/widgettheme','Buble background color'),
+        'required' => false,
+        'hidden' => true,
+        'validation_definition' => new ezcInputFormDefinitionElement(
+            ezcInputFormDefinitionElement::OPTIONAL, 'unsafe_raw'
+        )),
+    'buble_operator_title_color' => array(
+        'type' => 'colorpicker',
+        'main_attr' => 'css_attributes_array',
+        'trans' => erTranslationClassLhTranslation::getInstance()->getTranslation('abstract/widgettheme','Title color'),
+        'required' => false,
+        'hidden' => true,
+        'validation_definition' => new ezcInputFormDefinitionElement(
+            ezcInputFormDefinitionElement::OPTIONAL, 'unsafe_raw'
+        )),
+    'buble_operator_text_color' => array(
+        'type' => 'colorpicker',
+        'main_attr' => 'css_attributes_array',
+        'trans' => erTranslationClassLhTranslation::getInstance()->getTranslation('abstract/widgettheme','Text color'),
+        'required' => false,
+        'hidden' => true,
+        'validation_definition' => new ezcInputFormDefinitionElement(
+            ezcInputFormDefinitionElement::OPTIONAL, 'unsafe_raw'
+        )),
+    'chat_bg' => array(
+        'type' => 'colorpicker',
+        'main_attr' => 'css_attributes_array',
+        'trans' => erTranslationClassLhTranslation::getInstance()->getTranslation('abstract/widgettheme','Chat background color'),
+        'required' => false,
+        'hidden' => true,
+        'validation_definition' => new ezcInputFormDefinitionElement(
+            ezcInputFormDefinitionElement::OPTIONAL, 'unsafe_raw'
+        )),
+    'time_color' => array(
+        'type' => 'colorpicker',
+        'main_attr' => 'css_attributes_array',
+        'trans' => erTranslationClassLhTranslation::getInstance()->getTranslation('abstract/widgettheme','Time text color'),
+        'required' => false,
+        'hidden' => true,
+        'validation_definition' => new ezcInputFormDefinitionElement(
+            ezcInputFormDefinitionElement::OPTIONAL, 'unsafe_raw'
+        )),
+
+    'buble_sys_background' => array(
+        'type' => 'colorpicker',
+        'main_attr' => 'css_attributes_array',
+        'trans' => erTranslationClassLhTranslation::getInstance()->getTranslation('abstract/widgettheme','Buble background color'),
+        'required' => false,
+        'hidden' => true,
+        'validation_definition' => new ezcInputFormDefinitionElement(
+            ezcInputFormDefinitionElement::OPTIONAL, 'unsafe_raw'
+        )),
+
+    'buble_sys_title_color' => array(
+        'type' => 'colorpicker',
+        'main_attr' => 'css_attributes_array',
+        'trans' => erTranslationClassLhTranslation::getInstance()->getTranslation('abstract/widgettheme','Title text colorr'),
+        'required' => false,
+        'hidden' => true,
+        'validation_definition' => new ezcInputFormDefinitionElement(
+            ezcInputFormDefinitionElement::OPTIONAL, 'unsafe_raw'
+        )),
+
+    'buble_sys_text_color' => array(
+        'type' => 'colorpicker',
+        'main_attr' => 'css_attributes_array',
+        'trans' => erTranslationClassLhTranslation::getInstance()->getTranslation('abstract/widgettheme','Message text color'),
+        'required' => false,
+        'hidden' => true,
+        'validation_definition' => new ezcInputFormDefinitionElement(
+            ezcInputFormDefinitionElement::OPTIONAL, 'unsafe_raw'
+        )),
+
+    // Main styles
     'main_background_color' => array(
         'type' => 'colorpicker',
         'main_attr' => 'css_attributes_array',
Original file line number	Diff line number	Diff line change
		@@ -1 +1 @@
		<div class="message-row system-response"><i><span class="usr-tit sys-tit"><?php echo erTranslationClassLhTranslation::getInstance()->getTranslation('chat/syncadmin','System assistant')?></span><?php echo erTranslationClassLhTranslation::getInstance()->getTranslation('chat/userjoined','Visitor has joined the chat!')?></i></div>
		<div class="message-row system-response"><i><span class="usr-tit sys-tit"><?php echo erTranslationClassLhTranslation::getInstance()->getTranslation('chat/syncadmin','System assistant')?></span><div class="msg-body"><?php echo erTranslationClassLhTranslation::getInstance()->getTranslation('chat/userjoined','Visitor has joined the chat!')?></div></i></div>