milesmatthias/application.html.slim

## application.html.slim
doctype html

head

  = render partial: 'shared/mobile_detection'

  javascript:
    var device_cookie  = cookie.get('device'),
        cookiesEnabled = cookie.enabled();

    if (cookiesEnabled && device_cookie != 'desktop') {
      window.location.reload();
    }

body


## application.mobile.erb
<!DOCTYPE html>
<html class="no-js" lang="en-us">
  <head>

    <%= javascript_include_tag 'application-mobile' %>

    <script>
      var device_cookie  = cookie.get('device'),
          cookiesEnabled = cookie.enabled();

      if (cookiesEnabled && device_cookie == 'desktop') {
        window.location.reload(true);
      }
    </script>

  </head>

  <body>

    <p id="full_site_btn_wrapper">
      <%= link_to 'View full site', '#', :id => 'view_full_site_btn' %>
    </p>

    <script>
      jQuery('#view_full_site_btn').click(function(e){
        cookie.set('device', 'desktop', {
          domain: '<%= Rails.env.development? ? '' : Settings.host %>',
          path  : '/'
        });

        window.location.assign('<%= url_for %>');

        e.preventDefault();
        return false;
      });

    </script>


  </body>
</html>

## application_controller.rb
class ApplicationController < ActionController::Base
  before_filter :set_format

  def set_format
    if request.format.html? && 'mobile' == cookies[:device]
      request.format = :mobile
    end
  end
end

## get_device.html.erb
<html>
<head>
  <title>Example Site</title>
  <%= javascript_include_tag "mobile_detection" %>
  <script>

    function isMobile(){
      var MOBILE_USER_AGENTS = 'palm|blackberry|nokia|phone|midp|mobi|symbian|chtml|ericsson|minimo|' +
                            'audiovox|motorola|samsung|telit|upg1|windows ce|ucweb|astel|plucker|' +
                            'x320|x240|j2me|sgh|portable|sprint|docomo|kddi|softbank|android|mmp|' +
                            'pdxgw|netfront|xiino|vodafone|portalmmm|sagem|mot-|sie-|ipod|up\\.b|' +
                            'webos|amoi|novarra|cdm|alcatel|pocket|ipad|iphone|mobileexplorer|' +
                            'mobile|zune',
          mobile_regex      = new RegExp(MOBILE_USER_AGENTS, "i");

      return navigator.userAgent.match(mobile_regex);
    }

    // setting the device cookie to what we detect
    var detected_device = isMobile() ? 'mobile' : 'desktop';

    cookie.set('device', detected_device, {
      domain: '<%= Rails.env.development? ? '' : Settings.host %>',
      path  : '/'
    });

    // window.location to whereever you came from
    window.location.assign(localStorage.getItem('referrer_href'));

  </script>
</head>
<body style="background-color:#f1f1f2">
</body>
</html>

## home_controller.rb
class HomeController < ApplicationController
  layout 'application'

  def get_device
    render "get_device.html.erb", :layout => false
  end

  def set_device
    render "set_device.html.erb", :layout => false
  end
end

## mobile_detection.html.erb
<%= javascript_include_tag "mobile_detection" %>

<script>

  if (!window.location.href.match(/get_device|set_device/)){
    console.log('logging the window.location.href = ' + window.location.href);
    localStorage.setItem('referrer_href', window.location.href);
  }

  var device_cookie  = cookie.get('device'),
      cookiesEnabled = cookie.enabled();

  if (cookiesEnabled && device_cookie == undefined) {
    window.location.assign('/get_device.html');
  }

</script>

## mobile_detection.js
//= require cookie

## set_device.html.erb
<html>
<head>
  <title>Example Website</title>
  <%= javascript_include_tag "mobile_detection" %>
  <meta name="viewport" content="width=device-width, user-scalable=no">
</head>
<body style="background-color:#f1f1f2">

  <h1>Which device do you want to see the site as?</h1>

  <form id="device_selection_form">
    <input type="radio" name="device_option" value="desktop">Desktop</input>
    <input type="radio" name="device_option" value="mobile">Mobile</input>

    <button id="set_device_btn">Set device</button>
  </form>


  <script>

    document.getElementById('set_device_btn').addEventListener('click', function(e){

      // setting the device cookie to your selection
      var options         = document.getElementsByName('device_option'),
          selected_device = '';

      for(var i=0; i < options.length; i++){
        if (options[i].checked) {
          selected_device = options[i].value;
        }
      }

      cookie.set('device', selected_device, {
        domain: '<%= Rails.env.development? ? '' : Settings.host %>',
        path  : '/'
      });

      // window.location to whereever you came from
      window.location.assign(localStorage.getItem('referrer_href'));

      alert('Okay, we set your device to be ' + selected_device);

      e.preventDefault();
      return false;
    });


  </script>

