ode-csslib-panda-primot 3.4.12-develop-integration.202505221038

package/dist/template/timeline/notifications.html

@@ -0,0 +1,263 @@
+<!-- <app-title>
+	<h1><a data-reload><i class="notification"></i><span translate content="timeline.title"></span></a></h1>
+</app-title>
+<div data-ng-controller="FlashMessages" class="twelve cell">
+    <div class="flashmsg" ng-repeat="message in messages.all"
+        ng-class="message.color"
+        ng-style="{ 'background-color': message.customColor }">
+        <i class="close-2x right-magnet" tooltip="timeline.mark.flashmsg" ng-click="markMessage(message)"></i>
+        <div bind-html="message.contents[currentLanguage]"></div>
+    </div>
+</div>
+
+<article data-ng-controller="Timeline" class="twelve cell reduce-block-eight">
+	<div class="row line filters">
+		<ul>
+			<li class="legend" translate content="filters.title"></li>
+			<li>
+				<label class="checkbox small-text">
+					<input type="checkbox" ng-model="notificationTypes.noFilter" ng-change="removeFilter()" />
+					<span translate content="filters.all"></span>
+				</label>
+			</li>
+			<li ng-repeat="type in notificationTypes.all">
+				<label class="checkbox small-text">
+					<input type="checkbox" ng-model="type.selected" ng-change="type.apply()" />
+					<span translate content="[[type.data.toLowerCase()]]"></span>
+				</label>
+			</li>
+		</ul>
+	</div>
+	<div data-notificationid="[[notification._id]]" data-ng-repeat="notification in notifications.all" class="row line notifications notification">
+		<div class="twelve cell vertical-spacing-twice" ng-class="{ 'unread': isUnRead(notification) }">
+			<div class="row">
+				<div class="notification-date">
+					<em class="low-importance right-magnet">[[formatDate(notification.date.$date)]]</em>
+				</div>
+				<div class="cell twelve">
+					<div class="row">
+						<div class="two cell fixed-block height-two">
+							<div class="fixed twelve cell">
+								<div class="fluid twelve cell clip">
+									<i class="system-avatar" ng-if="!notification.sender"> </i>
+									<img ng-src="/userbook/avatar/[[notification.sender]]?thumbnail=100x100" ng-if="notification.sender" />
+								</div>
+							</div>
+						</div>
+						<div class="ten cell horizontal-spacing">
+							<p class="inline" bind-html="notification.message"></p>
+						</div>
+					</div>
+				</div>
+			</div>
+		</div>
+		<div class="notification-actions" ng-class="{'opened': notification.opened}" ng-if="showActions()">
+			<div class="opener" ng-click="toggleNotification(notification,$event)">
+				<span class="symbol">◀</span>
+			</div>
+			<div class="actions">
+				<div ng-repeat="(name, action) in actions" ng-show="!action.condition || action.condition(notification)" class="action [[ name ]]">
+					<i></i>
+					<a ng-click="action.action(notification)" ng-disabled="notification[action.doneProperty]">
+						[[ notification[action.doneProperty] ? lang.translate(action.doneLabel) : lang.translate(action.label) ]]
+					</a>
+				</div>
+			</div>
+		</div>
+	</div>
+</article> -->
+
+<div data-ng-controller="FlashMessages" class="twelve cell">
+  <flash-msg ng-repeat="message in messages.all track by message.id" mark-message="markMessage(message)" message="message"
+    current-language="currentLanguage">
+  </flash-msg>
+</div>
+
+<app-title>
+  <h1 data-reload class="application-title">
+    <i class="exclamation-mark"></i>
+    <i18n
+      pulsar="{ index: 0, i18n: 'timeline.pulsar.notifications', position: 'center right', className: 'pulse-notifications'}">
+      timeline.title</i18n>
+  </h1>
+</app-title>
+
+<div data-ng-controller="Timeline" class="twelve cell">
+  <div ng-if="!isEmpty()" class="row drop-down-block" ng-class="{slided: display.slide}">
+    <div class="drop-down-label" ng-if="filtered.notificationTypes.length > 0" ng-click="display.slide = !display.slide"
+      pulsar-highlight="1">
+      <i class="arrow"></i>
+      <label
+        pulsar="{ index: 1, i18n: 'timeline.pulsar.filters', position: 'bottom center', className: 'pulse-filters'}">
+        <i18n>filters.title</i18n>
+      </label>
+    </div>
+
+    <div class="drop-down-info" ng-model="notificationTypes" ng-if="filtered.notificationTypes.length > 0">
+      <span>
+        <i18n>filters.unactives</i18n>
+      </span><span> [[unactivesFilters()]]</span>
+    </div>
+
+    <div class="drop-down-content" slide="display.slide">
+      <div class="chips">
+        <label class="chip multiselect" ng-if="filtered.notificationTypes.length > 0">
+          <span>
+            <i18n>filters.all.none</i18n>
+          </span>
+          <input type="checkbox" ng-model="notificationTypes" ng-change="allFilters()" />
+        </label>
+        <label class="chip [[type.data.toLowerCase()]]" ng-class="{ selected: type.selected }"
+          ng-repeat="type in (filtered.notificationTypes = notificationTypes.all)">
+          <i class="[[type.data.toLowerCase()]] type"></i>
+          <span>[[suffixTitle(type.data.toLowerCase())]]</span>
+          <input type="checkbox" ng-model="type.selected" ng-change="switchFilter(type)" />
+        </label>
+      </div>
+      <div class="drop-up-label" ng-click="display.slide = !display.slide"
+        ng-if="filtered.notificationTypes.length > 0">
+        <label>
+          <i18n>filters.close</i18n>
+        </label>
+        <i class="arrow"></i>
+      </div>
+    </div>
+  </div>
+
+  <!--EMPTY BUT NOT ALL FILTERS SELECTED-->
+  <div ng-if="notifications.all.length === 0 && notificationTypes.length() !== notificationTypes.selection().length">
+    <div class="emptyscreen" ng-if="isCache() && !showSeeMoreOnEmpty()">
+      <h2 class="emptyscreen-header">
+        <i18n>empty.timeline.notifications.noresults.title</i18n>
+      </h2>
+      <img class="emptyscreen-image__mini" src="/assets/themes/entcore-css-lib/images/empty-filters.svg" />
+      <p class="emptyscreen-footer">
+        <i18n>empty.timeline.notifications.noresults</i18n>
+      </p>
+    </div>
+    <div class="info tuto" ng-if="isCache() && showSeeMoreOnEmpty()">
+      <b><span><i></i>
+          <i18n>timeline.empty.cache</i18n>
+        </span></b>
+    </div>
+  </div>
+  <!--EMPTY BUT ALL FILTERS SELECTED-->
+  <div
+    ng-if="notifications.all.length === 0 && notificationTypes.length() === notificationTypes.selection().length && notifications.lastPage">
+    <div class="emptyscreen" ng-if="isCache() && !showSeeMoreOnEmpty()">
+      <h2 class="emptyscreen-header">
+        <i18n>empty.timeline.notifications.title</i18n>
+      </h2>
+      <img class="emptyscreen-image__mini" src="/timeline/public/img/empty-timeline.svg" />
+      <p class="emptyscreen-footer">
+        <i18n>empty.timeline.notifications</i18n>
+      </p>
+    </div>
+    <div class="info tuto" ng-if="isCache() && showSeeMoreOnEmpty()">
+      <b><span><i></i>
+          <i18n>timeline.empty.cache</i18n>
+        </span></b>
+    </div>
+  </div>
+
+  <!-- Emptyscreen: no notifications -->
+  <div class="emptyscreen" ng-if="isEmpty() && !switchingFilters && !isCache()">
+    <h2 class="emptyscreen-header">
+      <i18n>empty.timeline.notifications.title</i18n>
+    </h2>
+    <img class="emptyscreen-image__mini" src="/timeline/public/img/empty-timeline.svg" />
+    <p class="emptyscreen-footer">
+      <i18n>empty.timeline.notifications</i18n>
+    </p>
+  </div>
+
+  <!-- Emptyscreen: no results with filters -->
+  <div class="emptyscreen" ng-if="noResultsWithFilters() && !switchingFilters && !isCache()">
+    <h2 class="emptyscreen-header">
+      <i18n>empty.timeline.notifications.noresults.title</i18n>
+    </h2>
+    <img class="emptyscreen-image__mini" src="/assets/themes/entcore-css-lib/images/empty-filters.svg" />
+    <p class="emptyscreen-footer">
+      <i18n>empty.timeline.notifications.noresults</i18n>
+    </p>
+  </div>
+
+  <!-- Emptyscreen: no filters selected -->
+  <div class="emptyscreen" ng-if="noFiltersSelected() && !switchingFilters && !isCache()">
+    <h2 class="emptyscreen-header">
+      <i18n>empty.timeline.notifications.nofilters.title</i18n>
+    </h2>
+    <img class="emptyscreen-image__mini" src="/assets/themes/entcore-css-lib/images/empty-filters.svg" />
+    <p class="emptyscreen-footer">
+      <i18n>empty.timeline.notifications.nofilters</i18n>
+    </p>
+  </div>
+
+  <div data-notificationid="[[notification._id]]"
+    data-ng-repeat="notification in notifications.all track by notification._id"
+    class="row notification [[notification.type.toLowerCase()]]" bottom-scroll="loadPage()">
+    <article ng-class="{ 'unread': isUnRead(notification) }">
+      <div class="row">
+        <div class="avatar">
+          <i class="system-avatar" ng-if="!notification.sender"></i>
+          <img ng-src="/userbook/avatar/[[notification.sender]]?thumbnail=100x100" ng-if="notification.sender" />
+          <i class="sticker app type [[notification.type.toLowerCase()]]"></i>
+        </div>
+        <div class="content horizontal-spacing">
+          <p class="inline" bind-html="notification.message"></p>
+        </div>
+      </div>
+      <div class="notification-date">
+        <em class="low-importance right-magnet">[[formatDate(notification.date.$date)]]</em>
+      </div>
+    </article>
+    <div class="notification-actions" ng-class="{'opened': notification.opened}" ng-if="showActions(notification)">
+      <div class="opener" ng-click="toggleNotification(notification,$event)">
+        <i class="left-open"></i>
+      </div>
+      <div class="actions">
+        <div ng-repeat="(name, action) in actions" ng-show="!action.condition || action.condition(notification)"
+          class="action [[ name ]]">
+          <i class="[[name]]"></i>
+          <a ng-click="action.action(notification)" ng-disabled="notification[action.doneProperty]">
+            [[ notification[action.doneProperty] ?
+            lang.translate(action.doneLabel) : lang.translate(action.label) ]]
+          </a>
+        </div>
+      </div>
+    </div>
+  </div>
+  <!--SHOW MORE -->
+  <div ng-if="showSeeMore()" style="text-align: center">
+    <a ng-click="loadPage()">
+      <i18n>timeline.seeold</i18n>
+    </a>
+  </div>
+  <div ng-if="showSeeMoreOnEmpty()" style="justify-content: center; display: flex">
+    <button ng-click="forceLoadPage()">
+      <i18n>timeline.historyold</i18n>
+    </button>
+  </div>
+  <lightbox show="display.confirmReport" on-close="display.confirmReport = false">
+    <h2>
+      <i18n>timeline.confirm.report</i18n>
+    </h2>
+    <p>
+      <i18n>timeline.confirm.report.text</i18n>
+    </p>
+    <div class="row">
+      <button ng-click="doReport(notification); display.confirmReport = false" class="right-magnet">
+        <i18n>timeline.action.report</i18n>
+      </button>
+      <button type="button" ng-click="display.confirmReport = false" class="right-magnet cancel">
+        <i18n>cancel</i18n>
+      </button>
+    </div>
+  </lightbox>
+
+  <div class="row notification" ng-show="notifications.loading">
+    <h1 class="reduce-block-eight nomargin">
+      <i18n>loading</i18n>
+    </h1>
+  </div>
+</div>

