isite 2023.1.8 → 2023.8.10

package/apps/client-side/site_files/css/treeview.css

@@ -1,83 +1,84 @@
 .treeview {
-    color: var(--treeview-color);
-    background: var(--treeview-background-color);
-    user-select: none;
-    -webkit-user-select: none;
-    -moz-user-select: none;
-    -ms-user-select: none;
+  color: var(--treeview-color);
+  background: var(--treeview-background-color);
+  user-select: none;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
 }
-.treeview .main-node{
-    display: block;
+.treeview .main-node {
+  display: block;
 }
-.treeview .main-node > i{
-    display: inline-block;
+.treeview .main-node > i {
+  display: inline-block;
 }
-.treeview .main-node > h2{
-    display: inline-block;
+.treeview .main-node > h2 {
+  display: inline-block;
 }
-.treeview .main-node > i-button{
-    display: inline-block;
+.treeview .main-node > i-button {
+  display: inline-block;
 }
 
-.treeview i-treenode ul{
-    transition: all linear .3s;
-    -webkit-transition:all linear .3s;
+.treeview i-treenode ul {
+  transition: all linear 0.3s;
+  -webkit-transition: all linear 0.3s;
 }
 
 .treeview i-treenode.ng-hide ul {
-    opacity:0;
+  opacity: 0;
 }
 
 .treeview .actions {
-    display: inline-block;
-    width: auto;
+  display: inline-block;
+  width: auto;
 }
 
 .treeview ul {
-    list-style: none;
-    margin-top: 10px;
+  list-style: none;
+  margin-top: 10px;
 }
 
 .treeview .title {
-    cursor: pointer;
-    padding-bottom: 10px;
-    font-size: 16px;
-    font-weight: bold;
+  cursor: pointer;
+  padding-bottom: 10px;
+  font-size: 16px;
+  font-weight: bold;
 }
 
 .treeview .display {
-    color: var(--treeview-display-color);
+  color: var(--treeview-display-color);
 }
 
 .treenode li {
-    display: block;
-    margin: 10px;
-    padding: 3px;
-    cursor: pointer;
-    border-left: 1px solid var(--treeview-border-color);
+  display: block;
+  margin: 10px;
+  padding: 3px;
+  cursor: pointer;
 }
 .ar .treenode li {
-    border-right: 1px solid var(--treeview-border-color);
+  border-right: 1px solid var(--treeview-border-color);
+}
+.en .treenode li {
+  border-left: 1px solid var(--treeview-border-color);
 }
-
 .treenode li span {
-    font-size: 14px;
-    font-weight: bold;
-    cursor: pointer;
-    padding: 10px 10px;
-    border-radius: 5px;
-    transition: all ease-out .2s;
-    -webkit-transition: all ease-out .2s;
-    display: inline-block;
-    width: auto;
+  font-size: 14px;
+  font-weight: bold;
+  cursor: pointer;
+  padding: 10px 10px;
+  border-radius: 5px;
+  transition: all ease-out 0.2s;
+  -webkit-transition: all ease-out 0.2s;
+  display: inline-block;
+  width: auto;
 }
 
 .treenode li span.text:hover {
-    background: var(--treeview-background-color2);
-    color: var(--treeview-color2);
+  background: var(--treeview-background-color2);
+  color: var(--treeview-color2);
 }
 
 .treenode li .selected {
-    background: var(--treeview-background-color2);
-    color: var(--treeview-color2);
-}
+  background: var(--treeview-background-color2);
+  color: var(--treeview-color2);
+}

package/apps/client-side/site_files/html/directive/i-date-old.html

@@ -0,0 +1,24 @@
+<div class="mb-3">
+  <label> {{label}} </label>
+  <div class="row" ng-hide="editOnly">
+    <p ng-click="editOnly = true" class="blue border padding pointer">
+      <span>{{model.selectedDay.name || '__'}} </span> / <span>{{model.selectedMonth.name || '______'}}</span> / <span>{{model.selectedYear.name || '____'}}</span> 
+    </p>
+  </div>
+  <div class="row dashed padding margin" ng-show="editOnly">
+    <div class="col3">
+      <i-list label="{{dayTitle}}" v="{{v}}" items="days" ng-search="$selectedDay" ng-model="model.selectedDay"></i-list>
+    </div>
+    <div class="col4">
+      <i-list label="{{monthTitle}}" v="{{v}}" items="monthes" ng-search="$selectedMonth" ng-model="model.selectedMonth"></i-list>
+    </div>
+    <div class="col3">
+      <i-list label="{{yearTitle}}" v="{{v}}" items="years" ng-search="$selectedYear" ng-model="model.selectedYear" active-value="model.activeYear"></i-list>
+    </div>
+
+    <div class="col2">
+      <br />
+      <i-button type="save default" ng-click="updateDate()"></i-button>
+    </div>
+  </div>
+</div>

package/apps/client-side/site_files/html/directive/i-date.html

@@ -1,24 +1,28 @@
 <div class="mb-3">
-  <label> {{label}} </label>
+  <label for="{{id2}}" class="form-label"> <span class="red bold"> {{requird}} </span> {{label}}</label>
   <div class="row" ng-hide="editOnly">
-    <p ng-click="editOnly = true" class="blue border padding pointer">
-      <span>{{model.selectedDay.name || '__'}} </span> / <span>{{model.selectedMonth.name || '______'}}</span> / <span>{{model.selectedYear.name || '____'}}</span> 
+    <p ng-click="editOnly = true" class="blue bold border padding pointer">
+      <span class="bold">{{model.selectedDay || '__'}} </span> <span class="orange"> / </span> <span class="bold">{{model.selectedMonth.name || '______'}}</span> <span class="orange"> / </span> <span class="bold">{{model.selectedYear || '____'}}</span>
     </p>
   </div>
-  <div class="row dashed padding margin" ng-show="editOnly">
-    <div class="col3">
-      <i-list label="{{dayTitle}}" v="{{v}}" items="days" ng-search="$selectedDay" ng-model="model.selectedDay"></i-list>
+  <div class="row" ng-show="editOnly">
+    <div class="col10">
+      <input
+        id="{{id2}}"
+        ng-disabled="disabled"
+        autofocus
+        type="date"
+        ng-model="ngModel1"
+        ng-change="ngChange()"
+        ngKeydown="ngKeydown()"
+        class="form-control"
+        placeholder="{{placeholder}}"
+        aria-label="{{label}}"
+      />
     </div>
-    <div class="col4">
-      <i-list label="{{monthTitle}}" v="{{v}}" items="monthes" ng-search="$selectedMonth" ng-model="model.selectedMonth"></i-list>
-    </div>
-    <div class="col3">
-      <i-list label="{{yearTitle}}" v="{{v}}" items="years" ng-search="$selectedYear" ng-model="model.selectedYear" active-value="model.activeYear"></i-list>
-    </div>
-
     <div class="col2">
-      <br />
-      <i-button type="save default" ng-click="updateDate()"></i-button>
+      <i class="fas fa-save" ng-click="updateDate()"></i>
     </div>
+    <div class="invalid-feedback"></div>
   </div>
 </div>

package/apps/client-side/site_files/html/directive/i-datetime.html

@@ -1,32 +1,21 @@
 <div class="mb-3">
-  <label> {{label}} </label>
+  <label for="{{id2}}" class="form-label"> <span class="red bold"> {{requird}} </span> {{label}}</label>
   <div class="row" ng-hide="editOnly">
-    <p ng-click="editOnly = true" class="blue border padding pointer">
-      <span>{{model.selectedDay.name || '__'}} </span> / <span>{{model.selectedMonth.name || '______'}}</span> / <span>{{model.selectedYear.name || '____'}}</span> <span class="bold green">{{model.selectedHour.name || '--'}} </span> :
-      <span class="bold green">{{model.selectedMinute.name || '--'}}</span>
+    <p ng-click="editOnly = true" class="blue  border padding pointer">
+      <span class="bold">{{model.selectedDay || '__'}} </span> <span class="orange"> / </span> <span class="bold">{{model.selectedMonth.name || '______'}}</span> <span class="orange"> / </span> <span class="bold">{{model.selectedYear || '____'}}</span>
+      <span class="black left-10"> ( </span> <span class="bold green">{{model.selectedHour || '__'}}</span> <span class="orange"> : </span> <span class="green bold">{{model.selectedMinute || '__'}} </span> <span class="black"> ) </span>
     </p>
   </div>
-  <div class="row dashed padding margin" ng-show="editOnly">
-    <div class="col2">
-      <i-list label="{{dayTitle}}"  items="days" ng-search="$selectedDay" ng-model="model.selectedDay"></i-list>
-    </div>
-    <div class="col3">
-      <i-list label="{{monthTitle}}"  items="monthes" ng-search="$selectedMonth" ng-model="model.selectedMonth"></i-list>
+  <div class="row" ng-show="editOnly">
+    <div class="col6">
+      <input id="date_{{id2}}" ng-disabled="disabled" autofocus type="date" ng-model="ngModel1" class="form-control" aria-label="{{label}}" />
     </div>
-    <div class="col3">
-      <i-list label="{{yearTitle}}"  items="years" ng-search="$selectedYear" ng-model="model.selectedYear"></i-list>
+    <div class="col4">
+      <input id="time_{{id2}}" ng-disabled="disabled" autofocus min="00:00" max="23:59" type="time" ng-model="ngModel2" class="form-control" aria-label="{{label}}" />
     </div>
-
     <div class="col2">
-      <i-list label="{{hourTitle}}"  items="hours" ng-search="$selectedHour" ng-model="model.selectedHour"></i-list>
-    </div>
-    <div class="col2">
-      <i-list label="{{minuteTitle}}"  items="minutes" ng-search="$selectedMinute" ng-model="model.selectedMinute"></i-list>
-    </div>
-    <div class="row">
-      <br />
-      <i-button type="save default" ng-click="updateDate()"></i-button>
+      <i class="fas fa-save" ng-click="updateDate()"></i>
     </div>
+    <div class="invalid-feedback"></div>
   </div>
-  <div class="invalid-feedback"></div>
 </div>

package/apps/client-side/site_files/html/require_payments.html

@@ -1,16 +1,15 @@
 <!DOCTYPE html>
 <html lang="en">
-    <head>
-        <meta charset="UTF-8" />
-        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-        <title>Require Payments</title>
-        <link rel="stylesheet" href="/x-css/all.css" />
-    </head>
-    <body>
-        <h1 class="center bold red">Require Payments</h1>
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Server Error</title>
+    <link rel="stylesheet" href="/x-css/all.css" />
+  </head>
+  <body>
+    <h1 class="text-center bold red">DNS Server Error</h1>
 
-        <br /><br />
-        <p>call us on facebook <a href="https://www.facebook.com/SmartCodeCompany"> Smart Code Company Page </a></p>
-        <p>call us on what's up ( +966568118373 )</p>
-    </body>
+    <br /><br />
+    <h2 class="text-center">Call Site Administrator or Development Team</h2>
+  </body>
 </html>

package/apps/client-side/site_files/html/require_permissions.html

@@ -7,7 +7,7 @@
         <link rel="stylesheet" href="/x-css/all.css" />
     </head>
     <body>
-        <h1 class="center bold red">Require Permissions</h1>
-        <h2 class="center">##data.permissions##</h2>
+        <h1 class="text-center bold red">Require Permissions</h1>
+        <h2 class="text-center">##data.permissions##</h2>
     </body>
 </html>

package/apps/client-side/site_files/html/words.html

@@ -0,0 +1,66 @@
+<!DOCTYPE html>
+<html lang="en" ng-app="myApp">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Document</title>
+    <link rel="stylesheet" href="/x-css/bootstrap-5-support.css" />
+  </head>
+  <body ng-controller="mainController" class="container loaded">
+    <h1 class="center">##word.counts## : {{words.length}}</h1>
+    <div class="row padding margin border">
+      <div class="col9">
+        <i-control ng-model="nameSearch" label="Search Words"></i-control>
+      </div>
+      <div class="col3">
+        <i-button type="save" ng-click="saveWords()" label="Save All Words"></i-button>
+      </div>
+    </div>
+
+    <table class="table">
+      <tr>
+        <th>ID</th>
+        <th>Name</th>
+        <th>En</th>
+        <th>Ar</th>
+      </tr>
+      <tr ng-repeat="word in words | filter:nameSearch">
+        <td>{{$index+1}}</td>
+        <td>{{word.name}}</td>
+        <td>
+          <i-control ng-model="word.En"></i-control>
+        </td>
+        <td><i-control ng-model="word.Ar"></i-control></td>
+      </tr>
+    </table>
+
+    <script src="/x-js/bootstrap-5-support.js"></script>
+    <script>
+      site.connectScope({}, ($scope, $http) => {
+        $scope.name = 'Amr Barakat';
+        $scope.loadWords = function () {
+          $http({
+            method: 'get',
+            url: '/x-api/words',
+          }).then(function (response) {
+            if (response.data.done) {
+              $scope.words = response.data.words;
+            }
+          });
+        };
+        $scope.saveWords = function () {
+          $http({
+            method: 'POST',
+            url: '/x-api/words/save',
+            data: $scope.words,
+          }).then(function (response) {
+            if (response.data.done) {
+              console.log(response.data);
+            }
+          });
+        };
+        $scope.loadWords();
+      });
+    </script>
+  </body>
+</html>

package/apps/client-side/site_files/js/app.js

@@ -2,3 +2,165 @@ var app = angular.module('myApp', []);
 app.config(function ($sceDelegateProvider) {
   $sceDelegateProvider.resourceUrlWhitelist(['self', 'https://www.youtube.com/**']);
 });
+
+site.connectScope = app.connectScope = function (_scope, callback) {
+  if (!_scope) {
+    _scope = {};
+  }
+  if (!_scope.name) {
+    if ((elem = document.querySelector('[ng-controller]'))) {
+      _scope.name = elem.getAttribute('ng-controller');
+    } else {
+      _scope.name = 'mainController';
+    }
+  }
+  if (!_scope.app) {
+    _scope.app = _scope.name;
+  }
+  if (typeof _scope.app === 'string') {
+    _scope.apps = [{ name: _scope.app, as: _scope.app, modal: '#' + _scope.app + 'Modal' }];
+  }
+  if (typeof _scope.app === 'object') {
+    _scope.apps = [{ ..._scope.app }];
+  }
+  if (Array.isArray(_scope.app)) {
+    _scope.apps = [..._scope.app];
+  }
+
+  app.controller(_scope.name, function ($scope, $http, $timeout, $interval) {
+    $scope.onError = function () {};
+    if (Array.isArray(_scope.apps)) {
+      _scope.apps.forEach((_app, index) => {
+        $scope[_app.as + 'DefaultItem'] = {};
+        $scope[_app.as + 'Item'] = {};
+        $scope[_app.as + 'List'] = [];
+
+        $scope[_app.as + 'Display'] = function () {
+          $scope.error = '';
+          $scope[_app.as + 'Item'] = { ...$scope[_app.as + 'DefaultItem'] };
+          site.showModal(_app.modal);
+        };
+
+        $scope[_app.as + 'Add'] = function () {
+          $scope.error = '';
+          const v = site.validated(_app.modal);
+          if (!v.ok) {
+            $scope.error = v.messages[0].ar;
+            return;
+          }
+          $scope.busy = true;
+          $http({
+            method: 'POST',
+            url: `/api/${_app.name}/add`,
+            data: $scope[_app.as + 'Item'],
+          }).then(
+            function (response) {
+              $scope.busy = false;
+              if (response.data.done) {
+                $scope[_app.as + 'List'].push(response.data.doc);
+                $scope[_app.as + 'Item'] = { ...$scope[_app.as + 'DefaultItem'] };
+              } else {
+                $scope.error = 'Please Login First';
+              }
+            },
+            function (err) {
+              $scope.onError({ error: err, func: _app.as + 'Add' });
+            }
+          );
+        };
+        $scope[_app.as + 'Update'] = function (selectedItem) {
+          $scope.error = '';
+          const v = site.validated(_app.modal);
+          if (!v.ok) {
+            $scope.error = v.messages[0].ar;
+            return;
+          }
+          $scope.busy = true;
+          $http({
+            method: 'POST',
+            url: `/api/${_app.name}/update`,
+            data: selectedItem,
+          }).then(
+            function (response) {
+              $scope.busy = false;
+              if (response.data.done) {
+                let index = $scope[_app.as + 'List'].findIndex((ss) => ss.id === selectedItem.id);
+                if (index > -1) {
+                  $scope[_app.as + 'List'][index] = response.data.doc;
+                }
+                $scope[_app.as + 'Item'] = { ...$scope[_app.as + 'DefaultItem'] };
+              } else {
+                $scope.error = 'Please Login First';
+              }
+            },
+            function (err) {
+              $scope.onError({ error: err, func: _app.as + 'Update' });
+            }
+          );
+        };
+        $scope[_app.as + 'Delete'] = function (selectedItem) {
+          $scope.error = '';
+          const v = site.validated(_app.modal);
+          if (!v.ok) {
+            $scope.error = v.messages[0].ar;
+            return;
+          }
+          $scope.busy = true;
+          $http({
+            method: 'POST',
+            url: `/api/${_app.name}/delete`,
+            data: selectedItem,
+          }).then(
+            function (response) {
+              $scope.busy = false;
+              if (response.data.done) {
+                let index = $scope[_app.as + 'List'].findIndex((ss) => ss.id === selectedItem.id);
+                if (index > -1) {
+                  $scope[_app.as + 'List'].splice(index, 1);
+                }
+              } else {
+                $scope.error = 'Please Login First';
+              }
+            },
+            function (err) {
+              $scope.onError({ error: err, func: _app.as + 'Delete' });
+            }
+          );
+        };
+        $scope[_app.as + 'LoadAll'] = function () {
+          $scope.busy = true;
+          $http({
+            method: 'POST',
+            url: `/api/${_app.name}/all`,
+            data: {
+              where: {},
+              select: {},
+            },
+          }).then(
+            function (response) {
+              $scope.busy = false;
+              if (response.data.done && response.data.list.length > 0) {
+                $scope[_app.as + 'List'] = response.data.list;
+              }
+            },
+            function (err) {
+              $scope.busy = false;
+              $scope.onError({ error: err, func: _app.as + 'LoadAll' });
+            }
+          );
+        };
+
+        if (index === 0) {
+          $scope.display = $scope[_app.as + 'Display'];
+          $scope.add = $scope[_app.as + 'Add'];
+          $scope.update = $scope[_app.as + 'Update'];
+          $scope.delete = $scope[_app.as + 'Delete'];
+          $scope.loadAll = $scope[_app.as + 'LoadAll'];
+        }
+      });
+    }
+    if (callback) {
+      callback($scope, $http, $timeout, $interval);
+    }
+  });
+};