Skip to content

Commit

Permalink
Mobile version. #32
Browse files Browse the repository at this point in the history
  • Loading branch information
MathieuNls committed Jun 15, 2015
1 parent e90ac86 commit e4ef7cb
Show file tree
Hide file tree
Showing 8 changed files with 27 additions and 165 deletions.
2 changes: 1 addition & 1 deletion application/config/autoload.php
Original file line number Diff line number Diff line change
Expand Up @@ -52,7 +52,7 @@
| $autoload['libraries'] = array('database', 'session', 'xmlrpc');
*/

$autoload['libraries'] = array('session', 'database');
$autoload['libraries'] = array('session', 'database', 'user_agent');


/*
Expand Down
7 changes: 6 additions & 1 deletion application/controllers/home.php
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,12 @@ function __construct()

function index()
{
array_push($this->_headerData['javaScripts'], "watch.animation");
if(!$this->agent->is_mobile()){
array_push($this->_headerData['javaScripts'], "home.logic", "watch.animation");
}else{
array_push($this->_headerData['javaScripts'], "home.logic.mobile");
}

$this->load->view('header', $this->_headerData);
$this->load->view('home');
$this->load->view('footer');
Expand Down
2 changes: 2 additions & 0 deletions application/views/footer.php
Original file line number Diff line number Diff line change
@@ -1,10 +1,12 @@
<footer>
<?php if(!$this->agent->is_mobile()){ ?>
<div class="publication">

<a href="http://www.fratellowatches.com/toolwatch-measure-the-accuracy-of-your-watch/"><img src="<?php echo img_url('fratello_logos_transparant.png'); ?>"></a>
<a href="http://wristreview.com/?p=16698"><img src="http://wristreview.com/wp-content/uploads/2015/04/wr-logo-V21.png"></a>

</div>
<?php } ?>
<div class="container container-fluid">

<div class="row">
Expand Down
7 changes: 2 additions & 5 deletions application/views/header.php
Original file line number Diff line number Diff line change
Expand Up @@ -63,9 +63,6 @@
</button>
</div>
<div class="modal-body">
</div>
<div class="modal-footer">
<p>Handcrafted with love in Lausanne, Switzerland, near the Watch Valley. Copyright 2015.</p>
</div>
</div>
</div>
Expand All @@ -80,10 +77,10 @@
<a href="<?php echo base_url(); ?>"><div class="logo"></div></a>
</div>
<div style="margin-top: 10px" class="col-md-1 col-md-offset-5 text-center">
<a href="/blog/watch-tips/">Features</a>
<a href="#features">Features</a>
</div>
<div style="margin-top: 10px" class="col-md-1 text-center">
<a href="/about/">Blog</a>
<a href="/blog/watch-tips/">Blog</a>
</div>
<?php
if($userIsLoggedIn)
Expand Down
163 changes: 15 additions & 148 deletions application/views/home.php
Original file line number Diff line number Diff line change
Expand Up @@ -3,20 +3,23 @@
<video id="home-video" src="<?php echo vid_url('home.mp4');?>" width="100%" height="100%" autoplay loop muted></video>
<div class="container container-fluid first slogan-home">

<div class="row">
<div class="col-md-12">
<center>
<h1>Measure your watch's accuracy</h1>
</center>
<?php if(!$this->agent->is_mobile()){ ?>
<div class="row">
<div class="col-md-12">
<center>
<h1>Measure your watch's accuracy</h1>
</center>
</div>
</div>
</div>
<?php } ?>
<div class="row">
<div class="col-md-12">
<center>
<a class="btn btn-lg btn-white" href="#" title="Signup" data-toggle="modal" data-target="#pageModal" data-modal-update="true" data-href="/sign-up/">Measure your watch now!</a>
</center>
</div>
</div>
<?php if(!$this->agent->is_mobile()){ ?>
<div class="row">
<div class="col-md-12">
<center>
Expand All @@ -32,14 +35,16 @@
</center>
</div>
</div>
<?php } ?>


</div>
</div>
</div>

<div class="home-picto">
<div class="container container-fluid">

<?php if(!$this->agent->is_mobile()){ ?>
<div class="row">

<div id="demo" class="col-sm-12">
Expand Down Expand Up @@ -78,7 +83,7 @@
</div>

</div>

<?php } ?>
<div class="row">
<div id="toolwatch-explained" class="col-sm-offset-2 col-sm-8">
<h1>MECHANICAL WATCH LOVER'S FAVORITE TOOL. IT'S INSANELY SIMPLE.</h1>
Expand All @@ -93,6 +98,7 @@
</div>
</div>

<?php if(!$this->agent->is_mobile()){ ?>
<div class="home-mosa">

<div class="home-mosa-stats">
Expand All @@ -116,143 +122,4 @@


</div>

<script>
// using jQuery


var delta = Math.floor((Math.random() * 10) + 1) - 5;
var d;

$( window ).resize(function() {
initSize();
});

$( document ).ready(function() {

$("#demo-third-step").hide();
$("#demo-fourth-step").hide();

initSize();


$('video,audio').mediaelementplayer({features: []});

$(".continue").click(function(){
setTimeout(countDownDisplay, 1000);
});

$( "#demo-cta" ).click(function() {

var result = delta;

$("#demo-pointer").hide();
$("#demo-third-step").hide();
$("#demo-fourth-step").fadeToggle();
console.log();
$(".watch-accuracy").html(result.toFixed(0));
});


});

function initSize(){

var windowHeight = $(window).height();
var headerHeight = $('header').height();
var sloganHeight = $(".slogan-home");
var windowRealHeight = windowHeight - headerHeight;
//var align = dispoDisplay / 2 - sloganHeight / 2;

$(".slogan-home").css("margin-top", -windowRealHeight + windowRealHeight/2);

var ratio = $("#mosa-picture-1").width() / 800 ;

$(".home-mosa").css("height", 450*ratio*2);

$(".home-mosa-stats").css("left", $(window).width()/2-$(".home-mosa-stats").width()/2 - 20);
$(".home-mosa-stats").css("marginTop", (450*ratio*2)/2 - $(".home-mosa-stats").height()/2 - 20);

$( ".slogan-home" ).animate({
marginTop: "-=300"
}, 2000);

}

function countDownDisplay(){
var countdown = $("#demo-sync-time").html();

$("#demo-sync-time").html(countdown - 1);
if(countdown > 1){
setTimeout(countDownDisplay, 1000);
}else{
d = new Date(new Date().getTime());
similateInput();
}
}

function similateInput(){
$("#demo-second-step").hide();
$("#demo-third-step").fadeToggle("slow", function (){

var leftDelta = $("#demo-pointer").position().left
- $("#inputUserTime").position().left;

var topDelta = $("#demo-pointer").position().top
- $("#inputUserTime").position().top - $("#inputUserTime").height() /2;

$( "#demo-pointer" ).animate({
marginTop: "-="+topDelta,
marginLeft: "-="+leftDelta
}, 2000, function(){

$("#inputUserTime").focus();

var seconds = (d.getSeconds() + Math.abs(delta));
if(seconds <= 9){
seconds = "0"+seconds;
}

var hours = d.getHours();

if(hours <= 9){
hours = "0"+seconds;
}

var minutes = d.getMinutes();

if(minutes <= 9){
minutes = "0"+minutes;
}

var date = hours + ':' + minutes + ':' + seconds;
writeToInput(date, 0);
});
});
}

function writeToInput(text, i){

if(i < text.length){
$("#inputUserTime").val($("#inputUserTime").val() + text.charAt(i));
i = i +1;
setTimeout(writeToInput, Math.round(Math.random() * (300 - 100) + 100), text, i);
}else{
clickCTA();
}
}

function clickCTA(){
var leftDelta = $("#demo-pointer").position().left - $("#demo-cta").position().left + $("#demo-cta").width() * 2 + 30;

var topDelta = $("#demo-pointer").position().top - $("#demo-cta").position().top + $("#demo-cta").height() * 3;

$( "#demo-pointer" ).animate({
marginTop: "+="+topDelta,
marginLeft: "+="+leftDelta
}, 2000, function(){
$("#demo-cta").click();
});
}

</script>
<?php } ?>
6 changes: 0 additions & 6 deletions assets/css/main.css
Original file line number Diff line number Diff line change
Expand Up @@ -341,11 +341,6 @@ footer
text-align: center;
}

footer .social
{
text-align: right;
}

footer .copyright{
margin-top: 20px;
font-size: 15px;
Expand Down Expand Up @@ -428,7 +423,6 @@ footer p
.home-intro-overlay
{
width: 100%;
min-height: 768px;
}

.home-picto, .home-text
Expand Down
2 changes: 1 addition & 1 deletion assets/js/application.js
Original file line number Diff line number Diff line change
Expand Up @@ -533,7 +533,7 @@ function resizeContent()
$('.content').css('min-height', (windowHeight-(headerHeight-30)-footerHeight)+'px');
$('.content').css('min-height', (windowHeight-(headerHeight-30)-footerHeight)+'px');
$('.content').css('margin-top', (headerHeight+50)+'px');
$('.home-intro, .home-intro-overlay').css('min-height', windowHeight+'px');
//$('.home-intro, .home-intro-overlay').css('min-height', windowHeight+'px');
}

var currentBg = 0;
Expand Down
3 changes: 0 additions & 3 deletions assets/js/sharrre.logic.js
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,6 @@ $( document ).ready(function() {
enableTracking: true,
urlCurl: '',
click: function(api, options){
generateImage();
api.simulateClick();
api.openPopup('googlePlus');
}
Expand All @@ -22,7 +21,6 @@ $( document ).ready(function() {
enableHover: false,
enableTracking: true,
click: function(api, options){
generateImage();
api.simulateClick();
api.openPopup('twitter');
}
Expand All @@ -35,7 +33,6 @@ $( document ).ready(function() {
enableHover: false,
enableTracking: true,
click: function(api, options){
generateImage();
api.simulateClick();
api.openPopup('facebook');
}
Expand Down

0 comments on commit e4ef7cb

Please sign in to comment.