Horizontal scrolling images on mobile devices

protected/humhub/libs/DynamicConfig.php

@@ -157,6 +157,8 @@ class DynamicConfig extends \yii\base\Object
         $config['components']['mailer'] = $mail;
         $config = ArrayHelper::merge($config, ThemeHelper::getThemeConfig(Yii::$app->settings->get('theme')));
         $config['params']['config_created_at'] = time();
+        
+        $config['params']['horImageScrollOnMobile'] = Yii::$app->settings->get('horImageScrollOnMobile');
 
         self::save($config);
     }

protected/humhub/modules/admin/messages/ru/forms_BasicSettingsForm.php

@@ -31,4 +31,5 @@ return [
     'Server Timezone' => 'Временная зона сервера',
     'Show introduction tour for new users' => 'Показывать приветственный тур для новых пользователей',
     'Show user profile post form on dashboard' => 'Показать поле для ввода сообщений на главной странице',
+    'Horizontal scrolling images on a mobile device' => 'Горизонтальная прокрутка изображений на мобильном устройстве',
 ];

protected/humhub/modules/admin/messages/ru/views_setting_index.php

@@ -25,5 +25,6 @@ return [
     'Delete' => 'Удалить',
     'E.g. http://example.com/humhub' => 'например, http://example.com/humhub',
     'Save' => 'Сохранить',
+    'Wall entry layout' => 'Отображение записи на стене',
     'You\'re using no logo at the moment. Upload your logo now.' => 'На данный момент вы не используете логотип. Загрузить логотип сейчас.',
 ];

protected/humhub/modules/admin/models/forms/DesignSettingsForm.php

@@ -25,6 +25,7 @@ class DesignSettingsForm extends \yii\base\Model
     public $spaceOrder;
     public $logo;
     public $dateInputDisplayFormat;
+    public $horImageScrollOnMobile;
 
     /**
      * @inheritdoc
@@ -40,6 +41,7 @@ class DesignSettingsForm extends \yii\base\Model
         $this->displayName = $settingsManager->get('displayNameFormat');
         $this->spaceOrder = Yii::$app->getModule('space')->settings->get('spaceOrder');
         $this->dateInputDisplayFormat = Yii::$app->getModule('admin')->settings->get('defaultDateInputFormat');
+        $this->horImageScrollOnMobile = $settingsManager->get('horImageScrollOnMobile');
     }
 
     /**
@@ -56,6 +58,7 @@ class DesignSettingsForm extends \yii\base\Model
             array('paginationSize', 'integer', 'max' => 200, 'min' => 1),
             array('theme', 'in', 'range' => $themes),
             array(['displayName', 'spaceOrder'], 'safe'),
+            array(['horImageScrollOnMobile'], 'boolean'),
             array('logo', 'file', 'extensions' => ['jpg', 'png', 'jpeg'], 'maxSize' => 3 * 1024 * 1024),
             array('logo', 'dimensionValidation', 'skipOnError' => true),
             array('dateInputDisplayFormat', 'in', 'range' => ['', 'php:d/m/Y']),
@@ -74,6 +77,7 @@ class DesignSettingsForm extends \yii\base\Model
             'spaceOrder' => Yii::t('AdminModule.forms_DesignSettingsForm', 'Dropdown space order'),
             'logo' => Yii::t('AdminModule.forms_BasicSettingsForm', 'Logo upload'),
             'dateInputDisplayFormat' => Yii::t('AdminModule.forms_BasicSettingsForm', 'Date input format'),
+            'horImageScrollOnMobile' => Yii::t('AdminModule.forms_BasicSettingsForm', 'Horizontal scrolling images on a mobile device'),
         );
     }
 
@@ -118,6 +122,7 @@ class DesignSettingsForm extends \yii\base\Model
         $settingsManager->set('displayNameFormat', $this->displayName);
         Yii::$app->getModule('space')->settings->set('spaceOrder', $this->spaceOrder);
         Yii::$app->getModule('admin')->settings->set('defaultDateInputFormat', $this->dateInputDisplayFormat);
+        $settingsManager->set('horImageScrollOnMobile', $this->horImageScrollOnMobile);
 
         if ($this->logo) {
             $logoImage = new \humhub\libs\LogoImage();

protected/humhub/modules/admin/views/setting/design.php

@@ -32,6 +32,10 @@ $this->registerJsFile('@web/resources/admin/uploadLogo.js');
         'php:d/m/Y' => Yii::t('AdminModule.views_setting_design', 'Fixed format (mm/dd/yyyy) - Example: {example}', ['{example}' => Yii::$app->formatter->asDate(time(), 'php:d/m/Y')]),
     ]);
     ?>
+    <strong><?php echo Yii::t('AdminModule.views_setting_index', 'Wall entry layout'); ?></strong>
+    <br>
+    <br>
+    <?php echo $form->field($model, 'horImageScrollOnMobile')->checkbox(); ?>
 
     <?php echo $form->field($model, 'logo')->fileInput(['id' => 'logo', 'style' => 'display: none', 'name' => 'logo[]']); ?>
 

protected/humhub/modules/content/widgets/views/stream.php

@@ -18,6 +18,12 @@ $jsLoadWall .= "mainStream = s;\n";
 $jsLoadWall .= "$('#btn-load-more').click(function() { currentStream.loadMore(); })\n";
 $this->registerJs($jsLoadWall, View::POS_READY);
 
+if(Yii::$app->settings->get('horImageScrollOnMobile'))
+$this->registerJs(new \yii\web\JsExpression("
+if (/Android|webOS|iPhone|iPad|iPod|BlackBerry|BB|PlayBook|IEMobile|Windows Phone|Kindle|Silk|Opera Mini/i.test(navigator.userAgent)) {
+        $('#wallStream').addClass('mobile');
+    }"), View::POS_READY);
+
 $defaultStreamSort = Yii::$app->getModule('content')->settings->get('stream.defaultSort');
 $this->registerJsVar('defaultStreamSort', ($defaultStreamSort != '') ? $defaultStreamSort : 'c');
 ?>

protected/humhub/modules/installer/libs/InitialData.php

@@ -33,6 +33,7 @@ class InitialData
         Yii::$app->settings->set('baseUrl', \yii\helpers\BaseUrl::base(true));
         Yii::$app->settings->set('paginationSize', 10);
         Yii::$app->settings->set('displayNameFormat', '{profile.firstname} {profile.lastname}');
+        Yii::$app->settings->set('horImageScrollOnMobile', true);
 
         // Authentication
         Yii::$app->getModule('user')->settings->set('auth.ldap.refreshUsers', '1');

themes/HumHub/css/theme.less

@@ -2355,9 +2355,23 @@ ul.tag_input.focus {
   img {
     vertical-align: top;
     margin-bottom: 3px;
+    margin-right: 5px;
+    max-height: 130px;
   }
 }
 
+#wallStream.mobile {
+  .post-files {
+    margin-top: 10px;
+    display: flex;
+    overflow-x: auto;
+    img {
+      max-width: 190px;
+    }
+  }
+}
+
+
 // fileupload button
 .comment_create,
 .content_edit {