ProjectSearch/index.html at master · Nathakorn/ProjectSearch · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
<!DOCTYPE HTML5>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>Project Search</title>
    <link rel="stylesheet" href="./css/master.css" >
    <link rel="stylesheet" href="./css/sofiapro_light_macroman/stylesheet.css" >
    <link href='https://fonts.googleapis.com/css?family=Handlee' rel='stylesheet' type='text/css'>
    <!--Font-->
    <link href='https://fonts.googleapis.com/css?family=Lora' rel='stylesheet' type='text/css'>
    <link href='https://fonts.googleapis.com/css?family=Pacifico' rel='stylesheet' type='text/css'>
    <link href='https://fonts.googleapis.com/css?family=Yanone+Kaffeesatz' rel='stylesheet' type='text/css'>
    <!--Bootstrap-->
     <link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.min.css">
</head>

<body ng-app="myApp" ng-controller="myCtrl">
    <script src="bower_components/jquery/dist/jquery.min.js"></script>
    <script src="bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js"></script>
    <script src="./controller.js"></script>
    <div class="container">
        <!--Search page-->
        <div class="row">
            <div class="col-sm-12">
                <h1 id="nameHead" style="font-family: 'Pacifico', cursive;">Wikipedia Search</h1>
            <div>
        </div>
        <div class="row">
            <div class="col-sm-3 col-sm-offset-3" ng-hide="done">
                <h3  style="font-family: 'Yanone Kaffeesatz', sans-serif;">Please input words <span class ="glyphicon glyphicon-pencil"></span></h3>
            </div>
            <div class="col-sm-3">
                <button class="mini-button" id="add-ex-button" ng-hide="done" ng-click="addExample()" ng-hide="done" >Add examples</button>
            </div>
        <div>
        <div class="row">
            <div class="col-sm-8 col-sm-offset-2">
                <textarea class="textarea-like" id="textarea-search" ng-hide="done" ng-model="message" cols="50" rows="10" maxlength="200"></textarea>
            </div>
        </div>
        <div class="row">
            <div class="col-sm-2 col-sm-offset-2">
                <button ng-hide="done" id="search-button" type="button" name="name"  ng-click="search()">
                <span class="glyphicon glyphicon-search"></span>
                </button>
            </div>
            <div ng-show="loading" ><img id = "loading"src="./images/loading.gif" alt=""></div>
            <div id="loading-img"></div>
        </div>
        <!--Result page-->
        <div class="textarea-like" ng-show="done" ng-mouseleave="leave()" ng-mouseover="hover($index, data.matches.length > 0)" ng-repeat="data in result" ng-class="{found: data.matches.length > 0, selected: $index==selectedIndex}">
            {{data.line}}
        </div>
        <div class="card" ng-repeat="data in result" id="show-more" ng-class="{selected: $index==selectedIndex}" ng-if="data.matches.length > 0">
            {{data.line}}
            <div class="box" ng-repeat="child in data.matches | startFrom:0 | limitTo:1">
                {{child.file_name}}
                <div class="number">
                    {{child.line_number}}
                </div>
            </div>

            <a class="mini-button" ng-show="data.matches.length > 1" ng-click="showAll = !showAll" ng-hide="showAll">Show more</a>

            <div class="box" <div ng-show="showAll" ng-repeat="child in data.matches | startFrom:1">
                {{child.file_name}}
                <div class="number">
                    {{child.line_number}}
                </div>
            </div>

            <a class="mini-button" ng-click="showAll = !showAll" ng-show="showAll">Hide</a>

        </div>
        <button ng-show="done" id="try-again-button"  name="name" ng-click="tryAgain()">Try Again<span class="glyphicon glyphicon-repeat"></span>
        </button>
    </div>
</body>

</html>