File: app/javascript/demo.js

Recommend this page to a friend!
  Classes of Laudir Bispo  >  PHP Real Estate Website  >  app/javascript/demo.js  >  Download  
File: app/javascript/demo.js
Role: Auxiliary data
Content type: text/plain
Description: Auxiliary data
Class: PHP Real Estate Website
Manage the properties of a real estate business
Author: By
Last change:
Date: 5 months ago
Size: 17,202 bytes
 

Contents

Class file image Download
/**
 * AdminLTE Demo Menu

 * You should not use this file in production.
 * This file is for demo purposes only.
 */
(function ($, AdinLTE) {

  "use strict";

  /**
   * List of all the available skins
   *
   * @type Array
   */
  var my_skins = [
    "skin-blue",
    "skin-black",
    "skin-red",
    "skin-yellow",
    "skin-purple",
    "skin-green",
    "skin-blue-light",
    "skin-black-light",
    "skin-red-light",
    "skin-yellow-light",
    "skin-purple-light",
    "skin-green-light"
  ];

  //Create the new tab
  var tab_pane = $("<DIV />", {
    "id": "control-sidebar-theme-demo-options-tab",
    "class": "tab-pane active"
  });

  //Create the tab button
  var tab_button = $("<LI />", {"class": "active"})
      .html("<a href='#control-sidebar-theme-demo-options-tab' DATA-TOGGLE='tab'>"
      + "<I CLASS='fa fa-wrench'></I>"
      + "</a>");

  //Add the tab button to the right sidebar tabs
  $("[href='#control-sidebar-home-tab']")
      .parent()
      .before(tab_button);

  //Create the menu
  var demo_settings = $("<DIV />");

  //Layout options
  demo_settings.append(
      "<H4 CLASS='control-sidebar-heading'>"
      + "Opções Layout"
      + "</H4>"
        //Fixed layout
      + "<DIV CLASS='form-group'>"
      + "<LABEL CLASS='control-sidebar-subheading'>"
      + "<input type='checkbox' DATA-LAYOUT='fixed' class='pull-right'/> "
      + "Layout fixo"
      + "</LABEL>"
      + "<P>Ativar o layout fixo . Você não pode usar layouts fixos e box em conjunto!</P>"
      + "</DIV>"
        //Boxed layout
      + "<DIV CLASS='form-group'>"
      + "<LABEL CLASS='control-sidebar-subheading'>"
      + "<input type='checkbox' DATA-LAYOUT='layout-boxed'class='pull-right'/> "
      + "Boxed Layout"
      + "</LABEL>"
      + "<P>Layout em caixa!</P>"
      + "</DIV>"
        //Sidebar Toggle
      + "<DIV CLASS='form-group'>"
      + "<LABEL CLASS='control-sidebar-subheading'>"
      + "<input type='checkbox' DATA-LAYOUT='sidebar-collapse' class='pull-right'/> "
      + "Encolher menu da esquerda"
      + "</LABEL>"
      + "<P>Mostra somente os ícones</P>"
      + "</DIV>"
        //Sidebar mini expand on hover toggle
      + "<DIV CLASS='form-group'>"
      + "<LABEL CLASS='control-sidebar-subheading'>"
      + "<input type='checkbox' DATA-ENABLE='expandOnHover' class='pull-right'/> "
      + "Expandir menu da esquerda ao passar o mouse"
      + "</LABEL>"
      + "<P>Mostra o menu da esquerda completo ao passar o mouse!</P>"
      + "</DIV>"
        //Control Sidebar Toggle
      + "<DIV CLASS='form-group'>"
      + "<LABEL CLASS='control-sidebar-subheading'>"
      + "<input type='checkbox' DATA-CONTROLSIDEBAR='control-sidebar-open' class='pull-right'/> "
      + "Fixar/desfixar este painel"
      + "</LABEL>"
      + "<P>Fixa este painel tornando-o parte do layout!</P>"
      + "</DIV>"
        //Control Sidebar Skin Toggle
      + "<DIV CLASS='form-group'>"
      + "<LABEL CLASS='control-sidebar-subheading'>"
      + "<input type='checkbox' DATA-SIDEBARSKIN='toggle' class='pull-right'/> "
      + "Invertes cores deste menu"
      + "</LABEL>"
      + "<P>Inverte as cores deste menu!</P>"
      + "</DIV>"
  );
  var skins_list = $("<UL />", {"class": 'list-unstyled clearfix'});

  //Dark sidebar skins
  var skin_blue =
      $("<LI />", {style: "float:left; width: 33.33333%; padding: 5px;"})
          .append("<a href='javascript:void(0);' DATA-SKIN='skin-blue' style='display: block; box-shadow: 0 0 3px rgba(0,0,0,0.4)' class='clearfix full-opacity-hover'>"
          + "<DIV><SPAN STYLE='display:block; width: 20%; float: left; height: 7px; background: #367fa9;'></SPAN><SPAN CLASS='bg-light-blue' STYLE='display:block; width: 80%; float: left; height: 7px;'></SPAN></DIV>"
          + "<DIV><SPAN STYLE='display:block; width: 20%; float: left; height: 20px; background: #222d32;'></SPAN><SPAN STYLE='display:block; width: 80%; float: left; height: 20px; background: #f4f5f7;'></SPAN></DIV>"
          + "</a>"
          + "<P CLASS='text-center no-margin'>Blue</P>");
  skins_list.append(skin_blue);
  var skin_black =
      $("<LI />", {style: "float:left; width: 33.33333%; padding: 5px;"})
          .append("<a href='javascript:void(0);' DATA-SKIN='skin-black' style='display: block; box-shadow: 0 0 3px rgba(0,0,0,0.4)' class='clearfix full-opacity-hover'>"
          + "<DIV STYLE='box-shadow: 0 0 2px rgba(0,0,0,0.1)' CLASS='clearfix'><SPAN STYLE='display:block; width: 20%; float: left; height: 7px; background: #242A30;'></SPAN><SPAN STYLE='display:block; width: 80%; float: left; height: 7px; background: #242A30;'></SPAN></DIV>"
          + "<DIV><SPAN STYLE='display:block; width: 20%; float: left; height: 20px; background: #222;'></SPAN><SPAN STYLE='display:block; width: 80%; float: left; height: 20px; background: #f4f5f7;'></SPAN></DIV>"
          + "</a>"
          + "<P CLASS='text-center no-margin'>Black</P>");
  skins_list.append(skin_black);
  var skin_purple =
      $("<LI />", {style: "float:left; width: 33.33333%; padding: 5px;"})
          .append("<a href='javascript:void(0);' DATA-SKIN='skin-purple' style='display: block; box-shadow: 0 0 3px rgba(0,0,0,0.4)' class='clearfix full-opacity-hover'>"
          + "<DIV><SPAN STYLE='display:block; width: 20%; float: left; height: 7px;' CLASS='bg-purple-active'></SPAN><SPAN CLASS='bg-purple' STYLE='display:block; width: 80%; float: left; height: 7px;'></SPAN></DIV>"
          + "<DIV><SPAN STYLE='display:block; width: 20%; float: left; height: 20px; background: #222d32;'></SPAN><SPAN STYLE='display:block; width: 80%; float: left; height: 20px; background: #f4f5f7;'></SPAN></DIV>"
          + "</a>"
          + "<P CLASS='text-center no-margin'>Purple</P>");
  skins_list.append(skin_purple);
  var skin_green =
      $("<LI />", {style: "float:left; width: 33.33333%; padding: 5px;"})
          .append("<a href='javascript:void(0);' DATA-SKIN='skin-green' style='display: block; box-shadow: 0 0 3px rgba(0,0,0,0.4)' class='clearfix full-opacity-hover'>"
          + "<DIV><SPAN STYLE='display:block; width: 20%; float: left; height: 7px;' CLASS='bg-green-active'></SPAN><SPAN CLASS='bg-green' STYLE='display:block; width: 80%; float: left; height: 7px;'></SPAN></DIV>"
          + "<DIV><SPAN STYLE='display:block; width: 20%; float: left; height: 20px; background: #222d32;'></SPAN><SPAN STYLE='display:block; width: 80%; float: left; height: 20px; background: #f4f5f7;'></SPAN></DIV>"
          + "</a>"
          + "<P CLASS='text-center no-margin'>Green</P>");
  skins_list.append(skin_green);
  var skin_red =
      $("<LI />", {style: "float:left; width: 33.33333%; padding: 5px;"})
          .append("<a href='javascript:void(0);' DATA-SKIN='skin-red' style='display: block; box-shadow: 0 0 3px rgba(0,0,0,0.4)' class='clearfix full-opacity-hover'>"
          + "<DIV><SPAN STYLE='display:block; width: 20%; float: left; height: 7px;' CLASS='bg-red-active'></SPAN><SPAN CLASS='bg-red' STYLE='display:block; width: 80%; float: left; height: 7px;'></SPAN></DIV>"
          + "<DIV><SPAN STYLE='display:block; width: 20%; float: left; height: 20px; background: #222d32;'></SPAN><SPAN STYLE='display:block; width: 80%; float: left; height: 20px; background: #f4f5f7;'></SPAN></DIV>"
          + "</a>"
          + "<P CLASS='text-center no-margin'>Red</P>");
  skins_list.append(skin_red);
  var skin_yellow =
      $("<LI />", {style: "float:left; width: 33.33333%; padding: 5px;"})
          .append("<a href='javascript:void(0);' DATA-SKIN='skin-yellow' style='display: block; box-shadow: 0 0 3px rgba(0,0,0,0.4)' class='clearfix full-opacity-hover'>"
          + "<DIV><SPAN STYLE='display:block; width: 20%; float: left; height: 7px;' CLASS='bg-yellow-active'></SPAN><SPAN CLASS='bg-yellow' STYLE='display:block; width: 80%; float: left; height: 7px;'></SPAN></DIV>"
          + "<DIV><SPAN STYLE='display:block; width: 20%; float: left; height: 20px; background: #222d32;'></SPAN><SPAN STYLE='display:block; width: 80%; float: left; height: 20px; background: #f4f5f7;'></SPAN></DIV>"
          + "</a>"
          + "<P CLASS='text-center no-margin'>Yellow</P>");
  skins_list.append(skin_yellow);

  //Light sidebar skins
  var skin_blue_light =
      $("<LI />", {style: "float:left; width: 33.33333%; padding: 5px;"})
          .append("<a href='javascript:void(0);' DATA-SKIN='skin-blue-light' style='display: block; box-shadow: 0 0 3px rgba(0,0,0,0.4)' class='clearfix full-opacity-hover'>"
          + "<DIV><SPAN STYLE='display:block; width: 20%; float: left; height: 7px; background: #367fa9;'></SPAN><SPAN CLASS='bg-light-blue' STYLE='display:block; width: 80%; float: left; height: 7px;'></SPAN></DIV>"
          + "<DIV><SPAN STYLE='display:block; width: 20%; float: left; height: 20px; background: #f9fafc;'></SPAN><SPAN STYLE='display:block; width: 80%; float: left; height: 20px; background: #f4f5f7;'></SPAN></DIV>"
          + "</a>"
          + "<P CLASS='text-center no-margin' STYLE='font-size: 12px'>Blue Light</P>");
  skins_list.append(skin_blue_light);
  var skin_black_light =
      $("<LI />", {style: "float:left; width: 33.33333%; padding: 5px;"})
          .append("<a href='javascript:void(0);' DATA-SKIN='skin-black-light' style='display: block; box-shadow: 0 0 3px rgba(0,0,0,0.4)' class='clearfix full-opacity-hover'>"
          + "<DIV STYLE='box-shadow: 0 0 2px rgba(0,0,0,0.1)' CLASS='clearfix'><SPAN STYLE='display:block; width: 20%; float: left; height: 7px; background: #fefefe;'></SPAN><SPAN STYLE='display:block; width: 80%; float: left; height: 7px; background: #fefefe;'></SPAN></DIV>"
          + "<DIV><SPAN STYLE='display:block; width: 20%; float: left; height: 20px; background: #f9fafc;'></SPAN><SPAN STYLE='display:block; width: 80%; float: left; height: 20px; background: #f4f5f7;'></SPAN></DIV>"
          + "</a>"
          + "<P CLASS='text-center no-margin' STYLE='font-size: 12px'>Light</P>");
  skins_list.append(skin_black_light);
  var skin_purple_light =
      $("<LI />", {style: "float:left; width: 33.33333%; padding: 5px;"})
          .append("<a href='javascript:void(0);' DATA-SKIN='skin-purple-light' style='display: block; box-shadow: 0 0 3px rgba(0,0,0,0.4)' class='clearfix full-opacity-hover'>"
          + "<DIV><SPAN STYLE='display:block; width: 20%; float: left; height: 7px;' CLASS='bg-purple-active'></SPAN><SPAN CLASS='bg-purple' STYLE='display:block; width: 80%; float: left; height: 7px;'></SPAN></DIV>"
          + "<DIV><SPAN STYLE='display:block; width: 20%; float: left; height: 20px; background: #f9fafc;'></SPAN><SPAN STYLE='display:block; width: 80%; float: left; height: 20px; background: #f4f5f7;'></SPAN></DIV>"
          + "</a>"
          + "<P CLASS='text-center no-margin' STYLE='font-size: 12px'>Purple Light</P>");
  skins_list.append(skin_purple_light);
  var skin_green_light =
      $("<LI />", {style: "float:left; width: 33.33333%; padding: 5px;"})
          .append("<a href='javascript:void(0);' DATA-SKIN='skin-green-light' style='display: block; box-shadow: 0 0 3px rgba(0,0,0,0.4)' class='clearfix full-opacity-hover'>"
          + "<DIV><SPAN STYLE='display:block; width: 20%; float: left; height: 7px;' CLASS='bg-green-active'></SPAN><SPAN CLASS='bg-green' STYLE='display:block; width: 80%; float: left; height: 7px;'></SPAN></DIV>"
          + "<DIV><SPAN STYLE='display:block; width: 20%; float: left; height: 20px; background: #f9fafc;'></SPAN><SPAN STYLE='display:block; width: 80%; float: left; height: 20px; background: #f4f5f7;'></SPAN></DIV>"
          + "</a>"
          + "<P CLASS='text-center no-margin' STYLE='font-size: 12px'>Green Light</P>");
  skins_list.append(skin_green_light);
  var skin_red_light =
      $("<LI />", {style: "float:left; width: 33.33333%; padding: 5px;"})
          .append("<a href='javascript:void(0);' DATA-SKIN='skin-red-light' style='display: block; box-shadow: 0 0 3px rgba(0,0,0,0.4)' class='clearfix full-opacity-hover'>"
          + "<DIV><SPAN STYLE='display:block; width: 20%; float: left; height: 7px;' CLASS='bg-red-active'></SPAN><SPAN CLASS='bg-red' STYLE='display:block; width: 80%; float: left; height: 7px;'></SPAN></DIV>"
          + "<DIV><SPAN STYLE='display:block; width: 20%; float: left; height: 20px; background: #f9fafc;'></SPAN><SPAN STYLE='display:block; width: 80%; float: left; height: 20px; background: #f4f5f7;'></SPAN></DIV>"
          + "</a>"
          + "<P CLASS='text-center no-margin' STYLE='font-size: 12px'>Red Light</P>");
  skins_list.append(skin_red_light);
  var skin_yellow_light =
      $("<LI />", {style: "float:left; width: 33.33333%; padding: 5px;"})
          .append("<a href='javascript:void(0);' DATA-SKIN='skin-yellow-light' style='display: block; box-shadow: 0 0 3px rgba(0,0,0,0.4)' class='clearfix full-opacity-hover'>"
          + "<DIV><SPAN STYLE='display:block; width: 20%; float: left; height: 7px;' CLASS='bg-yellow-active'></SPAN><SPAN CLASS='bg-yellow' STYLE='display:block; width: 80%; float: left; height: 7px;'></SPAN></DIV>"
          + "<DIV><SPAN STYLE='display:block; width: 20%; float: left; height: 20px; background: #f9fafc;'></SPAN><SPAN STYLE='display:block; width: 80%; float: left; height: 20px; background: #f4f5f7;'></SPAN></DIV>"
          + "</a>"
          + "<P CLASS='text-center no-margin' STYLE='font-size: 12px;'>Yellow Light</P>");
  skins_list.append(skin_yellow_light);

  demo_settings.append("<H4 CLASS='control-sidebar-heading'>Skins</H4>");
  demo_settings.append(skins_list);

  tab_pane.append(demo_settings);
  $("#control-sidebar-home-tab").after(tab_pane);

  setup();

  /**
   * Toggles layout classes
   *
   * @param String cls the layout class to toggle
   * @returns void
   */
  function change_layout(cls) {
    $("body").toggleClass(cls);
    AdminLTE.layout.fixSidebar();
    //Fix the problem with right sidebar and layout boxed
    if (cls == "layout-boxed")
      AdminLTE.controlSidebar._fix($(".control-sidebar-bg"));
    if ($('body').hasClass('fixed') && cls == 'fixed') {
      AdminLTE.pushMenu.expandOnHover();
      AdminLTE.layout.activate();
    }
    AdminLTE.controlSidebar._fix($(".control-sidebar-bg"));
    AdminLTE.controlSidebar._fix($(".control-sidebar"));
  }

  /**
   * Replaces the old skin with the new skin
   * @param String cls the new skin class
   * @returns Boolean false to prevent link's default action
   */
  function change_skin(cls) {
    $.each(my_skins, function (i) {
      $("body").removeClass(my_skins[i]);
    });

    $("body").addClass(cls);
    store('skin', cls);
    return false;
  }

  /**
   * Store a new settings in the browser
   *
   * @param String name Name of the setting
   * @param String val Value of the setting
   * @returns void
   */
  function store(name, val) {
    if (typeof (Storage) !== "undefined") {
      localStorage.setItem(name, val);
    } else {
      window.alert('Atualize seu navegador para uma versão mais moderna!');
    }
  }

  /**
   * Get a prestored setting
   *
   * @param String name Name of of the setting
   * @returns String The value of the setting | null
   */
  function get(name) {
    if (typeof (Storage) !== "undefined") {
      return localStorage.getItem(name);
    } else {
      window.alert('Atualize seu navegador para uma versão mais moderna!');
    }
  }

  /**
   * Retrieve default settings and apply them to the template
   *
   * @returns void
   */
  function setup() {
    var tmp = get('skin');
    if (tmp && $.inArray(tmp, my_skins))
      change_skin(tmp);

    //Add the change skin listener
    $("[data-skin]").on('click', function (e) {
      e.preventDefault();
      change_skin($(this).data('skin'));
    });

    //Add the layout manager
    $("[data-layout]").on('click', function () {
      change_layout($(this).data('layout'));
    });

    $("[data-controlsidebar]").on('click', function () {
      change_layout($(this).data('controlsidebar'));
      var slide = !AdminLTE.options.controlSidebarOptions.slide;
      AdminLTE.options.controlSidebarOptions.slide = slide;
      if (!slide)
        $('.control-sidebar').removeClass('control-sidebar-open');
    });

    $("[data-sidebarskin='toggle']").on('click', function () {
      var sidebar = $(".control-sidebar");
      if (sidebar.hasClass("control-sidebar-dark")) {
        sidebar.removeClass("control-sidebar-dark")
        sidebar.addClass("control-sidebar-light")
      } else {
        sidebar.removeClass("control-sidebar-light")
        sidebar.addClass("control-sidebar-dark")
      }
    });

    $("[data-enable='expandOnHover']").on('click', function () {
      $(this).attr('disabled', true);
      AdminLTE.pushMenu.expandOnHover();
      if (!$('body').hasClass('sidebar-collapse'))
        $("[data-layout='sidebar-collapse']").click();
    });

    // Reset options
    if ($('body').hasClass('fixed')) {
      $("[data-layout='fixed']").attr('checked', 'checked');
    }
    if ($('body').hasClass('layout-boxed')) {
      $("[data-layout='layout-boxed']").attr('checked', 'checked');
    }
    if ($('body').hasClass('sidebar-collapse')) {
      $("[data-layout='sidebar-collapse']").attr('checked', 'checked');
    }

  }
})(jQuery, $.AdminLTE);
For more information send a message to info at phpclasses dot org.