chat plug

css/message.css

@@ -0,0 +1,574 @@
+.modal-open {
+  overflow: hidden;
+}
+.modal {
+  position: fixed;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  z-index: 1050;
+  display: none;
+  overflow: hidden;
+  -webkit-overflow-scrolling: touch;
+  outline: 0;
+}
+.modal.fade .modal-dialog {
+  -webkit-transition: -webkit-transform .3s ease-out;
+       -o-transition:      -o-transform .3s ease-out;
+          transition:         transform .3s ease-out;
+  -webkit-transform: translate3d(0, -25%, 0);
+       -o-transform: translate3d(0, -25%, 0);
+          transform: translate3d(0, -25%, 0);
+}
+.modal.in .modal-dialog {
+  -webkit-transform: translate3d(0, 0, 0);
+       -o-transform: translate3d(0, 0, 0);
+          transform: translate3d(0, 0, 0);
+}
+.modal-open .modal {
+  overflow-x: hidden;
+  overflow-y: auto;
+}
+.modal-dialog {
+  position: relative;
+  width: auto;
+  margin: 10px;
+}
+.modal-content {
+  position: relative;
+  background-color: #fff;
+  -webkit-background-clip: padding-box;
+          background-clip: padding-box;
+  border: 1px solid #999;
+  border: 1px solid rgba(0, 0, 0, .2);
+  border-radius: 6px;
+  outline: 0;
+  -webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, .5);
+          box-shadow: 0 3px 9px rgba(0, 0, 0, .5);
+}
+.modal-backdrop {
+  position: fixed;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  z-index: 1040;
+  background-color: #000;
+}
+.modal-backdrop.fade {
+  filter: alpha(opacity=0);
+  opacity: 0;
+}
+.modal-backdrop.in {
+  filter: alpha(opacity=50);
+  opacity: .5;
+}
+.modal-header {
+  min-height: 16.42857143px;
+  padding: 15px;
+  border-bottom: 1px solid #e5e5e5;
+}
+.modal-header .close {
+  margin-top: -2px;
+}
+.modal-title {
+  margin: 0;
+  line-height: 1.42857143;
+}
+.modal-body {
+  position: relative;
+  padding: 15px;
+}
+.modal-footer {
+  padding: 15px;
+  text-align: right;
+  border-top: 1px solid #e5e5e5;
+}
+.modal-footer .btn + .btn {
+  margin-bottom: 0;
+  margin-left: 5px;
+}
+.modal-footer .btn-group .btn + .btn {
+  margin-left: -1px;
+}
+.modal-footer .btn-block + .btn-block {
+  margin-left: 0;
+}
+.modal-scrollbar-measure {
+  position: absolute;
+  top: -9999px;
+  width: 50px;
+  height: 50px;
+  overflow: scroll;
+}
+@media (min-width: 768px) {
+  .modal-dialog {
+    width: 600px;
+    margin: 30px auto;
+  }
+  .modal-content {
+    -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, .5);
+            box-shadow: 0 5px 15px rgba(0, 0, 0, .5);
+  }
+  .modal-sm {
+    width: 300px;
+  }
+}
+@media (min-width: 992px) {
+  .modal-lg {
+    width: 900px;
+  }
+}
+
+
+
+
+ul.messenger {
+  margin: 0;
+  padding: 0;
+}
+ul.messenger > li {
+  list-style: none;
+  margin: 0;
+  padding: 0;
+}
+ul.messenger.messenger-empty {
+  display: none;
+}
+ul.messenger .messenger-message {
+  overflow: hidden;
+  *zoom: 1;
+}
+ul.messenger .messenger-message.messenger-hidden {
+  display: none;
+}
+ul.messenger .messenger-message .messenger-phrase, ul.messenger .messenger-message .messenger-actions a {
+  padding-right: 5px;
+}
+ul.messenger .messenger-message .messenger-actions {
+  float: right;
+}
+ul.messenger .messenger-message .messenger-actions a {
+  cursor: pointer;
+  text-decoration: underline;
+}
+ul.messenger .messenger-message ul, ul.messenger .messenger-message ol {
+  margin: 10px 18px 0;
+}
+ul.messenger.messenger-fixed {
+  position: fixed;
+  z-index: 10000;
+}
+ul.messenger.messenger-fixed .messenger-message {
+  min-width: 0;
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
+}
+ul.messenger.messenger-fixed .message .messenger-actions {
+  float: left;
+}
+ul.messenger.messenger-fixed.messenger-on-top {
+  top: 20px;
+}
+ul.messenger.messenger-fixed.messenger-on-bottom {
+  bottom: 20px;
+}
+ul.messenger.messenger-fixed.messenger-on-top, ul.messenger.messenger-fixed.messenger-on-bottom {
+  left: 50%;
+  width: 800px;
+  margin-left: -400px;
+}
+@media (max-width: 960px) {
+  ul.messenger.messenger-fixed.messenger-on-top, ul.messenger.messenger-fixed.messenger-on-bottom {
+    left: 10%;
+    width: 80%;
+    margin-left: 0px;
+  }
+}
+ul.messenger.messenger-fixed.messenger-on-top.messenger-on-right, ul.messenger.messenger-fixed.messenger-on-bottom.messenger-on-right {
+  right: 20px;
+  left: auto;
+}
+ul.messenger.messenger-fixed.messenger-on-top.messenger-on-left, ul.messenger.messenger-fixed.messenger-on-bottom.messenger-on-left {
+  left: 20px;
+  margin-left: 0px;
+}
+ul.messenger.messenger-fixed.messenger-on-right, ul.messenger.messenger-fixed.messenger-on-left {
+  width: 350px;
+}
+ul.messenger.messenger-fixed.messenger-on-right .messenger-actions, ul.messenger.messenger-fixed.messenger-on-left .messenger-actions {
+  float: left;
+}
+ul.messenger .messenger-spinner {
+  display: none;
+}
+@-webkit-keyframes ui-spinner-rotate-right {
+  0% {
+    -webkit-transform: rotate(0deg);
+  }
+  25% {
+    -webkit-transform: rotate(180deg);
+  }
+  50% {
+    -webkit-transform: rotate(180deg);
+  }
+  75% {
+    -webkit-transform: rotate(360deg);
+  }
+  100% {
+    -webkit-transform: rotate(360deg);
+  }
+}
+@-webkit-keyframes ui-spinner-rotate-left {
+  0% {
+    -webkit-transform: rotate(0deg);
+  }
+  25% {
+    -webkit-transform: rotate(0deg);
+  }
+  50% {
+    -webkit-transform: rotate(180deg);
+  }
+  75% {
+    -webkit-transform: rotate(180deg);
+  }
+  100% {
+    -webkit-transform: rotate(360deg);
+  }
+}
+@-moz-keyframes ui-spinner-rotate-right {
+  0% {
+    -moz-transform: rotate(0deg);
+  }
+  25% {
+    -moz-transform: rotate(180deg);
+  }
+  50% {
+    -moz-transform: rotate(180deg);
+  }
+  75% {
+    -moz-transform: rotate(360deg);
+  }
+  100% {
+    -moz-transform: rotate(360deg);
+  }
+}
+@-moz-keyframes ui-spinner-rotate-left {
+  0% {
+    -moz-transform: rotate(0deg);
+  }
+  25% {
+    -moz-transform: rotate(0deg);
+  }
+  50% {
+    -moz-transform: rotate(180deg);
+  }
+  75% {
+    -moz-transform: rotate(180deg);
+  }
+  100% {
+    -moz-transform: rotate(360deg);
+  }
+}
+@keyframes ui-spinner-rotate-right {
+  0% {
+    transform: rotate(0deg);
+  }
+  25% {
+    transform: rotate(180deg);
+  }
+  50% {
+    transform: rotate(180deg);
+  }
+  75% {
+    transform: rotate(360deg);
+  }
+  100% {
+    transform: rotate(360deg);
+  }
+}
+@keyframes ui-spinner-rotate-left {
+  0% {
+    transform: rotate(0deg);
+  }
+  25% {
+    transform: rotate(0deg);
+  }
+  50% {
+    transform: rotate(180deg);
+  }
+  75% {
+    transform: rotate(180deg);
+  }
+  100% {
+    transform: rotate(360deg);
+  }
+}
+.messenger-spinner {
+  position: relative;
+  border-radius: 100%;
+}
+ul.messenger.messenger-spinner-active .messenger-spinner .messenger-spinner {
+  display: block;
+}
+.messenger-spinner .messenger-spinner-side {
+  width: 50%;
+  height: 100%;
+  overflow: hidden;
+  position: absolute;
+}
+.messenger-spinner .messenger-spinner-side .messenger-spinner-fill {
+  border-radius: 999px;
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  -webkit-animation-iteration-count: infinite;
+  -moz-animation-iteration-count: infinite;
+  -ms-animation-iteration-count: infinite;
+  -o-animation-iteration-count: infinite;
+  animation-iteration-count: infinite;
+  -webkit-animation-timing-function: linear;
+  -moz-animation-timing-function: linear;
+  -ms-animation-timing-function: linear;
+  -o-animation-timing-function: linear;
+  animation-timing-function: linear;
+}
+.messenger-spinner .messenger-spinner-side-left {
+  left: 0;
+}
+.messenger-spinner .messenger-spinner-side-left .messenger-spinner-fill {
+  left: 100%;
+  border-top-left-radius: 0;
+  border-bottom-left-radius: 0;
+  -webkit-animation-name: ui-spinner-rotate-left;
+  -moz-animation-name: ui-spinner-rotate-left;
+  -ms-animation-name: ui-spinner-rotate-left;
+  -o-animation-name: ui-spinner-rotate-left;
+  animation-name: ui-spinner-rotate-left;
+  -webkit-transform-origin: 0 50%;
+  -moz-transform-origin: 0 50%;
+  -ms-transform-origin: 0 50%;
+  -o-transform-origin: 0 50%;
+  transform-origin: 0 50%;
+}
+.messenger-spinner .messenger-spinner-side-right {
+  left: 50%;
+}
+.messenger-spinner .messenger-spinner-side-right .messenger-spinner-fill {
+  left: -100%;
+  border-top-right-radius: 0;
+  border-bottom-right-radius: 0;
+  -webkit-animation-name: ui-spinner-rotate-right;
+  -moz-animation-name: ui-spinner-rotate-right;
+  -ms-animation-name: ui-spinner-rotate-right;
+  -o-animation-name: ui-spinner-rotate-right;
+  animation-name: ui-spinner-rotate-right;
+  -webkit-transform-origin: 100% 50%;
+  -moz-transform-origin: 100% 50%;
+  -ms-transform-origin: 100% 50%;
+  -o-transform-origin: 100% 50%;
+  transform-origin: 100% 50%;
+}
+ul.messenger-theme-flat {
+  -webkit-border-radius: 4px;
+  -moz-border-radius: 4px;
+  -ms-border-radius: 4px;
+  -o-border-radius: 4px;
+  border-radius: 4px;
+  -moz-user-select: none;
+  -webkit-user-select: none;
+  -o-user-select: none;
+  user-select: none;
+  background: #404040;
+}
+ul.messenger-theme-flat.messenger-empty {
+  display: none;
+}
+ul.messenger-theme-flat .messenger-message {
+  -webkit-box-shadow: inset 0px 1px rgba(255, 255, 255, 0.13), inset 48px 0px 0px #292929;
+  -moz-box-shadow: inset 0px 1px rgba(255, 255, 255, 0.13), inset 48px 0px 0px #292929;
+  box-shadow: inset 0px 1px rgba(255, 255, 255, 0.13), inset 48px 0px 0px #292929;
+  -webkit-border-radius: 0px;
+  -moz-border-radius: 0px;
+  -ms-border-radius: 0px;
+  -o-border-radius: 0px;
+  border-radius: 0px;
+  position: relative;
+  border: 0px;
+  margin-bottom: 0px;
+  font-size: 13px;
+  background: transparent;
+  color: #f0f0f0;
+  font-weight: 500;
+  padding: 10px 30px 13px 65px;
+}
+ul.messenger-theme-flat .messenger-message .messenger-close {
+  position: absolute;
+  top: 0px;
+  right: 0px;
+  color: #888888;
+  opacity: 1;
+  font-weight: bold;
+  display: block;
+  font-size: 20px;
+  line-height: 20px;
+  padding: 8px 10px 7px 7px;
+  cursor: pointer;
+  background: transparent;
+  border: 0;
+  -webkit-appearance: none;
+}
+ul.messenger-theme-flat .messenger-message .messenger-close:hover {
+  color: #bbbbbb;
+}
+ul.messenger-theme-flat .messenger-message .messenger-close:active {
+  color: #777777;
+}
+ul.messenger-theme-flat .messenger-message .messenger-actions {
+  float: none;
+  margin-top: 10px;
+}
+ul.messenger-theme-flat .messenger-message .messenger-actions a {
+  -webkit-border-radius: 4px;
+  -moz-border-radius: 4px;
+  -ms-border-radius: 4px;
+  -o-border-radius: 4px;
+  border-radius: 4px;
+  text-decoration: none;
+  color: #aaaaaa;
+  background: #2e2e2e;
+  display: inline-block;
+  padding: 10px;
+  margin-right: 10px;
+  padding: 4px 11px 6px;
+  text-transform: capitalize;
+}
+ul.messenger-theme-flat .messenger-message .messenger-actions a:hover {
+  color: #f0f0f0;
+  background: #2e2e2e;
+}
+ul.messenger-theme-flat .messenger-message .messenger-actions a:active {
+  background: #292929;
+  color: #aaaaaa;
+}
+ul.messenger-theme-flat .messenger-message .messenger-actions .messenger-phrase {
+  display: none;
+}
+ul.messenger-theme-flat .messenger-message .messenger-message-inner:before {
+  -webkit-border-radius: 50%;
+  -moz-border-radius: 50%;
+  -ms-border-radius: 50%;
+  -o-border-radius: 50%;
+  border-radius: 50%;
+  position: absolute;
+  left: 17px;
+  display: block;
+  content: " ";
+  top: 50%;
+  margin-top: -8px;
+  height: 13px;
+  width: 13px;
+  z-index: 20;
+}
+ul.messenger-theme-flat .messenger-message.alert-success .messenger-message-inner:before {
+  background: #5fca4a;
+}
+ul.messenger-theme-flat .messenger-message.alert-info .messenger-message-inner:before {
+  background: #61c4b8;
+}
+ul.messenger-theme-flat .messenger-message.alert-error .messenger-message-inner:before {
+  background: #dd6a45;
+}
+ul.messenger-theme-flat .messenger-message.alert-error.messenger-retry-soon .messenger-spinner {
+  width: 32px;
+  height: 32px;
+  background: transparent;
+}
+ul.messenger-theme-flat .messenger-message.alert-error.messenger-retry-soon .messenger-spinner .messenger-spinner-side .messenger-spinner-fill {
+  background: #dd6a45;
+  -webkit-animation-duration: 20s;
+  -moz-animation-duration: 20s;
+  -ms-animation-duration: 20s;
+  -o-animation-duration: 20s;
+  animation-duration: 20s;
+  opacity: 1;
+}
+ul.messenger-theme-flat .messenger-message.alert-error.messenger-retry-soon .messenger-spinner:after {
+  content: "";
+  background: #292929;
+  position: absolute;
+  width: 26px;
+  height: 26px;
+  border-radius: 50%;
+  top: 3px;
+  left: 3px;
+  display: block;
+}
+ul.messenger-theme-flat .messenger-message.alert-error.messenger-retry-later .messenger-spinner {
+  width: 32px;
+  height: 32px;
+  background: transparent;
+}
+ul.messenger-theme-flat .messenger-message.alert-error.messenger-retry-later .messenger-spinner .messenger-spinner-side .messenger-spinner-fill {
+  background: #dd6a45;
+  -webkit-animation-duration: 600s;
+  -moz-animation-duration: 600s;
+  -ms-animation-duration: 600s;
+  -o-animation-duration: 600s;
+  animation-duration: 600s;
+  opacity: 1;
+}
+ul.messenger-theme-flat .messenger-message.alert-error.messenger-retry-later .messenger-spinner:after {
+  content: "";
+  background: #292929;
+  position: absolute;
+  width: 26px;
+  height: 26px;
+  border-radius: 50%;
+  top: 3px;
+  left: 3px;
+  display: block;
+}
+ul.messenger-theme-flat .messenger-message-slot.messenger-last .messenger-message {
+  -webkit-border-radius: 4px 4px 0px 0px;
+  -moz-border-radius: 4px 4px 0px 0px;
+  -ms-border-radius: 4px 4px 0px 0px;
+  -o-border-radius: 4px 4px 0px 0px;
+  border-radius: 4px 4px 0px 0px;
+  -webkit-box-shadow: inset 48px 0px 0px #292929;
+  -moz-box-shadow: inset 48px 0px 0px #292929;
+  box-shadow: inset 48px 0px 0px #292929;
+}
+ul.messenger-theme-flat .messenger-message-slot.messenger-first .messenger-message {
+  -webkit-border-radius: 0px 0px 4px 4px;
+  -moz-border-radius: 0px 0px 4px 4px;
+  -ms-border-radius: 0px 0px 4px 4px;
+  -o-border-radius: 0px 0px 4px 4px;
+  border-radius: 0px 0px 4px 4px;
+  -webkit-box-shadow: inset 0px 1px rgba(255, 255, 255, 0.13), inset 48px 0px 0px #292929;
+  -moz-box-shadow: inset 0px 1px rgba(255, 255, 255, 0.13), inset 48px 0px 0px #292929;
+  box-shadow: inset 0px 1px rgba(255, 255, 255, 0.13), inset 48px 0px 0px #292929;
+}
+ul.messenger-theme-flat .messenger-message-slot.messenger-first.messenger-last .messenger-message {
+  -webkit-border-radius: 4px;
+  -moz-border-radius: 4px;
+  -ms-border-radius: 4px;
+  -o-border-radius: 4px;
+  border-radius: 4px;
+  -webkit-box-shadow: inset 48px 0px 0px #292929;
+  -moz-box-shadow: inset 48px 0px 0px #292929;
+  box-shadow: inset 48px 0px 0px #292929;
+}
+ul.messenger-theme-flat .messenger-spinner {
+  display: block;
+  position: absolute;
+  left: 7px;
+  top: 50%;
+  margin-top: -18px;
+  z-index: 999;
+  height: 32px;
+  width: 32px;
+  z-index: 10;
+}

