Skip to content

Commit

Permalink
chore: change to Vue 2.6 and web component builds
Browse files Browse the repository at this point in the history 
Signed-off-by: Michel Mendiola <[email protected]>
  • Loading branch information
@MissAllSunday
MissAllSunday committed Aug 26, 2021
1 parent d45a242 commit a7450b7
Show file tree
Hide file tree
Showing 11 changed files with 285 additions and 904 deletions.
1 change: 1 addition & 0 deletions .gitignore
View file
Original file line number Diff line number Diff line change
Expand Up @@ -36,6 +36,7 @@ pnpm-debug.log*
*.o
*.so
*.bat
*.bash
*.session
# Packages #
############
Expand Down
2 changes: 1 addition & 1 deletion Sources/Breeze/Breeze.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,7 @@ class Breeze
public const PATTERN = self::NAME . '_';
public const FEED = 'https://api.github.com/repos/MissAllSunday/Breeze/releases';
public const SUPPORT_URL = 'https://missallsunday.com';
public const VUE_VERSION = '2.5.16';
public const VUE_VERSION = '2.6.11';

protected Container $container;

Expand Down
2 changes: 1 addition & 1 deletion Sources/Breeze/Service/Actions/WallService.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -86,7 +86,7 @@ public function init(array $subActions): void
]);
$this->components->loadTxtVarsFor(['general', 'mood', 'like']);
$this->components->loadComponents(
['wallMain', 'utils', 'tabs', 'status', 'comment', 'editor', 'modal', 'setMood', 'like']
['breeze-wall']
);
$this->components->loadCSSFile('breeze.css', [], 'smf_breeze');
}
Expand Down
58 changes: 32 additions & 26 deletions Sources/Breeze/Util/Components.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,36 +15,38 @@ class Components
private const FOLDER = 'breezeComponents/';

private const COMPONENTS = [
'contentSection',
'utils',
'like',
'setMood',
'moodForm',
'modal',
'feed',
'adminMain',
'status',
'comment',
'tabs',
'editor',
'wallMain',
'moodAdmin',
'moodListAdmin',
'textArea',
'breeze-wall',
// 'contentSection',
// 'utils',
// 'like',
// 'setMood',
// 'moodForm',
// 'modal',
// 'feed',
// 'adminMain',
// 'status',
// 'comment',
// 'tabs',
// 'editor',
// 'wallMain',
// 'moodAdmin',
// 'moodListAdmin',
// 'textArea',
];

private const CDN_JS = [
'vue' => 'https://cdn.jsdelivr.net/npm/vue@' . Breeze::VUE_VERSION . '/dist/vue.js',
'axios' => 'https://cdnjs.cloudflare.com/ajax/libs/axios/0.19.2/axios.min.js',
'moment' => 'https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/moment.min.js',
'noti' => 'https://cdn.jsdelivr.net/npm/vue-toast-notification',
'editor' => 'https://cdn.jsdelivr.net/npm/suneditor@latest/dist/suneditor.min.js',
'purify' => 'https://cdnjs.cloudflare.com/ajax/libs/dompurify/2.0.14/purify.min.js',
// 'vue' => 'https://cdnjs.cloudflare.com/ajax/libs/vue/' . Breeze::VUE_VERSION . '/vue.cjs.prod.min.js',
'vue' => 'https://unpkg.com/vue@' . Breeze::VUE_VERSION,
// 'axios' => 'https://cdnjs.cloudflare.com/ajax/libs/axios/0.19.2/axios.min.js',
// 'moment' => 'https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/moment.min.js',
// 'noti' => 'https://cdn.jsdelivr.net/npm/vue-toast-notification',
// 'editor' => 'https://cdn.jsdelivr.net/npm/suneditor@latest/dist/suneditor.min.js',
// 'purify' => 'https://cdnjs.cloudflare.com/ajax/libs/dompurify/2.0.14/purify.min.js',
];

private const CDN_CSS = [
'editor' => 'https://cdn.jsdelivr.net/npm/suneditor@latest/dist/css/suneditor.min.css',
'noti' => 'https://cdn.jsdelivr.net/npm/vue-toast-notification/dist/theme-default.css',
// 'editor' => 'https://cdn.jsdelivr.net/npm/suneditor@latest/dist/css/suneditor.min.css',
// 'noti' => 'https://cdn.jsdelivr.net/npm/vue-toast-notification/dist/theme-default.css',
];