</body>
</html>
	doctype html

	head

	= render partial: 'shared/mobile_detection'

	javascript:
	var device_cookie = cookie.get('device'),
	cookiesEnabled = cookie.enabled();

	if (cookiesEnabled && device_cookie != 'desktop') {
	window.location.reload();
	}

	body
	<!DOCTYPE html>
	<html class="no-js" lang="en-us">
	<head>

	<%= javascript_include_tag 'application-mobile' %>

	<script>
	var device_cookie = cookie.get('device'),
	cookiesEnabled = cookie.enabled();

	if (cookiesEnabled && device_cookie == 'desktop') {
	window.location.reload(true);
	}
	</script>

	</head>

	<body>

	<p id="full_site_btn_wrapper">
	<%= link_to 'View full site', '#', :id => 'view_full_site_btn' %>
	</p>

	<script>
	jQuery('#view_full_site_btn').click(function(e){
	cookie.set('device', 'desktop', {
	domain: '<%= Rails.env.development? ? '' : Settings.host %>',
	path : '/'
	});

	window.location.assign('<%= url_for %>');

	e.preventDefault();
	return false;
	});

	</script>


	</body>
	</html>
	class ApplicationController < ActionController::Base
	before_filter :set_format

	def set_format
	if request.format.html? && 'mobile' == cookies[:device]
	request.format = :mobile
	end
	end
	end
	<html>
	<head>
	<title>Example Site</title>
	<%= javascript_include_tag "mobile_detection" %>
	<script>

	function isMobile(){
	var MOBILE_USER_AGENTS = 'palm\|blackberry\|nokia\|phone\|midp\|mobi\|symbian\|chtml\|ericsson\|minimo\|' +
	'audiovox\|motorola\|samsung\|telit\|upg1\|windows ce\|ucweb\|astel\|plucker\|' +
	'x320\|x240\|j2me\|sgh\|portable\|sprint\|docomo\|kddi\|softbank\|android\|mmp\|' +
	'pdxgw\|netfront\|xiino\|vodafone\|portalmmm\|sagem\|mot-\|sie-\|ipod\|up\\.b\|' +
	'webos\|amoi\|novarra\|cdm\|alcatel\|pocket\|ipad\|iphone\|mobileexplorer\|' +
	'mobile\|zune',
	mobile_regex = new RegExp(MOBILE_USER_AGENTS, "i");

	return navigator.userAgent.match(mobile_regex);
	}

	// setting the device cookie to what we detect
	var detected_device = isMobile() ? 'mobile' : 'desktop';

	cookie.set('device', detected_device, {
	domain: '<%= Rails.env.development? ? '' : Settings.host %>',
	path : '/'
	});

	// window.location to whereever you came from
	window.location.assign(localStorage.getItem('referrer_href'));

	</script>
	</head>
	<body style="background-color:#f1f1f2">
	</body>
	</html>
	class HomeController < ApplicationController
	layout 'application'

	def get_device
	render "get_device.html.erb", :layout => false
	end

	def set_device
	render "set_device.html.erb", :layout => false
	end
	end
	<%= javascript_include_tag "mobile_detection" %>

	<script>

	if (!window.location.href.match(/get_device\|set_device/)){
	console.log('logging the window.location.href = ' + window.location.href);
	localStorage.setItem('referrer_href', window.location.href);
	}

	var device_cookie = cookie.get('device'),
	cookiesEnabled = cookie.enabled();

	if (cookiesEnabled && device_cookie == undefined) {
	window.location.assign('/get_device.html');
	}

	</script>
	<html>
	<head>
	<title>Example Website</title>
	<%= javascript_include_tag "mobile_detection" %>
	<meta name="viewport" content="width=device-width, user-scalable=no">
	</head>
	<body style="background-color:#f1f1f2">

	<h1>Which device do you want to see the site as?</h1>

	<form id="device_selection_form">
	<input type="radio" name="device_option" value="desktop">Desktop</input>
	<input type="radio" name="device_option" value="mobile">Mobile</input>

	<button id="set_device_btn">Set device</button>
	</form>


	<script>

	document.getElementById('set_device_btn').addEventListener('click', function(e){

	// setting the device cookie to your selection
	var options = document.getElementsByName('device_option'),
	selected_device = '';

	for(var i=0; i < options.length; i++){
	if (options[i].checked) {
	selected_device = options[i].value;
	}
	}

	cookie.set('device', selected_device, {
	domain: '<%= Rails.env.development? ? '' : Settings.host %>',
	path : '/'
	});

	// window.location to whereever you came from
	window.location.assign(localStorage.getItem('referrer_href'));

	alert('Okay, we set your device to be ' + selected_device);

	e.preventDefault();
	return false;
	});


	</script>

	</body>
	</html>