inc/tweaks.php

@@ -51,10 +51,90 @@ function dw_oembed_filter($html, $url, $attr, $post_ID) {
     return $return;
 }
 
-
 add_filter( 'embed_oembed_html', 'dw_embed_oembed_html' );
 function dw_embed_oembed_html( $html ) {
     return preg_replace( '@src="https?:@', 'src="', $html );
 }
 
+
+add_action( 'admin_menu', 'daw_is_online_add_admin_menu' );
+add_action( 'admin_init', 'daw_is_online_settings_init' );
+
+function daw_is_online_add_admin_menu(  ) { 
+	add_options_page( 'DW Status', 'DAW Online', 'manage_options', 'daw_is_online', 'daw_is_online_options_page' );
+}
+
+function daw_is_online_settings_init(  ) { 
+	register_setting( 'dwstatus', 'daw_is_online_settings' );
+	add_settings_section('daw_is_online_pluginPage_section', __( 'DAW Online', 'wordpress' ), 'daw_is_online_settings_section_callback', 'dwstatus');
+	add_settings_field( 'daw_is_online_select_field_0', __( 'Am I Online ?', 'wordpress' ), 'daw_is_online_select_field_0_render', 'dwstatus', 'daw_is_online_pluginPage_section' );
+}
+
+function daw_is_online_select_field_0_render(  ) { 
+	$options = get_option( 'daw_is_online_settings' ); ?>
+	<select name='daw_is_online_settings[daw_is_online_select_field_0]'>
+		<option value='1' <?php selected( $options['daw_is_online_select_field_0'], 1 ); ?>>Yes</option>
+		<option value='2' <?php selected( $options['daw_is_online_select_field_0'], 2 ); ?>>No</option>
+	</select>
+<?php }
+
+function daw_is_online_settings_section_callback(  ) { 
+	echo __( 'This sets my online status', 'wordpress' );
+}
+
+function daw_is_online_options_page(  ) { ?>
+	<form action='options.php' method='post'>	
+		<?php settings_fields( 'dwstatus' );
+		do_settings_sections( 'dwstatus' );
+		submit_button(); ?>
+	</form>
+<?php }
+
+function dw_online_get_status() {
+	$dw_status = get_option('daw_is_online_settings');
+	if( $dw_status['daw_is_online_select_field_0'] == '1' ) { ?>
+		<script type="text/javascript">
+		$(function(){
+	        Messenger.options = {extraClasses: "messenger-fixed messenger-on-bottom messenger-on-left",theme: "flat"};
+			var msg; msg = Messenger().post({
+				message: 'I am currently online', type: 'success',
+				actions: {
+					retry: {
+						label: 'Connect', phrase: 'Chat & Video', delay: 30,
+						action: function(){
+							var msg_return; msg_return = Messenger().run({
+							  errorMessage: 'Please wait a moment while I get connected', successMessage: 'Connecting Now!',
+							  action: function(opts) {
+								  msg.hide();
+									i = 0
+									if (++i < 6) {
+										return opts.error({status: 500,readyState: 0,responseText: 0});
+									} 
+									else if (++i < 2) { //TODO: connect with backbone and Twilio
+										return opts.success();
+									}
+									else {
+										return msg.on();
+									}
+								}
+							});
+						}
+					},
+					cancel: {
+						label: 'No Thanks',
+						action: function() {
+							return msg.update({message: 'Maybe Next Time', hideAfter: 1, type: 'error', actions: false});
+						}
+					}
+				}
+			});
+		});
+		</script>
+	<?php }
+
+}
+
+
+
+
 ?>