Add notification to login for being able to rate

extensions/ter_fe2/Resources/Private/Partials/Like.html

@@ -16,7 +16,8 @@
             </f:if>
         </f:then>
         <f:else>
-            <button class="btn btn-outline-primary" title="Login to like"><i class="fa fa-heart-o"></i>&nbsp;<f:format.number decimals="0" thousandsSeparator=".">{extension.likes}</f:format.number>
+            <button class="btn btn-outline-primary" data-login="1" title="Login to like">
+                <i class="fa fa-heart-o"></i>&nbsp;<f:format.number decimals="0" thousandsSeparator=".">{extension.likes}</f:format.number>
             </button>
         </f:else>
     </f:security.ifAuthenticated>

extensions/ter_fe2/Resources/Public/Javascript/Default.js

@@ -95,6 +95,60 @@ jQuery(document).ready(function ($) {
         });
     }
 
+    var $loginNeeded = $("[data-login]")[0];
+    if ($loginNeeded) {
+        $($loginNeeded).click(function () {
+            $.notify({
+                // options
+                icon: "info",
+                title: "No rating possible",
+                message: "Please log in to rate."
+            }, {
+                // settings
+                element: "body",
+                position: "fixed",
+                type: "info",
+                allow_dismiss: true,
+                newest_on_top: false,
+                showProgressbar: false,
+                placement: {
+                    from: "top",
+                    align: "center"
+                },
+                offset: 20,
+                spacing: 10,
+                z_index: 9000,
+                delay: 3000,
+                timer: 1000,
+                width: '50%',
+                url_target: "_blank",
+                mouse_over: null,
+                animate: {
+                    enter: "animated fadeInDown",
+                    exit: "animated fadeOutUp"
+                },
+                onShow: null,
+                onShown: null,
+                onClose: null,
+                onClosed: null,
+                icon_type: "class",
+                template: [
+                    '<div class="col-sm-9" data-notify="container">',
+                    '<div class="alert alert-{0}" role="alert">',
+                    '<button type="button" aria-hidden="true" class="close" data-notify="dismiss">&times;</button>',
+                    '<strong class="alert-heading" data-notify="title"><i class="fa fa-info-circle"></i> {1}</strong> ',
+                    '<span class="mb-0" data-notify="message">{2}</span>',
+                    '<div class="progress" data-notify="progressbar">',
+                    '<div class="progress-bar progress-bar-{0}" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" style="width: 0%;"></div>',
+                    '</div>',
+                    '<a href="{3}" target="{4}" data-notify="url"></a>',
+                    '</div>',
+                    '</div>'
+                ].join('')
+            });
+        });
+    }
+
 });
 
 function copyToClipboard(el) {