package/dist/version.txt

@@ -0,0 +1,2 @@
+entcore-css-lib 26/03/2025 20:54:01
+ode-csslib-panda-primot 22/05/2025 10:39:10

package/package.json

@@ -0,0 +1,52 @@
+{
+  "name": "ode-csslib-panda-primot",
+  "version": "3.4.12-develop-integration.202505221038",
+  "description": "Panda theme by Edifice",
+  "repository": {
+    "type": "git",
+    "url": "git@github.com:edificeio/panda.git"
+  },
+  "keywords": [
+    "Panda",
+    "ODE",
+    "theme"
+  ],
+  "author": "Edifice",
+  "license": "NONE",
+  "dependencies": {
+    "entcore-css-lib": "npm:ode-csslib@develop-integration"
+  },
+  "devDependencies": {
+    "concurrently": "5.3.0",
+    "copyfiles": "2.4.1",
+    "cpr": "3.0.1",
+    "entcore-generic-icons": "github:edificeio/generic-icons#master",
+    "prettier": "2.6.0",
+    "rimraf": "3.0.2",
+    "sass": "1.66.1"
+  },
+  "files": [
+    "dist"
+  ],
+  "scripts": {
+    "override:i18n": "OVERRIDE_SRC=${OVERRIDE_SRC} OVERRIDE_DIST=${OVERRIDE_DIST} node ode-override-plugin.js",
+    "sass:watch": "sass --source-map -w scss/index.scss docs/index.css",
+    "sass:build:debug": "sass --load-path=node_modules/ --source-map scss/index.scss docs/index.css",
+    "sass:build:release": "sass --load-path=node_modules/ --style=compressed ${SKIN_DIR}/$SKIN/theme.scss ${SKIN_DIR}/$SKIN/theme.css && cpr ${SKIN_DIR}/$SKIN/ ${DIST_DIR}/skins/$SKIN/ -o",
+    "dev:dependencies": "cpr node_modules/entcore-css-lib/assets/ docs/ -o",
+    "dev:prepare": "npm run sass:build:debug && npm run dev:dependencies && cpr assets/ docs/ -o",
+    "dev:watch": "npm run dev:prepare && concurrently  \" npm run sass:watch \" \" npm run dev:serve  \" ",
+    "dev:serve": "live-server --open=docs/ --ignore=**/node_modules/**,**/dist/**,**/package.json,**/.git/**",
+    "dev:lint": "stylelint scss/**/*.scss || echo \"lint faild for some file(s).\"",
+    "dev:lint-fix": "stylelint scss/**/*.scss --fix || echo \"lint faild for some file(s).\"",
+    "dev:copy-theme": "rm -rf build-css && ./build.sh build && cp -r dist/* ../recette/assets/themes/panda",
+    "prettier:all": "npm run prettier:write && npm run prettier:check",
+    "prettier:check": "npx prettier --check .",
+    "prettier:write": "npx prettier --write .",
+    "release:clean": "rimraf ${DIST_DIR}",
+    "release:dependencies": "cpr node_modules/entcore-css-lib/assets/ ${DIST_DIR}/ -o",
+    "release:prepare": "npm run release:clean && npm run release:dependencies && cpr template/ ${DIST_DIR}/template/ -o && cpr portal.html ${DIST_DIR}/ -o && cpr assets/ ${DIST_DIR}/ -o",
+    "release:build": "npm run release:prepare && SKIN=default npm run sass:build:release",
+    "watch": "sass --watch --style compressed --load-path=node_modules/ --no-source-map scss/index.scss ../recette/assets/themes/cg771d/skins/default/theme.css"
+  }
+}