public function loadComponents(array $components = []): void
Expand All @@ -56,7 +58,7 @@ public function loadComponents(array $components = []): void

foreach ($componentsToLoad as $component) {
$this->loadJavaScriptFile(self::FOLDER . $component . '.js', [
'defer' => true,
'defer' => false,
'default_theme' => true,
], strtolower(Breeze::PATTERN . $component));
}
Expand Down Expand Up @@ -141,13 +143,17 @@ protected function loadJsDependencies(): void
foreach (self::CDN_JS as $jsDependency) {
$this->loadJavaScriptFile($jsDependency, [
'external' => true,
'defer' => true,
'defer' => false,
], strtolower(Breeze::PATTERN . $jsDependency));
}
}

protected function loadCssDependencies(): void
{
if (empty(self::CDN_CSS)) {
return;
}

foreach (self::CDN_CSS as $cssDependency) {
$this->loadCSSFile($cssDependency, [
'external' => true,
Expand Down
97 changes: 12 additions & 85 deletions Themes/default/Breeze.template.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,100 +2,27 @@

declare(strict_types=1);

use Breeze\Entity\UserSettingsEntity;
use Breeze\Util\Parser;

/**
* @license http://www.mozilla.org/MPL/ MPL 2.0
*/

function template_breeze_main(): void
{
global $txt, $context, $user_info;

$memberOnline = sprintf(
'%1$s%2$s%3$s',
($context['can_send_pm'] ?
'<a href="' . $context['member']['online']['href'] . '" title="' .
$context['member']['online']['text'] . '" rel="nofollow">' : ''),
'<span class="' . (1 == $context['member']['online']['is_online'] ? 'on' : 'off') .
'" title="' . $context['member']['online']['text'] . '"></span>',
($context['can_send_pm'] ?
'</a>' : '')
);

echo '
<div id="breeze_app" class="breeze_main_section">
<div class="breeze_summary floatleft">
<div class="roundframe flow_auto">
<div class="breeze_avatar"
style="background-image: url(' . $context['member']['avatar']['url'] . ')">
</div>
<h3 class="breeze_name">
' . $memberOnline . '
' . $context['member']['name_color'] . '
</h3>
<p class="breeze_title">
' . (!empty($context['member']['primary_group']) ? $context['member']['primary_group'] :
$context['member']['post_group']) . '
</p>
<p class="breeze_title">
' . $context['member']['group_icons'] . '
</p>
<p class="breeze_description">
' . $context['member']['blurb'] . '
</p>
<p class="breeze_mood">
<set-mood
:current-mood-id="currentMoodId"
:user-id="wallData.ownerId"
:mood-txt="txtMood"
:is-current-user-owner="isCurrentUserOwner"
:use-mood="useMood"
></set-mood>
</p>
</div>
<div id="breeze_app" class="breeze_main_section">
<breeze-wall></breeze-wall>
</div>
';

<div class="breeze_wall floatright">
<tabs>
<tab :name="\'' . $txt['Breeze_tabs_wall'] . '\'" :selected="true">
<editor
editor_id="\'breeze_status\'"
@get-content="postStatus($event)">
</editor>
<ul class="status">
<status
v-if="errored !== null"
v-for="status_item in status"
v-bind:item="status_item"
v-bind:key="status_item.status_id"
:users="users"
@remove-status="onRemoveStatus($event)"
@set-new-users="onSetNewUsers($event)">
</status>
</ul>
</tab>';

if (!empty($context['userSettings']['aboutMe'])) {
echo '
<tab :name="\'' . $txt['Breeze_tabs_about'] . '\'">
<div class="windowbg">
<div class="content">
' . Parser::parse($context['userSettings'][UserSettingsEntity::ABOUT_ME]) . '
</div>
</div>
</tab>';
}
// "buildWall": "vue-cli-service build --target wc --name BreezeWall src/Wall.vue",
// "lint": "vue-cli-service lint"
// },
//"dependencies": {
// "axios": "^0.21.1",
// "core-js": "^3.6.5",
// "suneditor": "^2.41.3",
// "vue": "^3.0.0",
// "vue-toast-notification": "^2.0.0"

// Activity tab
// echo '
// <tab :name="\'' . $txt['Breeze_tabs_activity'] . '\'">
//
// </tab>';

echo '
</tabs>
</div>
<br />';
}
Loading

0 comments on commit a7450b7

Please sign in to comment.