Commit 5a3e7c65 authored by Richard's avatar Richard

Worked on look of the app

parent aa854e04
......@@ -23,7 +23,7 @@ Ext.define('app.controller.Main', {
'listpanel #summary': {
itemtap: 'simulation',
tap: 'closeoverlay',
//tap: 'closeoverlay',
},
'#ext-button-1': {
......@@ -136,7 +136,7 @@ Ext.define('app.controller.Main', {
});
this.requestInfo(test_id, cb);
this.getOverlay().hide().showBy(this.getMapView(), 'br-br');
this.getOverlay().showBy(this.getMapView(), 'br-br');
},
showOverlay: function(list, index, element, record){
......
......@@ -5,6 +5,7 @@ Ext.define('app.view.Map', {
config: {
useLoadMask : true,
mapOptions : {
zoom : 12,
mapTypeId : google.maps.MapTypeId.ROADMAP,
......
......@@ -6,14 +6,15 @@ Ext.define('app.view.Simulation', {
items:
[
{
dock: 'top',
docked: 'top',
xtype: 'toolbar',
title: 'Flood Simulation Browser'
title: 'Flood Simulation Browser',
},
{
xtype: 'SimulationMap',
flex: 2,
}],
}
});
......
......@@ -15,11 +15,12 @@ Ext.define('app.view.StepsOverlay', {
type: 'slideOut',
direction:'right',
},
dragging: true,
//draggable: true,
autoDestroy: true,
hidden: true,
width: 200,
height: 80,
width: 80,
height: 150,
scroll: false,
items: [
{
......@@ -27,36 +28,39 @@ Ext.define('app.view.StepsOverlay', {
id: 'closebutton',
iconCls: 'delete',
iconMask: true,
width: 45,
top: -30,
right: 10,
height: 10,
top: 0,
right: 0,
border: 'solid',
handler: this.closebutton,
scope: this,
},
{
top: 15,
top: 50,
align: 'center',
items : [
{
xtype: "button",
id: 'backwards',
id: 'forward',
cls: 'overlay-button',
width: 45,
iconCls: 'arrow_left',
iconCls: 'arrow_up',
floating: 'right',
iconMask: true,
left: 10,
align: 'center',
left: 20,
},
{
top: 50,
xtype: "button",
id: 'forward',
id: 'backwards',
cls: 'overlay-button',
width: 45,
floating: 'left',
iconCls: 'arrow_right',
iconCls: 'arrow_down',
left: 20,
align: 'center',
left: 100,
iconMask: true,
}]
}],
......
......@@ -78,6 +78,17 @@
background: white;
}
#overlay {
border: solid;
border-width: 1px;
border-color: #a9a9a9;
}
.x-button-icon.down.x-icon-mask {
background: url(up.png);
}
</style>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true"></script>
<script type="text/javascript">(function(h){function f(c,d){document.write('<meta name="'+c+'" content="'+d+'">')}if("undefined"===typeof g)var g=h.Ext={};g.blink=function(c){var d=c.js||[],c=c.css||[],b,e,a;f("viewport","width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no");f("apple-mobile-web-app-capable","yes");f("apple-touch-fullscreen","yes");for(b=0,e=c.length;b<e;b++)a=c[b],"string"!=typeof a&&(a=a.path),document.write('<link rel="stylesheet" href="'+a+'">');for(b=0,e=d.length;b<
......
This source diff could not be displayed because it is too large. You can view the blob instead.
This diff is collapsed.
......@@ -78,6 +78,17 @@
background: white;
}
#overlay {
border: solid;
border-width: 1px;
border-color: #a9a9a9;
}
.x-button-icon.down.x-icon-mask {
background: url(up.png);
}
</style>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true"></script>
<script type="text/javascript">(function(h){function f(c,d){document.write('<meta name="'+c+'" content="'+d+'">')}if("undefined"===typeof g)var g=h.Ext={};g.blink=function(c){var d=c.js||[],c=c.css||[],b,e,a;f("viewport","width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no");f("apple-mobile-web-app-capable","yes");f("apple-touch-fullscreen","yes");for(b=0,e=c.length;b<e;b++)a=c[b],"string"!=typeof a&&(a=a.path),document.write('<link rel="stylesheet" href="'+a+'">');for(b=0,e=d.length;b<
......
This source diff could not be displayed because it is too large. You can view the blob instead.
......@@ -78,6 +78,17 @@
background: white;
}
#overlay {
border: solid;
border-width: 1px;
border-color: #a9a9a9;
}
.x-button-icon.down.x-icon-mask {
background: url(up.png);
}
</style>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true"></script>
<script id="microloader" type="text/javascript" src="sdk/microloader/development.js"></script>
......
This diff is collapsed.
......@@ -4,8 +4,8 @@
// do not use in order to create a smaller css file.
@include sencha-panel;
@include sencha-buttons;
@include sencha-sheet;
@include sencha-picker;
//@include sencha-sheet;
//@include sencha-picker;
@include sencha-tabs;
@include sencha-toolbar;
@include sencha-toolbar-forms;
......@@ -13,7 +13,48 @@
@include sencha-list;
@include sencha-layout;
@include sencha-carousel;
@include sencha-form;
@include sencha-msgbox;
//@include sencha-form;
//@include sencha-msgbox;
// Your custom code goes here...
\ No newline at end of file
// Your custom code goes here...
#overlay {
//@include border-radius(10px);
// needs latest Compass, add '@import "compass"' to your scss
background-color: rgb(255,255,255); // Old browsers
@include filter-gradient(#ffffff, #b2b2b2, vertical); // IE6-9
@include background-image(linear-gradient(top, rgba(255,255,255,1) 0%,rgba(241,241,241,1) 65%,rgba(225,225,225,1) 82%,rgba(178,178,178,1) 100%));
}
#forward {
// needs latest Compass, add '@import "compass"' to your scss
background-color: rgb(255,48,25); // Old browsers
@include filter-gradient(#ff3019, #cf0404, vertical); // IE6-9
@include background-image(linear-gradient(top, rgba(255,48,25,1) 0%,rgba(207,4,4,1) 100%));
}
#backwards {
// needs latest Compass, add '@import "compass"' to your scss
background-color: rgb(255,48,25); // Old browsers
@include filter-gradient(#ff3019, #cf0404, vertical); // IE6-9
@include background-image(linear-gradient(top, rgba(255,48,25,1) 0%,rgba(207,4,4,1) 100%));
}
.x-button-pressed.overlay-button {
// needs latest Compass, add '@import "compass"' to your scss
background-color: rgb(207,4,4); // Old browsers
@include filter-gradient(#cf0404, #ff3019, vertical); // IE6-9
@include background-image(linear-gradient(top, rgba(207,4,4,1) 0%,rgba(255,48,25,1) 100%));
}
.x-button-pressed.overlay-button {
// needs latest Compass, add '@import "compass"' to your scss
background-color: rgb(207,4,4); // Old browsers
@include filter-gradient(#cf0404, #ff3019, vertical); // IE6-9
@include background-image(linear-gradient(top, rgba(207,4,4,1) 0%,rgba(255,48,25,1) 100%));
}
#closebutton {
background: none;
}
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment