<!DOCTYPE html>
<html ng-app="kulfy" >

<head>
    <meta charset="utf-8"/>
    <base href="/">
    <meta http-equiv="Content-Security-Policy">
    <meta name="format-detection" content="telephone=no">
    <meta name="msapplication-tap-highlight" content="no">
    <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width">

    <link rel="stylesheet" href="css/roboto-mono.css">
    <link rel="stylesheet" href="css/roboto.css">
    <link rel="stylesheet" href="css/material-icons.css">
    <!--link rel="stylesheet" href=" https://cdnjs.cloudflare.com/ajax/libs/noUiSlider/11.0.3/nouislider.min.css"-->
    <link rel="stylesheet" href="node_modules/angularjs-slider/dist/rzslider.min.css">
    <link rel="stylesheet" href="node_modules/angular-material/angular-material.min.css">
    <link rel="stylesheet" href="node_modules/md-color-picker/dist/mdColorPicker.min.css">
    <link rel="stylesheet" href="node_modules/angular-fontselect/dist/angular-fontselect.min.css">

    <link rel="stylesheet" href="css/fonts.css">
    <link rel="stylesheet" href="css/main.css">

    <!-- AngularJs -->
    <script type="text/javascript" src="node_modules/angular/angular.min.js" ></script>
    <script type="text/javascript" src="node_modules/@uirouter/angularjs/release/angular-ui-router.min.js"></script>
    <script type="text/javascript" src="node_modules/angular-aria/angular-aria.min.js"></script>
    <script type="text/javascript" src="node_modules/angular-animate/angular-animate.min.js"></script>
    <!--script type="text/javascript" src="node_modules/angular-material/angular-material.min.js"></script-->
    <script type="text/javascript" src="node_modules/angular-file-upload/dist/angular-file-upload.min.js"></script>
    <script type="text/javascript" src="node_modules/clipboard/dist/clipboard.min.js"></script>
    <script type="text/javascript" src="node_modules/angularjs-slider/dist/rzslider.min.js"></script>
    <script type="text/javascript" src="node_modules/angular-cookies/angular-cookies.min.js"></script>
    <script type="text/javascript" src="node_modules/tinycolor2/tinycolor.js"></script>
    <script type="text/javascript" src="node_modules/md-color-picker/dist/mdColorPicker.min.js"></script>
    <script type="text/javascript" src="node_modules/angular-fontselect/dist/angular-fontselect.min.js"></script>

    <!-- Modules -->
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/noUiSlider/11.0.3/nouislider.min.js"></script>
    <script type="text/javascript" src="js/auto_font_size.js"></script>
    <script type="text/javascript" src="js/constants.js"></script>
    <script type="text/javascript" src="js/utils.js"></script>
    <script type="text/javascript" src="js/serverApi.js"></script>
    <script type="text/javascript" src="js/kulfyClasses.js"></script>
    <script type="text/javascript" src="js/app.js"></script>
    <script type="text/javascript" src="js/directives.js"></script>

    <!-- Routes -->
    <script type="text/javascript" src="js/routes.js"></script>

    <!--script src="https://sdk.amazonaws.com/js/aws-sdk-2.211.0.min.js"></script-->

    <!-- Controllers -->
    <!--script type="text/javascript" src="components/welcome/welcome-controller.js"></script>
    <script type="text/javascript" src="components/main/main-controller.js"></script>
    <script type="text/javascript" src="components/share/share-controller.js"></script>
    <script type="text/javascript" src="components/sharePreview/sharePreview-controller.js"></script>
    <script type="text/javascript" src="components/chain/chain-controller.js"></script-->

    <title ng-bind="appName">Kulfy</title>
</head>

<body layout="column">
<div ng-if="showRotate" class="global-error" ng-show="showRotate" layout="column" layout-align="center center" layout-padding>
    <img src="css/icons/kulfy_logo.png" width="100px" height="100px">
    <h1>Kulfy Maker</h1>
    <br><br>
    <i class="material-icons" style="font-size: 100px;">screen_rotation</i>
    <br>
    <br>
    <h2>Please rotate your device</h2>
</div>

<div ng-if="showScreenErr" class="global-error" ng-show="showScreenErr" layout="column" layout-align="center center" layout-padding>
    <i class="material-icons" style="font-size: 100px;">cancel</i>
    <br>
    <br>
    <h2>You need screen at least 640 pixels wide to use Kulfy</h2>
</div>
    <md-content flex layout="row" ng-show="!showScreenErr && !showRotate">
        <md-content flex layout="column">
            <ui-view>
            </ui-view>
        </md-content>
    </md-content>
    <md-progress-linear md-mode="determinate" ng-show="loading"
                        class="loadingContainer" value="{{loadingPercent}}"></md-progress-linear>
    <canvas class="auto-font-size-canvas"></canvas>
    <div id="fontTestDiv" style="visibility: hidden; position: absolute; padding: 0; margin: 0"></div>

    <!--script type="text/javascript" src="node_modules/angular/angular.min.js"></script-->
    <script type="text/javascript" src="node_modules/angular-material/angular-material.min.js"></script>
    <script  async type="text/javascript" src="https://sdk.amazonaws.com/js/aws-sdk-2.211.0.min.js"></script>

    <script type="text/javascript" src="components/welcome/welcome-controller.js"></script>
    <script type="text/javascript" src="components/main/main-controller.js"></script>
    <script type="text/javascript" src="components/share/share-controller.js"></script>
    <script type="text/javascript" src="components/sharePreview/sharePreview-controller.js"></script>
    <script type="text/javascript" src="components/chain/chain-controller.js"></script>


    <link rel="stylesheet" href=" https://cdnjs.cloudflare.com/ajax/libs/noUiSlider/11.0.3/nouislider.min.css">

</body>

</html>
