소스 검색

added new notify style (total 4)
changed default notify style

causefx 8 년 전
부모
커밋
087498319c

+ 1 - 1
api/config/default.php

@@ -158,6 +158,6 @@ return array(
 	'pingOnlineSound' => 'plugins/sounds/default/awareness.mp3',
 	'pingMs' => false,
 	'pingAuthMs' => '1',
-	'notificationBackbone' => 'toastr',
+	'notificationBackbone' => 'izi',
 	'notificationPosition' => 'br'
 );

+ 7 - 3
api/functions/option-functions.php

@@ -45,17 +45,21 @@ function optionNotificationTypes()
 {
 	return array(
 		array(
-			'name' => 'Style 1',
+			'name' => 'Toastr',
 			'value' => 'toastr'
 		),
 		array(
-			'name' => 'Style 2',
+			'name' => 'Izi',
 			'value' => 'izi'
 		),
 		array(
-			'name' => 'Style 3',
+			'name' => 'Alertify',
 			'value' => 'alertify'
 		),
+		array(
+			'name' => 'Noty',
+			'value' => 'noty'
+		),
 	);
 }
 

+ 51 - 1
css/organizr.css

@@ -998,4 +998,54 @@ i.fa.fa-life-ring.fa-fw {
 .ajs-message.ajs-success-alertify { color: rgb(0, 255, 184);  background-color: #1b1a1a;  border-color: rgb(0, 255, 184); }
 .ajs-message.ajs-info-alertify { color: #3A83F0;  background-color: #1b1a1a;  border-color: #3A83F0; }
 .ajs-message.ajs-warning-alertify { color: #FFEB3B;  background-color: #1b1a1a;  border-color: #FFEB3B; }
-.ajs-message.ajs-error-alertify { color: #F44336;  background-color: #1b1a1a;  border-color: #F44336; }
+.ajs-message.ajs-error-alertify { color: #F44336;  background-color: #1b1a1a;  border-color: #F44336; }
+.noty_type__success-noty .noty_body{
+    background: #1b1a1a;
+    color: rgb(0, 255, 184);
+    border: 1px solid #232323;
+    border-bottom: transparent;
+}
+.noty_type__info-noty .noty_body{
+    background: #1b1a1a;
+    color: #3A83F0;
+    border: 1px solid #232323;
+    border-bottom: transparent;
+}
+.noty_type__warning-noty .noty_body
+{
+    background: #1b1a1a;
+    color: #FFEB3B;
+    border: 1px solid #232323;
+    border-bottom: transparent;
+}
+.noty_type__error-noty .noty_body{
+    background: #1b1a1a;
+    color: #F44336;
+    border: 1px solid #232323;
+    border-bottom: transparent;
+}
+
+.noty_type__success-noty.noty_has_timeout.noty_has_progressbar .noty_progressbar {
+    background-color: rgb(0, 255, 184);
+}
+.noty_type__info-noty.noty_has_timeout.noty_has_progressbar .noty_progressbar {
+    background-color: #3A83F0;
+}
+.noty_type__warning-noty.noty_has_timeout.noty_has_progressbar .noty_progressbar {
+    background-color: #FFEB3B;
+}
+.noty_type__error-noty.noty_has_timeout.noty_has_progressbar .noty_progressbar {
+    background-color: #F44336;
+}
+.noty_type__success-noty ellipse {
+    fill: rgb(0, 255, 184);
+}
+.noty_type__info-noty ellipse {
+    fill: #3A83F0;
+}
+.noty_type__warning-noty ellipse {
+    fill: #FFEB3B;
+}
+.noty_type__error-noty ellipse {
+    fill: #F44336;
+}

파일 크기가 너무 크기때문에 변경 상태를 표시하지 않습니다.
+ 0 - 0
css/organizr.min.css


+ 114 - 0
js/functions.js

@@ -3998,6 +3998,13 @@ function defineNotification(){
             include('plugins/bower_components/alertify/alertify.min.js');
             window.notificationFunction = 'alertify';
             break;
+        case 'noty':
+            include('plugins/bower_components/noty/noty.min.js');
+            include('plugins/bower_components/noty/mo.min.js');
+            include('plugins/bower_components/noty/noty.css');
+            include('plugins/bower_components/noty/mint.css');
+            window.notificationFunction = 'Noty';
+            break;
         default:
             return false
     }
@@ -4009,36 +4016,43 @@ function messagePositions(){
             "toastr":"bottom-right",
             "alertify":"bottom-right",
             "izi":"bottomRight",
+            "noty":"bottomRight",
         },
         "bl":{
             "toastr":"bottom-left",
             "alertify":"bottom-left",
             "izi":"bottomLeft",
+            "noty":"bottomLeft",
         },
         "bc":{
             "toastr":"bottom-center",
             "alertify":"bottom-center",
             "izi":"bottomCenter",
+            "noty":"bottomCenter",
         },
         "tr":{
             "toastr":"top-right",
             "alertify":"top-right",
             "izi":"topRight",
+            "noty":"topRight",
         },
         "tl":{
             "toastr":"top-left",
             "alertify":"top-left",
             "izi":"topLeft",
+            "noty":"topLeft",
         },
         "tc":{
             "toastr":"top-center",
             "alertify":"top-center",
             "izi":"topCenter",
+            "noty":"topCenter",
         },
         "c":{
             "toastr":"center",
             "alertify":"bottom-center",
             "izi":"center",
+            "noty":"center",
         }
     };
 }
@@ -4046,10 +4060,12 @@ function message(heading,text,position,color,icon,timeout){
     var bb = activeInfo.settings.notifications.backbone;
     switch (bb) {
         case 'toastr':
+
             var ready = (eval( notificationFunction) !== undefined) ? true :false;
             break;
         case 'izi':
         case 'alertify':
+        case 'noty':
             try {
                 var ready = (typeof eval(notificationFunction) !== undefined) ? true :false;
             } catch (e) {
@@ -4062,6 +4078,7 @@ function message(heading,text,position,color,icon,timeout){
             var ready = false;
     }
     if(notificationsReady && ready){
+        oldPosition = position;
         position = messagePositions()[position][bb];
         switch (bb) {
             case 'toastr':
@@ -4126,6 +4143,99 @@ function message(heading,text,position,color,icon,timeout){
                 alertify.set('notifier','position', position);
                 alertify.notify(msgFull, icon+'-alertify', timeout);
                 break;
+            case 'noty':
+                if(typeof mojs == 'undefined'){
+                    setTimeout(function(){ message(heading,text,oldPosition,color,icon,timeout); }, 100);
+                    return false;
+                }
+                var msgFull = (heading !== '') ? heading + '<br/>' + text : text;
+                new Noty({
+                    type: icon+'-noty',
+                    layout: position,
+                    text: msgFull,
+                    progressBar: true,
+                    timeout: timeout,
+                    animation: {
+                        open: function (promise) {
+                            var n = this;
+                            var Timeline = new mojs.Timeline();
+                            var body = new mojs.Html({
+                                el        : n.barDom,
+                                x         : {500: 0, delay: 0, duration: 500, easing: 'elastic.out'},
+                                isForce3d : true,
+                                onComplete: function () {
+                                    promise(function(resolve) {
+                                        resolve();
+                                    })
+                                }
+                            });
+
+                            var parent = new mojs.Shape({
+                                parent: n.barDom,
+                                width      : 200,
+                                height     : n.barDom.getBoundingClientRect().height,
+                                radius     : 0,
+                                x          : {[150]: -150},
+                                duration   : 1.2 * 500,
+                                isShowStart: true
+                            });
+
+                            n.barDom.style['overflow'] = 'visible';
+                            parent.el.style['overflow'] = 'hidden';
+
+                            var burst = new mojs.Burst({
+                                parent  : parent.el,
+                                count   : 10,
+                                top     : n.barDom.getBoundingClientRect().height + 75,
+                                degree  : 90,
+                                radius  : 75,
+                                angle   : {[-90]: 40},
+                                children: {
+                                    fill     : '#EBD761',
+                                    delay    : 'stagger(500, -50)',
+                                    radius   : 'rand(8, 25)',
+                                    direction: -1,
+                                    isSwirl  : true
+                                }
+                            });
+
+                            var fadeBurst = new mojs.Burst({
+                                parent  : parent.el,
+                                count   : 2,
+                                degree  : 0,
+                                angle   : 75,
+                                radius  : {0: 100},
+                                top     : '90%',
+                                children: {
+                                    fill     : '#EBD761',
+                                    pathScale: [.65, 1],
+                                    radius   : 'rand(12, 15)',
+                                    direction: [-1, 1],
+                                    delay    : .8 * 500,
+                                    isSwirl  : true
+                                }
+                            });
+
+                            Timeline.add(body, burst, fadeBurst, parent);
+                            Timeline.play();
+                        },
+                        close: function (promise) {
+                            var n = this;
+                            new mojs.Html({
+                                el        : n.barDom,
+                                x         : {0: 500, delay: 10, duration: 500, easing: 'cubic.out'},
+                                skewY     : {0: 10, delay: 10, duration: 500, easing: 'cubic.out'},
+                                isForce3d : true,
+                                onComplete: function () {
+                                    promise(function(resolve) {
+                                        resolve();
+                                    })
+                                }
+                            }).play();
+                        }
+                    }
+                }).show();
+                break;
             default:
                 console.log('msg not setup')
         }
@@ -4143,6 +4253,7 @@ function messageSingle(heading,text,position,color,icon,timeout){
             break;
         case 'izi':
         case 'alertify':
+        case 'noty':
             try {
                 var ready = (typeof eval(notificationFunction) !== undefined) ? true :false;
             } catch (e) {
@@ -4165,6 +4276,9 @@ function messageSingle(heading,text,position,color,icon,timeout){
             case 'alertify':
                 alertify.dismissAll();
                 break;
+            case 'noty':
+                Noty.closeAll();
+                break;
             default:
                 return false;
         }

+ 37 - 0
plugins/bower_components/noty/mint.css

@@ -0,0 +1,37 @@
+.noty_theme__mint.noty_bar {
+  margin: 4px 0;
+  overflow: hidden;
+  border-radius: 2px;
+  position: relative; }
+  .noty_theme__mint.noty_bar .noty_body {
+    padding: 10px;
+    font-size: 14px; }
+  .noty_theme__mint.noty_bar .noty_buttons {
+    padding: 10px; }
+
+.noty_theme__mint.noty_type__alert,
+.noty_theme__mint.noty_type__notification {
+  background-color: #fff;
+  border-bottom: 1px solid #D1D1D1;
+  color: #2F2F2F; }
+
+.noty_theme__mint.noty_type__warning {
+  background-color: #FFAE42;
+  border-bottom: 1px solid #E89F3C;
+  color: #fff; }
+
+.noty_theme__mint.noty_type__error {
+  background-color: #DE636F;
+  border-bottom: 1px solid #CA5A65;
+  color: #fff; }
+
+.noty_theme__mint.noty_type__info,
+.noty_theme__mint.noty_type__information {
+  background-color: #7F7EFF;
+  border-bottom: 1px solid #7473E8;
+  color: #fff; }
+
+.noty_theme__mint.noty_type__success {
+  background-color: #AFC765;
+  border-bottom: 1px solid #A0B55C;
+  color: #fff; }

파일 크기가 너무 크기때문에 변경 상태를 표시하지 않습니다.
+ 6 - 0
plugins/bower_components/noty/mo.min.js


+ 216 - 0
plugins/bower_components/noty/noty.css

@@ -0,0 +1,216 @@
+.noty_layout_mixin, #noty_layout__top, #noty_layout__topLeft, #noty_layout__topCenter, #noty_layout__topRight, #noty_layout__bottom, #noty_layout__bottomLeft, #noty_layout__bottomCenter, #noty_layout__bottomRight, #noty_layout__center, #noty_layout__centerLeft, #noty_layout__centerRight {
+  position: fixed;
+  margin: 0;
+  padding: 0;
+  z-index: 9999999;
+  -webkit-transform: translateZ(0) scale(1, 1);
+          transform: translateZ(0) scale(1, 1);
+  -webkit-backface-visibility: hidden;
+          backface-visibility: hidden;
+  -webkit-font-smoothing: subpixel-antialiased;
+  filter: blur(0);
+  -webkit-filter: blur(0);
+  max-width: 90%; }
+
+#noty_layout__top {
+  top: 0;
+  left: 5%;
+  width: 90%; }
+
+#noty_layout__topLeft {
+  top: 20px;
+  left: 20px;
+  width: 325px; }
+
+#noty_layout__topCenter {
+  top: 5%;
+  left: 50%;
+  width: 325px;
+  -webkit-transform: translate(-webkit-calc(-50% - .5px)) translateZ(0) scale(1, 1);
+          transform: translate(calc(-50% - .5px)) translateZ(0) scale(1, 1); }
+
+#noty_layout__topRight {
+  top: 20px;
+  right: 20px;
+  width: 325px; }
+
+#noty_layout__bottom {
+  bottom: 0;
+  left: 5%;
+  width: 90%; }
+
+#noty_layout__bottomLeft {
+  bottom: 20px;
+  left: 20px;
+  width: 325px; }
+
+#noty_layout__bottomCenter {
+  bottom: 5%;
+  left: 50%;
+  width: 325px;
+  -webkit-transform: translate(-webkit-calc(-50% - .5px)) translateZ(0) scale(1, 1);
+          transform: translate(calc(-50% - .5px)) translateZ(0) scale(1, 1); }
+
+#noty_layout__bottomRight {
+  bottom: 20px;
+  right: 20px;
+  width: 325px; }
+
+#noty_layout__center {
+  top: 50%;
+  left: 50%;
+  width: 325px;
+  -webkit-transform: translate(-webkit-calc(-50% - .5px), -webkit-calc(-50% - .5px)) translateZ(0) scale(1, 1);
+          transform: translate(calc(-50% - .5px), calc(-50% - .5px)) translateZ(0) scale(1, 1); }
+
+#noty_layout__centerLeft {
+  top: 50%;
+  left: 20px;
+  width: 325px;
+  -webkit-transform: translate(0, -webkit-calc(-50% - .5px)) translateZ(0) scale(1, 1);
+          transform: translate(0, calc(-50% - .5px)) translateZ(0) scale(1, 1); }
+
+#noty_layout__centerRight {
+  top: 50%;
+  right: 20px;
+  width: 325px;
+  -webkit-transform: translate(0, -webkit-calc(-50% - .5px)) translateZ(0) scale(1, 1);
+          transform: translate(0, calc(-50% - .5px)) translateZ(0) scale(1, 1); }
+
+.noty_progressbar {
+  display: none; }
+
+.noty_has_timeout.noty_has_progressbar .noty_progressbar {
+  display: block;
+  position: absolute;
+  left: 0;
+  bottom: 0;
+  height: 3px;
+  width: 100%;
+  background-color: #646464;
+  opacity: 0.2;
+  filter: alpha(opacity=10); }
+
+.noty_bar {
+  -webkit-backface-visibility: hidden;
+  -webkit-transform: translate(0, 0) translateZ(0) scale(1, 1);
+  -ms-transform: translate(0, 0) scale(1, 1);
+      transform: translate(0, 0) scale(1, 1);
+  -webkit-font-smoothing: subpixel-antialiased;
+  overflow: hidden; }
+
+.noty_effects_open {
+  opacity: 0;
+  -webkit-transform: translate(50%);
+      -ms-transform: translate(50%);
+          transform: translate(50%);
+  -webkit-animation: noty_anim_in 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
+          animation: noty_anim_in 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
+  -webkit-animation-fill-mode: forwards;
+          animation-fill-mode: forwards; }
+
+.noty_effects_close {
+  -webkit-animation: noty_anim_out 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
+          animation: noty_anim_out 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
+  -webkit-animation-fill-mode: forwards;
+          animation-fill-mode: forwards; }
+
+.noty_fix_effects_height {
+  -webkit-animation: noty_anim_height 75ms ease-out;
+          animation: noty_anim_height 75ms ease-out; }
+
+.noty_close_with_click {
+  cursor: pointer; }
+
+.noty_close_button {
+  position: absolute;
+  top: 2px;
+  right: 2px;
+  font-weight: bold;
+  width: 20px;
+  height: 20px;
+  text-align: center;
+  line-height: 20px;
+  background-color: rgba(0, 0, 0, 0.05);
+  border-radius: 2px;
+  cursor: pointer;
+  -webkit-transition: all .2s ease-out;
+  transition: all .2s ease-out; }
+
+.noty_close_button:hover {
+  background-color: rgba(0, 0, 0, 0.1); }
+
+.noty_modal {
+  position: fixed;
+  width: 100%;
+  height: 100%;
+  background-color: #000;
+  z-index: 10000;
+  opacity: .3;
+  left: 0;
+  top: 0; }
+
+.noty_modal.noty_modal_open {
+  opacity: 0;
+  -webkit-animation: noty_modal_in .3s ease-out;
+          animation: noty_modal_in .3s ease-out; }
+
+.noty_modal.noty_modal_close {
+  -webkit-animation: noty_modal_out .3s ease-out;
+          animation: noty_modal_out .3s ease-out;
+  -webkit-animation-fill-mode: forwards;
+          animation-fill-mode: forwards; }
+
+@-webkit-keyframes noty_modal_in {
+  100% {
+    opacity: .3; } }
+
+@keyframes noty_modal_in {
+  100% {
+    opacity: .3; } }
+
+@-webkit-keyframes noty_modal_out {
+  100% {
+    opacity: 0; } }
+
+@keyframes noty_modal_out {
+  100% {
+    opacity: 0; } }
+
+@keyframes noty_modal_out {
+  100% {
+    opacity: 0; } }
+
+@-webkit-keyframes noty_anim_in {
+  100% {
+    -webkit-transform: translate(0);
+            transform: translate(0);
+    opacity: 1; } }
+
+@keyframes noty_anim_in {
+  100% {
+    -webkit-transform: translate(0);
+            transform: translate(0);
+    opacity: 1; } }
+
+@-webkit-keyframes noty_anim_out {
+  100% {
+    -webkit-transform: translate(50%);
+            transform: translate(50%);
+    opacity: 0; } }
+
+@keyframes noty_anim_out {
+  100% {
+    -webkit-transform: translate(50%);
+            transform: translate(50%);
+    opacity: 0; } }
+
+@-webkit-keyframes noty_anim_height {
+  100% {
+    height: 0; } }
+
+@keyframes noty_anim_height {
+  100% {
+    height: 0; } }
+
+/*# sourceMappingURL=noty.css.map*/

+ 1 - 0
plugins/bower_components/noty/noty.css.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"noty.css","sourceRoot":""}

파일 크기가 너무 크기때문에 변경 상태를 표시하지 않습니다.
+ 8 - 0
plugins/bower_components/noty/noty.min.js


파일 크기가 너무 크기때문에 변경 상태를 표시하지 않습니다.
+ 0 - 0
plugins/bower_components/noty/noty.min.js.map


이 변경점에서 너무 많은 파일들이 변경되어 몇몇 파일들은 표시되지 않았습니다.