App/index.html at master · renatus/App · 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
<!DOCTYPE html>
<html ng-app="activitiesM">
    <head>
        <title>Test AngularJS app</title>
        <!-- Custom CSS we need globally -->
        <link rel="stylesheet" type="text/css" href="css/main.css" />

        <!--IndexedDBShim allows us to use IndexedDB in older browsers without native IndexedDB support, but with WebSQL available-->
        <script type="text/javascript" src="libs/IndexedDBShim.min.js"></script>
        <script type="text/javascript" src="libs/angular.js"></script>
        <script type="text/javascript" src="libs/angular-route.js"></script>

        <script src="js/activities.js"></script>
    </head>


    <!--Controller to render list of all activities-->
    <body ng-controller="activitiesController">
        <!--Fulltext search, all object properties are indexed, so "1" query will result in list of all entries, containing number 1 in, say, UUID-->
        Search: <input ng-model="userQuery">

        <!--Select sorting order for list of all activities-->
        <select ng-model="orderChoice">
            <option value="ascend">Ascending</option>
            <option value="descend">Descending</option>
        </select>

        <!-- This filter will search through all the fields, nod only through activity[activity['lastVersion']]['langcode'] -->
        <select ng-model="langcode">
            <option value="en">English</option>
            <option value="ru">Russian</option>
        </select>


        <!--List of all activities-->
        <ul>
            <!-- Single activity line -->
            <!-- Use "track by object.someUniqueKey" with ng-repeat to improve performance and prevent [ngRepeat:dupes] errors -->
            <!-- orderBy standard filter works with arrays only, not with objects -->
            <li ng-repeat="activity in activities | filter:userQuery | filter:langcode | filter:filterNot123 | orderObjectByINT:'title':orderChoice track by activity.uuid">

                <!-- Something like "ActivityTitle | en |"-->
                <span ng-hide="editing" ng-click="editing = true">{{activity[activity['lastVersion']]['title'][activity[activity['lastVersion']]['langcode']]}} | {{activity[activity['lastVersion']]['langcode']}} | </span>
                <!--"Details" link, click will open subpage with this particularactivity details-->
                <a ng-hide="editing" href="#/activities/{{activity.uuid}}">Details</a>

                <!--Button to delete this particular entry-->
                <button ng-hide="editing" ng-click="deleteEntry(activity)">Del</button>

                <!--Here activity editing form will be placed-->
                <edit-activity></edit-activity>

            </li>
        </ul>


        <!--Form to add new activity-->
        <form name="addActivity" ng-submit="addEntry(activity)" novalidate >
            <label>Title:</label>
            <input type="text" ng-model="activity.title" placeholder="Title" required />
            <select ng-model="activity.langcode" required >
                <option value="en">English</option>
                <option value="ru">Russian</option>
            </select>
            <br/>

            <!--Button to add entered values to the model-->
            <button class="btn" type="submit" ng-disabled="addActivity.$invalid">Add</button>
        </form>


        <!-- Here single activity's page content will be placed-->
        <ng-view></ng-view>

    </body>
</html>